You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@guacamole.apache.org by vn...@apache.org on 2017/07/19 18:37:06 UTC

[01/14] incubator-guacamole-client git commit: GUACAMOLE-346: Avoid blocking the main thread when seeking within a session recording.

Repository: incubator-guacamole-client
Updated Branches:
  refs/heads/master 682a6e49a -> 128b0ca8e


GUACAMOLE-346: Avoid blocking the main thread when seeking within a session recording.


Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/1d6e8d22
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/1d6e8d22
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/1d6e8d22

Branch: refs/heads/master
Commit: 1d6e8d2216adbebc1c6377bf774a23a6762c877f
Parents: 33e76c4
Author: Michael Jumper <mj...@apache.org>
Authored: Thu Jun 8 11:20:10 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 16:07:33 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/modules/SessionRecording.js | 110 ++++++++++++++++---
 1 file changed, 96 insertions(+), 14 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/1d6e8d22/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
----------------------------------------------------------------------
diff --git a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
index 139597b..74eeb0b 100644
--- a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
+++ b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
@@ -61,6 +61,17 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
     var KEYFRAME_TIME_INTERVAL = 5000;
 
     /**
+     * The maximum amount of time to spend in any particular seek operation
+     * before returning control to the main thread, in milliseconds. Seek
+     * operations exceeding this amount of time will proceed asynchronously.
+     *
+     * @private
+     * @constant
+     * @type {Number}
+     */
+    var MAXIMUM_SEEK_TIME = 5;
+
+    /**
      * All frames parsed from the provided tunnel.
      *
      * @private
@@ -150,6 +161,16 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      */
     var playbackTimeout = null;
 
+    /**
+     * The ID of the timeout which will continue the in-progress seek
+     * operation. If no seek operation is in progress, the ID stored here (if
+     * any) will not be valid.
+     *
+     * @private
+     * @type {Number}
+     */
+    var seekTimeout = null;
+
     // Start playback client connected
     playbackClient.connect();
 
@@ -294,17 +315,27 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
 
     /**
      * Moves the playback position to the given frame, resetting the state of
-     * the playback client and replaying frames as necessary.
+     * the playback client and replaying frames as necessary. If the seek
+     * cannot be completed quickly, the seek operation may proceed
+     * asynchronously. If a seek operation is already in progress, that seek is
+     * first aborted. The progress of the seek operation can be observed
+     * through the onseek handler and the provided callback.
      *
      * @private
      * @param {Number} index
      *     The index of the frame which should become the new playback
      *     position.
+     *
+     * @param {function} [callback]
+     *     The callback to invoke once the seek operation has completed.
      */
-    var seekToFrame = function seekToFrame(index) {
+    var seekToFrame = function seekToFrame(index, callback) {
 
         var startIndex;
 
+        // Abort any in-progress seek
+        abortSeek();
+
         // Back up until startIndex represents current state
         for (startIndex = index; startIndex >= 0; startIndex--) {
 
@@ -327,17 +358,50 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
         // Advance to frame index after current state
         startIndex++;
 
+        var startTime = new Date().getTime();
+
         // Replay any applicable incremental frames
-        for (; startIndex <= index; startIndex++)
+        for (; startIndex <= index; startIndex++) {
+
+            // Stop seeking if the operation is taking too long
+            var currentTime = new Date().getTime();
+            if (currentTime - startTime >= MAXIMUM_SEEK_TIME)
+                break;
+
             replayFrame(startIndex);
+        }
 
         // Current frame is now at requested index
-        currentFrame = index;
+        currentFrame = startIndex - 1;
 
         // Notify of changes in position
         if (recording.onseek)
             recording.onseek(recording.getPosition());
 
+        // If the seek operation has not yet completed, schedule continuation
+        if (currentFrame !== index)
+            seekTimeout = window.setTimeout(function continueSeek() {
+                seekToFrame(index, callback);
+            }, 0);
+
+        else {
+
+            // Notify that the requested seek has completed
+            if (callback)
+                callback();
+
+        }
+
+    };
+
+    /**
+     * Aborts the seek operation currently in progress, if any. If no seek
+     * operation is in progress, this function has no effect.
+     *
+     * @private
+     */
+    var abortSeek = function abortSeek() {
+        window.clearTimeout(seekTimeout);
     };
 
     /**
@@ -502,7 +566,9 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      * until no further frames exist. Playback is initially paused when a
      * Guacamole.SessionRecording is created, and must be explicitly started
      * through a call to this function. If playback is already in progress,
-     * this function has no effect.
+     * this function has no effect. If a seek operation is in progress,
+     * playback resumes at the current position, and the seek is aborted as if
+     * completed.
      */
     this.play = function play() {
 
@@ -531,12 +597,18 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      * Seeks to the given position within the recording. If the recording is
      * currently being played back, playback will continue after the seek is
      * performed. If the recording is currently paused, playback will be
-     * paused after the seek is performed.
+     * paused after the seek is performed. If a seek operation is already in
+     * progress, that seek is first aborted. Depending on how much processing
+     * the seek operation requires, the seek operation may proceed
+     * asynchronously.
      *
      * @param {Number} position
      *     The position within the recording to seek to, in milliseconds.
+     *
+     * @param {function} [callback]
+     *     The callback to invoke once the seek operation has completed.
      */
-    this.seek = function seek(position) {
+    this.seek = function seek(position, callback) {
 
         // Do not seek if no frames exist
         if (frames.length === 0)
@@ -547,22 +619,32 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
         recording.pause();
 
         // Perform seek
-        seekToFrame(findFrame(0, frames.length - 1, position));
+        seekToFrame(findFrame(0, frames.length - 1, position), function restorePlaybackState() {
+
+            // Restore playback state
+            if (originallyPlaying)
+                recording.play();
 
-        // Restore playback state
-        if (originallyPlaying)
-            recording.play();
+            // Notify that seek has completed
+            if (callback)
+                callback();
+
+        });
 
     };
 
     /**
      * Pauses playback of the recording, if playback is currently in progress.
-     * If playback is not in progress, this function has no effect. Playback is
-     * initially paused when a Guacamole.SessionRecording is created, and must
-     * be explicitly started through a call to play().
+     * If playback is not in progress, this function has no effect. If a seek
+     * operation is in progress, the seek is aborted. Playback is initially
+     * paused when a Guacamole.SessionRecording is created, and must be
+     * explicitly started through a call to play().
      */
     this.pause = function pause() {
 
+        // Abort any in-progress seek
+        abortSeek();
+
         // Stop playback only if playback is in progress
         if (recording.isPlaying()) {
 


[10/14] incubator-guacamole-client git commit: GUACAMOLE-346: Update seeking state when paused or canceled.

Posted by vn...@apache.org.
GUACAMOLE-346: Update seeking state when paused or canceled.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/be9124d5
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/be9124d5
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/be9124d5

Branch: refs/heads/master
Commit: be9124d599ef28b75736b34eed6221f0844a48b6
Parents: 519daee
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 17:25:34 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 17:25:34 2017 -0700

----------------------------------------------------------------------
 doc/guacamole-playback-example/src/main/webapp/playback.js | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/be9124d5/doc/guacamole-playback-example/src/main/webapp/playback.js
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.js b/doc/guacamole-playback-example/src/main/webapp/playback.js
index d699296..0554a50 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.js
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.js
@@ -161,6 +161,7 @@
     // If paused, the play/pause button should read "Play"
     recording.onpause = function() {
         playPause.textContent = 'Play';
+        display.classList.remove('seeking');
     };
 
     // Toggle play/pause when display or button are clicked
@@ -173,6 +174,7 @@
 
     // Cancel seek operation when cancel button is clicked
     cancelSeek.onclick = function cancelSeekOperation(e) {
+        display.classList.remove('seeking');
         recording.pause();
         e.stopPropagation();
     };
@@ -204,9 +206,6 @@
     // Seek within recording if slider is moved
     positionSlider.onchange = function sliderPositionChanged() {
 
-        // Seek is in progress
-        display.classList.add('seeking');
-
         // Request seek
         recording.seek(positionSlider.value, function seekComplete() {
 
@@ -214,6 +213,10 @@
             display.classList.remove('seeking');
 
         });
+
+        // Seek is in progress
+        display.classList.add('seeking');
+
     };
 
 })();


[02/14] incubator-guacamole-client git commit: GUACAMOLE-346: Always replay frames asynchronously when seeking.

Posted by vn...@apache.org.
GUACAMOLE-346: Always replay frames asynchronously when seeking.


Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/744574d0
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/744574d0
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/744574d0

Branch: refs/heads/master
Commit: 744574d026d9077e8cf36a838c3f47e55e787b42
Parents: 1d6e8d2
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 16:06:32 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 16:08:55 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/modules/SessionRecording.js | 61 ++++++++++----------
 1 file changed, 31 insertions(+), 30 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/744574d0/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
----------------------------------------------------------------------
diff --git a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
index 74eeb0b..a89bd70 100644
--- a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
+++ b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
@@ -315,11 +315,10 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
 
     /**
      * Moves the playback position to the given frame, resetting the state of
-     * the playback client and replaying frames as necessary. If the seek
-     * cannot be completed quickly, the seek operation may proceed
-     * asynchronously. If a seek operation is already in progress, that seek is
-     * first aborted. The progress of the seek operation can be observed
-     * through the onseek handler and the provided callback.
+     * the playback client and replaying frames as necessary. The seek
+     * operation will proceed asynchronously. If a seek operation is already in
+     * progress, that seek is first aborted. The progress of the seek operation
+     * can be observed through the onseek handler and the provided callback.
      *
      * @private
      * @param {Number} index
@@ -358,39 +357,42 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
         // Advance to frame index after current state
         startIndex++;
 
-        var startTime = new Date().getTime();
+        // Replay frames asynchronously
+        seekTimeout = window.setTimeout(function continueSeek() {
 
-        // Replay any applicable incremental frames
-        for (; startIndex <= index; startIndex++) {
+            var startTime = new Date().getTime();
 
-            // Stop seeking if the operation is taking too long
-            var currentTime = new Date().getTime();
-            if (currentTime - startTime >= MAXIMUM_SEEK_TIME)
-                break;
+            // Replay any applicable incremental frames
+            for (; startIndex <= index; startIndex++) {
 
-            replayFrame(startIndex);
-        }
+                // Stop seeking if the operation is taking too long
+                var currentTime = new Date().getTime();
+                if (currentTime - startTime >= MAXIMUM_SEEK_TIME)
+                    break;
 
-        // Current frame is now at requested index
-        currentFrame = startIndex - 1;
+                replayFrame(startIndex);
+            }
 
-        // Notify of changes in position
-        if (recording.onseek)
-            recording.onseek(recording.getPosition());
+            // Current frame is now at requested index
+            currentFrame = startIndex - 1;
 
-        // If the seek operation has not yet completed, schedule continuation
-        if (currentFrame !== index)
-            seekTimeout = window.setTimeout(function continueSeek() {
+            // Notify of changes in position
+            if (recording.onseek)
+                recording.onseek(recording.getPosition());
+
+            // If the seek operation has not yet completed, schedule continuation
+            if (currentFrame !== index)
                 seekToFrame(index, callback);
-            }, 0);
 
-        else {
+            else {
 
-            // Notify that the requested seek has completed
-            if (callback)
-                callback();
+                // Notify that the requested seek has completed
+                if (callback)
+                    callback();
 
-        }
+            }
+
+        }, 0);
 
     };
 
@@ -598,8 +600,7 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      * currently being played back, playback will continue after the seek is
      * performed. If the recording is currently paused, playback will be
      * paused after the seek is performed. If a seek operation is already in
-     * progress, that seek is first aborted. Depending on how much processing
-     * the seek operation requires, the seek operation may proceed
+     * progress, that seek is first aborted. The seek operation will proceed
      * asynchronously.
      *
      * @param {Number} position


[08/14] incubator-guacamole-client git commit: GUACAMOLE-346: Provide explicit "cancel" button for in-progress seek.

Posted by vn...@apache.org.
GUACAMOLE-346: Provide explicit "cancel" button for in-progress seek.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/ed3c022f
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/ed3c022f
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/ed3c022f

Branch: refs/heads/master
Commit: ed3c022f7e437bfad62ca3b4bd7286521e348a5f
Parents: 25de433
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 16:58:39 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 16:58:39 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/index.html                         |  5 ++++-
 .../src/main/webapp/playback.js                        | 13 +++++++++++++
 2 files changed, 17 insertions(+), 1 deletion(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/ed3c022f/doc/guacamole-playback-example/src/main/webapp/index.html
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/index.html b/doc/guacamole-playback-example/src/main/webapp/index.html
index 64f8cbc..9151ebc 100644
--- a/doc/guacamole-playback-example/src/main/webapp/index.html
+++ b/doc/guacamole-playback-example/src/main/webapp/index.html
@@ -34,7 +34,10 @@
             <div id="display">
                 <div class="notification-container">
                     <div class="seek-notification">
-                        <p>Seek in progress... Click "play" to cancel.</p>
+                        <p>
+                            Seek in progress...
+                            <button id="cancel-seek">Cancel</button>
+                        </p>
                     </div>
                 </div>
             </div>

http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/ed3c022f/doc/guacamole-playback-example/src/main/webapp/playback.js
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.js b/doc/guacamole-playback-example/src/main/webapp/playback.js
index d99322a..d699296 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.js
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.js
@@ -42,6 +42,13 @@
     var playPause = document.getElementById('play-pause');
 
     /**
+     * Button for cancelling in-progress seek operations.
+     *
+     * @type Element
+     */
+    var cancelSeek = document.getElementById('cancel-seek');
+
+    /**
      * Text status display indicating the current playback position within the
      * recording.
      *
@@ -164,6 +171,12 @@
             recording.pause();
     };
 
+    // Cancel seek operation when cancel button is clicked
+    cancelSeek.onclick = function cancelSeekOperation(e) {
+        recording.pause();
+        e.stopPropagation();
+    };
+
     // Fit display within containing div
     recordingDisplay.onresize = function displayResized(width, height) {
 


[14/14] incubator-guacamole-client git commit: GUACAMOLE-346: Merge Avoid blocking main thread when seeking.

Posted by vn...@apache.org.
GUACAMOLE-346: Merge Avoid blocking main thread when seeking.


Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/128b0ca8
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/128b0ca8
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/128b0ca8

Branch: refs/heads/master
Commit: 128b0ca8e03b24ac9646d3c4853b762296775242
Parents: 682a6e4 929452e
Author: Nick Couchman <vn...@apache.org>
Authored: Wed Jul 19 14:35:44 2017 -0400
Committer: Nick Couchman <vn...@apache.org>
Committed: Wed Jul 19 14:35:44 2017 -0400

----------------------------------------------------------------------
 .../src/main/webapp/index.html                  |  13 +-
 .../src/main/webapp/playback.css                |  51 +++++-
 .../src/main/webapp/playback.js                 |  34 +++-
 .../src/main/webapp/modules/SessionRecording.js | 162 +++++++++++++------
 4 files changed, 203 insertions(+), 57 deletions(-)
----------------------------------------------------------------------



[11/14] incubator-guacamole-client git commit: GUACAMOLE-346: Add "paused" notification to example player.

Posted by vn...@apache.org.
GUACAMOLE-346: Add "paused" notification to example player.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/76897471
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/76897471
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/76897471

Branch: refs/heads/master
Commit: 768974711caddebbf8ef432da3e6bc575db35408
Parents: be9124d
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 17:32:03 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 17:32:03 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/index.html                  |  5 ++-
 .../src/main/webapp/playback.css                | 32 ++++++++++++--------
 .../src/main/webapp/playback.js                 | 22 ++++++++------
 3 files changed, 35 insertions(+), 24 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/76897471/doc/guacamole-playback-example/src/main/webapp/index.html
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/index.html b/doc/guacamole-playback-example/src/main/webapp/index.html
index 9151ebc..127e198 100644
--- a/doc/guacamole-playback-example/src/main/webapp/index.html
+++ b/doc/guacamole-playback-example/src/main/webapp/index.html
@@ -28,7 +28,7 @@
     <body>
 
         <!-- Guacamole recording player -->
-        <div class="player">
+        <div id="player" class="paused">
 
             <!-- Player display -->
             <div id="display">
@@ -39,6 +39,9 @@
                             <button id="cancel-seek">Cancel</button>
                         </p>
                     </div>
+                    <div class="paused-notification">
+                        <p>Paused.</p>
+                    </div>
                 </div>
             </div>
 

http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/76897471/doc/guacamole-playback-example/src/main/webapp/playback.css
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.css b/doc/guacamole-playback-example/src/main/webapp/playback.css
index ce0c96e..85bf904 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.css
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.css
@@ -17,15 +17,15 @@
  * under the License.
  */
 
-.player {
+#player {
     width: 640px;
 }
 
-.player #display {
+#display {
     position: relative;
 }
 
-.player .notification-container {
+#player .notification-container {
     position: absolute;
     z-index: 1;
     top: 0;
@@ -34,7 +34,8 @@
     bottom: 0;
 }
 
-.player .seek-notification {
+#player .paused-notification,
+#player .seek-notification {
 
     color: white;
     background: rgba(0, 0, 0, 0.75);
@@ -45,18 +46,23 @@
 
 }
 
-.player #display.seeking .seek-notification {
+#player.seeking .seek-notification {
     display: table;
 }
 
-.player .seek-notification p {
+#player.paused .paused-notification {
+    display: table;
+}
+
+#player .paused-notification p,
+#player .seek-notification p {
     display: table-cell;
     text-align: center;
     vertical-align: middle;
     font-family: sans-serif;
 }
 
-.player .controls {
+#player .controls {
 
     width: 100%;
 
@@ -87,11 +93,11 @@
 
 }
 
-.player .controls > * {
+#player .controls > * {
     margin: 0.25em;
 }
 
-.player .controls #position-slider {
+#player .controls #position-slider {
     -ms-flex: 1 1 auto;
     -moz-box-flex: 1;
     -webkit-box-flex: 1;
@@ -99,16 +105,16 @@
     flex: 1 1 auto;
 }
 
-.player .controls #play-pause {
+#player .controls #play-pause {
     margin-left: 0;
     min-width: 5em;
 }
 
-.player .controls #position,
-.player .controls #duration {
+#player .controls #position,
+#player .controls #duration {
     font-family: monospace;
 }
 
-.player .controls #duration {
+#player .controls #duration {
     margin-right: 0;
 }

http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/76897471/doc/guacamole-playback-example/src/main/webapp/playback.js
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.js b/doc/guacamole-playback-example/src/main/webapp/playback.js
index 0554a50..8c1c49c 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.js
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.js
@@ -28,6 +28,13 @@
     var RECORDING_URL = 'recording.guac';
 
     /**
+     * The element representing the session recording player.
+     *
+     * @type Element
+     */
+    var player = document.getElementById('player');
+
+    /**
      * The element which will contain the recording display.
      *
      * @type Element
@@ -155,13 +162,13 @@
     // If playing, the play/pause button should read "Pause"
     recording.onplay = function() {
         playPause.textContent = 'Pause';
-        display.classList.remove('seeking');
+        player.className = 'playing';
     };
 
     // If paused, the play/pause button should read "Play"
     recording.onpause = function() {
         playPause.textContent = 'Play';
-        display.classList.remove('seeking');
+        player.className = 'paused';
     };
 
     // Toggle play/pause when display or button are clicked
@@ -174,7 +181,7 @@
 
     // Cancel seek operation when cancel button is clicked
     cancelSeek.onclick = function cancelSeekOperation(e) {
-        display.classList.remove('seeking');
+        player.className = 'paused';
         recording.pause();
         e.stopPropagation();
     };
@@ -207,15 +214,10 @@
     positionSlider.onchange = function sliderPositionChanged() {
 
         // Request seek
-        recording.seek(positionSlider.value, function seekComplete() {
-
-            // Seek has completed
-            display.classList.remove('seeking');
-
-        });
+        recording.seek(positionSlider.value);
 
         // Seek is in progress
-        display.classList.add('seeking');
+        player.className = 'seeking';
 
     };
 


[12/14] incubator-guacamole-client git commit: GUACAMOLE-346: Simply resume playback if seek operation is canceled.

Posted by vn...@apache.org.
GUACAMOLE-346: Simply resume playback if seek operation is canceled.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/387302db
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/387302db
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/387302db

Branch: refs/heads/master
Commit: 387302db4821210839aabef42d23869ff203bd93
Parents: 7689747
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 17:41:58 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 17:41:58 2017 -0700

----------------------------------------------------------------------
 doc/guacamole-playback-example/src/main/webapp/playback.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/387302db/doc/guacamole-playback-example/src/main/webapp/playback.js
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.js b/doc/guacamole-playback-example/src/main/webapp/playback.js
index 8c1c49c..50ac0a4 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.js
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.js
@@ -179,10 +179,9 @@
             recording.pause();
     };
 
-    // Cancel seek operation when cancel button is clicked
+    // Resume playback when cancel button is clicked
     cancelSeek.onclick = function cancelSeekOperation(e) {
-        player.className = 'paused';
-        recording.pause();
+        recording.play();
         e.stopPropagation();
     };
 


[06/14] incubator-guacamole-client git commit: GUACAMOLE-346: Simplify style of seek callback invocation.

Posted by vn...@apache.org.
GUACAMOLE-346: Simplify style of seek callback invocation.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/b41311f1
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/b41311f1
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/b41311f1

Branch: refs/heads/master
Commit: b41311f1ed9567cfe0201571ae8cb96ba2414b99
Parents: 21eadec
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 16:16:26 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 16:16:26 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/modules/SessionRecording.js               | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/b41311f1/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
----------------------------------------------------------------------
diff --git a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
index d544982..6b74782 100644
--- a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
+++ b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
@@ -384,13 +384,10 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
             if (currentFrame !== index)
                 seekToFrame(index, callback);
 
-            else {
-
-                // Notify that the requested seek has completed
+            // Notify that the requested seek has completed
+            else
                 callback();
 
-            }
-
         }, 0);
 
     };


[03/14] incubator-guacamole-client git commit: GUACAMOLE-346: Require seek callback internally, for sake of simplicity.

Posted by vn...@apache.org.
GUACAMOLE-346: Require seek callback internally, for sake of simplicity.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/b325eb81
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/b325eb81
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/b325eb81

Branch: refs/heads/master
Commit: b325eb8139f82387e8a4efbe8c2449b60066b142
Parents: 744574d
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 16:10:28 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 16:10:28 2017 -0700

----------------------------------------------------------------------
 guacamole-common-js/src/main/webapp/modules/SessionRecording.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/b325eb81/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
----------------------------------------------------------------------
diff --git a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
index a89bd70..13daa96 100644
--- a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
+++ b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
@@ -325,7 +325,7 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      *     The index of the frame which should become the new playback
      *     position.
      *
-     * @param {function} [callback]
+     * @param {function} callback
      *     The callback to invoke once the seek operation has completed.
      */
     var seekToFrame = function seekToFrame(index, callback) {
@@ -387,8 +387,7 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
             else {
 
                 // Notify that the requested seek has completed
-                if (callback)
-                    callback();
+                callback();
 
             }
 


[05/14] incubator-guacamole-client git commit: GUACAMOLE-346: Seek operations should be atomic with respect to the various timeouts.

Posted by vn...@apache.org.
GUACAMOLE-346: Seek operations should be atomic with respect to the various timeouts.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/21eadec6
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/21eadec6
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/21eadec6

Branch: refs/heads/master
Commit: 21eadec6a459d6dec192ccea2a00ea3b600e735a
Parents: 23cf840
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 16:15:01 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 16:15:56 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/modules/SessionRecording.js | 40 ++++++++++----------
 1 file changed, 20 insertions(+), 20 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/21eadec6/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
----------------------------------------------------------------------
diff --git a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
index c4279ee..d544982 100644
--- a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
+++ b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
@@ -330,35 +330,35 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      */
     var seekToFrame = function seekToFrame(index, callback) {
 
-        var startIndex;
-
         // Abort any in-progress seek
         abortSeek();
 
-        // Back up until startIndex represents current state
-        for (startIndex = index; startIndex >= 0; startIndex--) {
+        // Replay frames asynchronously
+        seekTimeout = window.setTimeout(function continueSeek() {
 
-            var frame = frames[startIndex];
+            var startIndex;
 
-            // If we've reached the current frame, startIndex represents
-            // current state by definition
-            if (startIndex === currentFrame)
-                break;
+            // Back up until startIndex represents current state
+            for (startIndex = index; startIndex >= 0; startIndex--) {
 
-            // If frame has associated absolute state, make that frame the
-            // current state
-            if (frame.clientState) {
-                playbackClient.importState(frame.clientState);
-                break;
-            }
+                var frame = frames[startIndex];
 
-        }
+                // If we've reached the current frame, startIndex represents
+                // current state by definition
+                if (startIndex === currentFrame)
+                    break;
 
-        // Advance to frame index after current state
-        startIndex++;
+                // If frame has associated absolute state, make that frame the
+                // current state
+                if (frame.clientState) {
+                    playbackClient.importState(frame.clientState);
+                    break;
+                }
 
-        // Replay frames asynchronously
-        seekTimeout = window.setTimeout(function continueSeek() {
+            }
+
+            // Advance to frame index after current state
+            startIndex++;
 
             var startTime = new Date().getTime();
 


[09/14] incubator-guacamole-client git commit: GUACAMOLE-346: Use internal seekToFrame() to handle frame timing.

Posted by vn...@apache.org.
GUACAMOLE-346: Use internal seekToFrame() to handle frame timing.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/519daeeb
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/519daeeb
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/519daeeb

Branch: refs/heads/master
Commit: 519daeebe206f338606ba73d89c8b6c287b6fc29
Parents: ed3c022
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 17:10:47 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 17:10:47 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/modules/SessionRecording.js | 67 ++++++++------------
 1 file changed, 28 insertions(+), 39 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/519daeeb/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
----------------------------------------------------------------------
diff --git a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
index 6b74782..87be39c 100644
--- a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
+++ b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
@@ -152,16 +152,6 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
     var startRealTimestamp = null;
 
     /**
-     * The ID of the timeout which will play the next frame, if playback is in
-     * progress. If playback is not in progress, the ID stored here (if any)
-     * will not be valid.
-     *
-     * @private
-     * @type {Number}
-     */
-    var playbackTimeout = null;
-
-    /**
      * The ID of the timeout which will continue the in-progress seek
      * operation. If no seek operation is in progress, the ID stored here (if
      * any) will not be valid.
@@ -327,8 +317,12 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      *
      * @param {function} callback
      *     The callback to invoke once the seek operation has completed.
+     *
+     * @param {Number} [delay=0]
+     *     The number of milliseconds that the seek operation should be
+     *     scheduled to take.
      */
-    var seekToFrame = function seekToFrame(index, callback) {
+    var seekToFrame = function seekToFrame(index, callback, delay) {
 
         // Abort any in-progress seek
         abortSeek();
@@ -382,13 +376,14 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
 
             // If the seek operation has not yet completed, schedule continuation
             if (currentFrame !== index)
-                seekToFrame(index, callback);
+                seekToFrame(index, callback,
+                    Math.max(delay - (new Date().getTime() - startTime), 0));
 
             // Notify that the requested seek has completed
             else
                 callback();
 
-        }, 0);
+        }, delay || 0);
 
     };
 
@@ -411,35 +406,30 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      */
     var continuePlayback = function continuePlayback() {
 
-        // Advance to next frame
-        seekToFrame(currentFrame + 1, function playbackSeekComplete() {
-
-            // If frames remain after advancing, schedule next frame
-            if (currentFrame + 1 < frames.length) {
+        // If frames remain after advancing, schedule next frame
+        if (currentFrame + 1 < frames.length) {
 
-                // Pull the upcoming frame
-                var next = frames[currentFrame + 1];
-
-                // Calculate the real timestamp corresponding to when the next
-                // frame begins
-                var nextRealTimestamp = next.timestamp - startVideoTimestamp + startRealTimestamp;
+            // Pull the upcoming frame
+            var next = frames[currentFrame + 1];
 
-                // Calculate the relative delay between the current time and
-                // the next frame start
-                var delay = Math.max(nextRealTimestamp - new Date().getTime(), 0);
+            // Calculate the real timestamp corresponding to when the next
+            // frame begins
+            var nextRealTimestamp = next.timestamp - startVideoTimestamp + startRealTimestamp;
 
-                // Advance to next frame after enough time has elapsed
-                playbackTimeout = window.setTimeout(function frameDelayElapsed() {
-                    continuePlayback();
-                }, delay);
+            // Calculate the relative delay between the current time and
+            // the next frame start
+            var delay = Math.max(nextRealTimestamp - new Date().getTime(), 0);
 
-            }
+            // Advance to next frame after enough time has elapsed
+            seekToFrame(currentFrame + 1, function frameDelayElapsed() {
+                continuePlayback();
+            }, delay);
 
-            // Otherwise stop playback
-            else
-                recording.pause();
+        }
 
-        });
+        // Otherwise stop playback
+        else
+            recording.pause();
 
     };
 
@@ -641,7 +631,7 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
      */
     this.pause = function pause() {
 
-        // Abort any in-progress seek
+        // Abort any in-progress seek / playback
         abortSeek();
 
         // Stop playback only if playback is in progress
@@ -651,8 +641,7 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
             if (recording.onpause)
                 recording.onpause();
 
-            // Stop playback
-            window.clearTimeout(playbackTimeout);
+            // Playback is stopped
             startVideoTimestamp = null;
             startRealTimestamp = null;
 


[04/14] incubator-guacamole-client git commit: GUACAMOLE-346: Playback must take into account that seeking is asynchronous.

Posted by vn...@apache.org.
GUACAMOLE-346: Playback must take into account that seeking is asynchronous.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/23cf840b
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/23cf840b
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/23cf840b

Branch: refs/heads/master
Commit: 23cf840ba6935434752a3160de07206a012e6a25
Parents: b325eb8
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 16:12:21 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 16:12:21 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/modules/SessionRecording.js | 40 ++++++++++----------
 1 file changed, 21 insertions(+), 19 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/23cf840b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
----------------------------------------------------------------------
diff --git a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
index 13daa96..c4279ee 100644
--- a/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
+++ b/guacamole-common-js/src/main/webapp/modules/SessionRecording.js
@@ -415,32 +415,34 @@ Guacamole.SessionRecording = function SessionRecording(tunnel) {
     var continuePlayback = function continuePlayback() {
 
         // Advance to next frame
-        seekToFrame(currentFrame + 1);
+        seekToFrame(currentFrame + 1, function playbackSeekComplete() {
 
-        // If frames remain after advancing, schedule next frame
-        if (currentFrame + 1 < frames.length) {
+            // If frames remain after advancing, schedule next frame
+            if (currentFrame + 1 < frames.length) {
 
-            // Pull the upcoming frame
-            var next = frames[currentFrame + 1];
+                // Pull the upcoming frame
+                var next = frames[currentFrame + 1];
 
-            // Calculate the real timestamp corresponding to when the next
-            // frame begins
-            var nextRealTimestamp = next.timestamp - startVideoTimestamp + startRealTimestamp;
+                // Calculate the real timestamp corresponding to when the next
+                // frame begins
+                var nextRealTimestamp = next.timestamp - startVideoTimestamp + startRealTimestamp;
 
-            // Calculate the relative delay between the current time and
-            // the next frame start
-            var delay = Math.max(nextRealTimestamp - new Date().getTime(), 0);
+                // Calculate the relative delay between the current time and
+                // the next frame start
+                var delay = Math.max(nextRealTimestamp - new Date().getTime(), 0);
 
-            // Advance to next frame after enough time has elapsed
-            playbackTimeout = window.setTimeout(function frameDelayElapsed() {
-                continuePlayback();
-            }, delay);
+                // Advance to next frame after enough time has elapsed
+                playbackTimeout = window.setTimeout(function frameDelayElapsed() {
+                    continuePlayback();
+                }, delay);
 
-        }
+            }
 
-        // Otherwise stop playback
-        else
-            recording.pause();
+            // Otherwise stop playback
+            else
+                recording.pause();
+
+        });
 
     };
 


[13/14] incubator-guacamole-client git commit: GUACAMOLE-346: Remove "paused" notification. Correct UI behavior.

Posted by vn...@apache.org.
GUACAMOLE-346: Remove "paused" notification. Correct UI behavior.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/929452e7
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/929452e7
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/929452e7

Branch: refs/heads/master
Commit: 929452e7015896efb20ec77f2250279db02747df
Parents: 387302d
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 17:45:39 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 17:45:39 2017 -0700

----------------------------------------------------------------------
 doc/guacamole-playback-example/src/main/webapp/index.html |  5 +----
 .../src/main/webapp/playback.css                          |  6 ------
 .../src/main/webapp/playback.js                           | 10 +++++++---
 3 files changed, 8 insertions(+), 13 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/929452e7/doc/guacamole-playback-example/src/main/webapp/index.html
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/index.html b/doc/guacamole-playback-example/src/main/webapp/index.html
index 127e198..c5ff621 100644
--- a/doc/guacamole-playback-example/src/main/webapp/index.html
+++ b/doc/guacamole-playback-example/src/main/webapp/index.html
@@ -28,7 +28,7 @@
     <body>
 
         <!-- Guacamole recording player -->
-        <div id="player" class="paused">
+        <div id="player">
 
             <!-- Player display -->
             <div id="display">
@@ -39,9 +39,6 @@
                             <button id="cancel-seek">Cancel</button>
                         </p>
                     </div>
-                    <div class="paused-notification">
-                        <p>Paused.</p>
-                    </div>
                 </div>
             </div>
 

http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/929452e7/doc/guacamole-playback-example/src/main/webapp/playback.css
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.css b/doc/guacamole-playback-example/src/main/webapp/playback.css
index 85bf904..bda4d3a 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.css
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.css
@@ -34,7 +34,6 @@
     bottom: 0;
 }
 
-#player .paused-notification,
 #player .seek-notification {
 
     color: white;
@@ -50,11 +49,6 @@
     display: table;
 }
 
-#player.paused .paused-notification {
-    display: table;
-}
-
-#player .paused-notification p,
 #player .seek-notification p {
     display: table-cell;
     text-align: center;

http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/929452e7/doc/guacamole-playback-example/src/main/webapp/playback.js
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.js b/doc/guacamole-playback-example/src/main/webapp/playback.js
index 50ac0a4..6fb4c0b 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.js
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.js
@@ -162,13 +162,11 @@
     // If playing, the play/pause button should read "Pause"
     recording.onplay = function() {
         playPause.textContent = 'Pause';
-        player.className = 'playing';
     };
 
     // If paused, the play/pause button should read "Play"
     recording.onpause = function() {
         playPause.textContent = 'Play';
-        player.className = 'paused';
     };
 
     // Toggle play/pause when display or button are clicked
@@ -182,6 +180,7 @@
     // Resume playback when cancel button is clicked
     cancelSeek.onclick = function cancelSeekOperation(e) {
         recording.play();
+        player.className = '';
         e.stopPropagation();
     };
 
@@ -213,7 +212,12 @@
     positionSlider.onchange = function sliderPositionChanged() {
 
         // Request seek
-        recording.seek(positionSlider.value);
+        recording.seek(positionSlider.value, function seekComplete() {
+
+            // Seek has completed
+            player.className = '';
+
+        });
 
         // Seek is in progress
         player.className = 'seeking';


[07/14] incubator-guacamole-client git commit: GUACAMOLE-346: Display "seek in progress" notification when seeking in playback example.

Posted by vn...@apache.org.
GUACAMOLE-346: Display "seek in progress" notification when seeking in playback example.

Project: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/commit/25de4339
Tree: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/tree/25de4339
Diff: http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/diff/25de4339

Branch: refs/heads/master
Commit: 25de43391aebb6a042fcc2ba2755e7fe081a8187
Parents: b41311f
Author: Michael Jumper <mj...@apache.org>
Authored: Sat Jul 15 16:50:02 2017 -0700
Committer: Michael Jumper <mj...@apache.org>
Committed: Sat Jul 15 16:50:02 2017 -0700

----------------------------------------------------------------------
 .../src/main/webapp/index.html                  |  8 ++++-
 .../src/main/webapp/playback.css                | 35 ++++++++++++++++++++
 .../src/main/webapp/playback.js                 | 13 +++++++-
 3 files changed, 54 insertions(+), 2 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/25de4339/doc/guacamole-playback-example/src/main/webapp/index.html
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/index.html b/doc/guacamole-playback-example/src/main/webapp/index.html
index 69e79a9..64f8cbc 100644
--- a/doc/guacamole-playback-example/src/main/webapp/index.html
+++ b/doc/guacamole-playback-example/src/main/webapp/index.html
@@ -31,7 +31,13 @@
         <div class="player">
 
             <!-- Player display -->
-            <div id="display"></div>
+            <div id="display">
+                <div class="notification-container">
+                    <div class="seek-notification">
+                        <p>Seek in progress... Click "play" to cancel.</p>
+                    </div>
+                </div>
+            </div>
 
             <!-- Player controls -->
             <div class="controls">

http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/25de4339/doc/guacamole-playback-example/src/main/webapp/playback.css
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.css b/doc/guacamole-playback-example/src/main/webapp/playback.css
index 210506f..ce0c96e 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.css
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.css
@@ -21,6 +21,41 @@
     width: 640px;
 }
 
+.player #display {
+    position: relative;
+}
+
+.player .notification-container {
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    right: 0;
+    left: 0;
+    bottom: 0;
+}
+
+.player .seek-notification {
+
+    color: white;
+    background: rgba(0, 0, 0, 0.75);
+
+    display: none; /* Initially hidden */
+    width: 100%;
+    height: 100%;
+
+}
+
+.player #display.seeking .seek-notification {
+    display: table;
+}
+
+.player .seek-notification p {
+    display: table-cell;
+    text-align: center;
+    vertical-align: middle;
+    font-family: sans-serif;
+}
+
 .player .controls {
 
     width: 100%;

http://git-wip-us.apache.org/repos/asf/incubator-guacamole-client/blob/25de4339/doc/guacamole-playback-example/src/main/webapp/playback.js
----------------------------------------------------------------------
diff --git a/doc/guacamole-playback-example/src/main/webapp/playback.js b/doc/guacamole-playback-example/src/main/webapp/playback.js
index 170a2b5..d99322a 100644
--- a/doc/guacamole-playback-example/src/main/webapp/playback.js
+++ b/doc/guacamole-playback-example/src/main/webapp/playback.js
@@ -148,6 +148,7 @@
     // If playing, the play/pause button should read "Pause"
     recording.onplay = function() {
         playPause.textContent = 'Pause';
+        display.classList.remove('seeking');
     };
 
     // If paused, the play/pause button should read "Play"
@@ -189,7 +190,17 @@
 
     // Seek within recording if slider is moved
     positionSlider.onchange = function sliderPositionChanged() {
-        recording.seek(positionSlider.value);
+
+        // Seek is in progress
+        display.classList.add('seeking');
+
+        // Request seek
+        recording.seek(positionSlider.value, function seekComplete() {
+
+            // Seek has completed
+            display.classList.remove('seeking');
+
+        });
     };
 
 })();