From 5d8471430ef2fd3ebef67826f20965f00eb18712 Mon Sep 17 00:00:00 2001
From: Calin Crisan <ccrisan@gmail.com>
Date: Sat, 18 Jan 2014 19:37:23 +0200
Subject: [PATCH] full screen camera improvements

---
 src/handlers.py     |  6 +++++-
 static/css/main.css |  2 ++
 static/js/main.js   | 47 +++++++++++++++++++++++----------------------
 3 files changed, 31 insertions(+), 24 deletions(-)

diff --git a/src/handlers.py b/src/handlers.py
index f107628..4117c2f 100644
--- a/src/handlers.py
+++ b/src/handlers.py
@@ -553,7 +553,11 @@ class PictureHandler(BaseHandler):
                 if sequence and picture:
                     mediafiles.set_picture_cache(camera_id, sequence, width, picture)
                 
-                self.finish(picture)
+                try:
+                    self.finish(picture)
+                
+                except IOError as e:
+                    logging.warning('could not write picture as response: %(msg)s' % {'msg': unicode(e)})
             
             remote.get_current_picture(camera_config, on_response, width=width, height=height)
 
diff --git a/static/css/main.css b/static/css/main.css
index 158ed19..ba1e8d3 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -681,6 +681,7 @@ img.camera {
     display: block;
     transition: opacity 0.2s linear;
     opacity: 1;
+    min-height: 160px;
 }
 
 img.camera.error,
@@ -705,6 +706,7 @@ img.no-camera {
 }
 
 div.camera-progress {
+    background: rgba(0, 0, 0, 0.001); /* otherwise IE would not extend this as expected */
     position: absolute;
     top: 0px;
     right: 0px;
diff --git a/static/js/main.js b/static/js/main.js
index 77aea0c..1ad741d 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1706,7 +1706,6 @@ function addCameraFrameUi(cameraConfig, framerate) {
     
     var nameSpan = cameraFrameDiv.find('span.camera-name');
     var configureButton = cameraFrameDiv.find('div.camera-button.configure');
-    var fullScreenButton = cameraFrameDiv.find('div.camera-button.full-screen');
     var picturesButton = cameraFrameDiv.find('div.camera-button.media-pictures');
     var moviesButton = cameraFrameDiv.find('div.camera-button.media-movies');
     var cameraPlaceholder = cameraFrameDiv.find('div.camera-placeholder');
@@ -1760,12 +1759,6 @@ function addCameraFrameUi(cameraConfig, framerate) {
         doConfigureCamera(cameraId);
     });
 
-    fullScreenButton.click(function (cameraId) {
-        return function () {
-            doFullScreenCamera(cameraId);
-        };
-    }(cameraId));
-    
     picturesButton.click(function (cameraId) {
         return function () {
             runMediaDialog(cameraId, 'picture');
@@ -1899,24 +1892,32 @@ function doFullScreenCamera(cameraId) {
     else {
         width = Math.round(0.9 * windowWidth);
     }
-    cameraFrameDiv.css('width', width);
+
+    cameraFrameDiv.find('div.camera-progress').addClass('visible');
     
-    runModalDialog({
-        title: cameraName,
-        closeButton: true,
-        //buttons: null,
-        content: cameraFrameDiv,
-        onClose: function () {
-            fullScreenCameraId = null;
-            cameraFrameDiv.css('width', '');
-            var nextFrame = pageContainer.children('div:eq(' + frameIndex + ')');
-            if (nextFrame.length) {
-                nextFrame.before(cameraFrameDiv);
-            }
-            else {
-                pageContainer.append(cameraFrameDiv);
+    var cameraImg = cameraFrameDiv.find('img.camera');
+    cameraImg.load(function showFullScreenCamera() {
+        cameraFrameDiv.css('width', width);
+        
+        runModalDialog({
+            title: cameraName,
+            closeButton: true,
+            content: cameraFrameDiv,
+            onShow: function () {
+                cameraImg.unbind('load', showFullScreenCamera);
+            },
+            onClose: function () {
+                fullScreenCameraId = null;
+                cameraFrameDiv.css('width', '');
+                var nextFrame = pageContainer.children('div:eq(' + frameIndex + ')');
+                if (nextFrame.length) {
+                    nextFrame.before(cameraFrameDiv);
+                }
+                else {
+                    pageContainer.append(cameraFrameDiv);
+                }
             }
-        }
+        });
     });
 }
 
-- 
2.39.5