# HG changeset patch
# User Drew Perttula <drewp@bigasterisk.com>
# Date 2016-06-04 22:38:30
# Node ID 5ba5afe30817f037c4b6b1ca66596c67bef86dcc
# Parent  34c9c4568c886effabbc80f362038c90c8dea007

ctrl-p does seekPlayOrPause
Ignore-this: 532763ad2a4006f710b090babfa35920

diff --git a/light9/web/lib/bower.json b/light9/web/lib/bower.json
--- a/light9/web/lib/bower.json
+++ b/light9/web/lib/bower.json
@@ -13,7 +13,8 @@
     "d3": "https://github.com/d3/d3.git#e7194db33090a0afc06c77a959594361ffb949df",
     "rdflib.js": "https://github.com/linkeddata/rdflib.js.git#920e59fe37",
     "rdfstore": "https://github.com/antoniogarrote/rdfstore-js.git#b3f7c0c9c1da9b26261af0d4858722fa982411bb",
-    "N3.js": "https://github.com/RubenVerborgh/N3.js.git#04f4e21f4ccb351587dc00a3f26340b28d4bb10f"
+    "N3.js": "https://github.com/RubenVerborgh/N3.js.git#04f4e21f4ccb351587dc00a3f26340b28d4bb10f",
+    "shortcut": "http://www.openjs.com/scripts/events/keyboard_shortcuts/shortcut.js"
   },
   "resolutions": {
     "paper-styles": "^1.1.4",
diff --git a/light9/web/light9-music.coffee b/light9/web/light9-music.coffee
--- a/light9/web/light9-music.coffee
+++ b/light9/web/light9-music.coffee
@@ -9,8 +9,10 @@ Polymer
     turboSign: { type: String, notify: true }
     
     duration: { type: Number, notify: true }
+    song: { type: String, notify: true }
+    # It does not yet work to write back to the playing/t
+    # properties. See seekPlayOrPause.
     playing: { type: Boolean, notify: true }
-    song: { type: String, notify: true }
     t: { type: Number, notify: true }
     
   ready: ->
@@ -23,6 +25,7 @@ Polymer
       setTimeout(@poll.bind(@), 2000)
     @poll()
     setInterval(@estimateTimeLoop.bind(@), 50)
+    
 
   estimateTimeLoop: ->
     if @playing
@@ -31,13 +34,15 @@ Polymer
       @t = @remoteT
     
   poll: ->
+    clearTimeout(@nextPoll) if @nextPoll
     @$.getTime.generateRequest()
     @status = "♫"
+    
   onResponse: ->
     @status = " "
-    r = @$.getTime.lastResponse
+    @lastResponse = @$.getTime.lastResponse
     now = Date.now()
-    if !r.playing && r.t != @remoteT
+    if !@lastResponse.playing && @lastResponse.t != @remoteT
       # likely seeking in another tool
       @turboUntil = now + 1000
     if now < @turboUntil
@@ -47,14 +52,18 @@ Polymer
       @turboSign = " "
       delay = 700
     
-    setTimeout(@poll.bind(@), delay)
-    @duration = r.duration
-    @playing = r.playing
-    @song = r.song
+    @nextPoll = setTimeout(@poll.bind(@), delay)
+    @duration = @lastResponse.duration
+    @playing = @lastResponse.playing
+    @song = @lastResponse.song
 
-    @remoteT = r.t
+    @remoteT = @lastResponse.t
     @remoteAsOfMs = now
 
+  seekPlayOrPause: (t) ->
+    @$.seek.body = {t: t}
+    @$.seek.generateRequest()
     
-
+    @turboUntil = Date.now() + 1000
+    @poll()
     
diff --git a/light9/web/light9-music.html b/light9/web/light9-music.html
--- a/light9/web/light9-music.html
+++ b/light9/web/light9-music.html
@@ -15,6 +15,10 @@
      }
     </style>
     <iron-ajax id="getTime" url="/ascoltami/time"></iron-ajax>
+    <iron-ajax id="seek"
+               method="POST"
+               url="/ascoltami/seekPlayOrPause"
+               content-type="application/json"></iron-ajax>
     <span>[[status]][[turboSign]]</span>
   </template>
   <script src="light9-music.js"></script>
diff --git a/light9/web/timeline-elements.html b/light9/web/timeline-elements.html
--- a/light9/web/timeline-elements.html
+++ b/light9/web/timeline-elements.html
@@ -33,7 +33,7 @@
     </style>
     <div>
       <rdfdb-synced-graph graph="{{graph}}"></rdfdb-synced-graph>
-      <light9-music song="{{song}}" t="{{songTime}}"></light9-music>
+      <light9-music id="music" song="{{song}}" t="{{songTime}}" playing="{{songPlaying}}"></light9-music>
       timeline editor: song [{{song}}] <button>unlink</button>
       <label><input type="checkbox"> follow player song choice</label>
     </div>
@@ -292,5 +292,6 @@
 <script src="/lib/d3/build/d3.min.js"></script>
 <script src="/lib/N3.js/browser/n3-browser.min.js"></script>
 <script src="/lib/knockout/dist/knockout.js"></script>
+<script src="/lib/shortcut/index.js"></script>
 <script src="adjustable.js"></script>
 <script src="timeline.js"></script>
diff --git a/light9/web/timeline.coffee b/light9/web/timeline.coffee
--- a/light9/web/timeline.coffee
+++ b/light9/web/timeline.coffee
@@ -9,6 +9,7 @@ Polymer
     graph: {type: Object, notify: true}
     song: {type: String, notify: true}
     songTime: {type: Number, notify: true, observer: '_onSongTime'}
+    songPlaying: {type: Boolean, notify: true}
   width: ko.observable(1)
   listeners:
     'iron-resize': '_onIronResize'
@@ -46,23 +47,29 @@ Polymer
                        @$.zoomed.$.time.offsetTop,
                        @$.zoomed.$.time.offsetHeight,
                        @fullZoomX, @zoomInX, @viewState.cursor)
+  
+    @adjs = @makeZoomAdjs().concat(@persistDemo())
+    @trackMouse()
+    @bindKeys()
 
-    # this isn't firing on phone during pen drag
+  trackMouse: ->
+    # not just for show- we use the mouse pos sometimes
     for evName in ['mousemove', 'touchmove']
       @addEventListener evName, (ev) =>
         ev.preventDefault()
-        
+
+        # todo: consolidate with _editorCoordinates version
         if ev.touches?.length
           ev = ev.touches[0]
 
-        # consolidate with _editorCoordinates version
         @root = @getBoundingClientRect()
         @viewState.mouse.pos($V([ev.pageX - @root.left, ev.pageY - @root.top]))
 
         @$.dia.setMouse(@viewState.mouse.pos())
-        @debug = evName + ' ' + ev.clientX + ' ' + ev.layerX + ' ' + ev.movementX + ' ' + ev.offsetX + ' ' + ev.pageX + ' ' + ev.x 
-  
-    @adjs = @makeZoomAdjs().concat(@persistDemo())
+    
+  bindKeys: ->
+    shortcut.add "Ctrl+P", (ev) =>
+      @$.music.seekPlayOrPause(@zoomInX.invert(@viewState.mouse.pos().e(1)))
 
   persistDemo: ->
     ctx = @graph.Uri('http://example.com/')
diff --git a/light9/web/timeline.html b/light9/web/timeline.html
--- a/light9/web/timeline.html
+++ b/light9/web/timeline.html
@@ -4,7 +4,6 @@
     <title>timeline</title>
     <meta charset="utf-8" />
     <script src="/lib/webcomponentsjs/webcomponents-lite.min.js"></script>
-   
     <link rel="import" href="timeline-elements.html"
   </head>
   <body>