atom-message-panel index.coffee

index.coffee

{View, $} = require 'atom'

module.exports = class MessagePaneView extends View

    @content:(params) =>
        @div class: 'am-panel tool-panel panel-bottom', =>
            @div class: 'panel-heading', params.title, =>
                @div click: 'detach', class: 'close', 'X'
            @div outlet:'body', style:'max-height:170px;overflow-y:scroll;',class: 'panel-body padded'

    attach: ->
        atom.workspaceView.prependToBottom @

    detach: ->
        @.remove()

    clear: ->
        @body.empty()

    appendHeader:(text, className) ->
        @body.append $('<h1>', {
            class: className
            text: text
            class: classNamecss:
                cursor: 'pointer'
        })

    appendMessage:(message, className) ->
        @body.append $('<div>', {
            class: 'block ' + className
            text: message
        })

    appendLineMessage:(line, character, message, preview, className) ->
        goToLine = () ->
            atom.workspace.getActiveEditor().cursors[0].setBufferPosition [line - 1, character - 1]

        preview = preview
            .replace(/&/g, '&amp;')
            .replace(/</g, '&lt;')
            .replace(/>/g, '&gt;')

        @body.append [
            $('<div>', {
                class: 'text-subtle inline-block'
                text: 'at line ' + line + ', character ' + character
                click: goToLine
                css:
                    cursor: 'pointer'
            }),
            $('<div>', {
                class: 'inline-block ' + className
                text: message
            }),
            $('<pre>', {
                text: preview
                click: goToLine
                css:
                    cursor: 'pointer'
            })
        ]

Okay, I've created what I think is a very nice example of what I meant (and added the 0.3.0 functionality of collapsing the message-pane).
You can see my gist at https://gist.github.com/fangel/9553390.

Basically it allows you to write

{MessagePaneView, PlainMessageView, LineMessageView} = require 'atom-message-pane'
messages = new MessagePaneView()
messages.attach()

messages.add(new PlainMessageView('a message'))
messages.add(new LineMessageView(1, 2, 'a line message', 'with a preview'))

Which I think shows how easily extendable it is. Just pass it another View and give it to the add method, and then you have your own type of messages displayed.