From 3a045a664bc849b6146613e3d880d43a7a9cdfeb Mon Sep 17 00:00:00 2001 From: Luke Pulverenti Date: Sat, 4 Jun 2016 20:17:35 -0400 Subject: [PATCH] update buttons --- .../emby-webcomponents/.bower.json | 8 +- .../actionsheet/actionsheet.css | 7 +- .../actionsheet/actionsheet.js | 8 +- .../emby-webcomponents/alert/alert.js | 6 +- .../emby-webcomponents/browser.js | 2 + .../collectioneditor/collectioneditor.js | 19 +-- .../emby-webcomponents/confirm/confirm.js | 6 +- .../emby-button/emby-button.css | 73 +++++++++ .../emby-button/emby-button.js | 50 ++++++ .../emby-input/emby-input.js | 18 +++ .../emby-webcomponents/focusmanager.js | 4 +- .../emby-webcomponents/guide/guide.js | 2 +- .../guide/tvguide.template.html | 2 +- .../playlisteditor/playlisteditor.js | 21 +-- .../emby-webcomponents/prompt/prompt.js | 20 +-- .../emby-webcomponents/prompt/style.css | 5 +- .../recordingcreator/recordingcreator.js | 46 ++---- .../recordingcreator.template.html | 6 +- .../recordingcreator/recordingeditor.js | 18 +-- .../recordingeditor.template.html | 6 +- .../emby-webcomponents/sharing/sharingmenu.js | 4 +- .../emby-webcomponents/strings/en-US.json | 3 +- .../subtitleeditor/subtitleeditor.js | 20 +-- .../subtitleeditor.template.html | 2 +- .../bower_components/polymer/.bower.json | 2 +- dashboard-ui/channels.html | 2 +- dashboard-ui/css/site.css | 9 +- dashboard-ui/home.html | 2 +- dashboard-ui/movies.html | 2 +- dashboard-ui/music.html | 2 +- dashboard-ui/scripts/site.js | 2 + .../thirdparty/paper-button-style.css | 147 +++++++++++++++++- dashboard-ui/tv.html | 2 +- 33 files changed, 360 insertions(+), 166 deletions(-) create mode 100644 dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css create mode 100644 dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.js diff --git a/dashboard-ui/bower_components/emby-webcomponents/.bower.json b/dashboard-ui/bower_components/emby-webcomponents/.bower.json index 2c50782636..c8254517e9 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.4.18", - "_release": "1.4.18", + "version": "1.4.24", + "_release": "1.4.24", "_resolution": { "type": "version", - "tag": "1.4.18", - "commit": "39d5a6a55acf536c14945385fbce917516fe23ea" + "tag": "1.4.24", + "commit": "05159909e71faf74eb1d39f3cac661614b0a5d5b" }, "_source": "https://github.com/MediaBrowser/emby-webcomponents.git", "_target": "^1.2.0", diff --git a/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.css b/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.css index 1da4198430..ad518de96b 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.css +++ b/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.css @@ -27,7 +27,7 @@ text-align: center; } -.actionSheetMenuItem { +button.actionSheetMenuItem { padding: 0 1.6em; margin: 0; text-transform: none; @@ -35,13 +35,14 @@ display: flex; font-weight: inherit; align-items: center; + flex-shrink: 0; } .actionSheetItemText { padding: .8em 0; } -.layout-tv .actionSheetMenuItem { +.layout-tv button.actionSheetMenuItem { padding-top: .16em; padding-bottom: .16em; } @@ -53,6 +54,8 @@ .actionSheetScroller { /* Override default style being applied by polymer */ margin-bottom: 0 !important; + display: flex; + flex-direction: column; } .layout-tv .actionSheetScroller { diff --git a/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js b/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js index c77e412b45..e167ab329b 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js +++ b/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js @@ -1,4 +1,4 @@ -define(['dialogHelper', 'layoutManager', 'globalize', 'paper-button', 'css!./actionsheet', 'html!./../icons/nav.html', 'scrollStyles'], function (dialogHelper, layoutManager, globalize) { +define(['dialogHelper', 'layoutManager', 'globalize', 'emby-button', 'css!./actionsheet', 'html!./../icons/nav.html', 'scrollStyles'], function (dialogHelper, layoutManager, globalize) { function parentWithClass(elem, className) { @@ -151,14 +151,14 @@ dlg.classList.add('centered'); } - var itemTagName = 'paper-button'; + var itemTagName = 'button'; for (i = 0, length = options.items.length; i < length; i++) { option = options.items[i]; var autoFocus = option.selected ? ' autoFocus' : ''; - html += '<' + itemTagName + autoFocus + ' class="actionSheetMenuItem" data-id="' + (option.id || option.value) + '">'; + html += '<' + itemTagName + autoFocus + ' is="emby-button" type="button" class="actionSheetMenuItem" data-id="' + (option.id || option.value) + '">'; if (option.ironIcon) { html += ''; @@ -172,7 +172,7 @@ if (options.showCancel) { html += '
'; - html += '' + globalize.translate('sharedcomponents#ButtonCancel') + ''; + html += ''; html += '
'; } html += ''; diff --git a/dashboard-ui/bower_components/emby-webcomponents/alert/alert.js b/dashboard-ui/bower_components/emby-webcomponents/alert/alert.js index 96847a2d64..01b90334a4 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/alert/alert.js +++ b/dashboard-ui/bower_components/emby-webcomponents/alert/alert.js @@ -1,4 +1,4 @@ -define(['dialogHelper', 'layoutManager', 'globalize', 'html!./../icons/nav.html', 'css!./../prompt/style.css', 'paper-button', 'paper-icon-button-light'], function (dialogHelper, layoutManager, globalize) { +define(['dialogHelper', 'layoutManager', 'globalize', 'html!./../icons/nav.html', 'css!./../prompt/style.css', 'emby-button', 'paper-icon-button-light'], function (dialogHelper, layoutManager, globalize) { function getIcon(icon, cssClass, canFocus, autoFocus) { @@ -72,10 +72,10 @@ define(['dialogHelper', 'layoutManager', 'globalize', 'html!./../icons/nav.html' var buttonText = options.type == 'error' ? 'sharedcomponents#ButtonOk' : 'sharedcomponents#ButtonGotIt'; if (raisedButtons) { - html += '' + globalize.translate(buttonText) + ''; + html += ''; } else { html += '
'; - html += '' + globalize.translate(buttonText) + ''; + html += ''; html += '
'; } diff --git a/dashboard-ui/bower_components/emby-webcomponents/browser.js b/dashboard-ui/bower_components/emby-webcomponents/browser.js index c973fdbb09..0957fc1340 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/browser.js +++ b/dashboard-ui/bower_components/emby-webcomponents/browser.js @@ -101,5 +101,7 @@ browser.tv = isTv(); browser.operaTv = browser.tv && userAgent.toLowerCase().indexOf('opr/') != -1; + browser.noFlex = browser.tv && !browser.chrome && !browser.operaTv; + return browser; }); \ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/collectioneditor/collectioneditor.js b/dashboard-ui/bower_components/emby-webcomponents/collectioneditor/collectioneditor.js index a9c7717fb3..5a1ef3be01 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/collectioneditor/collectioneditor.js +++ b/dashboard-ui/bower_components/emby-webcomponents/collectioneditor/collectioneditor.js @@ -1,4 +1,4 @@ -define(['shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionManager', 'scrollHelper', 'embyRouter', 'globalize', 'paper-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'html!./../icons/nav.html', 'css!./../formdialog'], function (shell, dialogHelper, loading, layoutManager, connectionManager, scrollHelper, embyRouter, globalize) { +define(['shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionManager', 'scrollHelper', 'embyRouter', 'globalize', 'paper-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'html!./../icons/nav.html', 'css!./../formdialog', 'emby-button'], function (shell, dialogHelper, loading, layoutManager, connectionManager, scrollHelper, embyRouter, globalize) { var currentServerId; @@ -170,7 +170,7 @@ html += '
'; html += '
'; html += '
'; - html += '' + globalize.translate('sharedcomponents#ButtonOk') + ''; + html += ''; html += '
'; html += ''; @@ -201,21 +201,6 @@ } }); - content.querySelector('.btnSubmit').addEventListener('click', function () { - // Do a fake form submit this the button isn't a real submit button - var fakeSubmit = document.createElement('input'); - fakeSubmit.setAttribute('type', 'submit'); - fakeSubmit.style.display = 'none'; - var form = content.querySelector('form'); - form.appendChild(fakeSubmit); - fakeSubmit.click(); - - // Seeing issues in smart tv browsers where the form does not get submitted if the button is removed prior to the submission actually happening - setTimeout(function () { - form.removeChild(fakeSubmit); - }, 500); - }); - content.querySelector('form').addEventListener('submit', onSubmit); content.querySelector('.fldSelectedItemIds', content).value = items.join(','); diff --git a/dashboard-ui/bower_components/emby-webcomponents/confirm/confirm.js b/dashboard-ui/bower_components/emby-webcomponents/confirm/confirm.js index be5bf19896..fbce2372eb 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/confirm/confirm.js +++ b/dashboard-ui/bower_components/emby-webcomponents/confirm/confirm.js @@ -74,9 +74,9 @@ define(['layoutManager', 'globalize'], function (layoutManager, globalize) { html += '
'; - html += '' + globalize.translate('sharedcomponents#ButtonOk') + ''; + html += ''; - html += '' + globalize.translate('sharedcomponents#ButtonCancel') + ''; + html += ''; html += '
'; @@ -106,7 +106,7 @@ define(['layoutManager', 'globalize'], function (layoutManager, globalize) { function showConfirm(options) { return new Promise(function (resolve, reject) { - require(['dialogHelper', 'paper-button'], function (dialogHelper) { + require(['dialogHelper', 'emby-button'], function (dialogHelper) { showConfirmInternal(options, dialogHelper, resolve, reject); }); }); diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css b/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css new file mode 100644 index 0000000000..59b8ff36ed --- /dev/null +++ b/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.css @@ -0,0 +1,73 @@ +[is="emby-button"] { + position: relative; + display: inline-flex; + align-items: center; + box-sizing: border-box; + margin: 0 .29em; + background: transparent; + text-align: center; + font: inherit; + color: inherit; + outline-width: 0; + -moz-user-select: none; + -ms-user-select: none; + -webkit-user-select: none; + user-select: none; + cursor: pointer; + z-index: 0; + padding: 0.7em 0.57em; + font-weight: normal; + vertical-align: middle; + border: 0; + vertical-align: middle; + border-radius: 3px; + /* These are getting an outline in opera tv browsers, which run chrome 30 */ + outline: none !important; + position: relative; + overflow: hidden; +} + + [is="emby-button"].raised { + box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2); + } + + [is="emby-button"].block { + display: flex; + align-items: center; + justify-content: center; + margin: .25em .29em; + width: 100%; + } + + [is="emby-button"].raised:focus { + box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.4); + transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1); + } + + [is="emby-button"] iron-icon + span { + margin-left: .5em; + } + +.ripple-effect { + position: absolute; + border-radius: 50%; + width: 50px; + height: 50px; + top: 50%; + left: 50%; + background: white; + animation: ripple-animation 2s; + opacity: 0.4; +} + +@keyframes ripple-animation { + from { + transform: none; + opacity: 0.4; + } + + to { + transform: scale(100); + opacity: 0; + } +} diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.js b/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.js new file mode 100644 index 0000000000..7db2ee3817 --- /dev/null +++ b/dashboard-ui/bower_components/emby-webcomponents/emby-button/emby-button.js @@ -0,0 +1,50 @@ +define(['css!./emby-button'], function (layoutManager, browser) { + + var EmbyButtonPrototype = Object.create(HTMLButtonElement.prototype); + + function animateButton(e) { + + var div = document.createElement('div'); + + div.classList.add('ripple-effect'); + + var offsetX = e.offsetX || 0; + var offsetY = e.offsetY || 0; + + if (offsetX > 0 && offsetY > 0) { + div.style.left = offsetX + 'px'; + div.style.top = offsetY + 'px'; + } + + this.appendChild(div); + + setTimeout(function () { + div.parentNode.removeChild(div); + }, 2000); + } + + function onKeyDown(e) { + + if (e.keyCode == 13) { + animateButton.call(this, e); + } + } + + EmbyButtonPrototype.attachedCallback = function () { + + if (this.getAttribute('data-embybutton') == 'true') { + return; + } + + this.setAttribute('data-embybutton', 'true'); + + this.addEventListener('keydown', onKeyDown); + this.addEventListener('mousedown', animateButton); + //this.addEventListener('click', animateButton); + }; + + document.registerElement('emby-button', { + prototype: EmbyButtonPrototype, + extends: 'button' + }); +}); \ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.js b/dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.js index fa3aab42ef..0c2bc70712 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.js +++ b/dashboard-ui/bower_components/emby-webcomponents/emby-input/emby-input.js @@ -4,6 +4,22 @@ var inputId = 0; + if (Object.getOwnPropertyDescriptor && Object.defineProperty) { + + var descriptor = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'value'); + + var baseSetMethod = descriptor.set; + descriptor.set = function (value) { + baseSetMethod.call(this, value); + this.dispatchEvent(new CustomEvent('valueset', { + bubbles: false, + cancelable: false + })); + } + + Object.defineProperty(HTMLInputElement.prototype, 'value', descriptor); + } + EmbyInputPrototype.createdCallback = function () { if (!this.id) { @@ -45,11 +61,13 @@ label.classList.add('focused'); }); this.addEventListener('blur', function () { + onChange.call(this); label.classList.remove('focused'); }); this.addEventListener('change', onChange); this.addEventListener('input', onChange); + this.addEventListener('valueset', onChange); onChange.call(this); }; diff --git a/dashboard-ui/bower_components/emby-webcomponents/focusmanager.js b/dashboard-ui/bower_components/emby-webcomponents/focusmanager.js index 637573cf9d..8b78d2185d 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/focusmanager.js +++ b/dashboard-ui/bower_components/emby-webcomponents/focusmanager.js @@ -21,7 +21,7 @@ define([], function () { function focus(element) { var tagName = element.tagName; - if (tagName == 'PAPER-INPUT' || tagName == 'EMBY-DROPDOWN-MENU') { + if (tagName == 'PAPER-INPUT') { element = element.querySelector('input') || element; } @@ -32,7 +32,7 @@ define([], function () { } } - var focusableTagNames = ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON', 'A', 'PAPER-BUTTON', 'PAPER-INPUT', 'PAPER-CHECKBOX', 'EMBY-DROPDOWN-MENU']; + var focusableTagNames = ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON', 'A', 'PAPER-BUTTON', 'PAPER-INPUT', 'PAPER-CHECKBOX']; var focusableContainerTagNames = ['BODY', 'DIALOG']; var focusableQuery = focusableTagNames.join(',') + ',.focusable'; diff --git a/dashboard-ui/bower_components/emby-webcomponents/guide/guide.js b/dashboard-ui/bower_components/emby-webcomponents/guide/guide.js index ac98056523..6aba1a7df7 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/guide/guide.js +++ b/dashboard-ui/bower_components/emby-webcomponents/guide/guide.js @@ -1,4 +1,4 @@ -define(['require', 'browser', 'globalize', 'connectionManager', 'loading', 'scrollHelper', 'datetime', 'focusManager', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'registrationservices', 'clearButtonStyle', 'css!./guide.css', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html', 'scrollStyles'], function (require, browser, globalize, connectionManager, loading, scrollHelper, datetime, focusManager, imageLoader, events, layoutManager, itemShortcuts, registrationServices) { +define(['require', 'browser', 'globalize', 'connectionManager', 'loading', 'scrollHelper', 'datetime', 'focusManager', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'registrationservices', 'clearButtonStyle', 'css!./guide.css', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html', 'scrollStyles', 'emby-button'], function (require, browser, globalize, connectionManager, loading, scrollHelper, datetime, focusManager, imageLoader, events, layoutManager, itemShortcuts, registrationServices) { function Guide(options) { diff --git a/dashboard-ui/bower_components/emby-webcomponents/guide/tvguide.template.html b/dashboard-ui/bower_components/emby-webcomponents/guide/tvguide.template.html index 33b8a7406f..664c0c906f 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/guide/tvguide.template.html +++ b/dashboard-ui/bower_components/emby-webcomponents/guide/tvguide.template.html @@ -18,5 +18,5 @@

- ${ButtonUnlockGuide} +
\ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/playlisteditor/playlisteditor.js b/dashboard-ui/bower_components/emby-webcomponents/playlisteditor/playlisteditor.js index 6c55ec8b13..91430942fd 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/playlisteditor/playlisteditor.js +++ b/dashboard-ui/bower_components/emby-webcomponents/playlisteditor/playlisteditor.js @@ -1,4 +1,4 @@ -define(['shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionManager', 'scrollHelper', 'embyRouter', 'globalize', 'paper-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'html!./../icons/nav.html', 'css!./../formdialog'], function (shell, dialogHelper, loading, layoutManager, connectionManager, scrollHelper, embyRouter, globalize) { +define(['shell', 'dialogHelper', 'loading', 'layoutManager', 'connectionManager', 'scrollHelper', 'embyRouter', 'globalize', 'paper-checkbox', 'emby-input', 'paper-icon-button-light', 'emby-select', 'html!./../icons/nav.html', 'css!./../formdialog', 'emby-button'], function (shell, dialogHelper, loading, layoutManager, connectionManager, scrollHelper, embyRouter, globalize) { var lastPlaylistId = ''; var currentServerId; @@ -158,7 +158,7 @@ html += '
'; html += '
'; - html += '' + globalize.translate('sharedcomponents#ButtonOk') + ''; + html += ''; html += '
'; html += ''; @@ -182,23 +182,6 @@ } }); - populatePlaylists(content); - - content.querySelector('.btnSubmit').addEventListener('click', function () { - // Do a fake form submit this the button isn't a real submit button - var fakeSubmit = document.createElement('input'); - fakeSubmit.setAttribute('type', 'submit'); - fakeSubmit.style.display = 'none'; - var form = content.querySelector('form'); - form.appendChild(fakeSubmit); - fakeSubmit.click(); - - // Seeing issues in smart tv browsers where the form does not get submitted if the button is removed prior to the submission actually happening - setTimeout(function () { - form.removeChild(fakeSubmit); - }, 500); - }); - content.querySelector('form').addEventListener('submit', onSubmit); content.querySelector('.fldSelectedItemIds', content).value = items.join(','); diff --git a/dashboard-ui/bower_components/emby-webcomponents/prompt/prompt.js b/dashboard-ui/bower_components/emby-webcomponents/prompt/prompt.js index ad4597edb9..615b577588 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/prompt/prompt.js +++ b/dashboard-ui/bower_components/emby-webcomponents/prompt/prompt.js @@ -1,4 +1,4 @@ -define(['dialogHelper', 'layoutManager', 'globalize', 'html!./../icons/nav.html', 'css!./style.css', 'paper-button', 'paper-icon-button-light', 'emby-input'], function (dialogHelper, layoutManager, globalize) { +define(['dialogHelper', 'layoutManager', 'globalize', 'html!./../icons/nav.html', 'css!./style.css', 'emby-button', 'paper-icon-button-light', 'emby-input'], function (dialogHelper, layoutManager, globalize) { function getIcon(icon, cssClass, canFocus, autoFocus) { @@ -66,11 +66,11 @@ define(['dialogHelper', 'layoutManager', 'globalize', 'html!./../icons/nav.html' html += '
'; if (raisedButtons) { - html += '' + globalize.translate('sharedcomponents#ButtonOk') + ''; + html += ''; } else { html += '
'; - html += '' + globalize.translate('sharedcomponents#ButtonOk') + ''; - html += '' + globalize.translate('sharedcomponents#ButtonCancel') + ''; + html += ''; + html += ''; html += '
'; } html += ''; @@ -95,18 +95,6 @@ define(['dialogHelper', 'layoutManager', 'globalize', 'html!./../icons/nav.html' return false; }); - dlg.querySelector('.btnSubmit').addEventListener('click', function (e) { - - // Do a fake form submit this the button isn't a real submit button - var fakeSubmit = document.createElement('input'); - fakeSubmit.setAttribute('type', 'submit'); - fakeSubmit.style.display = 'none'; - var form = dlg.querySelector('form'); - form.appendChild(fakeSubmit); - fakeSubmit.click(); - form.removeChild(fakeSubmit); - }); - dlg.querySelector('.btnPromptExit').addEventListener('click', function (e) { dialogHelper.close(dlg); diff --git a/dashboard-ui/bower_components/emby-webcomponents/prompt/style.css b/dashboard-ui/bower_components/emby-webcomponents/prompt/style.css index ff22c039ee..0f147a76c6 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/prompt/style.css +++ b/dashboard-ui/bower_components/emby-webcomponents/prompt/style.css @@ -22,7 +22,10 @@ } .promptDialog.fullscreen .btnSubmit { - display: block; + display: flex; + width: 100%; + align-items: center; + justify-content: center; } .promptDialog.fullscreen .btnPromptExit { diff --git a/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.js b/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.js index 694334d772..645db20f20 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.js +++ b/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.js @@ -1,4 +1,4 @@ -define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'paper-checkbox', 'emby-collapsible', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper) { +define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'paper-checkbox', 'emby-button', 'emby-collapsible', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper) { var currentProgramId; var currentServerId; @@ -208,21 +208,10 @@ }); } - function onPremiereLinkClicked(e) { - - require(['shell'], function (shell) { - shell.openUrl('https://emby.media/premiere'); - }); - e.preventDefault(); - return false; - } - function init(context) { var apiClient = connectionManager.getApiClient(currentServerId); - context.querySelector('.lnkPremiere').addEventListener('click', onPremiereLinkClicked); - context.querySelector('#chkRecordSeries').addEventListener('change', function () { if (this.checked) { @@ -232,22 +221,6 @@ } }); - context.querySelector('.btnSubmit').addEventListener('click', function () { - - // Do a fake form submit this the button isn't a real submit button - var fakeSubmit = document.createElement('input'); - fakeSubmit.setAttribute('type', 'submit'); - fakeSubmit.style.display = 'none'; - var form = context.querySelector('form'); - form.appendChild(fakeSubmit); - fakeSubmit.click(); - - // Seeing issues in smart tv browsers where the form does not get submitted if the button is removed prior to the submission actually happening - setTimeout(function () { - form.removeChild(fakeSubmit); - }, 500); - }); - context.querySelector('.btnCancel').addEventListener('click', function () { closeDialog(false); @@ -269,12 +242,6 @@ } } - if (appHost.supports('externalpremium')) { - context.querySelector('.btnSupporterForConverting a').href = 'https://emby.media/premiere'; - } else { - context.querySelector('.btnSupporterForConverting a').href = '#'; - } - apiClient.getNamedConfiguration("livetv").then(function (config) { context.querySelector('#chkConvertRecordings').checked = config.EnableRecordingEncoding; @@ -348,6 +315,15 @@ }); } + function onSupporterButtonClick() { + if (appHost.supports('externalpremium')) { + require(['shell'], function (shell) { + shell.openUrl('https://emby.media/premiere'); + }); + } else { + } + } + function reload(context, programId) { loading.show(); @@ -418,6 +394,8 @@ scrollHelper.centerFocus.on(dlg.querySelector('.dialogContent'), false); } + dlg.querySelector('.btnSupporterForConverting').addEventListener('click', onSupporterButtonClick); + hideSeriesRecordingFields(dlg); init(dlg); diff --git a/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.template.html b/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.template.html index 0c4841502b..89e4cc16be 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.template.html +++ b/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingcreator.template.html @@ -55,7 +55,7 @@
-
+
@@ -71,9 +71,9 @@

${MessageActiveSubscriptionRequiredSeriesRecordings}

${HeaderEnjoyDayTrial}

- ${HeaderBecomeProjectSupporter} +
- ${Record} + \ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.js b/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.js index f39c196965..0fa4b6d6a6 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.js +++ b/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.js @@ -1,4 +1,4 @@ -define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'scrollStyles', 'paper-checkbox', 'emby-collapsible', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper) { +define(['dialogHelper', 'globalize', 'layoutManager', 'mediaInfo', 'apphost', 'connectionManager', 'require', 'loading', 'scrollHelper', 'scrollStyles', 'paper-checkbox', 'emby-button', 'emby-collapsible', 'emby-input', 'paper-icon-button-light', 'css!./../formdialog', 'css!./recordingcreator', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html'], function (dialogHelper, globalize, layoutManager, mediaInfo, appHost, connectionManager, require, loading, scrollHelper) { var currentDialog; var recordingUpdated = false; @@ -81,22 +81,6 @@ context.querySelector('.btnSubmit').click(); }); - - context.querySelector('.btnSubmit').addEventListener('click', function () { - - // Do a fake form submit this the button isn't a real submit button - var fakeSubmit = document.createElement('input'); - fakeSubmit.setAttribute('type', 'submit'); - fakeSubmit.style.display = 'none'; - var form = context.querySelector('form'); - form.appendChild(fakeSubmit); - fakeSubmit.click(); - - // Seeing issues in smart tv browsers where the form does not get submitted if the button is removed prior to the submission actually happening - setTimeout(function () { - form.removeChild(fakeSubmit); - }, 500); - }); } function reload(context, id) { diff --git a/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.template.html b/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.template.html index 045524aad0..b9caeb23f7 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.template.html +++ b/dashboard-ui/bower_components/emby-webcomponents/recordingcreator/recordingeditor.template.html @@ -4,10 +4,10 @@ ${Edit}
- +
@@ -33,7 +33,7 @@
- ${Save} + \ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/sharing/sharingmenu.js b/dashboard-ui/bower_components/emby-webcomponents/sharing/sharingmenu.js index 3b83d38fea..0753d9c896 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/sharing/sharingmenu.js +++ b/dashboard-ui/bower_components/emby-webcomponents/sharing/sharingmenu.js @@ -1,4 +1,4 @@ -define(['dialogHelper', 'layoutManager', 'globalize', './social-share-kit-1.0.4/dist/js/social-share-kit.min', 'css!./social-share-kit-1.0.4/dist/css/social-share-kit.css'], function (dialogHelper, layoutManager, globalize) { +define(['dialogHelper', 'layoutManager', 'globalize', './social-share-kit-1.0.4/dist/js/social-share-kit.min', 'css!./social-share-kit-1.0.4/dist/css/social-share-kit.css', 'emby-button'], function (dialogHelper, layoutManager, globalize) { function showMenu(options) { @@ -22,7 +22,7 @@ html += ''; html += '
'; - html += '' + globalize.translate('sharedcomponents#ButtonCancel') + ''; + html += ''; html += '
'; dlg.innerHTML = html; diff --git a/dashboard-ui/bower_components/emby-webcomponents/strings/en-US.json b/dashboard-ui/bower_components/emby-webcomponents/strings/en-US.json index 8667d7ab98..3677f24c95 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/strings/en-US.json +++ b/dashboard-ui/bower_components/emby-webcomponents/strings/en-US.json @@ -79,5 +79,6 @@ "ConfirmDeletion": "Confirm Deletion", "MySubtitles": "My Subtitles", "MessageDownloadQueued": "Download queued.", - "EditSubtitles": "Edit Subtitles" + "EditSubtitles": "Edit Subtitles", + "UnlockGuide": "Unlock Guide" } \ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.js b/dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.js index 979aba1afc..17588493cf 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.js +++ b/dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.js @@ -1,4 +1,4 @@ -define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'scrollHelper', 'appStorage', 'connectionManager', 'loading', 'focusManager', 'emby-select', 'listViewStyle', 'paper-icon-button-light', 'css!./../formdialog', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html', 'css!./subtitleeditor'], function (dialogHelper, require, layoutManager, globalize, scrollHelper, appStorage, connectionManager, loading, focusManager) { +define(['dialogHelper', 'require', 'layoutManager', 'globalize', 'scrollHelper', 'appStorage', 'connectionManager', 'loading', 'focusManager', 'emby-select', 'listViewStyle', 'paper-icon-button-light', 'css!./../formdialog', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html', 'css!./subtitleeditor', 'emby-button'], function (dialogHelper, require, layoutManager, globalize, scrollHelper, appStorage, connectionManager, loading, focusManager) { var currentItem; var hasChanges; @@ -400,22 +400,6 @@ }); } - function onSubmitButtonClick(e) { - - // Do a fake form submit this the button isn't a real submit button - var fakeSubmit = document.createElement('input'); - fakeSubmit.setAttribute('type', 'submit'); - fakeSubmit.style.display = 'none'; - var form = parentWithClass(this, 'subtitleSearchForm'); - form.appendChild(fakeSubmit); - fakeSubmit.click(); - - // Seeing issues in smart tv browsers where the form does not get submitted if the button is removed prior to the submission actually happening - setTimeout(function () { - form.removeChild(fakeSubmit); - }, 500); - } - function showEditorInternal(itemId, serverId, template) { hasChanges = false; @@ -469,8 +453,6 @@ dialogHelper.close(dlg); }); - btnSubmit.addEventListener('click', onSubmitButtonClick); - return new Promise(function (resolve, reject) { dlg.addEventListener('close', function () { diff --git a/dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.template.html b/dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.template.html index bbda939706..45a0756d23 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.template.html +++ b/dashboard-ui/bower_components/emby-webcomponents/subtitleeditor/subtitleeditor.template.html @@ -17,7 +17,7 @@ - ${Search} +
diff --git a/dashboard-ui/bower_components/polymer/.bower.json b/dashboard-ui/bower_components/polymer/.bower.json index e3120e6882..4782b3c50f 100644 --- a/dashboard-ui/bower_components/polymer/.bower.json +++ b/dashboard-ui/bower_components/polymer/.bower.json @@ -39,6 +39,6 @@ "commit": "ce5b9fb2d8aa03c698410e2e55cffcfa0b788a3a" }, "_source": "git://github.com/Polymer/polymer.git", - "_target": "^1.1.0", + "_target": "^1.0.0", "_originalSource": "Polymer/polymer" } \ No newline at end of file diff --git a/dashboard-ui/channels.html b/dashboard-ui/channels.html index ef26c643d8..8a4bd375f8 100644 --- a/dashboard-ui/channels.html +++ b/dashboard-ui/channels.html @@ -1,4 +1,4 @@ -
+
diff --git a/dashboard-ui/css/site.css b/dashboard-ui/css/site.css index b0aeb2718d..633d98bd1d 100644 --- a/dashboard-ui/css/site.css +++ b/dashboard-ui/css/site.css @@ -67,6 +67,11 @@ body { overflow-y: auto !important; } +.mainAnimatedPage { + /* Have to override because it breaks scrolling when dependant on window scroll */ + contain: style !important; +} + iron-icon { min-width: 24px; min-height: 24px; @@ -748,6 +753,6 @@ emby-collapsible > .style-scope { padding: 1em 1.25em; } -#editItemMetadataPage #txtOverview .paper-input-input { - max-height: 90px; +#editItemMetadataPage #txtOverview .paper-input-input { + max-height: 90px; } diff --git a/dashboard-ui/home.html b/dashboard-ui/home.html index 3473e329da..69c00b884d 100644 --- a/dashboard-ui/home.html +++ b/dashboard-ui/home.html @@ -1,4 +1,4 @@ -
+
diff --git a/dashboard-ui/movies.html b/dashboard-ui/movies.html index fdbbf787fa..d355dca131 100644 --- a/dashboard-ui/movies.html +++ b/dashboard-ui/movies.html @@ -1,4 +1,4 @@ -
+
diff --git a/dashboard-ui/music.html b/dashboard-ui/music.html index 17a95fd960..f2067c60f9 100644 --- a/dashboard-ui/music.html +++ b/dashboard-ui/music.html @@ -1,4 +1,4 @@ -
+
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js index 2105d4ca11..4fc5467dd4 100644 --- a/dashboard-ui/scripts/site.js +++ b/dashboard-ui/scripts/site.js @@ -1479,6 +1479,7 @@ var AppInfo = {}; } AppInfo.supportsExternalPlayers = true; + AppInfo.enableAppLayouts = true; if (isCordova) { AppInfo.enableAppLayouts = true; @@ -1775,6 +1776,7 @@ var AppInfo = {}; define("libjass", [bowerPath + "/libjass/libjass", "css!" + bowerPath + "/libjass/libjass"], returnFirstDependency); + define("emby-button", [embyWebComponentsBowerPath + "/emby-button/emby-button"], returnFirstDependency); define("emby-input", [embyWebComponentsBowerPath + "/emby-input/emby-input"], returnFirstDependency); define("emby-select", [embyWebComponentsBowerPath + "/emby-select/emby-select"], returnFirstDependency); define("collectionEditor", [embyWebComponentsBowerPath + "/collectioneditor/collectioneditor"], returnFirstDependency); diff --git a/dashboard-ui/thirdparty/paper-button-style.css b/dashboard-ui/thirdparty/paper-button-style.css index f5e8be3ec3..92dff1b2c6 100644 --- a/dashboard-ui/thirdparty/paper-button-style.css +++ b/dashboard-ui/thirdparty/paper-button-style.css @@ -129,6 +129,114 @@ paper-button.iconRight iron-icon { top: 5px; } +button[is="emby-button"].blue { + color: #03a9f4; +} + + button[is="emby-button"].blue:hover { + background: #e1f5f3; + } + +button[is="emby-button"].menuButton { + color: #212121; + text-align: left; +} + + button[is="emby-button"].menuButton:hover { + background: #e1f5f3; + } + + +button[is="emby-button"].submit { + color: #52B54B; +} + +button[is="emby-button"].raised.submit, button[is="emby-button"].raised:not(.subdued):not(.cancel) { + background: #52B54B; + color: #fff; +} + +button[is="emby-button"].more { + color: #EC407A; +} + +button[is="emby-button"].raised.more { + background: #EC407A; + color: #fff; +} + +button[is="emby-button"].secondary { + color: #4285f4; +} + +button[is="emby-button"].raised.secondary { + background: #4285f4; + color: #fff; +} + +button[is="emby-button"].accent { + color: #52B54B; +} + +button[is="emby-button"].raised.accent { + background: #52B54B; + color: #fff; +} + +button[is="emby-button"].alt { + color: #F57F17; +} + +button[is="emby-button"].raised.alt { + background: #F57F17; + color: #fff; +} + +.ui-body-b button[is="emby-button"].cancel { + color: #444; +} + +.ui-body-b button[is="emby-button"].raised.cancel { + background: #444; + color: #fff; +} + +button[is="emby-button"].cancelDark { + color: #444; +} + +button[is="emby-button"].raised.cancelDark { + background: #444; + color: #fff; +} + +.ui-body-b button[is="emby-button"].subdued:not([disabled]) { + color: #404040; +} + +.ui-body-b button[is="emby-button"].raised.subdued:not([disabled]) { + background: #404040; + color: #fff; +} + +.ui-body-b button[is="emby-button"].raised[disabled].subduedd { + background: #111; +} + +button[is="emby-button"] span { + vertical-align: middle; +} + +button[is="emby-button"]:not(.iconRight) > iron-icon { + margin-right: .5em; +} + +button[is="emby-button"].iconRight iron-icon { + position: absolute; + right: 5px; + top: 5px; +} + .clearButton { background: transparent; border: 0; @@ -149,6 +257,23 @@ paper-button.iconRight iron-icon { color: inherit !important; } +button[is="emby-button"].mini { + min-width: initial; +} + +button[is="emby-button"].mini { + padding: 0.4em 0.7em; +} + + button[is="emby-button"].mini.noIcon { + padding: 0.4em 0.7em; + } + + button[is="emby-button"].mini iron-icon { + height: 20px; + width: 20px; + } + paper-button.mini { min-width: initial; } @@ -166,7 +291,6 @@ paper-button.mini { width: 20px; } - paper-toast { z-index: 9999999; } @@ -184,6 +308,19 @@ paper-button.notext { margin-right: 0; } +button[is="emby-button"].notext { + min-width: 2.8em; +} + + button[is="emby-button"].notext .content { + padding-left: 0 !important; + padding-right: 0 !important; + } + + button[is="emby-button"].notext iron-icon { + margin-right: 0; + } + paper-icon-button paper-ripple { color: inherit !important; } @@ -404,9 +541,9 @@ paper-input label, paper-textarea label { color: #656565; } -.ui-body-a .inputLabel.focused:not(.blank) { - color: green; -} + .ui-body-a .inputLabel.focused:not(.blank) { + color: green; + } .ui-body-b .selectLabelUnfocused, .ui-body-b .inputLabel { color: #ccc; @@ -498,7 +635,7 @@ div.dialogHeader { margin-top: .7em; } -.dialogHeader paper-button { +.dialogHeader paper-button, .dialogHeader button { margin-top: 0; margin-bottom: 0; } diff --git a/dashboard-ui/tv.html b/dashboard-ui/tv.html index 52ca2a7779..35581be1fc 100644 --- a/dashboard-ui/tv.html +++ b/dashboard-ui/tv.html @@ -1,4 +1,4 @@ -
+