Fix log

After update to glimmer log started to be rendered incorrectly, with log
lines being inserted in the wrong places. I'm not sure what's the
underlying problem, but rewriting to components seems to fix the issue.
Since views are deprecated anyway I'm not going to investigate the
problem deeper.

app/components/job-log.coffee

@@ -1,8 +1,6 @@
-`import BasicView from 'travis/views/basic'`
-`import config from 'travis/config/environment'`
+`import Ember from 'ember'`
 
-View = BasicView.extend
-  templateName: 'jobs/log'
+JobLogComponent = Ember.Component.extend
   logBinding: 'job.log'
 
   didInsertElement: ->
@@ -29,4 +27,4 @@ View = BasicView.extend
       job.get('log').fetch()
       job.subscribe()
 
-`export default View`
+`export default JobLogComponent`

app/components/log-content.coffee

@@ -1,8 +1,8 @@
+`import Ember from 'ember'`
 `import LinesSelector from 'travis/utils/lines-selector'`
 `import LogFolder from 'travis/utils/log-folder'`
 `import config from 'travis/config/environment'`
 `import { plainTextLog as plainTextLogUrl } from 'travis/utils/urls'`
-`import BasicView from 'travis/views/basic'`
 
 Log.DEBUG = false
 Log.LIMIT = 10000
@@ -41,16 +41,11 @@ Object.defineProperty Log.Limit.prototype, 'limited',
   get: ->
     @count >= @max_lines
 
-View = BasicView.extend
+LogContentComponent = Ember.Component.extend
   popup: Ember.inject.service()
+  auth: Ember.inject.service()
 
-  templateName: 'jobs/pre'
-  currentUserBinding: 'controller.auth.currentUser'
-
-  logWillChange: (->
-    console.log 'log view: log will change' if Log.DEBUG
-    @teardownLog()
-  ).observesBefore('log')
+  currentUserBinding: 'auth.currentUser'
 
   didInsertElement: ->
     console.log 'log view: did insert' if Log.DEBUG
@@ -61,21 +56,6 @@ View = BasicView.extend
     console.log 'log view: will destroy' if Log.DEBUG
     @teardownLog()
 
-  versionDidChange: (->
-    this.$('#log').empty()
-    @teardownLog()
-    @createEngine()
-  ).observes('log.version')
-
-  logDidChange: (->
-    console.log 'log view: log did change: rerender' if Log.DEBUG
-
-    this.$('#log').empty()
-    @teardownLog()
-    if @get('log')
-      @createEngine()
-  ).observes('log')
-
   teardownLog: ->
     if log = @get('log')
       parts = log.get('parts')
@@ -83,20 +63,30 @@ View = BasicView.extend
       parts.destroy()
       log.notifyPropertyChange('parts')
       @lineSelector?.willDestroy()
+      # log should do it on destroy
+      this.$('#log').empty()
 
   createEngine: ->
-    if @get('log')
+    if log = @get('log')
       console.log 'log view: create engine' if Log.DEBUG
+      log.onClear =>
+        @teardownLog()
+        @createEngine()
+
       @scroll = new Log.Scroll beforeScroll: =>
         @unfoldHighlight()
       @limit = new Log.Limit Log.LIMIT, =>
         @set('limited', true)
       @engine = Log.create(listeners: [@scroll, @limit])
       @engine.limit = @limit
-      @logFolder = new LogFolder(@$().find('#log'))
-      @lineSelector = new LinesSelector(@$().find('#log'), @scroll, @logFolder)
+      @logFolder = new LogFolder(@$('#log'))
+      @lineSelector = new LinesSelector(@$('#log'), @scroll, @logFolder)
       @observeParts()
 
+  didUpdateAttrs: ->
+    @teardownLog()
+    @createEngine()
+
   unfoldHighlight: ->
     @lineSelector.unfoldLines()
 
@@ -154,5 +144,4 @@ View = BasicView.extend
 
   noop: -> # TODO required?
 
-`export default View`
-Travis.PreView = View
+`export default LogContentComponent`

app/models/log.coffee

@@ -85,19 +85,26 @@ Log = Ember.Object.extend
 
   clear: ->
     @clearParts()
-    @incrementProperty('version')
+    @runOnClear()
+
+  runOnClear: ->
+    if callback = @get('onClearCallback')
+      callback()
+
+  onClear: (callback) ->
+    @set('onClearCallback', callback)
 
   append: (part) ->
     return if @get('parts').isDestroying || @get('parts').isDestroyed
     @get('parts').pushObject(part)
 
   loadParts: (parts) ->
-    console.log 'log model: load parts' if Log.DEBUG
+    console.log 'log model: load parts'
     @append(part) for part in parts
     @set('isLoaded', true)
 
   loadText: (text) ->
-    console.log 'log model: load text' if Log.DEBUG
+    console.log 'log model: load text'
     @append(number: 1, content: text, final: true)
     @set('isLoaded', true)
 

app/templates/build.hbs

@@ -84,7 +84,7 @@
       {{loading-indicator center=true}}
     {{/if}}
   {{else}}
-    {{view 'log' job=build.jobs.firstObject}}
+    {{job-log job=build.jobs.firstObject}}
   {{/if}}
 
 {{/if}}

app/templates/components/job-log.hbs

@@ -0,0 +1,5 @@
+{{#if log.isLoaded}}
+  {{log-content job=job log=log}}
+{{else}}
+  {{loading-indicator}}
+{{/if}}

app/templates/components/log-content.hbs

@@ -1,10 +1,10 @@
-{{remove-log-popup job=view.job}}
+{{remove-log-popup job=job}}
 
 <section id="log-container" class="log">
 
   {{#if auth.signedIn}}
-    {{#if view.job.isLegacyInfrastructure}}
-      {{#if view.job.isFinished}}
+    {{#if job.isLegacyInfrastructure}}
+      {{#if job.isFinished}}
         <p class="notice"><span class="icon-flag"></span>
         This job ran on our legacy infrastructure. Please read <a href="http://docs.travis-ci.com/user/migrating-from-legacy/?utm_source=legacy-notice&utm_medium=banner&utm_campaign=legacy-upgrade" title="Migrating from legacy">our docs on how to upgrade</a></p>
       {{else}}
@@ -14,23 +14,23 @@
     {{/if}}
   {{/if}}
 
-  {{#if view.job.notStarted}}
+  {{#if job.notStarted}}
     <div class="log-notice">Hang tight, the log cannot be shown until the build has started.</div>
   {{/if}}
 
-  <div class="{{if view.job.notStarted 'hidden'}}">
+  <div class="{{if job.notStarted 'hidden'}}">
     <menu class="log-header">
-      {{#if view.canRemoveLog}}
-        <a href="#" class="button button--grey open-popup" {{action "removeLogPopup" target=view}}><span class="icon icon--removeLog"></span> Remove Log</a>
+      {{#if canRemoveLog}}
+        <a href="#" class="button button--grey open-popup" {{action "removeLogPopup"}}><span class="icon icon--removeLog"></span> Remove Log</a>
       {{/if}}
-      <a class="button button--grey" href={{view.plainTextLogUrl}}><span class="icon icon--downloadLog"></span> Download Log</a>
+      <a class="button button--grey" href={{plainTextLogUrl}}><span class="icon icon--downloadLog"></span> Download Log</a>
     </menu>
     <div class="log-body">
-      {{#if view.showTailing}}
-        <a href="#" id="tail" class="log-tail" {{action "toggleTailing" target=view}}>
+      {{#if showTailing}}
+        <a href="#" id="tail" class="log-tail" {{action "toggleTailing"}}>
           <span class="tail-status"></span>
           <span class="tail-label button button--grey"><span class="icon icon--down"></span>
-            {{#if view.job.isFinished}}
+            {{#if job.isFinished}}
               Scroll to End of Log
             {{else}}
               Follow Log
@@ -41,15 +41,15 @@
 
       <pre id="log" class="ansi"></pre>
 
-      {{#if view.showToTop}}
-        <a href='#' class="to-top" {{action "toTop" target=view}}>Top</a>
+      {{#if showToTop}}
+        <a href='#' class="to-top" {{action "toTop"}}>Top</a>
       {{/if}}
     </div>
   </div>
-  {{#if view.limited}}
+  {{#if limited}}
     <p class="warning">
       This log is too long to be displayed. Please reduce the verbosity of your
-      build or download the <a href={{view.plainTextLogUrl}}>raw log</a>.
+      build or download the <a href={{plainTextLogUrl}}>raw log</a>.
     </p>
   {{/if}}
 </section>

app/templates/job.hbs

@@ -63,7 +63,7 @@
 
   {{view 'annotations' annotations=view.annotations}}
 
-  {{view 'log' job=job}}
+  {{job-log job=job}}
 
 {{else}}
   <div id="job">

app/templates/jobs/log.hbs

@@ -1,5 +0,0 @@
-{{#if view.log.isLoaded}}
-  {{view 'pre' job=view.job log=view.log}}
-{{else}}
-  {{loading-indicator}}
-{{/if}}