light9 Changeset - 8b3f7f5656f4

Changeset - 8b3f7f5656f4

Parent rev.

Child rev.

[Not reviewed]

default

0 1 0

Drew Perttula - 9 years ago 2016-06-08 05:47:49
drewp@bigasterisk.com

try to pretty up the zoom/layout change code
Ignore-this: f8ef1cecc4802b0d9befb49301501521

1 file changed with 32 insertions and 27 deletions:

light9/web/timeline.coffee

0 comments (0 inline, 0 general)

light9/web/timeline.coffee

➞

Show inline comments

@@ @@ -9,12 +9,14 @@ Polymer @@
     graph: {type: Object, notify: true}
     song: {type: String, notify: true}
     show: {value: 'http://light9.bigasterisk.com/show/dance2016'}
     songTime: {type: Number, notify: true, observer: '_onSongTime'}
     songDuration: {type: Number, notify: true, observer: '_onSongDuration'}
     songPlaying: {type: Boolean, notify: true}
     fullZoomX: {type: Object, notify: true}
     zoomInX: {type: Object, notify: true}
   width: ko.observable(1)
   listeners:
     'iron-resize': '_onIronResize'
   _onIronResize: ->
     @width(@offsetWidth)
   _onSongTime: (t) ->
@@ @@ -29,42 +31,43 @@ Polymer @@
         t1: ko.observable(0) # need validation to stay in bounds and not go too close
         t2: ko.observable(100)
       cursor:
         t: ko.observable(20)
       mouse:
         pos: ko.observable($V([0,0]))
     @fullZoomX = d3.scaleLinear()
     @zoomInX = d3.scaleLinear()
   attached: ->
     @dia = @$.dia
     ko.computed =>
       @debug = ko.toJSON(@viewState)
     ko.computed( =>
         @fullZoomX = d3.scaleLinear().domain([0, @viewState.zoomSpec.duration()]).range([0, @width()])
         @zoomInX = d3.scaleLinear().domain([@viewState.zoomSpec.t1(), @viewState.zoomSpec.t2()]).range([0, @width()])
         @dia.setTimeAxis(@width(), @$.zoomed.$.audio.offsetTop, @zoomInX)
         @$.adjusters.updateAllCoords()
       ).extend({rateLimit: 5})
     ko.computed( =>
         # zoomInX changing doesn't retrigger this, so I'll do it here
         ko.toJS(@viewState.zoomSpec)
         @$.dia.setCursor(@$.audio.offsetTop, @$.audio.offsetHeight,
                          @$.zoomed.$.time.offsetTop,
                          @$.zoomed.$.time.offsetHeight,
                          @fullZoomX, @zoomInX, @viewState.cursor)
+      )
     ko.computed(@zoomOrLayoutChanged.bind(@)).extend({rateLimit: 5})
     @adjs = @makeZoomAdjs()
     @trackMouse()
     @bindKeys()
     @bindWheelZoom()
   zoomOrLayoutChanged: ->
     @fullZoomX.domain([0, @viewState.zoomSpec.duration()])
     @fullZoomX.range([0, @width()])
     # had trouble making notes update when this changes
     zoomInX = d3.scaleLinear()
     zoomInX.domain([@viewState.zoomSpec.t1(), @viewState.zoomSpec.t2()])
     zoomInX.range([0, @width()])
     @zoomInX = zoomInX
     # todo: these run a lot of work purely for a time change
     @$.dia.setTimeAxis(@width(), @$.zoomed.$.audio.offsetTop, @zoomInX)
     @$.adjusters.updateAllCoords()
     @$.dia.setCursor(@$.audio.offsetTop, @$.audio.offsetHeight,
                      @$.zoomed.$.time.offsetTop,
                      @$.zoomed.$.time.offsetHeight,
                      @fullZoomX, @zoomInX, @viewState.cursor)
   trackMouse: ->
     # not just for show- we use the mouse pos sometimes
     for evName in ['mousemove', 'touchmove']
       @addEventListener evName, (ev) =>
         ev.preventDefault()
@@ @@ -73,18 +76,20 @@ Polymer @@
           ev = ev.touches[0]
         @root = @getBoundingClientRect()
         @viewState.mouse.pos($V([ev.pageX - @root.left, ev.pageY - @root.top]))
         @$.dia.setMouse(@viewState.mouse.pos())
         #@sendMouseToVidref()
         now = Date.now()
         if (!@$.vidrefLastSent? || @$.vidrefLastSent < now - 200) && !@songPlaying
           @$.vidrefTime.body = {t: @latestMouseTime(), source: 'timeline'}
           @$.vidrefTime.generateRequest()
           @$.vidrefLastSent = now
   sendMouseToVidref: ->
     now = Date.now()
     if (!@$.vidrefLastSent? || @$.vidrefLastSent < now - 200) && !@songPlaying
       @$.vidrefTime.body = {t: @latestMouseTime(), source: 'timeline'}
       @$.vidrefTime.generateRequest()
       @$.vidrefLastSent = now
   latestMouseTime: ->
     @zoomInX.invert(@viewState.mouse.pos().e(1))
   bindWheelZoom: ->
     @$.zoomed.addEventListener 'mousewheel', (ev) =>
@@ @@ -192,13 +197,13 @@ Polymer @@
   properties:
     graph: { type: Object, notify: true }
     zoomInX: { type: Object, notify: true }
     noteUris: { type: Array, notify: true }
     rowIndex: { type: Object, notify: true }
   observers: [
-    'onGraph(graph, zoomInX)'
     'onGraph(graph)'
+    ]
   onGraph: ->
     @graph.runHandler(@update.bind(@))
   update: ->
     U = (x) -> @graph.Uri(x)

0 comments (0 inline, 0 general)