layout for stereoview

svn path=/trunk/; revision=200

diff --git a/static/common.css b/static/common.css
index 312176ce6611784137bfa48cf4f8b77b3052741c..eb2e7a92cdcf957273840f54d608ce7758a1d0c5 100644 (file)
--- a/static/common.css
+++ b/static/common.css
@@ -481,3 +481,16 @@ span.progress > span {
   background-color: #333;
   min-width: 2em;
 }
+
+body.stereoview canvas {
+  position: fixed;
+  top: 0;
+  width: 50%;
+  margin: 0; padding: 0;
+}
+body.stereoview canvas#lv { left: 0; }
+body.stereoview canvas#rv { right: 0; }
+body.stereoview video {
+  position: fixed;
+  top: 0;
+}

diff --git a/templates/stereoview.html.sh b/templates/stereoview.html.sh
index 4aa623f3734a8982629386a57762b6b9a4d9f340..6fbbebd65c6422bb0c51d28c8adfbfd7585e5c40 100755 (executable)
--- a/templates/stereoview.html.sh
+++ b/templates/stereoview.html.sh
@@ -16,10 +16,9 @@
 # along with Serve0  If not, see <http://www.gnu.org/licenses/>. 
 
 cat <<EOF
-  <canvas id="lv" width="400" height="480" style="width: 50%; margin: 0;">
-  </canvas><canvas id="rv" width="400" height="480" style="width: 50%; margin: 0;"></canvas>
+  <canvas id="lv" width="400" height="480"></canvas><canvas id="rv" width="400" height="480"></canvas>
 
-  <video id="video" onclick="videoPlay();" style="position: absolute; top: 0;">
+  <video id="video" onclick="videoPlay();">
     <source src="$(urlsafe "$video")" type='video/mp4; codecs="avc1.4D401E, mp3"'>"
   </video>
 
@@ -43,14 +42,14 @@ cat <<EOF
       rc.drawImage(video, (w / 8 * 5 + ox) % (w/2) |0, sy, w / 4 |0, h / 2, 0, 0, rv.width, h / 2 * scale);
     } else {
       sx = (w / 8 * 3 + ox) % (w) |0;
-      lc.drawImage(video, sx, (v * h + h / 8)     |0, w / 4 |0, h / 4, 0, 0, lv.width, h / 4 * scale);
-      rc.drawImage(video, sx, (v * h + h / 8 * 5) |0, w / 4 |0, h / 4, 0, 0, rv.width, h / 4 * scale);
+      lc.drawImage(video, sx, (v * h + h / 8)     |0, w / 4 |0, h / 2, 0, 0, lv.width, h / 2 * scale);
+      rc.drawImage(video, sx, (v * h + h / 8 * 5) |0, w / 4 |0, h / 2, 0, 0, rv.width, h / 2 * scale);
       if (sx < 0) {
-        lc.drawImage(video, sx + w, (v * h + h / 8)     |0, w / 4 |0, h / 4, 0, 0, lv.width, h / 4 * scale);
-        rc.drawImage(video, sx + w, (v * h + h / 8 * 5) |0, w / 4 |0, h / 4, 0, 0, rv.width, h / 4 * scale);
+        lc.drawImage(video, sx + w, (v * h + h / 8)     |0, w / 4 |0, h / 2, 0, 0, lv.width, h / 2 * scale);
+        rc.drawImage(video, sx + w, (v * h + h / 8 * 5) |0, w / 4 |0, h / 2, 0, 0, rv.width, h / 2 * scale);
       } else if ( sx + w / 4 > w) {
-        lc.drawImage(video, sx - w, (v * h + h / 8)     |0, w / 4 |0, h / 4, 0, 0, lv.width, h / 4 * scale);
-        rc.drawImage(video, sx - w, (v * h + h / 8 * 5) |0, w / 4 |0, h / 4, 0, 0, rv.width, h / 4 * scale);
+        lc.drawImage(video, sx - w, (v * h + h / 8)     |0, w / 4 |0, h / 2, 0, 0, lv.width, h / 2 * scale);
+        rc.drawImage(video, sx - w, (v * h + h / 8 * 5) |0, w / 4 |0, h / 2, 0, 0, rv.width, h / 2 * scale);
       }
     }