media browser: fixed layout on small screens

diff --git a/static/js/main.js b/static/js/main.js
index 4a5a51a6db4df34dd98844730fe6dde52b27b321..a4f28e017934ed6234996c0b3d6fb0af1bae6904 100644 (file)
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -2669,9 +2669,11 @@ function runMediaDialog(cameraId, mediaType) {
         buttonsDiv.show();
         
         if (windowWidth < 1000) {
+            mediaListDiv.width(parseInt(windowWidth * 0.8));
+            mediaListDiv.height(parseInt(windowHeight * 0.7));
+            groupsDiv.width(parseInt(windowWidth * 0.8));
             groupsDiv.height('');
             groupsDiv.addClass('small-screen');
-            mediaListDiv.height(parseInt(windowHeight * 0.7));
         }
         else {
             mediaListDiv.width(parseInt(windowWidth * 0.7));
@@ -2756,7 +2758,10 @@ function runMediaDialog(cameraId, mediaType) {
         }
         
         var title;
-        if (mediaType === 'picture') {
+        if ($(window).width() < 1000) {
+            title = data.cameraName;
+        }
+        else if (mediaType === 'picture') {
             title = 'Pictures taken by ' + data.cameraName;
         }
         else {

diff --git a/static/js/ui.js b/static/js/ui.js
index 1f711fa7c5098435617c80f09277933d7dc6d3a2..19eaa2329f1f489759b48372ba37c7f89378c6d9 100644 (file)
--- a/static/js/ui.js
+++ b/static/js/ui.js
@@ -715,8 +715,8 @@ function updateModalDialogPosition() {
     
     /* repeat the operation multiple times, the size might change */
     for (i = 0; i < 3; i++) {
-        modalWidth = container.outerWidth() + 10 /* the margins */;
-        modalHeight = container.outerHeight() + 10 /* the margins */;
+        modalWidth = container.outerWidth();
+        modalHeight = container.outerHeight();
         
         container.css('left', Math.floor((windowWidth - modalWidth) / 2));
         container.css('top', Math.floor((windowHeight - modalHeight) / 2));