diff --git a/dashboard-ui/bower_components/emby-webcomponents/.bower.json b/dashboard-ui/bower_components/emby-webcomponents/.bower.json index 341c82e685..dcaa9f0f8d 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/.bower.json +++ b/dashboard-ui/bower_components/emby-webcomponents/.bower.json @@ -14,12 +14,12 @@ }, "devDependencies": {}, "ignore": [], - "version": "1.4.166", - "_release": "1.4.166", + "version": "1.4.167", + "_release": "1.4.167", "_resolution": { "type": "version", - "tag": "1.4.166", - "commit": "869fe388b2e0bd01bee868001f9e1d456a2c7ca1" + "tag": "1.4.167", + "commit": "03c12f1c7360d863dc0ec55491a292a3f64fb400" }, "_source": "https://github.com/MediaBrowser/emby-webcomponents.git", "_target": "^1.2.1", diff --git a/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js b/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js index 93ca3d7dee..267ef95aec 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js +++ b/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js @@ -34,8 +34,9 @@ function getPosition(options, dlg) { - var windowHeight = window.innerHeight; - var windowWidth = window.innerWidth; + var windowSize = dom.getWindowSize(); + var windowHeight = windowSize.innerHeight; + var windowWidth = windowSize.innerWidth; if (windowHeight < 540) { return null; @@ -125,7 +126,7 @@ // Admittedly a hack but right now the scrollbar is being factored into the width which is causing truncation if (options.items.length > 20) { - var minWidth = window.innerWidth >= 300 ? 240 : 200; + var minWidth = dom.getWindowSize().innerWidth >= 300 ? 240 : 200; style += "min-width:" + minWidth + "px;"; } diff --git a/dashboard-ui/bower_components/emby-webcomponents/backdrop/backdrop.js b/dashboard-ui/bower_components/emby-webcomponents/backdrop/backdrop.js index 74c39b2ca3..864c1144ca 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/backdrop/backdrop.js +++ b/dashboard-ui/bower_components/emby-webcomponents/backdrop/backdrop.js @@ -1,4 +1,4 @@ -define(['browser', 'connectionManager', 'playbackManager', 'css!./style'], function (browser, connectionManager, playbackManager) { +define(['browser', 'connectionManager', 'playbackManager', 'dom', 'css!./style'], function (browser, connectionManager, playbackManager, dom) { function enableAnimation(elem) { @@ -178,14 +178,6 @@ currentLoadingBackdrop = instance; } - var windowWidth; - function resetWindowSize() { - windowWidth = screen.availWidth || window.innerWidth; - } - window.addEventListener("orientationchange", resetWindowSize); - window.addEventListener('resize', resetWindowSize); - resetWindowSize(); - function getItemImageUrls(item) { var apiClient = connectionManager.getApiClient(item.ServerId); @@ -197,7 +189,7 @@ return apiClient.getScaledImageUrl(item.Id, { type: "Backdrop", tag: imgTag, - maxWidth: Math.min(windowWidth, 1920), + maxWidth: Math.min(dom.getWindowSize().innerWidth, 1920), index: index }); }); @@ -210,7 +202,7 @@ return apiClient.getScaledImageUrl(item.ParentBackdropItemId, { type: "Backdrop", tag: imgTag, - maxWidth: Math.min(windowWidth, 1920), + maxWidth: Math.min(dom.getWindowSize().innerWidth, 1920), index: index }); }); diff --git a/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/cardbuilder.js b/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/cardbuilder.js index c515146f49..d85c9f6816 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/cardbuilder.js +++ b/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/cardbuilder.js @@ -1,5 +1,5 @@ -define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'mediaInfo', 'focusManager', 'indicators', 'globalize', 'layoutManager', 'apphost', 'emby-button', 'css!./card', 'paper-icon-button-light', 'clearButtonStyle'], - function (datetime, imageLoader, connectionManager, itemHelper, mediaInfo, focusManager, indicators, globalize, layoutManager, appHost) { +define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'mediaInfo', 'focusManager', 'indicators', 'globalize', 'layoutManager', 'apphost', 'dom', 'emby-button', 'css!./card', 'paper-icon-button-light', 'clearButtonStyle'], + function (datetime, imageLoader, connectionManager, itemHelper, mediaInfo, focusManager, indicators, globalize, layoutManager, appHost, dom) { // Regular Expressions for parsing tags and attributes var SURROGATE_PAIR_REGEXP = /[\uD800-\uDBFF][\uDC00-\uDFFF]/g, @@ -118,7 +118,7 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'mediaInfo function getImageWidth(shape) { - var screenWidth = window.innerWidth; + var screenWidth = dom.getWindowSize().innerWidth; if (isResizable(screenWidth)) { var roundScreenTo = 100; diff --git a/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/roundcard.css b/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/roundcard.css index df2d9b9674..d1cfed7b7b 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/roundcard.css +++ b/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/roundcard.css @@ -1,5 +1,8 @@ .cardBox-round { - border: .7em solid transparent; + border: .7em solid transparent !important; + transition: transform 180ms ease-out !important; + -webkit-transform-origin: center center; + transform-origin: center center; } .cardImageContainer-round { @@ -10,12 +13,6 @@ border-color: #fff; } -.cardBox-round { - transition: transform 180ms ease-out !important; - -webkit-transform-origin: center center; - transform-origin: center center; -} - .layout-tv .card-round:focus .cardBox { transform: scale(1.34, 1.34); } @@ -26,4 +23,4 @@ .cardImageContainer-round, .card-round .cardImage { border-radius: 1000px; -} \ No newline at end of file +} diff --git a/dashboard-ui/bower_components/emby-webcomponents/dialoghelper/dialoghelper.js b/dashboard-ui/bower_components/emby-webcomponents/dialoghelper/dialoghelper.js index 507f7e489c..57a68356ee 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/dialoghelper/dialoghelper.js +++ b/dashboard-ui/bower_components/emby-webcomponents/dialoghelper/dialoghelper.js @@ -284,6 +284,8 @@ if (!dlg.classList.contains('hide')) { var onAnimationFinish = function () { + focusManager.popScope(dlg); + dlg.classList.add('hide'); if (dlg.close) { dlg.close(); @@ -319,6 +321,7 @@ function animateDialogOpen(dlg) { var onAnimationFinish = function () { + focusManager.pushScope(dlg); if (dlg.getAttribute('data-autofocus') == 'true') { autoFocus(dlg); } diff --git a/dashboard-ui/bower_components/emby-webcomponents/dom.js b/dashboard-ui/bower_components/emby-webcomponents/dom.js index 09d06a953a..00f0d0949a 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/dom.js +++ b/dashboard-ui/bower_components/emby-webcomponents/dom.js @@ -70,11 +70,30 @@ define([], function () { target.removeEventListener(type, handler, optionsOrCapture); } + var windowSize; + function resetWindowSize() { + windowSize = { + innerHeight: window.innerHeight, + innerWidth: window.innerWidth + }; + } + + function getWindowSize() { + if (!windowSize) { + resetWindowSize(); + addEventListenerWithOptions(window, "orientationchange", resetWindowSize, { passive: true }); + addEventListenerWithOptions(window, 'resize', resetWindowSize, { passive: true }); + } + + return windowSize; + } + return { parentWithAttribute: parentWithAttribute, parentWithClass: parentWithClass, parentWithTag: parentWithTag, addEventListener: addEventListenerWithOptions, - removeEventListener: removeEventListenerWithOptions + removeEventListener: removeEventListenerWithOptions, + getWindowSize: getWindowSize }; }); \ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/focusmanager.js b/dashboard-ui/bower_components/emby-webcomponents/focusmanager.js index 3ae397f1ef..e5370a4788 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/focusmanager.js +++ b/dashboard-ui/bower_components/emby-webcomponents/focusmanager.js @@ -1,5 +1,17 @@ define(['dom'], function (dom) { + var scopes = []; + function pushScope(elem) { + scopes.push(elem); + } + + function popScope(elem) { + + if (scopes.length) { + scopes.length -= 1; + } + } + function autoFocus(view, defaultToFirst, findAutoFocusElement) { var element; @@ -34,7 +46,14 @@ define(['dom'], function (dom) { var focusableTagNames = ['INPUT', 'TEXTAREA', 'SELECT', 'BUTTON', 'A']; var focusableContainerTagNames = ['BODY', 'DIALOG']; - var focusableQuery = focusableTagNames.join(',') + ',.focusable'; + var focusableQuery = focusableTagNames.map(function (t) { + + if (t == 'INPUT') { + t += ':not([type="range"])'; + } + return t + ':not([tabindex="-1"]):not(:disabled)'; + + }).join(',') + ',.focusable'; function isFocusable(elem) { @@ -62,6 +81,17 @@ define(['dom'], function (dom) { return elem; } + // Determines if a focusable element can be focused at a given point in time + function isCurrentlyFocusableInternal(elem) { + + // http://stackoverflow.com/questions/19669786/check-if-element-is-visible-in-dom + if (elem.offsetParent === null) { + return false; + } + + return true; + } + // Determines if a focusable element can be focused at a given point in time function isCurrentlyFocusable(elem) { @@ -73,11 +103,6 @@ define(['dom'], function (dom) { return false; } - // http://stackoverflow.com/questions/19669786/check-if-element-is-visible-in-dom - if (elem.offsetParent === null) { - return false; - } - if (elem.tagName == 'INPUT') { var type = elem.type; if (type == 'range') { @@ -85,18 +110,22 @@ define(['dom'], function (dom) { } } - return true; + return isCurrentlyFocusableInternal(elem); + } + + function getDefaultScope() { + return scopes[0] || document.body; } function getFocusableElements(parent) { - var elems = (parent || document.body).querySelectorAll(focusableQuery); + var elems = (parent || getDefaultScope()).querySelectorAll(focusableQuery); var focusableElements = []; for (var i = 0, length = elems.length; i < length; i++) { var elem = elems[i]; - if (isCurrentlyFocusable(elem)) { + if (isCurrentlyFocusableInternal(elem)) { focusableElements.push(elem); } } @@ -132,7 +161,7 @@ define(['dom'], function (dom) { elem = elem.parentNode; if (!elem) { - return document.body; + return getDefaultScope(); } } @@ -192,7 +221,7 @@ define(['dom'], function (dom) { activeElement = focusableParent(activeElement); } - var container = activeElement ? getFocusContainer(activeElement, direction) : document.body; + var container = activeElement ? getFocusContainer(activeElement, direction) : getDefaultScope(); if (!activeElement) { autoFocus(container, true, false); @@ -218,9 +247,9 @@ define(['dom'], function (dom) { continue; } - if (!isCurrentlyFocusable(curr)) { - continue; - } + //if (!isCurrentlyFocusableInternal(curr)) { + // continue; + //} var elementRect = getViewportBoundingClientRect(curr, windowData); @@ -415,6 +444,8 @@ define(['dom'], function (dom) { nav(sourceElement, 3); }, sendText: sendText, - isCurrentlyFocusable: isCurrentlyFocusable + isCurrentlyFocusable: isCurrentlyFocusable, + pushScope: pushScope, + popScope: popScope }; }); \ No newline at end of file diff --git a/dashboard-ui/bower_components/emby-webcomponents/images/imagehelper.js b/dashboard-ui/bower_components/emby-webcomponents/images/imagehelper.js index e9c03a53e9..eb4af9bb3c 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/images/imagehelper.js +++ b/dashboard-ui/bower_components/emby-webcomponents/images/imagehelper.js @@ -2,7 +2,6 @@ define(['visibleinviewport', 'imageFetcher', 'layoutManager', 'events', 'browser var thresholdX; var thresholdY; - var windowSize; var supportsIntersectionObserver = function () { @@ -20,37 +19,28 @@ define(['visibleinviewport', 'imageFetcher', 'layoutManager', 'events', 'browser return false; }(); - function resetWindowSize() { - windowSize = { - innerHeight: window.innerHeight, - innerWidth: window.innerWidth - }; - } - function resetThresholds() { var x = screen.availWidth; var y = screen.availHeight; - if (layoutManager.mobile) { + if (browser.touch) { x *= 2; y *= 2; } thresholdX = x; thresholdY = y; - resetWindowSize(); } if (!supportsIntersectionObserver) { - window.addEventListener("orientationchange", resetThresholds); - window.addEventListener('resize', resetThresholds); - events.on(layoutManager, 'modechange', resetThresholds); + dom.addEventListener(window, "orientationchange", resetThresholds, { passive: true }); + dom.addEventListener(window, 'resize', resetThresholds, { passive: true }); resetThresholds(); } function isVisible(elem) { - return visibleinviewport(elem, true, thresholdX, thresholdY, windowSize); + return visibleinviewport(elem, true, thresholdX, thresholdY); } var wheelEvent = (document.implementation.hasFeature('Event.wheel', '3.0') ? 'wheel' : 'mousewheel'); diff --git a/dashboard-ui/bower_components/emby-webcomponents/visibleinviewport.js b/dashboard-ui/bower_components/emby-webcomponents/visibleinviewport.js index c89a6bdee2..645af61c63 100644 --- a/dashboard-ui/bower_components/emby-webcomponents/visibleinviewport.js +++ b/dashboard-ui/bower_components/emby-webcomponents/visibleinviewport.js @@ -1,4 +1,4 @@ -define([], function () { +define(['dom'], function (dom) { /** * Copyright 2012, Digital Fusion @@ -19,10 +19,7 @@ return true; } - windowSize = windowSize || { - innerHeight: window.innerHeight, - innerWidth: window.innerWidth - }; + windowSize = windowSize || dom.getWindowSize(); var vpWidth = windowSize.innerWidth, vpHeight = windowSize.innerHeight; diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js index d4e665ec88..5a0e8bcb00 100644 --- a/dashboard-ui/scripts/site.js +++ b/dashboard-ui/scripts/site.js @@ -2865,7 +2865,11 @@ var AppInfo = {}; if (!browserInfo.tv && !AppInfo.isNativeApp) { if (navigator.serviceWorker) { - navigator.serviceWorker.register('serviceworker.js'); + try { + navigator.serviceWorker.register('serviceworker.js'); + } catch (err) { + console.log('Error registering serviceWorker: ' + err); + } } if (window.Notification) {