Optimized Video module UI

web/Video/index.html

@@ -109,11 +109,15 @@
                     <input id="autoplayToggle" type="checkbox" name="autoplay" onchange="setAutoplay(this);">
                     <label>Autoplay</label>
                 </div>
-                <button onclick="playNextVideo();" class="ui tiny right floated basic icon button"><i class="step forward icon"></i></button>
-                <button onclick="playPreviousVideo();" class="ui tiny right floated basic icon button"><i class="step backward icon"></i></button>
             </div>
             
             <div class="ui fluid segment">
+                <div class="ui icon tiny right floated basic buttons">
+                    <button onclick="playPreviousVideo();" class="ui tiny basic icon button"><i class="step backward icon"></i></button>
+                    <button onclick="jumpToPlayingPlaylist();" class="ui tiny basic icon button"><i class="list icon"></i></button>
+                    <button onclick="jumpToPlayingVideo();" class="ui tiny basic icon button"><i class="arrow down icon"></i></button>
+                    <button onclick="playNextVideo();" class="ui tiny basic icon button"><i class="step forward icon"></i></button>
+                </div>
                 <div id="playList" class="ui accordion">
                     <div class="title">
                         <i class="dropdown icon"></i>
@@ -275,6 +279,25 @@
                 });
             }
 
+            function jumpToPlayingVideo(){
+                if ($(".videoObject.playing").length == 0){
+                    return;
+                }
+                var scrollToLocation = $(".videoObject.playing").offset().top;
+                $('html, body').animate({
+                    scrollTop: scrollToLocation
+                }, 200);
+            }
+
+            function jumpToPlayingPlaylist(){
+                if ($(".playlistObject.active").length == 0){
+                    return;
+                }
+                var scrollToLocation = $(".playlistObject.active").offset().top;
+                $('html, body').animate({
+                    scrollTop: scrollToLocation
+                }, 200);
+            }
 
             function setAutoplay(obj){
                 autoPlay = obj.checked;