safebox/guacamole-client
4
0
Fork 0
mirror of https://github.com/gyurix1968/guacamole-client.git synced 2025-09-06 05:07:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

GUACAMOLE-346: Display "seek in progress" notification when seeking in playback example.

Browse Source
This commit is contained in:
Michael Jumper
2017-07-15 16:50:02 -07:00
parent b41311f1ed
commit 25de43391a
3 changed files with 54 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
doc/guacamole-playback-example/src/main/webapp/index.html
View File

@@ -31,7 +31,13 @@
<div class="player"> <div class="player">
<!-- Player display --> <!-- 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 --> <!-- Player controls -->
<div class="controls"> <div class="controls">

35
doc/guacamole-playback-example/src/main/webapp/playback.css
View File

@@ -21,6 +21,41 @@
width: 640px; 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 { .player .controls {
width: 100%; width: 100%;

13
doc/guacamole-playback-example/src/main/webapp/playback.js
View File

@@ -148,6 +148,7 @@
// If playing, the play/pause button should read "Pause" // If playing, the play/pause button should read "Pause"
recording.onplay = function() { recording.onplay = function() {
playPause.textContent = 'Pause'; playPause.textContent = 'Pause';
display.classList.remove('seeking');
}; };
// If paused, the play/pause button should read "Play" // If paused, the play/pause button should read "Play"
@@ -189,7 +190,17 @@
// Seek within recording if slider is moved // Seek within recording if slider is moved
positionSlider.onchange = function sliderPositionChanged() { 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');
});
}; };
})(); })();