light9 Changeset - 5805056fdf93

Changeset - 5805056fdf93

Parent rev.

Child rev.

[Not reviewed]

default

0 4 0

Drew Perttula - 9 years ago 2016-06-08 08:07:28
drewp@bigasterisk.com

fix a lot of refresh and cleanup issues
Ignore-this: 521fef8e76f7af266cda635d8add6c30

4 files changed with 52 insertions and 33 deletions:

light9/web/edit-choice.coffee

light9/web/timeline/adjustable.coffee

light9/web/timeline/timeline-elements.html

light9/web/timeline/timeline.coffee

0 comments (0 inline, 0 general)

light9/web/edit-choice.coffee

➞

Show inline comments

@@ @@ -22,7 +22,8 @@ Polymer @@
       event.preventDefault()
       @uri = event.dataTransfer.getData('text/uri-list')
       @updateLabel()
       @$.box.classList.remove('over')
     gotGraph: ->
       @graph.runHandler(@updateLabel.bind(@))

light9/web/timeline/adjustable.coffee

➞

Show inline comments

@@ @@ -58,7 +58,6 @@ class Adjustable @@
     @root = rootElem.getBoundingClientRect() if rootElem
     offsetParentPos = $V([ev.pageX - @root.left, ev.pageY - @root.top])
     setMouse(offsetParentPos) # for debugging
     return offsetParentPos
 class window.AdjustableFloatObservable extends Adjustable

light9/web/timeline/timeline-elements.html

➞

Show inline comments

@@ @@ -51,6 +51,7 @@ @@
                            song="{{song}}"></light9-timeline-audio>
     <light9-timeline-time-zoomed id="zoomed"
                                  graph="{{graph}}"
                                  dia="{{dia}}"
                                  song="{{song}}"
                                  show="{{show}}"
                                  zoom="{{viewState.zoomSpec}}"
@@ @@ -99,6 +100,8 @@ @@
       </light9-timeline-audio>
       <template is="dom-repeat" items="{{rows}}">
         <light9-timeline-graph-row graph="{{graph}}"
                                    dia="{{dia}}"
                                    song="{{song}}"
                                    zoom-in-x="{{zoomInX}}"
                                    row-index="{{item}}"
+        >
@@ @@ -106,27 +109,6 @@ @@
       </template>
     </div>
   </template>
   <script>
    Polymer({
        is: "light9-timeline-time-zoomed",
        behaviors: [
            Polymer.IronResizableBehavior
        ],
        properties: {
            graph: { type: Object, notify: true },
            song: { type: String, notify: true },
            zoomInX: { type: Object, notify: true },
            rows: {value: [0,1,2]},
            zoom: {type: Object, notify: true, observer: 'onZoom'},
            zoomFlattened: {type: Object, notify: true}
        },
        onZoom: function() {
            ko.computed(function() {
                this.zoomFlattened = ko.toJS(this.zoom);
            }.bind(this));
+       }
    });
   </script>
 </dom-module>
@@ @@ -204,7 +186,9 @@ @@
     </style>
     <template is="dom-repeat" items="{{noteUris}}">
       <light9-timeline-note graph="{{graph}}"
                             dia="{{dia}}"
                             uri="{{item}}"
                             song="{{song}}"
                             zoom-in-x="{{zoomInX}}">
       </light9-timeline-note>
     </template>

light9/web/timeline/timeline.coffee

➞

Show inline comments

@@ @@ -44,8 +44,9 @@ Polymer @@
     @fullZoomX = d3.scaleLinear()
     @zoomInX = d3.scaleLinear()
   attached: ->
+    @dia = @$.dia
     ko.computed(@zoomOrLayoutChanged.bind(@)).extend({rateLimit: 5})
     ko.computed(@songTimeChanged.bind(@))
     @adjs = @makeZoomAdjs()
@@ @@ -64,10 +65,13 @@ Polymer @@
     @zoomInX = zoomInX
     # todo: these run a lot of work purely for a time change
-    @$.dia.setTimeAxis(@width(), @$.zoomed.$.audio.offsetTop, @zoomInX)
     @dia.setTimeAxis(@width(), @$.zoomed.$.audio.offsetTop, @zoomInX)
     @$.adjusters.updateAllCoords()
     @$.dia.setCursor(@$.audio.offsetTop, @$.audio.offsetHeight,
     @songTimeChanged()
   songTimeChanged: ->
     @dia.setCursor(@$.audio.offsetTop, @$.audio.offsetHeight,
                      @$.zoomed.$.time.offsetTop,
                      @$.zoomed.$.time.offsetHeight,
                      @fullZoomX, @zoomInX, @viewState.cursor)
@@ @@ -85,7 +89,7 @@ Polymer @@
         @root = @getBoundingClientRect()
         @viewState.mouse.pos($V([ev.pageX - @root.left, ev.pageY - @root.top]))
-        @$.dia.setMouse(@viewState.mouse.pos())
         @dia.setMouse(@viewState.mouse.pos())
         #@sendMouseToVidref()
   sendMouseToVidref: ->
@@ @@ -194,6 +198,22 @@ Polymer @@
     return [left, right, pan]
 Polymer
   is: 'light9-timeline-time-zoomed'
   behaviors: [ Polymer.IronResizableBehavior ]
   properties:
     graph: { type: Object, notify: true }
     dia: { type: Object, notify: true }
     song: { type: String, notify: true }
     zoomInX: { type: Object, notify: true }
     rows: { value: [0, 1, 2] }
     zoom: { type: Object, notify: true, observer: 'onZoom' }
     zoomFlattened: { type: Object, notify: true }
   onZoom: ->
     updateZoomFlattened = ->
       @zoomFlattened = ko.toJS(@zoom)
     ko.computed(updateZoomFlattened.bind(@))
 Polymer
   is: "light9-timeline-time-axis",
   # for now since it's just one line calling dia,
   # light9-timeline-editor does our drawing work.
@@ @@ -203,11 +223,14 @@ Polymer @@
   behaviors: [ Polymer.IronResizableBehavior ]
   properties:
     graph: { type: Object, notify: true }
     dia: { type: Object, notify: true }
     song:  { type: String, notify: true }
     zoomInX: { type: Object, notify: true }
     noteUris: { type: Array, notify: true }
     rowIndex: { type: Object, notify: true }
   observers: [
     'onGraph(graph)'
     'update(song)'
+    ]
   onGraph: ->
     @graph.runHandler(@update.bind(@))
@@ @@ -217,7 +240,6 @@ Polymer @@
     @noteUris = []
     for note in @graph.objects(@song, U(':note'))
       @push('noteUris', note)
 Polymer
   is: 'light9-timeline-note'
@@ @@ -225,14 +247,18 @@ Polymer @@
   listeners: 'iron-resize': 'update'
   properties:
     graph: { type: Object, notify: true }
     dia: { type: Object, notify: true }
     uri: { type: String, notify: true }
     zoomInX: { type: Object, notify: true }
   observers: [
     'onUri(graph, uri)'
     'update(graph, uri, zoomInX)'
     'onUri(graph, dia, uri)'
     'update(graph, dia, uri, zoomInX)'
+    ]
   ready: ->
   detached: ->
     @dia.clearElem(@uri)
   onUri: ->
     @graph.runHandler(@update.bind(@))
@@ @@ -257,7 +283,7 @@ Polymer @@
       screenPos = (pt) =>
         $V([@zoomInX(pt.e(1)), @offsetTop + (1 - pt.e(2)) * @offsetHeight])
       setNote(@uri, (screenPos(pt) for pt in worldPts))
+      @dia.setNote(@uri, (screenPos(pt) for pt in worldPts))
     catch e
       log("during resize of #{@uri}: #{@e}")
@@ @@ -342,6 +368,11 @@ Polymer @@
       @adj?.continueDrag($V([d3.event.x, d3.event.y]))
     drag.on('end', () => @adj?.endDrag())
     @updateDisplay()
   detached: ->
     @dia.clearElem(@myId)
 svgPathFromPoints = (pts) ->
   out = ''
@@ @@ -360,8 +391,6 @@ Polymer @@
   properties: {}
   ready: ->
     @elemById = {}
     window.setNote = @setNote.bind(this)
     window.setMouse = @setMouse.bind(this)
   setTimeAxis: (width, yTop, scale) ->
     pxPerTick = 50
@@ @@ -383,6 +412,12 @@ Polymer @@
       for k,v of attrs
         elem.setAttribute(k, v)
     return elem
   clearElem: (uri) ->
     elem = @elemById[uri]
     if elem
       elem.remove()
       delete @elemById[uri]
   setNote: (uri, curvePts) ->
     elem = @getOrCreateElem(uri, 'notes', 'path', {style:"fill:#53774b; stroke:#000000; stroke-width:1.5;"})

0 comments (0 inline, 0 general)