emby 4.8

settings/cameraupload.html

@@ -0,0 +1,37 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+        <form class="userProfileSettingsForm auto-center">
+
+            <div style="margin:1em 0;">
+                <div class="premiereInfo"></div>
+            </div>
+
+            <div style="margin: 2em 0;" class="progressContainer hide">
+                <div class="secondaryText progressDescription" style="margin:0 0 .5em;"></div>
+                <div class="itemProgressBar"><div class="itemProgressBarForeground" style="width:50%;"></div></div>
+            </div>
+
+            <div style="margin: 1.5em 0;">
+                <h3 class="checkboxListLabel">${UploadToFollowingServers}</h3>
+
+                <div class="checkboxList uploadServerList autoSetting autoSave" data-settingmethod="cameraUploadServers" data-settingowner="appsettings" data-triggerchange="true">
+
+                </div>
+            </div>
+
+            <label class="checkboxContainer">
+                <input type="checkbox" is="emby-checkbox" class="chkWifi autoSetting autoSave" data-settingmethod="cameraUploadOnlyOnWifi" data-settingowner="appsettings" />
+                <span>${UploadOnlyOnWifi}</span>
+            </label>
+
+            <div class="fldUploadFolders hide" style="margin: 1.5em 0;">
+                <h3 class="checkboxListLabel">${HeaderFoldersToUpload}</h3>
+
+                <div class="uploadFolderList checkboxList autoSetting autoSave" data-settingmethod="cameraUploadFolders" data-settingowner="appsettings">
+
+                </div>
+            </div>
+
+        </form>
+    </div>
+</div>

settings/cameraupload.js

@@ -0,0 +1 @@
+define(["exports","./../modules/viewmanager/basesettingsview.js","./../modules/common/globalize.js","./../modules/emby-elements/emby-scroller/emby-scroller.js","./../modules/emby-elements/emby-select/emby-select.js","./../modules/emby-elements/emby-button/emby-button.js","./../modules/emby-elements/emby-button/paper-icon-button-light.js","./../modules/emby-elements/emby-input/emby-input.js","./../modules/emby-elements/emby-checkbox/emby-checkbox.js","./../modules/emby-apiclient/events.js","./../modules/emby-apiclient/connectionmanager.js","./../modules/common/servicelocator.js","./../modules/common/textencoding.js"],function(_exports,_basesettingsview,_globalize,_embyScroller,_embySelect,_embyButton,_paperIconButtonLight,_embyInput,_embyCheckbox,_events,_connectionmanager,_servicelocator,_textencoding){function loadForm(page){return page.querySelector(".uploadServerList").innerHTML=_connectionmanager.default.getSavedServers().map(function(s){return'<label><input type="checkbox" is="emby-checkbox" class="chkUploadServer" data-id="'+s.Id+'"/><span>'+_textencoding.default.htmlEncode(s.Name)+"</span></label>"}).join(""),_servicelocator.cameraUpload.getAvailableFolders().then(function(allFolders){!function(page,folders){page.querySelector(".uploadFolderList").innerHTML=folders.map(function(s){return'<label><input type="checkbox" is="emby-checkbox" class="chkUploadFolder" data-id="'+s.Id+'"/><span>'+_textencoding.default.htmlEncode(s.Name)+"</span></label>"}).join("")}(page,allFolders)})}function View(view,params){_basesettingsview.default.apply(this,arguments),this.progressContainer=view.querySelector(".progressContainer"),this.itemProgressBarForeground=view.querySelector(".itemProgressBarForeground"),this.progressDescription=view.querySelector(".progressDescription"),view.querySelector(".premiereInfo").innerHTML=_globalize.default.translate("FeatureRequiresEmbyPremiere",'<a href="https://emby.media/premiere" data-preset="premiereinfo" is="emby-linkbutton" type="button" class="button-link">',"</a>"),view.querySelector(".uploadServerList").addEventListener("change",function(e){var page;return(page=view).querySelector(".chkUploadServer:checked")?page.querySelector(".fldUploadFolders").classList.remove("hide"):page.querySelector(".fldUploadFolders").classList.add("hide"),e.preventDefault(),!1}),view.querySelector("form").addEventListener("submit",function(e){return e.preventDefault(),!1}),this.boundOnUploadProgress=function(e,progressInfo){var numItems=progressInfo.numItems||0,numItemsComplete=progressInfo.numItemsComplete||0,progressInfo=progressInfo.totalPercentComplete||0;this.itemProgressBarForeground.style.width=progressInfo+"%",this.progressDescription.innerHTML=_globalize.default.translate("UploadingNumItems",numItemsComplete+1,numItems),numItems&&progressInfo<100?this.progressContainer.classList.remove("hide"):this.progressContainer.classList.add("hide")}.bind(this)}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,Object.assign(View.prototype,_basesettingsview.default.prototype),View.prototype.onResume=function(options){_basesettingsview.default.prototype.onResume.apply(this,arguments),_events.default.on(_servicelocator.cameraUpload,"progress",this.boundOnUploadProgress),_servicelocator.cameraUpload.setProgressUpdatesEnabled(!0),_servicelocator.cameraUpload.start()},View.prototype.loadSettingsInternal=function(){var instance=this;return loadForm(this.view).then(function(){instance.loadAutoSettings()})},View.prototype.onPause=function(){_basesettingsview.default.prototype.onPause.apply(this,arguments),this.boundOnUploadProgress&&_events.default.off(_servicelocator.cameraUpload,"progress",this.boundOnUploadProgress),_servicelocator.cameraUpload.setProgressUpdatesEnabled(!1),_servicelocator.cameraUpload.start()},View.prototype.destroy=function(){_basesettingsview.default.prototype.destroy.apply(this,arguments),this.boundOnUploadProgress&&(_events.default.off(_servicelocator.cameraUpload,"progress",this.boundOnUploadProgress),this.boundOnUploadProgress=null),this.progressContainer=null,this.itemProgressBarForeground=null,this.progressDescription=null},_exports.default=View});

settings/display.html

@@ -0,0 +1,253 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+        <form class="auto-center padded-top">
+
+            <div class="selectContainer">
+                <select class="selectLanguage autoSetting autoSave" is="emby-select" label="${LabelDisplayLanguage}" data-settingmethod="language" data-settingowner="usersettings">
+                    <option value="">${Auto}</option>
+                    <option value="sq">Albanian</option>
+                    <option value="ar">Arabic</option>
+                    <option value="be-BY">Belarusian (Belarus)</option>
+                    <option value="bg-BG">Bulgarian (Bulgaria)</option>
+                    <option value="ca">Catalan</option>
+                    <option value="zh-CN">Chinese Simplified</option>
+                    <option value="zh-TW">Chinese Traditional</option>
+                    <option value="zh-HK">Chinese Traditional (Hong Kong)</option>
+                    <option value="hr">Croatian</option>
+                    <option value="cs">Czech</option>
+                    <option value="da">Danish</option>
+                    <option value="nl">Dutch</option>
+                    <option value="en-GB">English (United Kingdom)</option>
+                    <option value="en-US">English (United States)</option>
+                    <option value="et-EE">Estonian</option>
+                    <option value="fi">Finnish</option>
+                    <option value="fr">French</option>
+                    <option value="fr-CA">French (Canada)</option>
+                    <option value="de">German</option>
+                    <option value="el">Greek</option>
+                    <option value="he">Hebrew</option>
+                    <option value="hi-IN">Hindi (India)</option>
+                    <option value="hu">Hungarian</option>
+                    <option value="id">Indonesian</option>
+                    <option value="it">Italian</option>
+                    <option value="ja">Japanese</option>
+                    <option value="kk">Kazakh</option>
+                    <option value="ko">Korean</option>
+                    <option value="lt-LT">Lithuanian</option>
+                    <option value="ms">Malay</option>
+                    <option value="nb">Norwegian Bokmål</option>
+                    <option value="no">Norwegian</option>
+                    <option value="fa">Persian</option>
+                    <option value="pl">Polish</option>
+                    <option value="pt-BR">Portuguese (Brazil)</option>
+                    <option value="pt-PT">Portuguese (Portugal)</option>
+                    <option value="ro">Romanian</option>
+                    <option value="ru">Russian</option>
+                    <option value="sk">Slovak</option>
+                    <option value="sl-SI">Slovenian (Slovenia)</option>
+                    <option value="es">Spanish</option>
+                    <option value="es-419">Spanish (Latin America)</option>
+                    <option value="es-MX">Spanish (Mexico)</option>
+                    <option value="es-US">Spanish (United States)</option>
+                    <option value="sv">Swedish</option>
+                    <option value="gsw">Swiss German</option>
+                    <option value="tr">Turkish</option>
+                    <option value="uk">Ukrainian</option>
+                    <option value="vi">Vietnamese</option>
+                </select>
+                <div class="fieldDescription">
+                    <div>${LabelDisplayLanguageHelp}</div>
+                    <div class="learnHowToContributeContainer hide">
+                        <a is="emby-linkbutton" class="button-link" href="https://emby.media/community/index.php?/topic/5727-join-our-translation-team" target="_blank">${LearnHowYouCanContribute}</a>
+                    </div>
+                </div>
+            </div>
+
+            <div class="selectContainer fldDateTimeLocale hide">
+                <select is="emby-select" class="selectDateTimeLocale autoSetting autoSave" label="${LabelDateTimeLocale}" data-settingmethod="dateTimeLocale" data-settingowner="usersettings">
+                    <option value="">${AutoBasedOnLanguageSetting}</option>
+                    <option value="sq">Albanian</option>
+                    <option value="ar">Arabic</option>
+                    <option value="be-BY">Belarusian (Belarus)</option>
+                    <option value="bg-BG">Bulgarian (Bulgaria)</option>
+                    <option value="ca">Catalan</option>
+                    <option value="zh-CN">Chinese Simplified</option>
+                    <option value="zh-TW">Chinese Traditional</option>
+                    <option value="zh-HK">Chinese Traditional (Hong Kong)</option>
+                    <option value="hr">Croatian</option>
+                    <option value="cs">Czech</option>
+                    <option value="da">Danish</option>
+                    <option value="nl">Dutch</option>
+                    <option value="en-GB">English (United Kingdom)</option>
+                    <option value="en-US">English (United States)</option>
+                    <option value="et-EE">Estonian</option>
+                    <option value="fi">Finnish</option>
+                    <option value="fr">French</option>
+                    <option value="fr-CA">French (Canada)</option>
+                    <option value="de">German</option>
+                    <option value="el">Greek</option>
+                    <option value="he">Hebrew</option>
+                    <option value="hi-IN">Hindi (India)</option>
+                    <option value="hu">Hungarian</option>
+                    <option value="id">Indonesian</option>
+                    <option value="it">Italian</option>
+                    <option value="ja">Japanese</option>
+                    <option value="kk">Kazakh</option>
+                    <option value="ko">Korean</option>
+                    <option value="lt-LT">Lithuanian</option>
+                    <option value="ms">Malay</option>
+                    <option value="nb">Norwegian Bokmål</option>
+                    <option value="no">Norwegian</option>
+                    <option value="fa">Persian</option>
+                    <option value="pl">Polish</option>
+                    <option value="pt-BR">Portuguese (Brazil)</option>
+                    <option value="pt-PT">Portuguese (Portugal)</option>
+                    <option value="ro">Romanian</option>
+                    <option value="ru">Russian</option>
+                    <option value="sk">Slovak</option>
+                    <option value="sl-SI">Slovenian (Slovenia)</option>
+                    <option value="es">Spanish</option>
+                    <option value="es-419">Spanish (Latin America)</option>
+                    <option value="es-MX">Spanish (Mexico)</option>
+                    <option value="es-US">Spanish (United States)</option>
+                    <option value="sv">Swedish</option>
+                    <option value="gsw">Swiss German</option>
+                    <option value="tr">Turkish</option>
+                    <option value="uk">Ukrainian</option>
+                    <option value="vi">Vietnamese</option>
+                </select>
+            </div>
+
+            <div class="selectContainer fldDisplayMode hide">
+                <select is="emby-select" class="selectLayout autoSetting autoSave" label="${LabelDisplayMode}" data-settingmethod="setLayout" data-getsettingmethod="getSavedLayout" data-settingowner="layoutmanager" data-changedelay="true">
+                    <option value="">${Auto}</option>
+                    <option value="desktop">${Desktop}</option>
+                    <option value="mobile">${Mobile}</option>
+                    <option value="tv">${TV}</option>
+                </select>
+                <div class="fieldDescription">${DisplayModeHelp}</div>
+                <div class="fieldDescription displayModePremiere hide"></div>
+            </div>
+
+            <div class="selectContainer">
+                <select class="selectTheme autoSetting autoSave" is="emby-select" label="${LabelTheme}" data-settingmethod="theme" data-settingowner="usersettings"></select>
+                <div class="fieldDescription featurePremiereInfo"></div>
+            </div>
+
+            <div class="selectContainer fldSettingsTheme">
+                <select class="selectSettingsTheme autoSetting autoSave" is="emby-select" label="${LabelSettingsTheme}" data-settingmethod="settingsTheme" data-settingowner="usersettings"></select>
+                <div class="fieldDescription featurePremiereInfo"></div>
+            </div>
+
+            <div class="selectContainer fldAccentColor hide">
+                <select class="selectAccentColor autoSetting autoSave" is="emby-select" label="${LabelThemeAccentColor}" data-settingmethod="accentColor" data-settingowner="usersettings">
+                    <option value="blue">Blue</option>
+                    <option value="emby">Green</option>
+                    <option value="pink">Pink</option>
+                    <option value="purple">Purple</option>
+                    <option value="red">Red</option>
+                </select>
+                <div class="fieldDescription">${ThemeAccentColorDescription}</div>
+                <div class="fieldDescription featurePremiereInfo"></div>
+            </div>
+
+            <div class="selectContainer hide selectScreensaverContainer">
+                <select is="emby-select" class="selectScreensaver autoSetting autoSave" label="${LabelScreensaver}" data-settingmethod="screensaver" data-settingowner="usersettings"></select>
+                <div class="fieldDescription featurePremiereInfo"></div>
+            </div>
+
+            <div class="selectContainer fldSoundEffects hide">
+                <select is="emby-select" class="selectSoundEffects autoSetting autoSave" label="${LabelSoundEffects}" data-settingmethod="soundEffects" data-settingowner="usersettings"></select>
+            </div>
+
+            <div class="selectContainer fldCardSize hide">
+                <select is="emby-select" class="selectCardSize autoSetting autoSave" label="${LabelImageSize}" data-settingmethod="cardSize" data-settingowner="usersettings">
+                    <option value="extrasmall">${ExtraSmall}</option>
+                    <option value="smaller">${Smaller}</option>
+                    <option value="small">${Small}</option>
+                    <option value="">${Default}</option>
+                    <option value="large">${Large}</option>
+                    <option value="larger">${Larger}</option>
+                    <option value="extralarge">${ExtraLarge}</option>
+                </select>
+                <div class="fieldDescription">${ImageSizeHelp}</div>
+            </div>
+
+            <div class="selectContainer fldNowPlayingAudioBackground">
+                <select is="emby-select" class="selectNowPlayingAudioBackground autoSetting autoSave" label="${LabelNowPlayingAudioBackgroundStyle}" data-settingmethod="nowPlayingAudioBackgroundStyle" data-settingowner="usersettings">
+                    <option value="backdrop">${Backdrop}</option>
+                    <option value="blur">${PrimaryImageBlur}</option>
+                </select>
+            </div>
+
+            <div class="selectContainer fldNowPlayingVideoBackground">
+                <select is="emby-select" class="selectNowPlayingVideoBackground autoSetting autoSave" label="${LabelNowPlayingVideoBackgroundStyle}" data-settingmethod="nowPlayingVideoBackgroundStyle" data-settingowner="usersettings">
+                    <option value="backdrop">${Backdrop}</option>
+                    <option value="blur">${PrimaryImageBlur}</option>
+                </select>
+                <div class="fieldDescription">${NowPlayingVideoBackgroundStyleHelp}</div>
+            </div>
+
+            <div class="checkboxContainer checkboxContainer-withDescription fldBackdrops hide">
+                <label>
+                    <input type="checkbox" is="emby-checkbox" class="chkBackdrops autoSetting autoSave" data-settingmethod="enableBackdrops" data-settingowner="usersettings" />
+                    <span>${EnableBackdrops}</span>
+                </label>
+                <div class="fieldDescription checkboxFieldDescription">${EnableBackdropsHelp}</div>
+            </div>
+
+            <div class="checkboxContainer checkboxContainer-withDescription">
+                <label>
+                    <input type="checkbox" is="emby-checkbox" class="chkLogoImages autoSetting autoSave" data-settingmethod="setEnableLogoAsTitle" data-getsettingmethod="getEnableLogoAsTitle" data-settingowner="usersettings" />
+                    <span>${EnableLogoImagesAsTitle}</span>
+                </label>
+                <div class="fieldDescription checkboxFieldDescription">${EnableLogoImagesAsTitleHelp}</div>
+            </div>
+
+            <div class="checkboxContainer checkboxContainer-withDescription fldThemeSong hide">
+                <label>
+                    <input type="checkbox" is="emby-checkbox" class="chkThemeSong autoSetting autoSave" data-settingmethod="enableThemeSongs" data-settingowner="usersettings" />
+                    <span>${EnableThemeSongs}</span>
+                </label>
+                <div class="fieldDescription checkboxFieldDescription">${EnableThemeSongsHelp}</div>
+            </div>
+            <div class="checkboxContainer checkboxContainer-withDescription fldThemeVideo hide">
+                <label>
+                    <input type="checkbox" is="emby-checkbox" class="chkThemeVideo autoSetting autoSave" data-settingmethod="enableThemeVideos" data-settingowner="usersettings" />
+                    <span>${EnableThemeVideos}</span>
+                </label>
+                <div class="fieldDescription checkboxFieldDescription">${EnableThemeVideosHelp}</div>
+            </div>
+
+            <div class="checkboxContainer hide fldAutorun">
+                <label>
+                    <input type="checkbox" is="emby-checkbox" class="chkRunAtStartup autoSetting autoSave" data-settingmethod="runAtStartup" data-settingowner="appsettings" />
+                    <span>${RunAtStartup}</span>
+                </label>
+            </div>
+
+            <div class="selectContainer">
+                <select is="emby-select" class="selectSeriesDisplay autoSetting autoSave" label="${PreferredShowDisplay}" data-settingmethod="seriesDisplay" data-settingowner="usersettings">
+                    <option value="episodes">${ShowAllEpisodesAllSeasons}</option>
+                    <option value="episodessingleseason">${ShowAllEpisodesSingleSeason}</option>
+                    <option value="seasons">${ShowSeasonFolders}</option>
+                </select>
+            </div>
+
+            <div class="checkboxContainer checkboxContainer-withDescription">
+                <label>
+                    <input type="checkbox" is="emby-checkbox" class="autoSetting autoSave" data-settingmethod="showFullMediaInfoOnDetailScreen" data-settingowner="usersettings" />
+                    <span>${ShowMediaInfoOnDetailScreens}</span>
+                </label>
+            </div>
+
+            <div class="checkboxContainer checkboxContainer-withDescription fldDisplayMissingEpisodes hide">
+                <label>
+                    <input type="checkbox" is="emby-checkbox" class="chkDisplayMissingEpisodes autoSetting autoSave" data-settingfield="DisplayMissingEpisodes" data-settingowner="userconfiguration" />
+                    <span>${DisplayMissingEpisodesWithinSeasons}</span>
+                </label>
+                <div class="fieldDescription checkboxFieldDescription">${DisplayMissingEpisodesWithinSeasonsHelp}</div>
+            </div>
+        </form>
+    </div>
+</div>

settings/download.html

@@ -0,0 +1,42 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+        <form class="auto-center padded-top">
+
+            <div style="margin: 2em 0;" class="progressContainer hide">
+                <div class="secondaryText progressDescription" style="margin:0 0 .5em;"></div>
+                <div class="itemProgressBar"><div class="itemProgressBarForeground" style="width:50%;"></div></div>
+            </div>
+
+            <div class="inputContainer fldCustomSyncPath hide">
+                <div class="flex align-items-center">
+                    <div class="flex-grow">
+                        <input is="emby-input" class="txtSyncPath" label="${LabelDownloadLocation}" autocomplete="off" readonly />
+                    </div>
+                    <button type="button" is="paper-icon-button-light" title="${BrowseForFolder}" aria-label="${BrowseForFolder}" class="emby-input-iconbutton btnSelectSyncPath"><i class="md-icon">search</i></button>
+                </div>
+            </div>
+
+            <div class="selectContainer fldSyncLocation hide">
+                <select is="emby-select" label="${LabelDownloadLocation}" class="selectSyncLocation"></select>
+            </div>
+
+            <div class="selectContainer">
+                <select is="emby-select" class="selectAudioBitrate autoSetting autoSave" data-settingmethod="maxStaticMusicBitrate" data-settingowner="appsettings" label="${LabelMusicDownloadQuality}">
+                    <option value="10000000">${Unlimited}</option>
+                    <option value="512000">512K</option>
+                    <option value="320000">320K</option>
+                    <option value="256000">256K</option>
+                    <option value="192000">192K</option>
+                    <option value="128000">128K</option>
+                    <option value="64000">64K</option>
+                </select>
+                <div class="fieldDescription">${MusicDownloadQualityHelp}</div>
+            </div>
+
+            <label class="checkboxContainer">
+                <input type="checkbox" is="emby-checkbox" class="chkWifi autoSetting autoSave" data-settingmethod="syncOnlyOnWifi" data-settingowner="appsettings" />
+                <span>${DownloadOnlyOnWifi}</span>
+            </label>
+        </form>
+    </div>
+</div>

settings/homescreen.html

@@ -0,0 +1,140 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+        <form class="auto-center padded-top">
+
+            <div class="verticalSection">
+
+                <div class="selectContainer hide selectTVHomeScreenContainer">
+                    <select is="emby-select" class="selectTVHomeScreen autoSetting autoSave" label="${LabelTVHomeScreen}" data-settingmethod="tvHome" data-settingowner="usersettings" data-triggerchange="true">
+                        <option value="horizontal">${Horizontal}</option>
+                        <option value="vertical">${Vertical}</option>
+                    </select>
+                    <div class="fieldDescription">Changes take effect after signing out or restarting the app.</div>
+                </div>
+
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectHomeSection0 autoSetting autoSave" label="LabelHomeScreenSectionValue" data-labelformatargs="1" data-settingmethod="homeSection0" data-settingowner="usersettings">
+                        <option value="smalllibrarytiles">${HeaderMyMedia}</option>
+                        <option value="librarybuttons">${HeaderMyMediaSmall}</option>
+                        <option value="activerecordings">${HeaderActiveRecordings}</option>
+                        <option value="resume">${HeaderContinueWatching}</option>
+                        <option value="resumeaudio">${HeaderContinueListening}</option>
+                        <option value="latestmedia">${HeaderLatestMedia}</option>
+                        <option value="nextup">${HeaderNextUp}</option>
+                        <option value="livetv">${LiveTV}</option>
+                        <option value="none">${None}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectHomeSection1 autoSetting autoSave" label="LabelHomeScreenSectionValue" data-labelformatargs="2" data-settingmethod="homeSection1" data-settingowner="usersettings">
+                        <option value="smalllibrarytiles">${HeaderMyMedia}</option>
+                        <option value="librarybuttons">${HeaderMyMediaSmall}</option>
+                        <option value="activerecordings">${HeaderActiveRecordings}</option>
+                        <option value="resume">${HeaderContinueWatching}</option>
+                        <option value="resumeaudio">${HeaderContinueListening}</option>
+                        <option value="latestmedia">${HeaderLatestMedia}</option>
+                        <option value="nextup">${HeaderNextUp}</option>
+                        <option value="livetv">${LiveTV}</option>
+                        <option value="none">${None}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectHomeSection2 autoSetting autoSave" label="LabelHomeScreenSectionValue" data-labelformatargs="3" data-settingmethod="homeSection2" data-settingowner="usersettings">
+                        <option value="smalllibrarytiles">${HeaderMyMedia}</option>
+                        <option value="librarybuttons">${HeaderMyMediaSmall}</option>
+                        <option value="activerecordings">${HeaderActiveRecordings}</option>
+                        <option value="resume">${HeaderContinueWatching}</option>
+                        <option value="resumeaudio">${HeaderContinueListening}</option>
+                        <option value="latestmedia">${HeaderLatestMedia}</option>
+                        <option value="nextup">${HeaderNextUp}</option>
+                        <option value="livetv">${LiveTV}</option>
+                        <option value="none">${None}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectHomeSection3 autoSetting autoSave" label="LabelHomeScreenSectionValue" data-labelformatargs="4" data-settingmethod="homeSection3" data-settingowner="usersettings">
+                        <option value="smalllibrarytiles">${HeaderMyMedia}</option>
+                        <option value="librarybuttons">${HeaderMyMediaSmall}</option>
+                        <option value="activerecordings">${HeaderActiveRecordings}</option>
+                        <option value="resume">${HeaderContinueWatching}</option>
+                        <option value="resumeaudio">${HeaderContinueListening}</option>
+                        <option value="latestmedia">${HeaderLatestMedia}</option>
+                        <option value="nextup">${HeaderNextUp}</option>
+                        <option value="livetv">${LiveTV}</option>
+                        <option value="none">${None}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectHomeSection4 autoSetting autoSave" label="LabelHomeScreenSectionValue" data-labelformatargs="5" data-settingmethod="homeSection4" data-settingowner="usersettings">
+                        <option value="smalllibrarytiles">${HeaderMyMedia}</option>
+                        <option value="librarybuttons">${HeaderMyMediaSmall}</option>
+                        <option value="activerecordings">${HeaderActiveRecordings}</option>
+                        <option value="resume">${HeaderContinueWatching}</option>
+                        <option value="resumeaudio">${HeaderContinueListening}</option>
+                        <option value="latestmedia">${HeaderLatestMedia}</option>
+                        <option value="nextup">${HeaderNextUp}</option>
+                        <option value="livetv">${LiveTV}</option>
+                        <option value="none">${None}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectHomeSection5 autoSetting autoSave" label="LabelHomeScreenSectionValue" data-labelformatargs="6" data-settingmethod="homeSection5" data-settingowner="usersettings">
+                        <option value="smalllibrarytiles">${HeaderMyMedia}</option>
+                        <option value="librarybuttons">${HeaderMyMediaSmall}</option>
+                        <option value="activerecordings">${HeaderActiveRecordings}</option>
+                        <option value="resume">${HeaderContinueWatching}</option>
+                        <option value="resumeaudio">${HeaderContinueListening}</option>
+                        <option value="latestmedia">${HeaderLatestMedia}</option>
+                        <option value="nextup">${HeaderNextUp}</option>
+                        <option value="livetv">${LiveTV}</option>
+                        <option value="none">${None}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectHomeSection6 autoSetting autoSave" label="LabelHomeScreenSectionValue" data-labelformatargs="7" data-settingmethod="homeSection6" data-settingowner="usersettings">
+                        <option value="smalllibrarytiles">${HeaderMyMedia}</option>
+                        <option value="librarybuttons">${HeaderMyMediaSmall}</option>
+                        <option value="activerecordings">${HeaderActiveRecordings}</option>
+                        <option value="resume">${HeaderContinueWatching}</option>
+                        <option value="resumeaudio">${HeaderContinueListening}</option>
+                        <option value="latestmedia">${HeaderLatestMedia}</option>
+                        <option value="nextup">${HeaderNextUp}</option>
+                        <option value="livetv">${LiveTV}</option>
+                        <option value="none">${None}</option>
+                    </select>
+                </div>
+            </div>
+
+            <div class="verticalSection">
+                <label class="checkboxContainer">
+                    <input class="chkHidePlayedFromLatest autoSetting autoSave" type="checkbox" is="emby-checkbox" data-settingfield="HidePlayedInLatest" data-settingowner="userconfiguration" />
+                    <span>${HideWatchedContentFromLatestMedia}</span>
+                </label>
+
+            </div>
+
+            <div class="checkboxContainer checkboxContainer-withDescription fldHomeFocusPreviews hide">
+                <label>
+                    <input type="checkbox" is="emby-checkbox" class="chkHomeFocusPreviews autoSetting autoSave" data-settingmethod="enableHomescreenFocusPreviews" data-settingowner="usersettings" />
+                    <span>${EnableHomeScreenFocusPreview}</span>
+                </label>
+                <div class="fieldDescription checkboxFieldDescription">${EnableHomeScreenFocusPreviewHelp}</div>
+            </div>
+
+            <div class="verticalSection verticalSection-extrabottompadding">
+
+                <h2 class="sectionTitle">
+                    ${HeaderLibraryOrder}
+                </h2>
+                <div class="viewOrderList">
+
+                </div>
+
+            </div>
+
+            <div class="perLibrarySettings">
+
+            </div>
+        </form>
+    </div>
+</div>

settings/keyboard.html

@@ -0,0 +1,72 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+        <div class="readOnlyContent auto-center">
+
+            <h3 style="margin:.5em 0;">${Navigation}</h3>
+            <ul style="margin:0;">
+                <li>alt-left: navigate back</li>
+                <li>alt-b: navigate back</li>
+                <li>alt-right: navigate forward</li>
+                <li>page-up: scroll up in list</li>
+                <li>page-down: scroll down in list</li>
+                <li>end: scroll to end of list</li>
+                <li>home: return to app home screen</li>
+                <li>control-t: Nagivate to Live TV</li>
+                <li>control-g: Nagivate to Live TV Guide</li>
+                <li>control-r: Record - works when highlighting a program or on program detail screen</li>
+                <li>control-o: Navigate to Recorded TV</li>
+                <li>control-d: show menu or info for selected content (if available)</li>
+            </ul>
+
+            <h3 style="margin-bottom:.5em;">${HeaderVideoPlayback}</h3>
+            <ul style="margin:0;">
+                <li>spacebar: toggle play/pause</li>
+                <li>control-shift-a: cycle through audio tracks</li>
+                <li>control-u: cycle through subtitle tracks</li>
+                <li>control-p: toggle play/pause</li>
+                <li>control-shift-p: play selected media</li>
+                <li>control-shift-s: stop</li>
+                <li>control-shift-f: skip forward</li>
+                <li>control-f: next chapter or track</li>
+                <li>control-shift-b: skip backward</li>
+                <li>control-b: previous chapter or track</li>
+                <li>left: rewind, if on-screen display is not showing</li>
+                <li>right: fast-forward, if on-screen display is not showing</li>
+                <li>Shift+Left arrow: rewind</li>
+                <li>Shift+Right arrow: fast-forward</li>
+                <li>F8: toggle mute</li>
+                <li>F9: volume down</li>
+                <li>F10: volume up</li>
+                <li>F: toggle full-screen</li>
+                <li>M: toggle mute</li>
+                <li>PageUp: Next chapter in video</li>
+                <li>PageDown: Previous chapter in video</li>
+                <li>Channel up: +, Next channel (or next track if not playing live tv)</li>
+                <li>Channel down: -, Previous channel (or previous track if not playing live tv)</li>
+            </ul>
+
+            <h3 style="margin-bottom:.5em;">${HeaderSpecialKeys}</h3>
+            <p>${FollowingSpecialKeys}</p>
+            <ul style="margin:0;">
+                <li>search/find: launch app search function</li>
+                <li>${Favorites}</li>
+                <li>${Home}</li>
+                <li>menu/info: show menu or info for selected content (if available)</li>
+                <li>${Back}</li>
+                <li>toggle mute</li>
+                <li>volume up</li>
+                <li>volume down</li>
+                <li>channel up</li>
+                <li>channel down</li>
+                <li>next track</li>
+                <li>previous track</li>
+                <li>${Pause}</li>
+                <li>${Play}</li>
+                <li>${FastForward}</li>
+                <li>${Rewind}</li>
+                <li>${Record}</li>
+                <li>${Stop}</li>
+            </ul>
+        </div>
+    </div>
+</div>

settings/keyboard.js

@@ -0,0 +1 @@
+define(["exports","./../modules/viewmanager/basesettingsview.js"],function(_exports,_basesettingsview){function View(view,params){_basesettingsview.default.apply(this,arguments)}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,Object.assign(View.prototype,_basesettingsview.default.prototype),_exports.default=View});

settings/managedownloads.html

@@ -0,0 +1,6 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+        <div class="syncActivity">
+        </div>
+    </div>
+</div>

settings/managedownloads.js

@@ -0,0 +1 @@
+define(["exports","./../modules/emby-apiclient/connectionmanager.js","./../modules/viewmanager/baseview.js","./../modules/sync/syncjoblist.js"],function(_exports,_connectionmanager,_baseview,_syncjoblist){function View(view,params){_baseview.default.apply(this,arguments);var apiClient=_connectionmanager.default.currentApiClient();this.mySyncJobList=new _syncjoblist.default({mode:"download",serverId:apiClient.serverId(),userId:null,element:view.querySelector(".syncActivity")})}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,Object.assign(View.prototype,_baseview.default.prototype),View.prototype.destroy=function(){_baseview.default.prototype.destroy.apply(this,arguments);var mySyncJobList=this.mySyncJobList;mySyncJobList&&(mySyncJobList.destroy(),this.mySyncJobList=null)},_exports.default=View});

settings/notificationeditor.template.html

@@ -0,0 +1,41 @@
+<div class="formDialogHeader">
+    <button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1"><i class="md-icon">&#xE5C4;</i></button>
+    <h3 class="formDialogHeaderTitle"></h3>
+</div>
+
+<div is="emby-scroller" data-horizontal="false" data-focusscroll="true" class="formDialogContent">
+    <div class="scrollSlider">
+        <form class="dialogContentInner dialog-content-centered padded-left padded-right padded-bottom-page">
+
+            <div class="entryFormElements">
+
+            </div>
+
+            <div class="flex flex-wrap-wrap" style="margin:1em 0">
+                <button is="emby-button" type="button" class="raised btnSendTest raised flex-grow justify-content-center">
+                    <i class="md-icon button-icon button-icon-left">send</i>
+                    <span>${SendTestNotification}</span>
+                </button>
+            </div>
+
+            <div class="verticalSection">
+                <h3 class="checkboxListLabel">${Events}</h3>
+                <div class="checkboxList eventList"></div>
+            </div>
+
+            <div class="selectContainer fldSelectUser hide" style="margin-top:1em;">
+                <select is="emby-select" class="selectUser" label="${LimitUserEventsTo}" multiple></select>
+            </div>
+
+            <div class="selectContainer" style="margin-top:1em;">
+                <select is="emby-select" class="selectLibrary" label="${LimitLibraryEventsTo}" multiple></select>
+            </div>
+
+            <div class="formDialogFooter">
+                <button is="emby-button" type="submit" class="raised btnSubmit block formDialogFooterItem button-submit">
+                    ${Save}
+                </button>
+            </div>
+        </form>
+    </div>
+</div>

settings/playback.html

@@ -0,0 +1,174 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+        <form class="auto-center">
+
+            <div class="verticalSection">
+                <h2 class="sectionTitle">
+                    ${Audio}
+                </h2>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectAudioLanguage autoSetting autoSave" label="${LabelAudioLanguagePreference}" data-settingfield="AudioLanguagePreference" data-settingowner="userconfiguration"></select>
+                </div>
+                <label class="checkboxContainer">
+                    <input type="checkbox" is="emby-checkbox" class="chkPlayDefaultAudioTrack autoSetting autoSave" data-settingfield="PlayDefaultAudioTrack" data-settingowner="userconfiguration" />
+                    <span>${LabelPlayDefaultAudioTrack}</span>
+                </label>
+                <div class="checkboxContainer checkboxContainer-withDescription">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkRememberAudioTracks autoSetting autoSave" data-settingfield="RememberAudioSelections" data-settingowner="userconfiguration" />
+                        <span>${RememberSelectedAudioTracks}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${RememberSelectedAudioTracksHelp}</div>
+
+                    <div class="fieldDescription checkboxFieldDescription fldClearTrackSelections">
+                        <button is="emby-button" type="button" class="button-link btnClearTrackSelections" data-mode="audio">
+                            <i class="md-icon button-icon button-icon-left">&#xe0b8;</i>
+                            <span>${ClearSavedTrackSelections}</span>
+                        </button>
+                    </div>
+                </div>
+                <div class="selectContainer musicQualitySection hide">
+                    <select is="emby-select" class="selectMusicInternetQuality autoSetting autoSave" label="${LabelInternetQuality}" data-settingmethod="selectMusicInternetQuality" data-settingowner="appsettings"></select>
+                </div>
+            </div>
+
+            <div class="qualitySections hide">
+                <div class="verticalSection videoQualitySection">
+                    <h2 class="sectionTitle">
+                        ${Video}
+                    </h2>
+                    <div class="selectContainer fldVideoInNetworkQuality hide">
+                        <select is="emby-select" class="selectVideoInNetworkQuality autoSetting autoSave" label="${LabelHomeNetworkQuality}" data-settingmethod="selectVideoInNetworkQuality" data-settingowner="appsettings"></select>
+                    </div>
+                    <div class="selectContainer fldVideoInternetQuality hide">
+                        <select is="emby-select" class="selectVideoInternetQuality autoSetting autoSave" label="${LabelInternetQuality}" data-settingmethod="selectVideoInternetQuality" data-settingowner="appsettings"></select>
+                    </div>
+                    <div class="selectContainer fldChromecastQuality hide">
+                        <select is="emby-select" class="selectChromecastVideoQuality autoSetting autoSave" label="${LabelMaxChromecastBitrate}" data-settingmethod="maxChromecastBitrate" data-settingowner="appsettings"></select>
+                    </div>
+                    <div class="selectContainer fldBackgroundVideo hide">
+                        <select is="emby-select" class="selectBackgroundVideo autoSetting autoSave" label="${LabelBackgroundVideoPlayback}" data-settingmethod="backgroundVideo" data-settingowner="appsettings">
+                            <option value="on">${AlwaysOn}</option>
+                            <option value="external">${HeadphonesOrExternalSpeakersConnected}</option>
+                            <option value="">${Off}</option>
+                        </select>
+                        <div class="fieldDescription">${BackgroundVideoPlaybackHelp}</div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="verticalSection">
+                <h2 class="sectionTitle">
+                    ${Advanced}
+                </h2>
+                <div class="checkboxContainer checkboxContainer-withDescription fldEnableResolutionSwitch hide">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkEnableResolutionSwitch autoSetting autoSave" data-settingmethod="enableResolutionSwitching" data-settingowner="appsettings" />
+                        <span>${EnableResolutionSwitching}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${EnableResolutionSwitchingHelp}</div>
+                </div>
+                <div class="checkboxContainer checkboxContainer-withDescription fldEnableRefreshRate hide">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkEnableRefreshRate autoSetting autoSave" data-settingmethod="enableRefreshRateSwitching" data-settingowner="appsettings" />
+                        <span>${EnableDisplayRefreshRateSwitching}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${EnableDisplayRefreshRateSwitchingHelp}</div>
+                </div>
+                <div class="checkboxContainer checkboxContainer-withDescription cinemaModeOptions">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkEnableCinemaMode autoSetting autoSave" data-settingmethod="enableCinemaMode" data-settingowner="usersettings" />
+                        <span>${EnableCinemaMode}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${CinemaModeConfigurationHelp}</div>
+                </div>
+                <div class="checkboxContainer fldEpisodeAutoPlay hide">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkEpisodeAutoPlay autoSetting autoSave" data-settingfield="EnableNextEpisodeAutoPlay" data-settingowner="userconfiguration" />
+                        <span>${PlayNextEpisodeAutomatically}</span>
+                    </label>
+                </div>
+                <div class="checkboxContainer checkboxContainer-withDescription fldEnableNextVideoOverlay hide">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkEnableNextVideoOverlay autoSetting autoSave" data-settingmethod="enableNextVideoInfoOverlay" data-settingowner="usersettings" />
+                        <span>${EnableNextVideoInfoOverlay}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${EnableNextVideoInfoOverlayHelp}</div>
+                </div>
+
+                <div class="checkboxContainer fldExternalPlayer checkboxContainer-withDescription hide">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkExternalVideoPlayer autoSetting autoSave" data-settingmethod="enableSystemExternalPlayers" data-settingowner="appsettings" />
+                        <span>${EnableExternalVideoPlayers}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">
+                        <div class="labelNativeExternalPlayers">${EnableExternalVideoPlayersHelp}</div>
+                    </div>
+                </div>
+
+                <div class="selectContainer fldVideoUnderUI">
+                    <select is="emby-select" class="selectVideoUnderUI autoSetting autoSave" label="${LabelVideoBackBehavior}" data-settingmethod="enableVideoUnderUI" data-settingowner="usersettings" data-triggerchange="true">
+                        <option value="stop">${Stop}</option>
+                        <option value="play">${KeepPlayingInBackground}</option>
+                    </select>
+                </div>
+
+                <div class="selectContainer fldHideMediaTransport hide">
+                    <select is="emby-select" class="selectHideMediaTransport autoSetting autoSave" label="${LabelHideMediaTransportButtons}" data-settingmethod="hideMediaTransportButtons" data-settingowner="usersettings">
+                        <option value="auto">${Auto}</option>
+                        <option value="true">${Yes}</option>
+                        <option value="false">${No}</option>
+                    </select>
+                    <div class="fieldDescription">${HideMediaTransportButtonsHelp}</div>
+                </div>
+
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectSkipForwardLength autoSetting autoSave" label="${LabelSkipForwardLength}" data-settingmethod="skipForwardLength" data-settingowner="usersettings"></select>
+                </div>
+
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectSkipBackLength autoSetting autoSave" label="${LabelSkipBackLength}" data-settingmethod="skipBackLength" data-settingowner="usersettings"></select>
+                </div>
+
+                <div class="selectContainer fldResumeRewind">
+                    <select is="emby-select" class="selectResumeRewind autoSetting autoSave" label="${LabelResumeRewindSeconds}" data-settingfield="ResumeRewindSeconds" data-settingowner="userconfiguration">
+                    </select>
+                    <div class="fieldDescription">${ResumeRewindSecondsHelp}</div>
+                </div>
+
+                <div class="selectContainer fldIntroSkip">
+                    <select is="emby-select" class="selectIntroSkip autoSetting autoSave" label="${LabelIntroSkipMode}" data-settingfield="IntroSkipMode" data-settingowner="userconfiguration">
+                        <option value="None">${Off}</option>
+                        <option value="ShowButton">${ShowSkipIntroButton}</option>
+                        <option value="AutoSkip">${AutoSkipIntro}</option>
+                    </select>
+                    <div class="fieldDescription">${IntroSkipModeHelp}</div>
+                </div>
+
+                <div class="checkboxContainer checkboxContainer-withDescription">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkStillWatching autoSetting autoSave" data-settingmethod="enableStillWatching" data-settingowner="usersettings" />
+                        <span>${PromptStillWatching}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${PreventPlaybackContinuing}</div>
+                </div>
+
+                <div class="selectContainer fldOrientationLock hide">
+                    <select is="emby-select" class="selectOrientationLock autoSetting autoSave" label="${LabelScreenOrientationDuringVideo}" data-settingmethod="videoOrientation" data-settingowner="usersettings">
+                        <option value="auto">${Auto}</option>
+                        <option value="landscape">${LockToLandscape}</option>
+                        <option value="device">${UseDeviceSetting}</option>
+                    </select>
+                </div>
+
+                <div class="checkboxContainer checkboxContainer-withDescription">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkRatingOnPlaybackStart autoSetting autoSave" data-settingmethod="enableRatingInfoOnPlaybackStart" data-settingowner="usersettings" />
+                        <span>${DisplayRatingInformationOnVideoPlaybackStart}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${DisplayRatingInformationOnVideoPlaybackStartHelp}</div>
+                </div>
+            </div>
+        </form>
+    </div>
+</div>

settings/profile.css

@@ -0,0 +1 @@
+.imageDropZone{border:.2em dashed currentcolor;border-radius:.25em;text-align:center;position:relative;height:12em;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center}

settings/profile.html

@@ -0,0 +1,93 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+
+        <div class="readOnlyContent padded-top auto-center flex align-items-center">
+
+            <div class="fldImage"></div>
+
+            <div>
+                <h2 class="username" style="margin: 0 0 .5em;"></h2>
+
+                <button is="emby-button" type="button" class="raised hide btnDeleteImage" style="margin:0;">
+                    <span>${HeaderDeleteImage}</span>
+                </button>
+            </div>
+        </div>
+
+        <form class="newImageForm userProfileSettingsForm hide auto-center" style="margin-top:2em;">
+
+            <div class="flex align-items-center" style="margin:1.5em 0;">
+                <h2 style="margin:0;">${HeaderUploadNewImage}</h2>
+
+                <button is="emby-button" type="button" class="fab btnBrowse" style="margin-left:1em;" title="${Browse}" aria-label="${Browse}">
+                    <i class="md-icon">folder</i>
+                </button>
+            </div>
+
+            <div class="fldNewImage">
+
+                <div class="userImageDropZone imageDropZone fieldDescription">
+                    <div>${LabelDropImageHere}</div>
+
+                    <output class="userImageOutput flex align-items-center justify-content-center" style="position: absolute;top:0;left:0;right:0;bottom:0;width:100%;"></output>
+
+                    <input type="file" accept="image/*" class="uploadUserImage" name="uploadUserImage" style="position: absolute;top:0;left:0;right:0;bottom:0;width:100%;opacity:0;" tabindex="-1" />
+                </div>
+            </div>
+
+            <div class="fldUpload hide" style="margin-top:1em;">
+                <button is="emby-button" type="submit" class="raised button-submit block">${Upload}</button>
+            </div>
+
+        </form>
+
+        <form class="updatePasswordForm passwordSection userProfileSettingsForm hide auto-center padded-top" style="margin-top: 1em;">
+
+            <div class="verticalSection">
+                <h2 class="detailSectionHeader">
+                    ${Password}
+                </h2>
+
+                <div class="fldCurrentPassword inputContainer hide">
+                    <input is="emby-input" type="password" class="txtCurrentPassword" label="${LabelCurrentPassword}" autocomplete="off" />
+                </div>
+                <div class="inputContainer">
+                    <input is="emby-input" type="password" class="txtNewPassword" label="${LabelNewPassword}" autocomplete="off" required />
+                </div>
+                <div class="inputContainer">
+                    <input is="emby-input" type="password" class="txtNewPasswordConfirm" label="${LabelNewPasswordConfirm}" autocomplete="off" required />
+                </div>
+                <div>
+                    <button is="emby-button" type="submit" class="raised button-submit block"><span>${ChangePassword}</span></button>
+                </div>
+                <button is="emby-button" type="button" class="btnResetPassword raised button-cancel block hide">
+                    <span>${HeaderRemovePassword}</span>
+                </button>
+            </div>
+        </form>
+        <form class="localAccessForm localAccessSection auto-center" style="margin-top: 3em;">
+            <div class="detailSection">
+                <h2 class="detailSectionHeader">
+                    ${HeaderLocalNetworkAccess}
+                </h2>
+                <div class="selectContainer fldInNetworkPasswordMode">
+                    <select is="emby-select" class="selectInNetworkPasswordMode" label="${LabelLocalNetworkPasswordMode}">
+                        <option value="password">${RequirePasswordInLocalNetwork}</option>
+                        <option value="nopassword">${NoPasswordInLocalNetwork}</option>
+                        <option value="pin">${PinCodeInLocalNetwork}</option>
+                    </select>
+                    <div class="fieldDescription">${LocalNetworkPasswordModeHelp}</div>
+                </div>
+                <div class="inputContainer fldInNetworkPassword hide">
+                    <input placeholder="*****" is="emby-input" type="number" class="txtInNetworkPassword" label="${LabelLocalNetworkPinCode}" autocomplete="off" pattern="[0-9]*" step="1" maxlength="5" />
+                </div>
+                <div>
+                    <button is="emby-button" type="submit" class="raised button-submit block">
+                        <span>${Save}</span>
+                    </button>
+                </div>
+            </div>
+        </form>
+
+    </div>
+</div>

settings/settings.html

@@ -0,0 +1,12 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-right padded-top-page padded-bottom-page settingsContainer">
+        <div class="readOnlyContent" style="margin: 0 auto;">
+
+            <div class="dynamicRoutes focuscontainer-x">
+
+            </div>
+
+            <p class="appInfo secondaryText" style="text-align:center;"></p>
+        </div>
+    </div>
+</div>

settings/settings.js

@@ -0,0 +1 @@
+define(["exports","./../modules/viewmanager/baseview.js","./../modules/emby-apiclient/connectionmanager.js","./../modules/loading/loading.js","./../modules/common/servicelocator.js","./../modules/focusmanager.js","./../modules/emby-elements/emby-button/emby-button.js","./../modules/emby-elements/emby-scroller/emby-scroller.js","./../modules/navdrawer/navdrawercontent.js"],function(_exports,_baseview,_connectionmanager,_loading,_servicelocator,_focusmanager,_embyButton,_embyScroller,_navdrawercontent){function renderSettings(view,params){var apiClient=params.serverId?_connectionmanager.default.getApiClient(params.serverId):_connectionmanager.default.currentApiClient();apiClient.getUser(params.userId||apiClient.getCurrentUserId()).then(function(user){apiClient.getCurrentUser().then(function(loggedInUser){!function(view,apiClient,user,loggedInUser){var options={apiClient:apiClient,user:user,loggedInUser:loggedInUser,userImage:!0,selectServer:!0,signOut:!0,itemClass:"navMenuOption-settings",home:!1,collapsible:!1,header:!1};_navdrawercontent.default.getSettingsDrawerHtml(options).then(function(html){var routesElem=view.querySelector(".dynamicRoutes");routesElem.innerHTML=html,_navdrawercontent.default.initItemsContainers(routesElem,options).then(function(){_focusmanager.default.autoFocus(routesElem,{skipIfNotEnabled:!0})})})}(view,apiClient,user,loggedInUser)})})}function View(view,params){_baseview.default.apply(this,arguments),view.querySelector(".appInfo").innerHTML=_servicelocator.appHost.appName()+" "+_servicelocator.appHost.appVersion()}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,Object.assign(View.prototype,_baseview.default.prototype),View.prototype.onResume=function(options){_baseview.default.prototype.onResume.apply(this,arguments),_loading.default.hide(),options.refresh&&renderSettings(this.view,this.params)},_exports.default=View});

settings/subtitles.html

@@ -0,0 +1,129 @@
+<div is="emby-scroller" class="view flex flex-direction-column scrollFrameY flex-grow" data-mousewheel="true" data-horizontal="false" data-forcescrollbar="true" data-focusscroll="true" data-bindheader="true">
+    <div class="scrollSlider flex-grow flex-direction-column padded-left padded-left-page padded-right padded-top-page padded-bottom-page settingsContainer">
+
+        <form class="auto-center padded-top">
+
+            <div class="verticalSection">
+
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectSubtitleLanguage autoSetting autoSave" label="${LabelPreferredSubtitleLanguage}" data-settingfield="SubtitleLanguagePreference" data-settingowner="userconfiguration"></select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectSubtitlePlaybackMode autoSetting autoSave" label="${LabelSubtitlePlaybackMode}" data-settingfield="SubtitleMode" data-settingowner="userconfiguration" data-triggerchange="true">
+                        <option value="Default">${Default}</option>
+                        <option value="Smart">${Smart}</option>
+                        <option value="OnlyForced">${OnlyForcedSubtitles}</option>
+                        <option value="Always">${AlwaysPlaySubtitles}</option>
+                        <option value="None">${NoSubtitles}</option>
+                    </select>
+                    <div class="fieldDescription subtitlesDefaultHelp subtitlesHelp hide">${DefaultSubtitlesHelp}</div>
+                    <div class="fieldDescription subtitlesSmartHelp subtitlesHelp hide">${SmartSubtitlesHelp}</div>
+                    <div class="fieldDescription subtitlesAlwaysHelp subtitlesHelp hide">${AlwaysPlaySubtitlesHelp}</div>
+                    <div class="fieldDescription subtitlesOnlyForcedHelp subtitlesHelp hide">${OnlyForcedSubtitlesHelp}</div>
+                    <div class="fieldDescription subtitlesNoneHelp subtitlesHelp hide">${NoSubtitlesHelp}</div>
+                </div>
+                <div class="checkboxContainer checkboxContainer-withDescription">
+                    <label>
+                        <input type="checkbox" is="emby-checkbox" class="chkRememberSubtitles autoSetting autoSave" data-settingfield="RememberSubtitleSelections" data-settingowner="userconfiguration" />
+                        <span>${RememberSelectedSubtitleTracks}</span>
+                    </label>
+                    <div class="fieldDescription checkboxFieldDescription">${RememberSelectedSubtitleTracksHelp}</div>
+
+                    <div class="fieldDescription checkboxFieldDescription fldClearTrackSelections">
+                        <button is="emby-button" type="button" class="button-link btnClearTrackSelections" data-mode="subtitles">
+                            <i class="md-icon button-icon button-icon-left">&#xe0b8;</i>
+                            <span>${ClearSavedTrackSelections}</span>
+                        </button>
+                    </div>
+                </div>
+            </div>
+
+            <div class="verticalSection subtitleAppearanceSection hide">
+
+                <h2 class="sectionTitle">
+                    ${HeaderSubtitleAppearance}
+                </h2>
+
+                <div style="margin-bottom:1.5em;">
+                    <div class="subtitleappearance-preview flex align-items-center justify-content-center" style="border: .08em solid gray; color: black; background: #6A96BD; padding:1em;">
+                        <div class="subtitleappearance-preview-window flex align-items-center justify-content-center" style="width: 90%; padding: .25em;">
+                            <div class="subtitleappearance-preview-text flex align-items-center justify-content-center">
+                                ${TheseSettingsAffectSubtitlesOnThisDevice}
+                            </div>
+                        </div>
+                    </div>
+                    <div class="fieldDescription">${SubtitleAppearanceSettingsDisclaimer}</div>
+                    <div class="fieldDescription">${SubtitleAppearanceSettingsAlsoPassedToCastDevices}</div>
+                </div>
+
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectTextSize autoSetting autoSave" label="${LabelTextSize}" data-settingfield="textSize" data-settingowner="subtitleappearancesettings" data-triggerchange="true">
+                        <option value="smaller">${Smaller}</option>
+                        <option value="small">${Small}</option>
+                        <option value="">${Normal}</option>
+                        <option value="large">${Large}</option>
+                        <option value="larger">${Larger}</option>
+                        <option value="extralarge">${ExtraLarge}</option>
+                    </select>
+                </div>
+
+                <div class="selectContainer hide">
+                    <select is="emby-select" class="selectVerticalPosition autoSetting autoSave" label="${LabelVerticalPositionFromBottom}" data-settingfield="verticalPosition" data-settingowner="subtitleappearancesettings">
+                    </select>
+                </div>
+                <div class="inputContainer hide">
+                    <input is="emby-input" class="inputTextBackground autoSetting autoSave" label="${LabelTextBackgroundColor}" type="text" data-settingfield="textBackground" data-settingowner="subtitleappearancesettings" />
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="inputTextColor autoSetting autoSave" label="${LabelTextColor}" data-settingfield="textColor" data-settingowner="subtitleappearancesettings">
+                        <option value="#000000">${Black}</option>
+                        <option value="#0000FF">${Blue}</option>
+                        <option value="#00FFFF">${Cyan}</option>
+                        <option value="#D3D3D3">${Gray}</option>
+                        <option value="#008000">${Green}</option>
+                        <option value="#00FF00">${Lime}</option>
+                        <option value="#FF00FF">${Magenta}</option>
+                        <option value="#FFA500">${Orange}</option>
+                        <option value="#FFC0CB">${Pink}</option>
+                        <option value="#FF0000">${Red}</option>
+                        <option value="#FFFF00">${Yellow}</option>
+                        <option value="#ffffff">${White}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectDropShadow autoSetting autoSave" label="${LabelDropShadow}" data-settingfield="dropShadow" data-settingowner="subtitleappearancesettings">
+                        <option value="none">${None}</option>
+                        <option value="raised">${Raised}</option>
+                        <option value="depressed">${Depressed}</option>
+                        <option value="uniform">${Uniform}</option>
+                        <option value="dropshadow">${DropShadow}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectBackgroundColor autoSetting autoSave" label="${LabelBackgroundColor}" data-settingfield="textBackground" data-settingowner="subtitleappearancesettings">
+                        <option value="#000000">${Black}</option>
+                        <option value="#0000FF">${Blue}</option>
+                        <option value="#00FFFF">${Cyan}</option>
+                        <option value="#008000">${Green}</option>
+                        <option value="#00FF00">${Lime}</option>
+                        <option value="#FF00FF">${Magenta}</option>
+                        <option value="#FFA500">${Orange}</option>
+                        <option value="#FFC0CB">${Pink}</option>
+                        <option value="#FF0000">${Red}</option>
+                        <option value="transparent">${Transparent}</option>
+                        <option value="#FFFF00">${Yellow}</option>
+                        <option value="#ffffff">${White}</option>
+                    </select>
+                </div>
+                <div class="selectContainer">
+                    <select is="emby-select" class="selectBackgroundOpacity autoSetting autoSave" label="${LabelBackgroundOpacity}" data-settingfield="textBackgroundOpacity" data-settingowner="subtitleappearancesettings">
+                        <option value=".25">25%</option>
+                        <option value=".50">50%</option>
+                        <option value=".75">75%</option>
+                        <option value="1">100%</option>
+                    </select>
+                </div>
+            </div>
+        </form>
+    </div>
+</div>

settings/usernotificationcontroller.js

@@ -0,0 +1 @@
+define(["exports","./../modules/common/itemmanager/itemmanager.js","./../modules/common/itemmanager/baseitemcontroller.js","./../modules/emby-apiclient/connectionmanager.js","./../modules/common/globalize.js","./notificationeditor.js","./../modules/common/pluginmanager.js"],function(_exports,_itemmanager,_baseitemcontroller,_connectionmanager,_globalize,_notificationeditor,_pluginmanager){function UserNotificationController(){_baseitemcontroller.default.apply(this,arguments)}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,Object.assign(UserNotificationController.prototype,_baseitemcontroller.default.prototype),UserNotificationController.prototype.getTypeNames=function(){return["UserNotification"]},UserNotificationController.prototype.getDisplayName=function(item,options){return item.FriendlyName||item.ServiceName},UserNotificationController.prototype.isSingleItemFetchRequired=function(typeName){return!1},UserNotificationController.prototype.getDefaultIcon=function(item){return""},UserNotificationController.prototype.canDelete=function(item,user){return!0},UserNotificationController.prototype.enableLibraryItemDeleteConfirmation=function(){return!1},UserNotificationController.prototype.canRefreshMetadata=function(item,user){return!1},UserNotificationController.prototype.canAddToPlaylist=function(item){return!1},UserNotificationController.prototype.canAddToCollection=function(item,user){return!1},UserNotificationController.prototype.canConvert=function(item,user){return!1},UserNotificationController.prototype.canEdit=function(item,user){return!0},UserNotificationController.prototype.canRate=function(item){return!1},UserNotificationController.prototype.canMarkPlayed=function(item){return!1},UserNotificationController.prototype.getEditCommandText=function(item){return _globalize.default.translate("Edit")},UserNotificationController.prototype.canEditImages=function(item,user){return!1},UserNotificationController.prototype.canEditSubtitles=function(item,user){return!1},UserNotificationController.prototype.isDeletePrimaryCommand=function(itemType){return!0},UserNotificationController.prototype.getDeleteMessages=function(){return{single:{text:"DeleteNotificationConfirmation",title:_globalize.default.translate("DeleteNotification"),confirmText:_globalize.default.translate("Delete")},plural:{text:"DeleteNotificationConfirmation",title:_globalize.default.translate("DeleteNotification"),confirmText:_globalize.default.translate("Delete")}}},UserNotificationController.prototype.deleteItemsInternal=function(options){var item=options.items[0];return _connectionmanager.default.getApiClient(item).deleteUserNotifications(options.items)},UserNotificationController.prototype.editItems=function(items,options){var item=items[0],apiClient=_connectionmanager.default.getApiClient(item);return apiClient.getNotificationTypes({userId:item.UserId}).then(function(allEventTypes){return require([(url=item.SetupModuleUrl,_pluginmanager.default.getConfigurationResourceUrl(url))]).then(function(responses){responses=responses[0];return(new _notificationeditor.default).show({entry:item,apiClient:apiClient,eventTypes:allEventTypes,entryFormEditor:responses,userId:item.UserId})});var url})};var instance=new UserNotificationController;_itemmanager.default.registerItemController(instance),_exports.default=instance});