Incorporate Editor into templating framework.

spec/atom/editor-spec.coffee

@@ -12,27 +12,23 @@ describe "Editor", ->
   beforeEach ->
     filePath = require.resolve 'fixtures/sample.txt'
     tempFilePath = '/tmp/temp.txt'
-    mainDiv = $("<div id='main'>")
-    $("#jasmine-content").append(mainDiv)
-    spyOn(Editor.prototype, 'open').andCallThrough()
-    editor = new Editor
+    spyOn(Editor.prototype.viewProperties, 'open').andCallThrough()
+    editor = Editor.build()
 
   afterEach ->
     fs.remove tempFilePath
     editor.destroy()
 
-  describe "constructor", ->
-    it "attaches itself to the #main element and opens the given url", ->
-      expect(mainDiv.children('.editor').html()).not.toBe ''
-      expect(Editor.prototype.open).toHaveBeenCalled()
+  describe "initialize", ->
+    it "opens the given url", ->
+      Editor.build(url: tempFilePath)
+      expect(Editor.prototype.viewProperties.open).toHaveBeenCalledWith(tempFilePath)
 
   describe 'destroy', ->
-    it 'destroys the ace editor and removes #editor from the dom.', ->
+    it 'destroys the ace editor', ->
       spyOn(editor.aceEditor, 'destroy').andCallThrough()
-
       editor.destroy()
       expect(editor.aceEditor.destroy).toHaveBeenCalled()
-      expect(mainDiv.children('.editor').length).toBe 0
 
   describe "open(url)", ->
     describe "when called with a url", ->
@@ -51,9 +47,8 @@ describe "Editor", ->
         expect(editor.getAceSession().getMode().name).toBe 'text'
 
       it "assigns the url on the $atomController global", ->
-        expect($atomController.url).toBeNull()
-        editor.open(filePath)
-        expect($atomController.url.toString()).toEqual(filePath)
+        editor.open("/other/path")
+        expect($atomController.url.toString()).toEqual("/other/path")
 
     describe "when called with null", ->
       it "loads an empty buffer with no url", ->

spec/atom/root-view-spec.coffee

@@ -8,12 +8,10 @@ describe "RootView", ->
   describe ".addPane(view)", ->
     it "adds the given view to the rootView (at the bottom by default)", ->
       expect(rootView.vertical.children().length).toBe 1
-
       rootView.addPane $('<div id="foo">')
-
       expect(rootView.vertical.children().length).toBe 2
 
-  describe "toggleFileFinder", ->
+  xdescribe "toggleFileFinder", ->
     it "shows the FileFinder when it is not on screen and hides it when it is", ->
       #expect(rootView.find('.file-finder')).not.toExist()
       # rootView.toggleFileFinder()

src/atom/editor.coffee

@@ -1,42 +1,46 @@
+Template = require 'template'
 Buffer = require 'buffer'
 {EditSession} = require 'ace/edit_session'
 ace = require 'ace/ace'
 $ = require 'jquery'
 
 module.exports =
-class Editor
-  aceEditor: null
-  buffer: null
-  editorElement: null
+class Editor extends Template
+  content: ->
+    @div class: 'editor'
 
-  constructor: (url) ->
-    @buildAceEditor()
-    @open(url)
+  viewProperties:
+    aceEditor: null
+    buffer: null
+    editorElement: null
 
-  shutdown: ->
-    @destroy()
+    initialize: ({url}) ->
+      @buildAceEditor()
+      @open(url)
 
-  destroy: ->
-    @aceEditor.destroy()
+    shutdown: ->
+      @destroy()
 
-  open: (url) ->
-    $atomController.url = url
-    @buffer = new Buffer(url)
-    session = new EditSession(@buffer.aceDocument, @buffer.getMode())
-    @aceEditor.setSession(session)
+    destroy: ->
+      @aceEditor.destroy()
 
-  buildAceEditor: ->
-    @editorElement = $("<div class='editor'>").appendTo('#main')
-    @aceEditor = ace.edit @editorElement[0]
-    @aceEditor.setTheme(require "ace/theme/twilight")
+    open: (url) ->
+      $atomController.url = url
+      @buffer = new Buffer(url)
+      session = new EditSession(@buffer.aceDocument, @buffer.getMode())
+      @aceEditor.setSession(session)
 
-  getAceSession: ->
-    @aceEditor.getSession()
+    buildAceEditor: ->
+      @aceEditor = ace.edit this[0]
+      @aceEditor.setTheme(require "ace/theme/twilight")
 
-  save: ->
-    if @buffer.url
-      @buffer.save()
-    else if url = atom.native.savePanel()
-      @buffer.url = url
-      @buffer.save()
+    getAceSession: ->
+      @aceEditor.getSession()
+
+    save: ->
+      if @buffer.url
+        @buffer.save()
+      else if url = atom.native.savePanel()
+        @buffer.url = url
+        @buffer.save()
 

src/atom/root-view.coffee

@@ -15,12 +15,10 @@ class RootView extends Template
     @link rel: 'stylesheet', href: "#{require.resolve('atom.css')}?#{(new Date).getTime()}"
     @div id: 'app-horizontal', =>
       @div id: 'app-vertical', outlet: 'vertical', =>
-        @div id: 'main', outlet: 'main'
+        @div id: 'main', outlet: 'main', =>
+          @subview 'editor', Editor.build(url: $atomController.url?.toString())
 
   viewProperties:
-    initialize: ->
-      @editor = new Editor $atomController.url?.toString()
-
     addPane: (view) ->
       pane = $('<div class="pane">')
       pane.append(view)

src/stdlib/template.coffee

@@ -20,7 +20,7 @@ class Template
   @toHtml: (attributes) ->
     (new this).toHtml(attributes)
 
-  build: (attributes) ->
+  build: (attributes={}) ->
     @builder = new Builder
     @content(attributes)
     view = @builder.toFragment()