The Atom Message Panel

The easy way to display your messages in Atom.

Why!?

To streamline how plugin messages are displayed in Atom! ✊

Checkout this list of packages already using Atom Message Panel.

Usage

JavaScript:

var MessagePanelView = require('atom-message-panel').MessagePanelView,
    PlainMessageView = require('atom-message-panel').PlainMessageView;

var messages = new MessagePanelView({
  title: 'It\'s alive..... IT\'S ALIIIIIVE!!!!'
});

messages.attach();

messages.add(new PlainMessageView({
  message: 'I did it mommy, I made my first Atom Message Panel!',
  className: 'text-success'
}));

CoffeeScript:

{MessagePanelView, LineMessageView} = require 'atom-message-panel'

messages = new MessagePanelView
    title: 'Remember your Coffee!'

messages.attach()

messages.add new LineMessageView
    line: 1
    character: 4
    message: 'You haven\'t had a single drop of coffee since this character'

API

MessagePanelView:

It all depends on this guy, this is your init function and you will need it 😎

• new MessagePanelView(params):

• title: the title of your panel
• rawTitle: sat to true will allow the title to contains HTML (default is false)
• closeMethod: What should the close button do? hide (default) or destroy.
• speed: how fast you what the fold/unfold function to run (default is fast)
• recentMessagesAtTop: should new messages be added at the top? (default is false)
• position: should the panel attach to the "top", "bottom", "left" or "right" (default is bottom)
• maxHeight: set a max-height of the panel body (default is 170px)

• attach(): append the panel to the Atom view
• close(): closes the panel
• setTitle(title:string,raw?:boolean): change the panel title
• toggle(): fold/unfold the panel
• unfold(): unfold the panel
• clear(): clear the body
• add(): add a view to the panel
• remove(index): remove a view from the panel
• state(): get current state informations about your panel

PlainMessageView:

Lets you add a simple message 💬

• PlainMessageView(params):

• message: your message to the people
• raw: sat to true will allow the mesage to contains HTML (default is false)
• className: adding css classes to your message (this is optional)

LineMessageView:

Lets you add messages for a specific line and character, and it will even navigate the user to that position with a single click 💥

• LineMessageView(params):

• message: your message to the people
• line: what line are we talking about?
• file: so, was that in some other file? (this is optional)
• character: lets be more specific of what we are talking about (this is optional)
• preview: lets you display a code snippet inside a pre tag (this is optional)
• className: adding css classes to your message (this is optional)

License

MIT © tcarlsen