Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Message/Loading Popup/Modal #56

Closed
Glavin001 opened this issue Aug 4, 2014 · 12 comments
Closed

Message/Loading Popup/Modal #56

Glavin001 opened this issue Aug 4, 2014 · 12 comments

Comments

@Glavin001
Copy link
Owner

Currently there is no way to display a message to the user, such as errors or warnings or deprecation notices (see #40). Let's put a little overlay on the top for displaying such information.

@Glavin001
Copy link
Owner Author

  • Loading AKA "Beautification in progress..."
  • Errors
  • Unsupported language

@jamhall
Copy link
Contributor

jamhall commented Aug 18, 2014

I was quickly looking into this.

Two options that I've found (many possibilities) and tested:

https://github.com/CodeSeven/toastr

Include toastr.js in the lib directory and toastr.css in the stylesheets directory. Add jquery as an npm dependency:

toastr = require "./toastr"
toastr.error "There was an error beautifying <b>/tmp/test/fixtures.sql</b>. The command <b>sqlformat</b> was not found.", "Atom beautifer"

Result:

beautifier-toastr

Another more atom-integrated solution is to use: https://github.com/tcarlsen/atom-message-panel

    messages.add new PlainMessageView(
      message: "There was an error beautifying <b>/tmp/test/fixtures.sql</b>. The command <b>sqlformat</b> was not found."
      className: "text-error"
      raw: true
    )

Result:

beautifier-atom-message-panel

Personally, I prefer the second solution; especially for error messages. I also don't think it's a nice idea to include jquery as a dependency (unnecessary bloat)

Anyway, some food for thought :-)

@Glavin001
Copy link
Owner Author

Thanks for doing some research, @Flukey.

I have not seen the Toastr before. Looks nice! How did you include a Bower dependencies? Normally Atom restricts access to client-side libraries.

I have used Atom Message Panel before and I'd prefer to have something a little nicer and more customizable for this.

Using SpacePen you can easily build nice panels, such as deprecation notice and append them to the top of the workspaceView, and for easier developing Atom Preview now supports SpacePen previewing.

Personally, I prefer the second solution; especially for error messages. I also don't think it's a nice idea to include jquery as a dependency (unnecessary bloat)

jQuery is at the core of Atom's SpacePen, so you should not have to include it. You should be able to use {$} = require 'atom'.

I will be throw some screenshots here when they're ready to get some feedback :).

@Glavin001
Copy link
Owner Author

I think you have a good idea with those because you could list off multiple errors and other messages, versus only one at a time. I'll keep that in mind when designing the Atom Beautify interface.

  • Support listing multiple messages
  • Clear messages on close view
  • if the messages list is empty, view should be closed
  • addMessage and clearMessages API

@Glavin001
Copy link
Owner Author

How about something like these?

image

@Glavin001
Copy link
Owner Author

  • Change close button to clear, which will execute clearMessages and consequently close the view

@Glavin001
Copy link
Owner Author

I think I will go with Atom Message Panel for now, until we've fleshed out what features we want in the Message View. It can always be updated later, the important thing is having a view to better display these errors and other messages.

Current screenshot of work-in-progress:
image

Glavin001 added a commit that referenced this issue Sep 8, 2014
@Glavin001
Copy link
Owner Author

For Beautification in progress message:
image

@Glavin001
Copy link
Owner Author

Published Beautification in progress message and Unsupported language messages (using Atom Message Panel) to v0.7.0

Glavin001 added a commit that referenced this issue Sep 8, 2014
@Glavin001 Glavin001 changed the title Message/Loading Popup/Model Message/Loading Popup/Modal Sep 9, 2014
@Glavin001 Glavin001 modified the milestones: v0.26.0, v0.25.0 May 3, 2015
@Glavin001
Copy link
Owner Author

This can be deprecated in favour of Atom Notifications!

Update: Since I still want to see beautification progress (start and completion), the currently implemented UI for showing that a beautification is in progress can stay. Errors and other notifications can use Atom Notifications. This is already being done for deprecate method in Beautifier class (See #282).

Given that the beautification progress UI is already implemented and the Atom Notifications can be used for everything else, this issue can be closed.

@Glavin001
Copy link
Owner Author

Should go migrate off of Atom Message Panel to Atom Notifications.

@Glavin001 Glavin001 reopened this May 3, 2015
@Glavin001 Glavin001 modified the milestones: v0.26.0, v0.27.0 May 3, 2015
@Glavin001
Copy link
Owner Author

Removed old Atom Message Panel related code with 1dfac5b

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants