changeset 1617:ff193840cd84

timeline cleanups. rm old adjuster class. Ignore-this: cbcaa296b818ebef0a155f13a4004be2
author Drew Perttula <drewp@bigasterisk.com>
date Wed, 07 Jun 2017 07:28:37 +0000
parents 2362fcf5e220
children ab025bf6c3df
files light9/web/timeline/timeline-elements.html light9/web/timeline/timeline.coffee
diffstat 2 files changed, 3 insertions(+), 125 deletions(-) [+]
line wrap: on
line diff
--- a/light9/web/timeline/timeline-elements.html	Wed Jun 07 05:48:04 2017 +0000
+++ b/light9/web/timeline/timeline-elements.html	Wed Jun 07 07:28:37 2017 +0000
@@ -87,7 +87,7 @@
          height: 100%;
      }
      #rows.dragging {
-background: rgba(126, 52, 245, 0.0784313725490196);
+         background: rgba(126, 52, 245, 0.0784);
          }
      light9-timeline-audio {
          width: 100%;
@@ -127,8 +127,6 @@
        - background grids
        - zoom arcs
        - notes
-       - annotations on notes
-       - connectors between adjusters and their targets
      
      This element is not responsible for any hit detection. Things you click (rows,
      notes, adjusters, etc) are caught on their respective elements. (But is that
@@ -160,8 +158,6 @@
         <g id="timeAxis" transform="translate(0,40)"></g>
         <g id="mouse"></g>
         <g id="notes"></g>
-        <g id="noteLabels"></g>
-        <g id="connectors"></g>
       </g>
     </svg>
   </template>
@@ -255,66 +251,6 @@
   </template>
 </dom-module>
 
-<!-- Yellow dotted handle that you can adjust to edit something.
-     Knows an attribute to edit and the true screen location, even if
-     parent <light9-timeline-adjusters> has offset us a bit to avoid a
-     text overlap.
-     Draws affordance arrows and a connector line if we're far
-     away from the point that we edit.
-     May grow to a bigger editor when you click or drag.
-   -->
-<dom-module id="light9-timeline-adjuster">
-  <template>
-    <style>
-     /* 
-     #top {outline: 2px solid rgba(255, 0, 0, 0.25);}
-     table {outline: 2px solid rgba(0, 0, 255, 0.19);}
-     */
-     
-     #top {
-         position: absolute;
-         display: inline-block;
-     }
-     table {
-         position: relative;
-         left: -50%;
-         top: -40px; /* percent had no effect */
-         z-index: 2;
-         border-collapse: collapse;
-     }
-     td {
-         text-align: center;
-         font-size: 20px;
-     }
-     span {
-         font-size: 16px;
-         background: rgba(255, 255, 0, 0.5);
-         border: 3px yellow dotted;
-         border-radius: 8px;
-         padding: 5px;
-
-         cursor: ew-resize;
-         -webkit-user-select: none;
-         pointer-events: all;
-     }
-     span.empty {
-         width: 30px; /* todo: supposed to fill the whole visible section*/
-         height: 13px;
-         display: inline-block;
-         background: rgba(0,0,0,0);
-     }
-    </style>
-    <div id="top" style$="left: [[centerStyle.x]]px; top: [[centerStyle.y]]px">
-      <table>
-        <tr><td></td><td style="visibility: hidden">↑</td><td></td></tr>
-        <tr><td>←</td><td><span id="label" class$="[[spanClass]]">[[displayValue]]</span></td><td>→</td></tr>
-        <tr><td></td><td style="visibility: hidden">↓</td><td></td></tr>
-      </table>
-    </div>
-    
-  </template>
-</dom-module>
-
 <!-- sometimes we draw attrs within the shape of a note. -->
 <dom-module id="light9-timeline-note-inline-attrs">
   <template>
--- a/light9/web/timeline/timeline.coffee	Wed Jun 07 05:48:04 2017 +0000
+++ b/light9/web/timeline/timeline.coffee	Wed Jun 07 07:28:37 2017 +0000
@@ -633,57 +633,6 @@
     patch = {delQuads: [{subject: @song, predicate: @graph.Uri(':note'), object: @uri, graph: @song}], addQuads: []}
     @graph.applyAndSendPatch(patch)
 
-    
-class deleteme
-  go: ->
-    visible: { type: Boolean, notify: true }
-    
-    displayValue: { type: String }
-    centerStyle: { type: Object }
-    spanClass: { type: String, value: '' }
-
-  observer: [
-    'onAdj(graph, adj, dia, id, visible)'
-    ]
-  onAdj:  ->
-    log('onAdj', @id)
-    @adj.subscribe(@updateDisplay.bind(this))
-    @graph.runHandler(@updateDisplay.bind(@))
-
-  updateDisplay: () ->
-    go = =>
-      if !@visible
-        @clearElements()
-        return
-      window.debug_adjUpdateDisplay++
-      @spanClass = if @adj.config.emptyBox then 'empty' else ''
-      @displayValue = @adj.getDisplayValue()
-      center = @adj.getCenter()
-      target = @adj.getTarget()
-      #log("adj updateDisplay center #{center.elements} target #{target.elements}")
-      return if isNaN(center.e(1))
-      @centerStyle = {x: center.e(1), y: center.e(2)}
-      @dia.setAdjusterConnector(@adj.id + '/conn', center, target)
-    @debounce('updateDisplay', go)
-        
-  attached: ->
-    drag = d3.drag()
-    sel = d3.select(@$.label)
-    sel.call(drag)
-    drag.subject((d) -> {x: @offsetLeft, y: @offsetTop})
-    drag.container(@offsetParent)
-    drag.on('start', () => @adj?.startDrag())
-    drag.on 'drag', () =>
-      @adj?.continueDrag($V([d3.event.x, d3.event.y]))
-    drag.on('end', () => @adj?.endDrag())
-
-    @updateDisplay()
-
-  detached: -> @clearElements()
-  clearElements: ->
-    @dia.clearElem(@adj.id, ['/conn'])
-
-
 svgPathFromPoints = (pts) ->
   out = ''
   pts.forEach (p) ->
@@ -881,7 +830,7 @@
     for _, adj of @adjs
       desired = adj.getSuggestedCenter()
       output = desired
-      for tries in [0...2]
+      for tries in [0...4]
         nearest = @qt.find(output.e(1), output.e(2))
         if nearest
           dist = output.distanceFrom(nearest)
@@ -936,6 +885,7 @@
     # coords from a center that's passed in
     # # special layout for the thaeter ones with middinh 
     # l/r arrows
+    # mouse arrow cursor upon hover, and accent the hovered adjuster
     # connector
 
   
@@ -1003,11 +953,3 @@
     #elem.setAttribute('x', curvePts[0].e(1)+20)
     #elem.setAttribute('y', curvePts[0].e(2)-10)
     #elem.innerHTML = effectLabel;
-
-  setAdjusterConnector: (uri, center, target) ->
-    id = uri + '/adj'
-    if not @anyPointsInView([center, target])
-      @clearElem(id, [''])
-      return
-    elem = @getOrCreateElem(uri, 'connectors', 'path', {style: "fill:none;stroke:#d4d4d4;stroke-width:0.9282527;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:2.78475821, 2.78475821;stroke-dashoffset:0;"})
-    elem.setAttribute('d', svgPathFromPoints([center, target]))