diff --git a/src/components/apphost.js b/src/components/apphost.js index b1b1c30dc9..c03ae0bce8 100644 --- a/src/components/apphost.js +++ b/src/components/apphost.js @@ -168,23 +168,25 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet return false; } - var savedResult = appSettings.get(htmlMediaAutoplayAppStorageKey); - return "true" === savedResult || "false" !== savedResult && null; + return true; } - function cueSupported() { + function supportsCue() { try { var video = document.createElement("video"); var style = document.createElement("style"); + style.textContent = "video::cue {background: inherit}"; document.body.appendChild(style); document.body.appendChild(video); + var cue = window.getComputedStyle(video, "::cue").background; document.body.removeChild(style); document.body.removeChild(video); + return !!cue.length; } catch (err) { - console.log("Error detecting cue support:" + err); + console.log("error detecting cue support: " + err); return false; } } @@ -204,8 +206,6 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet } } - var htmlMediaAutoplayAppStorageKey = "supportshtmlmediaautoplay0"; - var supportedFeatures = function () { var features = []; @@ -280,7 +280,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet //features.push("multiserver"); features.push("screensaver"); - if (!browser.orsay && !browser.tizen && !browser.msie && (browser.firefox || browser.ps4 || browser.edge || cueSupported())) { + if (!browser.orsay && !browser.tizen && !browser.msie && (browser.firefox || browser.ps4 || browser.edge || supportsCue())) { features.push("subtitleappearancesettings"); } @@ -299,18 +299,6 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet return features; }(); - if (supportedFeatures.indexOf("htmlvideoautoplay") === -1 && supportsHtmlMediaAutoplay() !== false) { - require(["autoPlayDetect"], function (autoPlayDetect) { - autoPlayDetect.supportsHtmlMediaAutoplay().then(function () { - appSettings.set(htmlMediaAutoplayAppStorageKey, "true"); - supportedFeatures.push("htmlvideoautoplay"); - supportedFeatures.push("htmlaudioautoplay"); - }, function () { - appSettings.set(htmlMediaAutoplayAppStorageKey, "false"); - }); - }); - } - var deviceId; var deviceName; var appName = "Jellyfin Web"; @@ -395,7 +383,9 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet } } }; + var doc = self.document; + var isHidden = false; if (doc) { if (void 0 !== doc.visibilityState) { @@ -419,8 +409,6 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet } } - var isHidden = false; - if (doc) { doc.addEventListener(visibilityChange, function () { if (document[visibilityState]) { diff --git a/src/components/htmlvideoplayer/plugin.js b/src/components/htmlvideoplayer/plugin.js index 6f1ea2b110..d2f9632adb 100644 --- a/src/components/htmlvideoplayer/plugin.js +++ b/src/components/htmlvideoplayer/plugin.js @@ -1403,7 +1403,6 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa dlg.classList.add('videoPlayerContainer'); if (options.backdropUrl) { - dlg.classList.add('videoPlayerContainer-withBackdrop'); dlg.style.backgroundImage = "url('" + options.backdropUrl + "')"; } @@ -1412,11 +1411,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa dlg.classList.add('videoPlayerContainer-onTop'); } - // playsinline new for iOS 10 - // https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_0.html - var html = ''; - var cssClass = 'htmlvideoplayer'; if (!browser.chromecast) { @@ -1451,7 +1446,6 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa self._mediaElement = videoElement; if (mediaManager) { - if (!mediaManager.embyInit) { initMediaManager(); mediaManager.embyInit = true; @@ -1467,9 +1461,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa } else { resolve(videoElement); } - }); - } else { if (options.backdropUrl) { dlg.classList.add('videoPlayerContainer-withBackdrop'); diff --git a/src/components/layoutManager.js b/src/components/layoutManager.js index 1059bf5758..21bcdf5933 100644 --- a/src/components/layoutManager.js +++ b/src/components/layoutManager.js @@ -2,7 +2,6 @@ define(['browser', 'appSettings', 'events'], function (browser, appSettings, eve 'use strict'; function setLayout(instance, layout, selectedLayout) { - if (layout === selectedLayout) { instance[layout] = true; document.documentElement.classList.add('layout-' + layout); @@ -38,7 +37,6 @@ define(['browser', 'appSettings', 'events'], function (browser, appSettings, eve }; LayoutManager.prototype.getSavedLayout = function (layout) { - return appSettings.get('layout'); }; @@ -64,4 +62,4 @@ define(['browser', 'appSettings', 'events'], function (browser, appSettings, eve }; return new LayoutManager(); -}); \ No newline at end of file +}); diff --git a/src/components/playback/autoplaydetect.js b/src/components/playback/autoplaydetect.js deleted file mode 100644 index 3610eef2ab..0000000000 --- a/src/components/playback/autoplaydetect.js +++ /dev/null @@ -1,61 +0,0 @@ -define([], function () { - 'use strict'; - - function supportsHtmlMediaAutoplay() { - - return new Promise(function (resolve, reject) { - - var timeout; - var elem = document.createElement('video'); - var elemStyle = elem.style; - //skip the test if video itself, or the autoplay - //element on it isn't supported - if (!('autoplay' in elem)) { - reject(); - return; - } - elemStyle.position = 'absolute'; - elemStyle.height = 0; - elemStyle.width = 0; - - elem.setAttribute('autoplay', 'autoplay'); - elem.style.display = 'none'; - document.body.appendChild(elem); - - var testAutoplay = function (arg) { - clearTimeout(timeout); - elem.removeEventListener('playing', testAutoplay); - elem.removeEventListener('play', testAutoplay); - var supported = (arg && arg.type === 'playing') || (arg && arg.type === 'play') || elem.currentTime !== 0; - elem.parentNode.removeChild(elem); - - if (supported) { - resolve(); - } else { - reject(); - } - }; - - // play needed for firefox - elem.addEventListener('play', testAutoplay); - elem.addEventListener('playing', testAutoplay); - - try { - elem.src = 'data:video/mp4;base64,AAAAHGZ0eXBtcDQyAAAAAG1wNDJpc29tYXZjMQAAAz5tb292AAAAbG12aGQAAAAAzaNacc2jWnEAAV+QAAFfkAABAAABAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACAAAAGGlvZHMAAAAAEICAgAcAT////3//AAACQ3RyYWsAAABcdGtoZAAAAAHNo1pxzaNacQAAAAEAAAAAAAFfkAAAAAAAAAAAAAAAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAEAAAAAAEAAAABAAAAAAAd9tZGlhAAAAIG1kaGQAAAAAzaNacc2jWnEAAV+QAAFfkFXEAAAAAAAhaGRscgAAAAAAAAAAdmlkZQAAAAAAAAAAAAAAAAAAAAGWbWluZgAAABR2bWhkAAAAAQAAAAAAAAAAAAAAJGRpbmYAAAAcZHJlZgAAAAAAAAABAAAADHVybCAAAAABAAABVnN0YmwAAACpc3RzZAAAAAAAAAABAAAAmWF2YzEAAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAEAAQAEgAAABIAAAAAAAAAAEOSlZUL0FWQyBDb2RpbmcAAAAAAAAAAAAAAAAAAAAAAAAY//8AAAAxYXZjQwH0AAr/4QAZZ/QACq609NQYBBkAAAMAAQAAAwAKjxImoAEABWjOAa8gAAAAEmNvbHJuY2xjAAYAAQAGAAAAGHN0dHMAAAAAAAAAAQAAAAUAAEZQAAAAKHN0c3oAAAAAAAAAAAAAAAUAAAIqAAAACAAAAAgAAAAIAAAACAAAAChzdHNjAAAAAAAAAAIAAAABAAAABAAAAAEAAAACAAAAAQAAAAEAAAAYc3RjbwAAAAAAAAACAAADYgAABaQAAAAUc3RzcwAAAAAAAAABAAAAAQAAABFzZHRwAAAAAAREREREAAAAb3VkdGEAAABnbWV0YQAAAAAAAAAhaGRscgAAAAAAAAAAbWRpcgAAAAAAAAAAAAAAAAAAAAA6aWxzdAAAADKpdG9vAAAAKmRhdGEAAAABAAAAAEhhbmRCcmFrZSAwLjkuOCAyMDEyMDcxODAwAAACUm1kYXQAAAHkBgX/4NxF6b3m2Ui3lizYINkj7u94MjY0IC0gY29yZSAxMjAgLSBILjI2NC9NUEVHLTQgQVZDIGNvZGVjIC0gQ29weWxlZnQgMjAwMy0yMDExIC0gaHR0cDovL3d3dy52aWRlb2xhbi5vcmcveDI2NC5odG1sIC0gb3B0aW9uczogY2FiYWM9MCByZWY9MSBkZWJsb2NrPTE6MDowIGFuYWx5c2U9MHgxOjAgbWU9ZXNhIHN1Ym1lPTkgcHN5PTAgbWl4ZWRfcmVmPTAgbWVfcmFuZ2U9NCBjaHJvbWFfbWU9MSB0cmVsbGlzPTAgOHg4ZGN0PTAgY3FtPTAgZGVhZHpvbmU9MjEsMTEgZmFzdF9wc2tpcD0wIGNocm9tYV9xcF9vZmZzZXQ9MCB0aHJlYWRzPTYgc2xpY2VkX3RocmVhZHM9MCBucj0wIGRlY2ltYXRlPTEgaW50ZXJsYWNlZD0wIGJsdXJheV9jb21wYXQ9MCBjb25zdHJhaW5lZF9pbnRyYT0wIGJmcmFtZXM9MCB3ZWlnaHRwPTAga2V5aW50PTUwIGtleWludF9taW49NSBzY2VuZWN1dD00MCBpbnRyYV9yZWZyZXNoPTAgcmM9Y3FwIG1idHJlZT0wIHFwPTAAgAAAAD5liISscR8A+E4ACAACFoAAITAAAgsAAPgYCoKgoC+L4vi+KAvi+L4YfAEAACMzgABF9AAEUGUgABDJiXnf4AAAAARBmiKUAAAABEGaQpQAAAAEQZpilAAAAARBmoKU'; - var promise = elem.play(); - if (promise && promise.catch) { - promise.catch(reject); - } - - timeout = setTimeout(testAutoplay, 500); - } catch (e) { - reject(); - return; - } - }); - } - - return { - supportsHtmlMediaAutoplay: supportsHtmlMediaAutoplay - }; -}); \ No newline at end of file diff --git a/src/components/usersettings/usersettings.js b/src/components/usersettings/usersettings.js deleted file mode 100644 index 6b3dc90d49..0000000000 --- a/src/components/usersettings/usersettings.js +++ /dev/null @@ -1,5 +0,0 @@ -define(['userSettingsBuilder'], function (userSettingsBuilder) { - 'use strict'; - - return new userSettingsBuilder(); -}); \ No newline at end of file diff --git a/src/elements/emby-input/emby-input.css b/src/elements/emby-input/emby-input.css index 65fa4ddee6..176f8874e8 100644 --- a/src/elements/emby-input/emby-input.css +++ b/src/elements/emby-input/emby-input.css @@ -2,18 +2,14 @@ display: block; margin: 0; margin-bottom: 0 !important; - - /* Remove select styling */ - - /* Font size must the 16px or larger to prevent iOS page zoom on focus */ - font-size: 110%; - - /* General select styles: change as needed */ font-family: inherit; font-weight: inherit; padding: 0.4em 0.25em; - /* Prevent padding from causing width overflow */ + /* must the 16px or larger to prevent iOS page zoom on focus */ + font-size: 110%; + + /* prevent padding from causing width overflow */ -webkit-box-sizing: border-box; box-sizing: border-box; outline: none !important; diff --git a/src/components/appSettings.js b/src/scripts/settings/appSettings.js similarity index 99% rename from src/components/appSettings.js rename to src/scripts/settings/appSettings.js index d1a981148c..bd91786f87 100644 --- a/src/components/appSettings.js +++ b/src/scripts/settings/appSettings.js @@ -10,13 +10,13 @@ define(['appStorage', 'events'], function (appStorage, events) { } function AppSettings() { - } AppSettings.prototype.enableAutoLogin = function (val) { if (val != null) { this.set('enableAutoLogin', val.toString()); } + return this.get('enableAutoLogin') !== 'false'; }; @@ -132,4 +132,4 @@ define(['appStorage', 'events'], function (appStorage, events) { }; return new AppSettings(); -}); \ No newline at end of file +}); diff --git a/src/components/usersettings/usersettingsbuilder.js b/src/scripts/settings/userSettings.js similarity index 99% rename from src/components/usersettings/usersettingsbuilder.js rename to src/scripts/settings/userSettings.js index f852dacc43..4105a8611e 100644 --- a/src/components/usersettings/usersettingsbuilder.js +++ b/src/scripts/settings/userSettings.js @@ -242,5 +242,5 @@ define(['appSettings', 'events'], function (appSettings, events) { return this.get(key, true); }; - return UserSettings; + return new UserSettings(); }); diff --git a/src/scripts/site.js b/src/scripts/site.js index d7c3a1c8a4..9d7757d344 100644 --- a/src/scripts/site.js +++ b/src/scripts/site.js @@ -315,6 +315,14 @@ var AppInfo = {}; return "components"; } + function getElementsPath() { + return "elements" + } + + function getScriptsPath() { + return "scripts" + } + function getPlaybackManager(playbackManager) { window.addEventListener("beforeunload", function () { try { @@ -650,8 +658,12 @@ var AppInfo = {}; (function () { var urlArgs = "v=" + (window.dashboardVersion || new Date().getDate()); + var bowerPath = getBowerPath(); var componentsPath = getComponentsPath(); + var elementsPath = getElementsPath(); + var scriptsPath = getScriptsPath(); + var paths = { browserdeviceprofile: "scripts/browserdeviceprofile", browser: "scripts/browser", @@ -672,7 +684,6 @@ var AppInfo = {}; itemHelper: componentsPath + "/itemhelper", itemShortcuts: componentsPath + "/shortcuts", playQueueManager: componentsPath + "/playback/playqueuemanager", - autoPlayDetect: componentsPath + "/playback/autoplaydetect", nowPlayingHelper: componentsPath + "/playback/nowplayinghelper", pluginManager: componentsPath + "/pluginManager", packageManager: componentsPath + "/packagemanager", @@ -765,7 +776,6 @@ var AppInfo = {}; return queryString; }); - var elementsPath = "elements" define("emby-button", [elementsPath + "/emby-button/emby-button"], returnFirstDependency); define("paper-icon-button-light", [elementsPath + "/emby-button/paper-icon-button-light"], returnFirstDependency); define("emby-checkbox", [elementsPath + "/emby-checkbox/emby-checkbox"], returnFirstDependency); @@ -778,6 +788,9 @@ var AppInfo = {}; define("emby-textarea", [elementsPath + "/emby-textarea/emby-textarea"], returnFirstDependency); define("emby-toggle", [elementsPath + "/emby-toggle/emby-toggle"], returnFirstDependency); + define("appSettings", [scriptsPath + "/settings/appSettings"], returnFirstDependency); + define("userSettings", [scriptsPath + "/settings/userSettings"], returnFirstDependency); + define("chromecastHelper", [componentsPath + "/chromecast/chromecasthelpers"], returnFirstDependency); define("mediaSession", [componentsPath + "/playback/mediasession"], returnFirstDependency); define("actionsheet", [componentsPath + "/actionsheet/actionsheet"], returnFirstDependency); @@ -865,9 +878,6 @@ var AppInfo = {}; define("toast", [componentsPath + "/toast/toast"], returnFirstDependency); define("scrollHelper", [componentsPath + "/scrollhelper"], returnFirstDependency); define("touchHelper", [componentsPath + "/touchhelper"], returnFirstDependency); - define("appSettings", [componentsPath + "/appSettings"], returnFirstDependency); - define("userSettings", [componentsPath + "/usersettings/usersettings"], returnFirstDependency); - define("userSettingsBuilder", [componentsPath + "/usersettings/usersettingsbuilder", "layoutManager", "browser"], returnFirstDependency); define("imageUploader", [componentsPath + "/imageuploader/imageuploader"], returnFirstDependency); define("htmlMediaHelper", [componentsPath + "/htmlMediaHelper"], returnFirstDependency); define("viewContainer", [componentsPath + "/viewContainer"], returnFirstDependency); diff --git a/src/themes/appletv/theme.css b/src/themes/appletv/theme.css index 789371c454..9c3bc803ec 100644 --- a/src/themes/appletv/theme.css +++ b/src/themes/appletv/theme.css @@ -255,9 +255,9 @@ html { .emby-textarea { color: inherit; background: rgba(255, 255, 255, 0.9); - border: 0.07em solid rgba(0, 0, 0, 0.158); - -webkit-border-radius: 0.15em; - border-radius: 0.15em; + border: 0.16em solid rgba(0, 0, 0, 0.158); + -webkit-border-radius: 0.2em; + border-radius: 0.2em; } .emby-input:focus, diff --git a/src/themes/blueradiance/theme.css b/src/themes/blueradiance/theme.css index 75c7219544..b1979e4901 100644 --- a/src/themes/blueradiance/theme.css +++ b/src/themes/blueradiance/theme.css @@ -252,9 +252,9 @@ html { .emby-textarea { color: inherit; background: rgba(0, 0, 0, 0.5); - border: 0.07em solid transparent; - -webkit-border-radius: 0.15em; - border-radius: 0.15em; + border: 0.16em solid transparent; + -webkit-border-radius: 0.2em; + border-radius: 0.2em; } .emby-input:focus, diff --git a/src/themes/dark/theme.css b/src/themes/dark/theme.css index a339c71861..4912e591c7 100644 --- a/src/themes/dark/theme.css +++ b/src/themes/dark/theme.css @@ -226,9 +226,9 @@ html { .emby-textarea { color: inherit; background: #292929; - border: 0.07em solid #292929; - -webkit-border-radius: 0.15em; - border-radius: 0.15em; + border: 0.16em solid #292929; + -webkit-border-radius: 0.2em; + border-radius: 0.2em; } .emby-input:focus, diff --git a/src/themes/emby/theme.css b/src/themes/emby/theme.css index 134bd61788..ba0699cc65 100644 --- a/src/themes/emby/theme.css +++ b/src/themes/emby/theme.css @@ -225,8 +225,8 @@ html { .emby-textarea { color: inherit; background: #292929; - border: 0.07em solid #292929; - border-radius: 0.15em; + border: 0.16em solid #292929; + border-radius: 0.2em; } .emby-input:focus, diff --git a/src/themes/light/theme.css b/src/themes/light/theme.css index 4f6017e169..c6e5bca899 100644 --- a/src/themes/light/theme.css +++ b/src/themes/light/theme.css @@ -248,9 +248,9 @@ html { .emby-textarea { color: inherit; background: #fff; - border: 0.07em solid rgba(0, 0, 0, 0.158); - -webkit-border-radius: 0.15em; - border-radius: 0.15em; + border: 0.16em solid rgba(0, 0, 0, 0.158); + -webkit-border-radius: 0.2em; + border-radius: 0.2em; } .emby-input:focus, diff --git a/src/themes/purplehaze/theme.css b/src/themes/purplehaze/theme.css index 3425109479..7f10c9265b 100644 --- a/src/themes/purplehaze/theme.css +++ b/src/themes/purplehaze/theme.css @@ -340,9 +340,9 @@ a[data-role=button] { .emby-textarea { color: inherit; background: rgba(0, 0, 0, 0.5); - border: 0.07em solid transparent; - -webkit-border-radius: 0.15em; - border-radius: 0.15em; + border: 0.16em solid transparent; + -webkit-border-radius: 0.2em; + border-radius: 0.2em; } .emby-input:focus, diff --git a/src/themes/wmc/theme.css b/src/themes/wmc/theme.css index 2d6a61be95..4243204172 100644 --- a/src/themes/wmc/theme.css +++ b/src/themes/wmc/theme.css @@ -238,9 +238,9 @@ html { .emby-textarea { color: inherit; background: rgba(255, 255, 255, 0.2); - border: 0.07em solid rgba(255, 255, 255, 0.135); - -webkit-border-radius: 0.15em; - border-radius: 0.15em; + border: 0.16em solid rgba(255, 255, 255, 0.135); + -webkit-border-radius: 0.2em; + border-radius: 0.2em; } .emby-input:focus,