light9 Changeset - 16aa26b7d685

Changeset - 16aa26b7d685

Parent rev.

Child rev.

[Not reviewed]

default

0 4 0

Drew Perttula - 9 years ago 2016-06-05 06:23:01
drewp@bigasterisk.com

timeline audio loads the current song img
Ignore-this: 8c9afdda65323ecd0b48553dc13b1db5

4 files changed with 47 insertions and 8 deletions:

light9/web/graph.coffee

light9/web/light9-timeline-audio.html

light9/web/timeline-elements.html

light9/web/timeline.coffee

0 comments (0 inline, 0 general)

light9/web/graph.coffee

➞

Show inline comments

@@ @@ -272,25 +272,29 @@ class window.SyncedGraph @@
     if immediatePatch.addQuads.length
       onChange(immediatePatch)
   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) ->
   subjects: (p, o) ->

light9/web/light9-timeline-audio.html

➞

Show inline comments

@@ @@ -18,28 +18,53 @@ @@
      img {
          height: 100%;
          position: relative;
+     }
     </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%";
+           }
            return (100 / ((zoom.t2 - zoom.t1) / zoom.duration)) + "%";

light9/web/timeline-elements.html

➞

Show inline comments

@@ @@ -39,15 +39,20 @@ @@
                     playing="{{songPlaying}}"
                     duration="{{songDuration}}"></light9-music>
       timeline editor: song [{{song}}] <button>unlink</button>
       <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>
     <light9-timeline-diagram-layer id="dia"></light9-timeline-diagram-layer>
     <light9-timeline-adjusters id="adjusters"
                                dia="{{dia}}"
@@ @@ -78,12 +83,15 @@ @@
          flex-grow: 1;
+     }
     </style>
     <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}}">
         <light9-timeline-graph-row graph="{{graph}}"
                                    zoom-in-x="{{zoomInX}}">
         </light9-timeline-graph-row>
@@ @@ -95,12 +103,13 @@ @@
        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]},
            zoom: {type: Object, notify: true, observer: 'onZoom'},
            zoomFlattened: {type: Object, notify: true}
        },
        onZoom: function() {

light9/web/timeline.coffee

➞

Show inline comments

@@ @@ -5,12 +5,13 @@ Polymer @@
   behaviors: [ Polymer.IronResizableBehavior ]
   properties:
     viewState: { type: Object }
     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}
   width: ko.observable(1)
   listeners:
     'iron-resize': '_onIronResize'

0 comments (0 inline, 0 general)