light9 Changeset - 3843f6bd0460

Changeset - 3843f6bd0460

Parent rev.

Child rev.

[Not reviewed]

default

0 1 2

Drew Perttula - 9 years ago 2016-06-04 20:43:31
drewp@bigasterisk.com

music time fetcher
Ignore-this: c490ec8c59c3f1c5c0c8f7ebd08e0e2c

3 files changed with 42 insertions and 0 deletions:

light9/web/light9-music.coffee

light9/web/light9-music.html

light9/web/timeline-elements.html

0 comments (0 inline, 0 general)

light9/web/light9-music.coffee

➞

Show inline comments

@@ new file 100644 @@
 log = console.log
 # port of light9/curvecalc/musicaccess.py
 Polymer
   is: "light9-music",
   properties:
     status: { type: String, notify: true }
     duration: { type: Number, notify: true }
     playing: { type: Boolean, notify: true }
     song: { type: String, notify: true }
     t: { type: Number, notify: true }
   ready: ->
     @$.getTime.addEventListener('response', @onResponse.bind(@))
     @$.getTime.addEventListener 'error', (e) =>
       req = @$.getTime.lastRequest
       @status = "GET "+req.url+ " -> " + req.status + " " + req.statusText
       setTimeout(@poll.bind(@), 2000)
     @poll()
   poll: ->
     @$.getTime.generateRequest()
     @status = "poll"
   onResponse: ->
     @status = "ok"
     setTimeout(@poll.bind(@), 1000)
     r = @$.getTime.lastResponse
     @duration = r.duration
     @playing = r.playing
     @song = r.song
     @t = r.t

light9/web/light9-music.html

➞

Show inline comments

@@ new file 100644 @@
 <link rel="import" href="/lib/polymer/polymer.html">
 <link rel="import" href="/lib/iron-ajax/iron-ajax.html">
 <!-- remote control of ascoltami -->
 <dom-module id="light9-music">
   <template>
     <iron-ajax id="getTime" url="/ascoltami/time"></iron-ajax>
     <span>[[status]]</span>
   </template>
   <script src="light9-music.js"></script>
 </dom-module>

light9/web/timeline-elements.html

➞

Show inline comments

 <link rel="import" href="/lib/polymer/polymer.html">
 <link rel="import" href="light9-timeline-audio.html">
 <link rel="import" href="/lib/iron-resizable-behavior/iron-resizable-behavior.html">
 <link rel="import" href="rdfdb-synced-graph.html">
 <link rel="import" href="light9-music.html">
 <!-- Whole editor- include this on your page.
      Most coordinates are relative to this element.
    -->
 <dom-module id="light9-timeline-editor">
   <template>
     <style>
      :host {
          background: #444;
          display: flex;
          flex-direction: column;
          position: relative;
          border: 1px solid black;
          overflow: hidden;
+     }
      light9-timeline-audio {
          width: 100%;
          height: 30px;
+     }
      light9-timeline-time-zoomed {
          flex-grow: 1;
+     }
      light9-timeline-diagram-layer, light9-timeline-adjusters {
          position: absolute;
          left: 0; top: 0; right: 0; bottom: 0;
+     }
      #debug {
          position: fixed;
          right: 0;
          bottom: 0;
+     }
     </style>
     <div>
       <rdfdb-synced-graph graph="{{graph}}"></rdfdb-synced-graph>
       <light9-music></light9-music>
       timeline editor: song [uri] <button>unlink</button>
       <label><input type="checkbox"> follow player song choice</label>
     </div>
     <!--
          Old zoom menu:
          See current time .. esc
          See from current time -> end .. shift+esc
          Zoom all .. ctrl+esc
        -->
     <light9-timeline-audio id="audio"></light9-timeline-audio>
     <light9-timeline-time-zoomed id="zoomed" graph="{{graph}}" 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}}" adjs="{{adjs}}"></light9-timeline-adjusters>
     <div id="debug">[[debug]]</div>
   </template>
 </dom-module>
 <!-- the whole section that pans/zooms in time (most of the editor) -->
 <dom-module id="light9-timeline-time-zoomed">
   <template>
     <style>
      :host {
          display: flex;
          height: 100%;
+     }
      div {
          display: flex;
          flex-direction: column;
          height: 100%;
+     }
      light9-timeline-audio {
          width: 100%;
          height: 90px;
+     }
      light9-timeline-graph-row {
          flex-grow: 1;
+     }
     </style>
     <div>
       <light9-timeline-time-axis id="time"></light9-timeline-time-axis>
       <light9-timeline-audio id="audio" 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>
       </template>
     </div>
   </template>

0 comments (0 inline, 0 general)