--- a/light9/web/timeline/timeline-elements.html	Mon Jun 13 00:04:59 2016 +0000
+++ b/light9/web/timeline/timeline-elements.html	Mon Jun 13 00:11:32 2016 +0000
@@ -321,7 +321,11 @@
       <div>note [[noteLabel]] <button on-click="onDel">del</button></div>
       <table>
         <tr><th>effect:</th><td><edit-choice uri="{{effect}}" label="{{effectLabel}}"></edit-choice></td></tr>
-        <!-- <tr><th>color:</th><td>[[color]]</td></tr> -->
+        <tr><th>colorScale:</th><td>
+          <!-- this could share with live/index.html's
+          light9-live-control, but that one is currently junky -->
+          <span><input type="color" value="{{colorScale::input}}"> [[colorScale]]</span>
+        </td></tr>
       </table>
     </div>
   </template>

--- a/light9/web/timeline/timeline.coffee	Mon Jun 13 00:04:59 2016 +0000
+++ b/light9/web/timeline/timeline.coffee	Mon Jun 13 00:11:32 2016 +0000
@@ -334,7 +334,6 @@
     @graph.runHandler(@update.bind(@), "row notes #{@rowIndex}")
   update: ->
     U = (x) -> @graph.Uri(x)
-    log("row #{@rowIndex} updating")
 
     notesForThisRow = []
     i = 0
@@ -342,7 +341,6 @@
       if (i % ROW_COUNT) == @rowIndex
         notesForThisRow.push(n)
       i++
-    log("row #{@rowIndex} gets", notesForThisRow)
 
     updateChildren @, notesForThisRow, (newUri) =>
       child = document.createElement('light9-timeline-note')
@@ -355,7 +353,6 @@
       return child      
 
   onZoom: ->
-    log('row onzoom')
     for e in @children
       e.zoomInX = @zoomInX
 
@@ -429,8 +426,8 @@
 
     leftX = Math.max(2, screenPts[1].e(1) + 5)
     rightX = screenPts[2].e(1) - 5
-    w = 120
-    h = 45
+    w = 170
+    h = 80
     @inlineRect = {
       left: leftX,
       top: @offsetTop + @offsetHeight - h - 5,
@@ -497,15 +494,36 @@
   properties:
     graph: { type: Object, notify: true }
     song: { type: String, notify: true }
-    uri: { type: String, notify: true }
+    uri: { type: String, notify: true }  # the Note
     rect: { type: Object, notify: true }
     effect: { type: String, notify: true }
     effectLabel: { type: String, notify: true }
-    color: { type: String, notify: true }
+    colorScale: { type: String, notify: true }
     noteLabel: { type: String, notify: true }
   observers: [
     'addHandler(graph, uri)'
+    'onColorScale(graph, uri, colorScale)'
     ]
+  onColorScale: ->
+    U = (x) -> @graph.Uri(x)
+    log('onColorScale', @colorScale, @colorScaleFromGraph, @existingColorScaleSetting)
+    if @colorScale == @colorScaleFromGraph
+      return
+      
+    quad = (s, p, o) => {subject: s, predicate: p, object: o, graph: @song}
+
+    settingValue = @graph.Literal(@colorScale)
+    if @existingColorScaleSetting
+      @graph.patchObject(@existingColorScaleSetting, U(':value'), settingValue, @song)
+    else
+      setting = @graph.nextNumberedResource(@uri + 'set')
+      patch = {delQuads: [], addQuads: [
+        quad(@uri, U(':setting'), setting)
+        quad(setting, U(':effectAttr'), U(':colorScale'))
+        quad(setting, U(':value'), settingValue)
+        ]}
+      @graph.applyAndSendPatch(patch)
+    
   addHandler: ->
     @graph.runHandler(@update.bind(@))
   update: ->
@@ -513,7 +531,20 @@
     @effect = @graph.uriValue(@uri, U(':effectClass'))
     @effectLabel = @effect.replace(/.*\//, '')
     @noteLabel = @uri.replace(/.*\//, '')
-    @color = '#ff0000'
+
+    @existingColorScaleSetting = null
+    for setting in @graph.objects(@uri, U(':setting'))
+      ea = @graph.uriValue(setting, U(':effectAttr'))
+      value = @graph.stringValue(setting, U(':value'))
+      if ea == U(':colorScale')
+        @colorScaleFromGraph = value
+        @colorScale = value
+        @existingColorScaleSetting = setting
+    if @existingColorScaleSetting == null
+      @colorScaleFromGraph = '#ffffff'
+      @colorScale = '#ffffff'
+
+
   onDel: ->
     patch = {delQuads: [{subject: @song, predicate: @graph.Uri(':note'), object: @uri, graph: @song}], addQuads: []}
     @graph.applyAndSendPatch(patch)