Changeset 29890 for main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/transform/pages/document.xsl

Timestamp:

2015-05-18T00:46:55+12:00 (9 years ago)

Author:

davidb

Message:

Basic popup functionality added in (hard-wired for now)

File:

• main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/transform/pages/document.xsl (modified) (3 diffs)

main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/transform/pages/document.xsl

@@ -1319 +1319 @@
 
     <div class="video-player-bar">
-      <div id="video-titlebar" style="background-image: none; background-color: #2E52A4; width: 97%; float: left; margin-bottom: 10px;">
+      <div id="video-titlebar" style="background-image: none; background-color: #2E52A4; width: 97%; float: left; margin-bottom: 10px; z-index: 4; position: relative;">
     Video Display
       </div>
 
       <div id="video-area" class="documenttext" 
-       style="display: none; position: absolute: left: 0px; top: 0px;">
+       style="display: none; position: absolute: left: 0px; top: 0px; z-index: 1;">
     <center>
-      <video id="video" width="60%" controls="true">
-        <source src="{$httpCollection}/index/assoc/{$assocFilePath}/{$streamablevideo}" />
-        Your browser does not support the video tag.
-      </video>
+
+
+      <style>
+        #video_box {position:relative; z-index: 1;}
+        #overlay {position: absolute; t: 0; left: 0; z-index: 2;}
+        #video_container {z-index: 1;}
+
+        #XXXvideo_container {position:absolute;top: 0px;left: 0px;}
+      </style>
+
+
+      <div id="video_box">
+        <div id="overlay"><xsl:comment>filler</xsl:comment></div>
+        <div id="video_container">
+
+          <video id="video" width="60%" controls="false">
+        <source src="{$httpCollection}/index/assoc/{$assocFilePath}/{$streamablevideo}" />
+        <track id="bubbles" label="Metadata" kind="metadata" 
+               srclang="en" src="{$httpCollection}/tracks/land-down-under-metadata-en.vtt" default="default" />
+        Your browser does not support the video tag.
+          </video>
+
+        </div>
+      </div>
     </center> 
       </div>
@@ -1338 +1358 @@
     <input id="progress-bar" type="range" 
            min='0' max='100' step='0.01' value='0' 
-           style="width: 100%"/>
+           style="width: 98%"/> <!-- used to be 100% -->
 
       </div>
@@ -1418 +1438 @@
           <div style="color: white;">
 
-        <form style="width: 99%; margin-top: 10px; margin-bottom: 10px;">
+        <form id="bubForm" style="width: 99%; margin-top: 10px; margin-bottom: 10px;">
           <fieldset>
         <legend id="mpm-legend">Popup Layers</legend>