index.coffee

#
# Example usage:
#
#   {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'))
#
# Having each message-type as a view that is simply attached allows for more people to add
# their own kind of messages easily.
#
# And while I personally prefer JavaScript over CoffeeScript I have chosen to comply with
# the Atom default of using CoffeeScript because it should be natural to other people that
# also follows the style-guide...
# Notice: This is also my first time writing CoffeeScript - so feel free to point out places
# where I use non-CoffeeScript idioms / places where things could be written in a more
# CoffeeScript'y way.
#

{View, $} = require 'atom'

class MessagePaneView extends View
  initialize: (title, speed = 'fast') ->
    @title = title
    @speed = speed

  @content: =>
      @div class: 'am-panel tool-panel panel-bottom', =>
          @div class: 'panel-heading', =>
              @span class: 'heading-title', outlet: 'heading'
              @span class: 'heading-close icon-remove-close pull-right', style: 'cursor: pointer', outlet: 'btnClose', click: 'detach'
              @span class: 'heading-fold icon-fold pull-right', style: 'cursor: pointer', outlet: 'btnFold', click: 'toggle'
          @div outlet:'body', style:'max-height:170px;overflow-y:scroll;',class: 'panel-body padded'

  attach: ->
      atom.workspaceView.prependToBottom @
      @heading.text @title

  toggle: =>
    @btnFold.toggleClass 'icon-fold, icon-unfold'
    @body.toggle @speed

  detach: ->
      @.remove()

  clear: ->
      @body.empty()

  add: (view) ->
    @body.append view

class PlainMessageView extends View
    initialize: (msg, className) ->
      @msg = msg
      @className = className

    @content: =>
        @div class: 'plain-message'

    afterAttach: ->
      @.text(@msg)
      if @className
          @.addClass @className

class LineMessageView extends View
    initialize: (line, character, message, preview, className) ->
        @line = line
        @character = character
        @message = message
        @preview = preview
        @className = className

    @content: =>
        @div class: 'line-message', =>
            @div class: 'text-subtle inline-block', outlet: 'position', click: 'goToLine', style: 'cursor: pointer'
            @div class: 'message inline-block', outlet: 'content'
            if @preview
                @pre class: 'preview', outlet: 'code', click: 'goToLine', style: 'cursor: pointer'

    goToLine: ->
        atom.workspace.getActiveEditor().cursors[0].setBufferPosition [@line - 1, @character - 1]

    afterAttach: ->
        @position.text 'at line ' + @line + ', character ' + @character
        @content.text @message
        if @className
          @content.addClass @className
        if @preview
          @code.text (@preview
                        .replace /&/g, '&'
                        .replace /</g, '&lt;'
                        .replace />/g, '&gt;')

module.exports = {MessagePaneView, PlainMessageView, LineMessageView}