update series timers

dashboard-ui/components/imagedownloader/imagedownloader.js

@@ -6,7 +6,7 @@
     var hasChanges = false;
 
     // These images can be large and we're seeing memory problems in safari
-    var browsableImagePageSize = $.browser.safari ? 6 : 12;
+    var browsableImagePageSize = $.browser.safari ? 6 : 10;
 
     var browsableImageStartIndex = 0;
     var browsableImageType = 'Primary';
@@ -275,10 +275,13 @@
             dlg.setAttribute('role', 'alertdialog');
             // without this safari will scroll the background instead of the dialog contents
             dlg.setAttribute('modal', 'modal');
+            // seeing max call stack size exceeded in the debugger with this
+            dlg.setAttribute('noAutoFocus', 'noAutoFocus');
             dlg.entryAnimation = 'scale-up-animation';
             dlg.exitAnimation = 'fade-out-animation';
             dlg.classList.add('fullscreen-editor-paper-dialog');
             dlg.classList.add('ui-body-b');
+            dlg.classList.add('smoothScrollY');
 
             var html = '';
             html += '<h2 class="dialogHeader">';

dashboard-ui/components/imagedownloader/imagedownloader.template.html

@@ -1,17 +1,13 @@
 <div style="text-align: center;">
     <div style="margin: 0; display: inline-block;">
-        <label for="selectImageProvider">${LabelSource}</label>
+        <label for="selectImageProvider" style="display: inline-block;">${LabelSource}</label>
-    </div>
+        <select id="selectImageProvider" style="padding-left:.5em;padding-right:0;display: inline-block;width:auto!important;">
-    <div style="margin: 0; display: inline-block;">
-        <select id="selectImageProvider" style="padding-left:.5em;padding-right:0;">
             <option value="">${OptionAll}</option>
         </select>
     </div>
     <div style="margin-left:.5em; display: inline-block;">
-        <label for="selectBrowsableImageType">${LabelImage}</label>
+        <label for="selectBrowsableImageType" style="display: inline-block;">${LabelImage}</label>
-    </div>
+        <select id="selectBrowsableImageType" style="padding-left:.5em;padding-right:0;display: inline-block;width:auto!important;">
-    <div style="display: inline-block;">
-        <select id="selectBrowsableImageType" style="padding-left:.5em;padding-right:0;">
             <option value="Primary">${OptionPrimary}</option>
             <option value="Art">${OptionArt}</option>
             <option value="Backdrop">${OptionBackdrop}</option>

dashboard-ui/components/imageeditor/imageeditor.js

@@ -56,17 +56,18 @@
             var image = images[i];
 
             html += '<div class="editorTile imageEditorTile">';
+            html += '<div class="editorTileInner">';
+
+            var height = 150;
+
+            html += '<div style="height:' + height + 'px;vertical-align:top;background-repeat:no-repeat;background-position:center bottom;background-size:contain;background-image:url(\'' + LibraryBrowser.getImageUrl(currentItem, image.ImageType, image.ImageIndex, { height: height }) + '\');"></div>';
+
+            html += '<div class="editorTileFooter">';
 
             if (image.ImageType !== "Backdrop" && image.ImageType !== "Screenshot") {
                 html += '<h3>' + image.ImageType + '</h3>';
             }
 
-            var height = 150;
-
-            html += '<div style="height:' + height + 'px;vertical-align:top;background-repeat:no-repeat;background-position:center center;background-size:contain;background-image:url(\'' + LibraryBrowser.getImageUrl(currentItem, image.ImageType, image.ImageIndex, { height: height }) + '\');"></div>';
-
-            html += '<div class="editorTileInner">';
-
             if (image.Width && image.Height) {
                 html += '<p>' + image.Width + ' X ' + image.Height + '</p>';
             } else {
@@ -89,17 +90,18 @@
                     html += '<paper-icon-button icon="chevron-right" disabled title="' + Globalize.translate('ButtonMoveRight') + '"></paper-icon-button>';
                 }
             }
-
+            else {
                 if (imageProviders.length) {
                     html += '<paper-icon-button icon="search" data-imagetype="' + image.ImageType + '" class="btnSearchImages" title="' + Globalize.translate('ButtonBrowseOnlineImages') + '"></paper-icon-button>';
                 }
+            }
 
             html += '<paper-icon-button icon="delete" data-imagetype="' + image.ImageType + '" data-index="' + (image.ImageIndex != null ? image.ImageIndex : "null") + '" class="btnDeleteImage" title="' + Globalize.translate('Delete') + '"></paper-icon-button>';
 
             html += '</div>';
 
             html += '</div>';
-
+            html += '</div>';
             html += '</div>';
         }
 
@@ -210,7 +212,7 @@
         });
 
         $('.btnBrowseAllImages', page).on('click', function () {
-            showImageDownloader(page, 'Primary');
+            showImageDownloader(page, this.getAttribute('data-imagetype') || 'Primary');
         });
     }
 
@@ -233,10 +235,13 @@
                 dlg.setAttribute('role', 'alertdialog');
                 // without this safari will scroll the background instead of the dialog contents
                 dlg.setAttribute('modal', 'modal');
+                // seeing max call stack size exceeded in the debugger with this
+                dlg.setAttribute('noAutoFocus', 'noAutoFocus');
                 dlg.entryAnimation = 'scale-up-animation';
                 dlg.exitAnimation = 'fade-out-animation';
                 dlg.classList.add('fullscreen-editor-paper-dialog');
                 dlg.classList.add('ui-body-b');
+                dlg.classList.add('smoothScrollY');
 
                 var html = '';
                 html += '<h2 class="dialogHeader">';

dashboard-ui/components/imageeditor/imageeditor.template.html

@@ -12,7 +12,7 @@
 <div id="backdropsContainer" style="display: none;">
     <div>
         <h1 style="display:inline-block;vertical-align:middle;">${HeaderBackdrops}</h1>
-        <paper-fab icon="search" class="btnBrowseAllImages mini subdued" style="vertical-align:middle;margin-left:1em;"></paper-fab>
+        <paper-fab icon="search" class="btnBrowseAllImages mini subdued" style="vertical-align:middle;margin-left:1em;" data-imagetype="Backdrop"></paper-fab>
         <paper-fab icon="add" class="btnOpenUploadMenu mini subdued" style="vertical-align:middle;margin-left:.25em;"></paper-fab>
     </div>
     <div id="backdrops">
@@ -21,7 +21,11 @@
 </div>
 
 <div id="screenshotsContainer" style="display: none;">
-    <h1>${Screenshots}</h1>
+    <div>
+        <h1 style="display:inline-block;vertical-align:middle;">${Screenshots}</h1>
+        <paper-fab icon="search" class="btnBrowseAllImages mini subdued" style="vertical-align:middle;margin-left:1em;" data-imagetype="Screenshot"></paper-fab>
+        <paper-fab icon="add" class="btnOpenUploadMenu mini subdued" style="vertical-align:middle;margin-left:.25em;"></paper-fab>
+    </div>
     <div id="screenshots">
     </div>
 </div>

dashboard-ui/components/imageuploader/imageuploader.js

@@ -139,10 +139,13 @@
             dlg.setAttribute('role', 'alertdialog');
             // without this safari will scroll the background instead of the dialog contents
             dlg.setAttribute('modal', 'modal');
+            // seeing max call stack size exceeded in the debugger with this
+            dlg.setAttribute('noAutoFocus', 'noAutoFocus');
             dlg.entryAnimation = 'scale-up-animation';
             dlg.exitAnimation = 'fade-out-animation';
             dlg.classList.add('fullscreen-editor-paper-dialog');
             dlg.classList.add('ui-body-b');
+            dlg.classList.add('smoothScrollY');
 
             var html = '';
             html += '<h2 class="dialogHeader">';

dashboard-ui/components/subtitleeditor/subtitleeditor.js

@@ -341,10 +341,13 @@
                 dlg.setAttribute('role', 'alertdialog');
                 // without this safari will scroll the background instead of the dialog contents
                 dlg.setAttribute('modal', 'modal');
+                // seeing max call stack size exceeded in the debugger with this
+                dlg.setAttribute('noAutoFocus', 'noAutoFocus');
                 dlg.entryAnimation = 'scale-up-animation';
                 dlg.exitAnimation = 'fade-out-animation';
                 dlg.classList.add('fullscreen-editor-paper-dialog');
                 dlg.classList.add('ui-body-b');
+                dlg.classList.add('smoothScrollY');
 
                 var html = '';
                 html += '<h2 class="dialogHeader">';

dashboard-ui/css/metadataeditor.css

@@ -197,29 +197,31 @@
 
 .editorTile {
     display: inline-block;
-    margin: .5em;
     text-align: center;
     vertical-align: middle;
 }
 
+.editorTileInner {
+    margin: 1em .5em;
+}
+
 .imageEditorTile {
-    width: 256px;
+    width: 100%;
-    background-color: #282828;
     padding: 0;
 }
 
 .editorTile h3 {
-    text-transform: uppercase;
     text-align: center;
-    color: #ddd;
+    margin: .5em 0 .7em;
 }
 
 .editorTile p {
     margin: .5em 0;
 }
 
-.editorTileInner {
+.editorTileFooter {
     padding: .5em;
+    background-color: #282828;
 }
 
 .editorTile .ui-field-contain {
@@ -259,6 +261,10 @@
     .subtitleViewerContent {
         width: 400px;
     }
+
+    .imageEditorTile {
+        width: 50%;
+    }
 }
 
 @media all and (min-width: 600px) {
@@ -281,6 +287,10 @@
     .subtitleViewerContent {
         width: 600px;
     }
+
+    .imageEditorTile {
+        width: 33.3%;
+    }
 }
 
 @media all and (min-width: 800px) {
@@ -317,6 +327,10 @@
     .popupIdentify {
         width: 800px;
     }
+
+    .imageEditorTile {
+        width: 25%;
+    }
 }
 
 @media all and (min-width: 1100px) {
@@ -331,6 +345,17 @@
     .popupIdentify {
         width: 1000px;
     }
+
+    .imageEditorTile {
+        width: 20%;
+    }
+}
+
+@media all and (min-width: 1400px) {
+
+    .imageEditorTile {
+        width: 16.666666666666666666666666666667%;
+    }
 }
 
 @media all and (min-width: 1800px) {
@@ -342,6 +367,10 @@
     .editPageInnerContent {
         width: 72.5%;
     }
+
+    .imageEditorTile {
+        width: 14.285714285714285714285714285714%;
+    }
 }
 
 .popupIdentify form, .identificationSearchResults {

dashboard-ui/scripts/mediacontroller.js

@@ -589,7 +589,8 @@
         self.currentPlaylistIndex = function (i) {
 
             if (i == null) {
-                return currentPlayer.currentPlaylistIndex();
+                // TODO: Get this implemented in all of the players
+                return currentPlayer.currentPlaylistIndex ? currentPlayer.currentPlaylistIndex() : -1;
             }
 
             currentPlayer.currentPlaylistIndex(i);