diff --git a/dashboard-ui/bower_components/emby-webcomponents/.bower.json b/dashboard-ui/bower_components/emby-webcomponents/.bower.json index a5987ee8b5..0bc8e65a45 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/.bower.json +++ b/dashboard-ui/bower_components/emby-webcomponents/.bower.json @@ -15,12 +15,12 @@ }, "devDependencies": {}, "ignore": [], - "version": "1.0.32", - "_release": "1.0.32", + "version": "1.0.35", + "_release": "1.0.35", "_resolution": { "type": "version", - "tag": "1.0.32", - "commit": "4f59bdceba30ab8a9e1bf4c7d6bacd659d27b9bb" + "tag": "1.0.35", + "commit": "3fbcae2c9495ad83a36aa1bcf34f985f979923e7" }, "_source": "git://github.com/MediaBrowser/emby-webcomponents.git", "_target": "~1.0.0", diff --git a/dashboard-ui/bower_components/emby-webcomponents/paperdialoghelper/paperdialoghelper.css b/dashboard-ui/bower_components/emby-webcomponents/paperdialoghelper/paperdialoghelper.css index cf54eccfd7..1cb020007b 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/paperdialoghelper/paperdialoghelper.css +++ b/dashboard-ui/bower_components/emby-webcomponents/paperdialoghelper/paperdialoghelper.css @@ -1,17 +1,19 @@ .paperDialog { margin: 0; - top: 0; - left: 0; - right: 0; - bottom: 0; - position: fixed; - max-width: none !important; - max-height: none !important; - display: flex; - align-items: center; - justify-content: center; } + .paperDialog.fixedSize { + position: fixed !important; + top: 0 !important; + bottom: 0 !important; + left: 0 !important; + right: 0 !important; + margin: 0 !important; + border-radius: 0 !important; + max-height: none !important; + max-width: none !important; + } + .paperDialog.scrollY { overflow-y: auto; -webkit-overflow-scrolling: touch; @@ -25,4 +27,36 @@ .paperDialog.hiddenScroll { -ms-overflow-style: none; overflow: -moz-scrollbars-none; - } \ No newline at end of file + } + +@media all and (min-width: 1280px) and (min-height: 720px) { + + .paperDialog.medium { + top: 10% !important; + bottom: 10% !important; + left: 10% !important; + right: 10% !important; + } + + .paperDialog.small { + top: 10% !important; + bottom: 10% !important; + left: 20% !important; + right: 20% !important; + } +} + +@media all and (min-width: 1280px) and (min-height: 720px) { + + .paperDialog.fullscreen-border { + top: 5% !important; + bottom: 5% !important; + left: 5% !important; + right: 5% !important; + } +} + +.noScroll { + overflow-x: hidden !important; + overflow-y: hidden !important; +} \ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/paperdialoghelper/paperdialoghelper.js b/dashboard-ui/bower_components/emby-webcomponents/paperdialoghelper/paperdialoghelper.js index 2c064ead86..01c6dbdd86 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/paperdialoghelper/paperdialoghelper.js +++ b/dashboard-ui/bower_components/emby-webcomponents/paperdialoghelper/paperdialoghelper.js @@ -5,6 +5,7 @@ var self = this; self.originalUrl = window.location.href; var activeElement = document.activeElement; + var removeScrollLockOnClose = false; function onHashChange(e) { @@ -22,9 +23,8 @@ function onDialogClosed() { - if (lockDocumentScroll !== false) { - // TODO - //Dashboard.onPopupClose(); + if (removeScrollLockOnClose) { + document.body.classList.remove('noScroll'); } window.removeEventListener('popstate', onHashChange); @@ -55,9 +55,9 @@ dlg.addEventListener('iron-overlay-closed', onDialogClosed); dlg.open(); - if (lockDocumentScroll !== false) { - // TODO - //Dashboard.onPopupOpen(); + if (lockDocumentScroll !== false && !document.body.classList.contains('noScroll')) { + document.body.classList.add('noScroll'); + removeScrollLockOnClose = true; } historyManager.pushState({ dialogId: hash }, "Dialog", hash); @@ -135,7 +135,14 @@ dlg.setAttribute('data-removeonclose', 'true'); } - dlg.addEventListener('iron-overlay-opened', onDialogOpened); + if (options.size) { + dlg.classList.add('fixedSize'); + dlg.classList.add(options.size); + } + + if (options.autoFocus !== false) { + dlg.addEventListener('iron-overlay-opened', onDialogOpened); + } return dlg; } diff --git a/dashboard-ui/bower_components/iron-behaviors/.bower.json b/dashboard-ui/bower_components/iron-behaviors/.bower.json index db08f2170c..17f68b3351 100644 --- a/dashboard-ui/bower_components/iron-behaviors/.bower.json +++ b/dashboard-ui/bower_components/iron-behaviors/.bower.json @@ -29,14 +29,14 @@ "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0" }, "ignore": [], - "homepage": "https://github.com/PolymerElements/iron-behaviors", + "homepage": "https://github.com/polymerelements/iron-behaviors", "_release": "1.0.12", "_resolution": { "type": "version", "tag": "v1.0.12", "commit": "657f526a2382a659cdf4e13be87ecc89261588a3" }, - "_source": "git://github.com/PolymerElements/iron-behaviors.git", + "_source": "git://github.com/polymerelements/iron-behaviors.git", "_target": "^1.0.0", - "_originalSource": "PolymerElements/iron-behaviors" + "_originalSource": "polymerelements/iron-behaviors" } \ No newline at end of file diff --git a/dashboard-ui/components/collectioneditor/collectioneditor.js b/dashboard-ui/components/collectioneditor/collectioneditor.js index 949a7c7c7e..bba463a18e 100644 --- a/dashboard-ui/components/collectioneditor/collectioneditor.js +++ b/dashboard-ui/components/collectioneditor/collectioneditor.js @@ -193,11 +193,14 @@ size: 'small' }); + dlg.classList.add('ui-body-b'); + dlg.classList.add('background-theme-b'); + var html = ''; var title = items.length ? Globalize.translate('HeaderAddToCollection') : Globalize.translate('HeaderNewCollection'); html += '
'; - html += ''; + html += ''; html += '
'; html += title; html += '
'; diff --git a/dashboard-ui/components/directorybrowser/directorybrowser.js b/dashboard-ui/components/directorybrowser/directorybrowser.js index 16deb8e7bb..d2283bc5f7 100644 --- a/dashboard-ui/components/directorybrowser/directorybrowser.js +++ b/dashboard-ui/components/directorybrowser/directorybrowser.js @@ -208,10 +208,13 @@ getSystemInfo().then(function (systemInfo) { var dlg = paperDialogHelper.createDialog({ - theme: 'a', size: 'medium' }); + dlg.classList.add('ui-body-a'); + dlg.classList.add('background-theme-a'); + dlg.classList.add('popupEditor'); + dlg.classList.add('directoryPicker'); var html = ''; diff --git a/dashboard-ui/components/imagedownloader/imagedownloader.js b/dashboard-ui/components/imagedownloader/imagedownloader.js index 1052bff02f..76aa7b2399 100644 --- a/dashboard-ui/components/imagedownloader/imagedownloader.js +++ b/dashboard-ui/components/imagedownloader/imagedownloader.js @@ -271,11 +271,19 @@ currentItemId = itemId; currentItemType = itemType; - var dlg = paperDialogHelper.createDialog(); + var dlg = paperDialogHelper.createDialog({ + size: 'fullscreen-border' + }); + + var theme = 'b'; + + dlg.classList.add('ui-body-' + theme); + dlg.classList.add('background-theme-' + theme); + dlg.classList.add('popupEditor'); var html = ''; html += '

'; - html += ''; + html += ''; html += '
' + Globalize.translate('HeaderSearch') + '
'; html += '

'; diff --git a/dashboard-ui/components/imageeditor/imageeditor.js b/dashboard-ui/components/imageeditor/imageeditor.js index fdbfa9236e..fd88141710 100644 --- a/dashboard-ui/components/imageeditor/imageeditor.js +++ b/dashboard-ui/components/imageeditor/imageeditor.js @@ -242,12 +242,18 @@ ApiClient.getItem(Dashboard.getCurrentUserId(), itemId).then(function (item) { var dlg = paperDialogHelper.createDialog({ - theme: options.theme + size: 'fullscreen-border' }); + var theme = options.theme || 'b'; + + dlg.classList.add('ui-body-' + theme); + dlg.classList.add('background-theme-' + theme); + dlg.classList.add('popupEditor'); + var html = ''; html += '

'; - html += ''; + html += ''; html += '
' + item.Name + '
'; html += '

'; diff --git a/dashboard-ui/components/imageuploader/imageuploader.js b/dashboard-ui/components/imageuploader/imageuploader.js index 37d524f69c..085b5f158d 100644 --- a/dashboard-ui/components/imageuploader/imageuploader.js +++ b/dashboard-ui/components/imageuploader/imageuploader.js @@ -134,12 +134,18 @@ currentItemId = itemId; var dlg = paperDialogHelper.createDialog({ - theme: options.theme + size: 'fullscreen-border' }); + var theme = options.theme || 'b'; + + dlg.classList.add('ui-body-' + theme); + dlg.classList.add('background-theme-' + theme); + dlg.classList.add('popupEditor'); + var html = ''; html += '

'; - html += ''; + html += ''; html += '
' + Globalize.translate('HeaderUploadImage') + '
'; html += '

'; diff --git a/dashboard-ui/components/itemidentifier/itemidentifier.js b/dashboard-ui/components/itemidentifier/itemidentifier.js index 5162a0f38b..a0ff561c88 100644 --- a/dashboard-ui/components/itemidentifier/itemidentifier.js +++ b/dashboard-ui/components/itemidentifier/itemidentifier.js @@ -295,6 +295,9 @@ size: 'medium' }); + dlg.classList.add('ui-body-b'); + dlg.classList.add('background-theme-b'); + var html = ''; html += Globalize.translateDocument(template); diff --git a/dashboard-ui/components/itemidentifier/itemidentifier.template.html b/dashboard-ui/components/itemidentifier/itemidentifier.template.html index e3f9d74f75..ed7cfa0fce 100644 --- a/dashboard-ui/components/itemidentifier/itemidentifier.template.html +++ b/dashboard-ui/components/itemidentifier/itemidentifier.template.html @@ -1,5 +1,5 @@ 
- +
diff --git a/dashboard-ui/components/medialibrarycreator/medialibrarycreator.js b/dashboard-ui/components/medialibrarycreator/medialibrarycreator.js index 5d7de85cd3..1dcc85d7cd 100644 --- a/dashboard-ui/components/medialibrarycreator/medialibrarycreator.js +++ b/dashboard-ui/components/medialibrarycreator/medialibrarycreator.js @@ -194,15 +194,18 @@ var template = this.response; var dlg = paperDialogHelper.createDialog({ size: 'small', - theme: 'a', // In (at least) chrome this is causing the text field to not be editable modal: false }); + dlg.classList.add('ui-body-a'); + dlg.classList.add('background-theme-a'); + dlg.classList.add('popupEditor'); + var html = ''; html += '

'; - html += ''; + html += ''; var title = Globalize.translate('ButtonAddMediaLibrary'); diff --git a/dashboard-ui/components/medialibraryeditor/medialibraryeditor.js b/dashboard-ui/components/medialibraryeditor/medialibraryeditor.js index 7a722d09f0..9357e97ae5 100644 --- a/dashboard-ui/components/medialibraryeditor/medialibraryeditor.js +++ b/dashboard-ui/components/medialibraryeditor/medialibraryeditor.js @@ -148,15 +148,18 @@ var template = this.response; var dlg = paperDialogHelper.createDialog({ size: 'small', - theme: 'a', // In (at least) chrome this is causing the text field to not be editable modal: false }); + dlg.classList.add('ui-body-a'); + dlg.classList.add('background-theme-a'); + dlg.classList.add('popupEditor'); + var html = ''; html += '

'; - html += ''; + html += ''; html += '
' + options.library.Name + '
'; html += '

'; diff --git a/dashboard-ui/components/metadataeditor/metadataeditor.js b/dashboard-ui/components/metadataeditor/metadataeditor.js index 2d0a58607f..2814fbc58f 100644 --- a/dashboard-ui/components/metadataeditor/metadataeditor.js +++ b/dashboard-ui/components/metadataeditor/metadataeditor.js @@ -868,6 +868,9 @@ size: 'small' }); + dlg.classList.add('ui-body-b'); + dlg.classList.add('background-theme-b'); + dlg.classList.add('formDialog'); var html = ''; diff --git a/dashboard-ui/components/paperdialoghelper.js b/dashboard-ui/components/paperdialoghelper.js deleted file mode 100644 index 00ce17a038..0000000000 --- a/dashboard-ui/components/paperdialoghelper.js +++ /dev/null @@ -1,207 +0,0 @@ -define(['paper-dialog', 'scale-up-animation', 'fade-out-animation', 'fade-in-animation'], function () { - - function paperDialogHashHandler(dlg, hash, resolve, lockDocumentScroll) { - - var self = this; - self.originalUrl = window.location.href; - var activeElement = document.activeElement; - - function onHashChange(e) { - - var isBack = self.originalUrl == window.location.href; - - if (isBack || !dlg.opened) { - window.removeEventListener('popstate', onHashChange); - } - - if (isBack) { - self.closedByBack = true; - dlg.close(); - } - } - - function onDialogClosed() { - - if (lockDocumentScroll !== false) { - Dashboard.onPopupClose(); - } - - window.removeEventListener('popstate', onHashChange); - - if (!self.closedByBack) { - var state = history.state || {}; - if (state.dialogId == hash) { - history.back(); - } - } - - activeElement.focus(); - - if (dlg.getAttribute('data-removeonclose') == 'true') { - dlg.parentNode.removeChild(dlg); - } - - //resolve(); - // if we just called history.back(), then use a timeout to allow the history events to fire first - setTimeout(function () { - resolve({ - element: dlg, - closedByBack: self.closedByBack - }); - }, 1); - } - - dlg.addEventListener('iron-overlay-closed', onDialogClosed); - dlg.open(); - - if (lockDocumentScroll !== false) { - Dashboard.onPopupOpen(); - } - - var state = { - dialogId: hash, - navigate: false - }; - history.pushState(state, "Dialog", hash); - - jQuery.onStatePushed(state); - - window.addEventListener('popstate', onHashChange); - } - - function open(dlg) { - - return new Promise(function (resolve, reject) { - - new paperDialogHashHandler(dlg, 'dlg' + new Date().getTime(), resolve); - }); - } - - function close(dlg) { - - if (dlg.opened) { - history.back(); - } - } - - function onDialogOpened(e) { - - //Emby.FocusManager.autoFocus(e.target, true); - } - - function createDialog(options) { - - options = options || {}; - - var dlg = document.createElement('paper-dialog'); - - dlg.setAttribute('with-backdrop', 'with-backdrop'); - dlg.setAttribute('role', 'alertdialog'); - - // without this safari will scroll the background instead of the dialog contents - // but not needed here since this is already on top of an existing dialog - // but skip it in IE because it's causing the entire browser to hang - // Also have to disable for firefox because it's causing select elements to not be clickable - if (!browserInfo.msie && !browserInfo.firefox) { - if (options.modal !== false) { - //dlg.setAttribute('modal', 'modal'); - } - } - - // seeing max call stack size exceeded in the debugger with this - dlg.setAttribute('noAutoFocus', 'noAutoFocus'); - - // These don't seem to perform well on mobile - var defaultEntryAnimation = browserInfo.mobile ? 'fade-in-animation' : 'scale-up-animation'; - dlg.entryAnimation = options.entryAnimation || defaultEntryAnimation; - dlg.exitAnimation = 'fade-out-animation'; - - dlg.animationConfig = { - // scale up - 'entry': { - name: options.entryAnimation || defaultEntryAnimation, - node: dlg, - timing: { duration: options.entryAnimationDuration || 300, easing: 'ease-out' } - }, - // fade out - 'exit': { - name: 'fade-out-animation', - node: dlg, - timing: { duration: options.exitAnimationDuration || 400, easing: 'ease-in' } - } - }; - - if (options.size != 'auto') { - dlg.classList.add('popupEditor'); - - if (options.size == 'small') { - dlg.classList.add('small-paper-dialog'); - } - else if (options.size == 'medium') { - dlg.classList.add('medium-paper-dialog'); - } else { - dlg.classList.add('fullscreen-paper-dialog'); - } - } - - var theme = options.theme || 'b'; - - dlg.classList.add('ui-body-' + theme); - dlg.classList.add('background-theme-' + theme); - dlg.classList.add('smoothScrollY'); - - if (options.removeOnClose) { - dlg.setAttribute('data-removeonclose', 'true'); - } - - return dlg; - } - - function positionTo(dlg, elem) { - - var windowHeight = $(window).height(); - - // If the window height is under a certain amount, don't bother trying to position - // based on an element. - if (windowHeight >= 540) { - - var pos = $(elem).offset(); - - pos.top += elem.offsetHeight / 2; - pos.left += elem.offsetWidth / 2; - - // Account for margins - pos.top -= 24; - pos.left -= 24; - - // Account for popup size - we can't predict this yet so just estimate - pos.top -= $(dlg).height() / 2; - pos.left -= $(dlg).width() / 2; - - // Account for scroll position - pos.top -= $(window).scrollTop(); - pos.left -= $(window).scrollLeft(); - - // Avoid showing too close to the bottom - pos.top = Math.min(pos.top, windowHeight - 300); - pos.left = Math.min(pos.left, $(window).width() - 300); - - // Do some boundary checking - pos.top = Math.max(pos.top, 0); - pos.left = Math.max(pos.left, 0); - - dlg.style.position = 'fixed'; - dlg.style.left = pos.left + 'px'; - dlg.style.top = pos.top + 'px'; - } - } - - window.PaperDialogHelper = { - open: open, - close: close, - createDialog: createDialog, - positionTo: positionTo - }; - - return PaperDialogHelper; -}); \ No newline at end of file diff --git a/dashboard-ui/components/playlisteditor/playlisteditor.js b/dashboard-ui/components/playlisteditor/playlisteditor.js index 2cbab4f736..5eccec04e2 100644 --- a/dashboard-ui/components/playlisteditor/playlisteditor.js +++ b/dashboard-ui/components/playlisteditor/playlisteditor.js @@ -198,12 +198,15 @@ size: 'small' }); + dlg.classList.add('ui-body-b'); + dlg.classList.add('background-theme-b'); + var html = ''; var title = Globalize.translate('HeaderAddToPlaylist'); html += '
'; - html += ''; + html += ''; html += '
'; html += title; html += '
'; diff --git a/dashboard-ui/components/recordingcreator/recordingcreator.js b/dashboard-ui/components/recordingcreator/recordingcreator.js index 185dcc3584..9c28bfecb4 100644 --- a/dashboard-ui/components/recordingcreator/recordingcreator.js +++ b/dashboard-ui/components/recordingcreator/recordingcreator.js @@ -296,6 +296,9 @@ size: 'small' }); + dlg.classList.add('ui-body-b'); + dlg.classList.add('background-theme-b'); + dlg.classList.add('formDialog'); var html = ''; diff --git a/dashboard-ui/components/recordingcreator/recordingcreator.template.html b/dashboard-ui/components/recordingcreator/recordingcreator.template.html index 7347d5eb19..7aa0e94541 100644 --- a/dashboard-ui/components/recordingcreator/recordingcreator.template.html +++ b/dashboard-ui/components/recordingcreator/recordingcreator.template.html @@ -1,5 +1,5 @@ 
- +
${HeaderNewRecording}
diff --git a/dashboard-ui/components/subtitleeditor/subtitleeditor.js b/dashboard-ui/components/subtitleeditor/subtitleeditor.js index 5c9b83d41b..d7e908f121 100644 --- a/dashboard-ui/components/subtitleeditor/subtitleeditor.js +++ b/dashboard-ui/components/subtitleeditor/subtitleeditor.js @@ -344,9 +344,12 @@ removeOnClose: true }); + dlg.classList.add('ui-body-b'); + dlg.classList.add('background-theme-b'); + var html = ''; html += '
'; - html += ''; + html += ''; html += '
'; html += item.Name; html += '
'; diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index 960b0c6a1b..ba2f08e304 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -2881,11 +2881,12 @@ var dlg = paperDialogHelper.createDialog({ removeOnClose: true, - theme: 'a', - size: 'auto', modal: false }); + dlg.classList.add('ui-body-a'); + dlg.classList.add('background-theme-a'); + var html = ''; // There seems to be a bug with this in safari causing it to immediately roll up to 0 height diff --git a/dashboard-ui/scripts/registrationservices.js b/dashboard-ui/scripts/registrationservices.js index c56749777b..4aee9b678e 100644 --- a/dashboard-ui/scripts/registrationservices.js +++ b/dashboard-ui/scripts/registrationservices.js @@ -99,14 +99,20 @@ require(['paperdialoghelper', 'paper-fab', 'paper-item-body', 'paper-icon-item'], function (paperDialogHelper) { - var dlg = paperDialogHelper.createDialog({}); + var dlg = paperDialogHelper.createDialog({ + size: 'fullscreen-border' + }); + + dlg.classList.add('ui-body-b'); + dlg.classList.add('background-theme-b'); + dlg.classList.add('popupEditor'); var html = ''; html += '

'; - html += ''; + html += ''; html += '

'; - html += '
'; + html += '
'; html += '

' + Globalize.translate('HeaderTryEmbyPremiere') + '

'; @@ -123,7 +129,7 @@ html += '
'; - html += '' + Globalize.translate('ButtonBecomeSupporter') + ''; + html += '' + Globalize.translate('ButtonBecomeSupporter') + ''; html += '' + Globalize.translate('ButtonClosePlayVideo') + ''; html += '
'; diff --git a/dashboard-ui/scripts/sync.js b/dashboard-ui/scripts/sync.js index 3f34f58bba..f7325b4324 100644 --- a/dashboard-ui/scripts/sync.js +++ b/dashboard-ui/scripts/sync.js @@ -236,10 +236,14 @@ var dlg = paperDialogHelper.createDialog({ size: 'small', - theme: 'a', - removeOnClose: true + removeOnClose: true, + autoFocus: false }); + dlg.classList.add('ui-body-a'); + dlg.classList.add('background-theme-a'); + dlg.classList.add('popupEditor'); + var html = ''; html += '

'; html += ''; diff --git a/dashboard-ui/thirdparty/paper-button-style.css b/dashboard-ui/thirdparty/paper-button-style.css index 3ad00ff053..d75e28666c 100644 --- a/dashboard-ui/thirdparty/paper-button-style.css +++ b/dashboard-ui/thirdparty/paper-button-style.css @@ -532,45 +532,6 @@ paper-dialog paper-radio-group paper-radio-button { display: block; } -.fullscreen-paper-dialog, .medium-paper-dialog, .small-paper-dialog { - position: fixed !important; - top: 0 !important; - bottom: 0 !important; - left: 0 !important; - right: 0 !important; - margin: 0 !important; - border-radius: 0 !important; - max-height: none !important; - max-width: none !important; -} - -@media all and (min-width: 1280px) and (min-height: 720px) { - - .medium-paper-dialog { - top: 10% !important; - bottom: 10% !important; - left: 10% !important; - right: 10% !important; - } - - .small-paper-dialog { - top: 10% !important; - bottom: 10% !important; - left: 20% !important; - right: 20% !important; - } -} - -@media all and (min-width: 1280px) and (min-height: 720px) { - - .fullscreen-paper-dialog { - top: 5% !important; - bottom: 5% !important; - left: 5% !important; - right: 5% !important; - } -} - div.dialogHeader { margin: 0 0 2.5em!important; padding: .35em .5em; diff --git a/dashboard-ui/voice/voice.js b/dashboard-ui/voice/voice.js index bf27341223..990b388704 100644 --- a/dashboard-ui/voice/voice.js +++ b/dashboard-ui/voice/voice.js @@ -234,9 +234,12 @@ removeOnClose: true }); + dlg.classList.add('ui-body-b'); + dlg.classList.add('background-theme-b'); + var html = ''; html += '

'; - html += ''; + html += ''; html += '

'; html += '
';