--- a/light9/web/graph.coffee	Sun Jun 05 05:36:00 2016 +0000
+++ b/light9/web/graph.coffee	Sun Jun 05 06:23:01 2016 +0000
@@ -275,19 +275,23 @@
   unsubscribe: (subscription) ->
     @_watchers.unsubscribe(subscription)
 
-
-  floatValue: (s, p) ->
+  _singleValue: (s, p) ->
     quads = @graph.findByIRI(s, p)
     switch quads.length
-      when 0 then throw new Error("no value for "+s+" "+p)
+      when 0
+        throw new Error("no value for "+s+" "+p)
       when 1
         obj = quads[0].object
-        return parseFloat(N3.Util.getLiteralValue(obj))
+        return N3.Util.getLiteralValue(obj)
       else
         throw new Error("too many values: " + JSON.stringify(quads))
+
+  floatValue: (s, p) ->
+    parseFloat(@_singleValue(s, p))
     
   stringValue: (s, p) ->
-
+    @_singleValue(s, p)
+    
   uriValue: (s, p) ->
 
   objects: (s, p) ->

--- a/light9/web/light9-timeline-audio.html	Sun Jun 05 05:36:00 2016 +0000
+++ b/light9/web/light9-timeline-audio.html	Sun Jun 05 06:23:01 2016 +0000
@@ -21,22 +21,47 @@
      }
     </style>
     <div>
-      <img src="show/dance2016/spectrogram/01-dream.png"
+      <img src="{{imgSrc}}"
            style="width: {{imgWidth}} ; left: {{imgLeft}}">
     </div>
   </template>
   <script>
+   log = console.log
    Polymer({
        is: "light9-timeline-audio",
        properties: {
-           uri: {type: String, notify: true}, // song
+           graph: {type: Object, notify: true, observer: '_imgSrc'},
+           show: {type: String, notify: true, observer: '_imgSrc'},
+           song: {type: String, notify: true, observer: '_imgSrc'}, // song
            zoom: {type: Object, notify: true},
+           imgSrc: { type: String, notify: true},
            imgWidth: { computed: '_imgWidth(zoom)' },
            imgLeft: { computed: '_imgLeft(zoom)' },
        },
        ready: function() {
            this.zoom = {duration: 0};
        },
+       
+       _imgSrc: function() {
+           try {
+               // Should be subscriptions to root and filename
+               // that get replaced when the song changes.
+               if (this.graph && this.show && !this.subscribed) {
+                   this.subscribed = true;
+                   this.graph.subscribe(this.graph.Uri(this.show), null, null,
+                                        this._imgSrc.bind(this));
+               }
+               
+               var root = this.graph.stringValue(
+                   this.graph.Uri(this.show),
+                   this.graph.Uri(':spectrogramUrlRoot'));
+               var filename = this.graph.stringValue(
+                   this.song, this.graph.Uri(':songFilename'));
+               this.imgSrc = root + '/' + filename.replace('.wav', '.png');
+           } catch(e) {
+               log(e)
+           }
+       },
        _imgWidth: function(zoom) {
            if (!zoom.duration) {
                return "100%";

--- a/light9/web/timeline-elements.html	Sun Jun 05 05:36:00 2016 +0000
+++ b/light9/web/timeline-elements.html	Sun Jun 05 06:23:01 2016 +0000
@@ -42,9 +42,14 @@
       <label><input type="checkbox"> follow player song choice</label>
     </div>
     <div>[[debug]]</div>
-    <light9-timeline-audio id="audio"></light9-timeline-audio>
+    <light9-timeline-audio id="audio"
+                           graph="{{graph}}"
+                           show="{{show}}"
+                           song="{{song}}"></light9-timeline-audio>
     <light9-timeline-time-zoomed id="zoomed"
                                  graph="{{graph}}"
+                                 song="{{song}}"
+                                 show="{{show}}"
                                  zoom="{{viewState.zoomSpec}}"
                                  zoom-in-x="{{zoomInX}}">
     </light9-timeline-time-zoomed>
@@ -81,6 +86,9 @@
     <div>
       <light9-timeline-time-axis id="time"></light9-timeline-time-axis>
       <light9-timeline-audio id="audio"
+                             graph="{{graph}}"
+                             song="{{song}}"
+                             show="{{show}}"
                              zoom="{{zoomFlattened}}">
       </light9-timeline-audio>
       <template is="dom-repeat" items="{{rows}}">
@@ -98,6 +106,7 @@
        ],
        properties: {
            graph: { type: Object, notify: true },
+           song: { type: String, notify: true },
            zoomInX: { type: Object, notify: true },
            rows: {value: [0]},
            zoom: {type: Object, notify: true, observer: 'onZoom'},

--- a/light9/web/timeline.coffee	Sun Jun 05 05:36:00 2016 +0000
+++ b/light9/web/timeline.coffee	Sun Jun 05 06:23:01 2016 +0000
@@ -8,6 +8,7 @@
     debug: {type: String}
     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}