Merge pull request #4 from codingandcommunity/push-add-toggle-button

Added button that toggles plugin visibility

Author: eagraf

lib/fast-forward-view.coffee

@@ -1,21 +1,31 @@
 module.exports =
 class FastForwardView
-  constructor: (serializedState) ->
+  constructor: (serializedState, emitter) ->
+    # Set Emitter field variable.
+    @emitter = emitter
+
     # Create root element
     @element = document.createElement('div')
     @element.classList.add('fast-forward')
 
-    # Create message element
-    message = document.createElement('div')
-    message.textContent = "The FastForward package is Alive! It's ALIVE!"
-    message.classList.add('message')
-    @element.appendChild(message)
+    # Create button element
+    @button = document.createElement('button')
+    @button.textContent = "Toggle Fast Forward"
+    @button.classList.add('btn-primary')
+    @button.classList.add('btn')
+
+    # Event listening for button. Emits event to the FastForward module.
+    @button.addEventListener('click', () =>
+      @emitter.emit('toggle-button-event')
+    )
+    @element.appendChild(@button)
 
   # Returns an object that can be retrieved when package is activated
   serialize: ->
 
   # Tear down any state and detach
   destroy: ->
+    @button.removeEventListener('click', 0)
     @element.remove()
 
   getElement: ->

lib/fast-forward.coffee

@@ -1,33 +1,39 @@
 FastForwardView = require './fast-forward-view'
-{CompositeDisposable} = require 'atom'
+{CompositeDisposable, Emitter} = require 'atom'
 
 module.exports = FastForward =
   fastForwardView: null
   modalPanel: null
   subscriptions: null
+  emitter: null
 
   activate: (state) ->
-    @fastForwardView = new FastForwardView(state.fastForwardViewState)
+    # Construct Emitter, then pass Emitter into construct fastForwardView.
+    @emitter = new Emitter()
+    @fastForwardView = new FastForwardView(state.fastForwardViewState, @emitter)
+
     # Create a panel for the plugin, visible by default
     @modalPanel = atom.workspace.addRightPanel(item: @fastForwardView.getElement(), visible: true)
 
     # Events subscribed to in atom's system can be easily cleaned up with a CompositeDisposable
-    @subscriptions = new CompositeDisposable
+    @subscriptions = new CompositeDisposable()
 
     # Register command that toggles this view
-    @subscriptions.add atom.commands.add 'atom-workspace', 'fast-forward:toggle': => @toggle()
+    @subscriptions.add(atom.commands.add('atom-workspace', {'fast-forward:toggle': () => @toggle()}))
+
+    @emitter.on 'toggle-button-event', => @toggle()
 
   deactivate: ->
     @modalPanel.destroy()
     @subscriptions.dispose()
+    @emitter.dispose()
     @fastForwardView.destroy()
 
   serialize: ->
     fastForwardViewState: @fastForwardView.serialize()
 
   toggle: ->
     console.log 'FastForward was toggled!'
-
     if @modalPanel.isVisible()
       @modalPanel.hide()
     else