picture viewer has now a loading progress indicator

diff --git a/src/config.py b/src/config.py
index d53d77f82f5b9a78ba9bdd62f963d760e451be9e..d56c5160f5bb36c1c5ef59990a16600eaea6b28a 100644 (file)
--- a/src/config.py
+++ b/src/config.py
@@ -261,8 +261,9 @@ def set_camera(camera_id, data):
         try:
             os.makedirs(data['target_dir'])
         
-        except Exception as e:
-            logging.warn('failed to create target directory: %(msg)s' % {'msg': unicode(e)})
+        except OSError as e:
+            if e.errno != errno.EEXIST:
+                logging.warn('failed to create target directory: %(msg)s' % {'msg': unicode(e)})
 
     # read the actual configuration from file
     config_file_path = _CAMERA_CONFIG_FILE_PATH % {'id': camera_id}

diff --git a/static/css/main.css b/static/css/main.css
index 100a04198dc35f381f619595c856aa618aaabde2..b70020e841917accd499d0b307868800c786b11b 100644 (file)
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -469,6 +469,8 @@ div.media-list-download-button:ACTIVE {
 
 div.picture-dialog-content {
     position: relative;
+    text-align: center;
+    min-height: 100px;
 }
 
 div.picture-dialog-prev-arrow,
@@ -500,6 +502,14 @@ img.picture-dialog-content {
     border: 1px solid #292929;
 }
 
+img.picture-dialog-progress {
+    position: absolute;
+    background-color: #313131;
+    padding: 10px;
+    border-radius: 10px;
+    opacity: 0.7;
+}
+
 
     /* camera frames */
 

diff --git a/static/js/main.js b/static/js/main.js
index e07616f06a705160be0066ccb3fa7961d0ce536a..55fff9271c4047bd982d26b4f9a6c11af9dbfb00 100644 (file)
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1026,6 +1026,8 @@ function runPictureDialog(entries, pos) {
     
     var windowWidth = $(window).width();
     
+    var progressImg = $('<img class="picture-dialog-progress" src="' + staticUrl + 'img/modal-progress.gif">');
+    
     function updatePicture() {
         var entry = entries[pos];
         var width; 
@@ -1036,11 +1038,21 @@ function runPictureDialog(entries, pos) {
             width = parseInt(windowWidth * 0.5);
         }
         
-        img.width(width);
-        img.attr('src', '/picture/' + entry.cameraId + '/preview' + entry.path + '?width=' + width);
+        prevArrow.css('display', 'none');
+        nextArrow.css('display', 'none');
+        img.parent().append(progressImg);
+        updateModalDialogPosition();
+        progressImg.css('left', (img.parent().width() - progressImg.width()) / 2);
+        progressImg.css('top', (img.parent().height() - progressImg.height()) / 2);
         
-        prevArrow.css('display', pos > 0 ? '' : 'none');
-        nextArrow.css('display', pos < entries.length - 1 ? '' : 'none');
+        img.attr('src', '/picture/' + entry.cameraId + '/preview' + entry.path);
+        img.load(function () {
+            img.width(width);
+            updateModalDialogPosition();
+            prevArrow.css('display', pos > 0 ? '' : 'none');
+            nextArrow.css('display', pos < entries.length - 1 ? '' : 'none');
+            progressImg.remove();
+        });
         
         $('div.modal-container').find('span.modal-title:last').html(entry.name);
         updateModalDialogPosition();