1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

support track selection before playback

This commit is contained in:
Luke Pulverenti 2017-11-05 16:51:23 -05:00
parent 8742246096
commit 06a9394de5
19 changed files with 47 additions and 22 deletions

View file

@ -1 +1 @@
.emby-select{display:block;margin:0;margin-bottom:0!important;font-size:110%;font-family:inherit;font-weight:inherit;padding:.5em;-webkit-box-sizing:border-box;box-sizing:border-box;outline:0!important;-webkit-tap-highlight-color:transparent;width:100%}.emby-select::-moz-focus-inner{border:0}.emby-select+.fieldDescription{margin-top:.25em}.selectContainer{margin-bottom:1.8em;position:relative}.selectLabel{display:block;margin-bottom:.25em}.emby-select-withcolor{-webkit-appearance:none;-moz-appearance:none;appearance:none}.selectArrowContainer{position:absolute;right:.35em;top:.27em;color:inherit;pointer-events:none}.selectArrow{margin-top:.35em;font-size:1.7em}.emby-select-iconbutton{-webkit-align-self:flex-end;align-self:flex-end}
.emby-select{display:block;margin:0;margin-bottom:0!important;font-size:110%;font-family:inherit;font-weight:inherit;padding:.5em 1.9em .5em .5em;-webkit-box-sizing:border-box;box-sizing:border-box;outline:0!important;-webkit-tap-highlight-color:transparent;width:100%}.selectContainer-inline>.emby-select{padding:.1em 1.9em .1em .5em}.emby-select::-moz-focus-inner{border:0}.emby-select-focusscale{-webkit-transition:-webkit-transform 180ms ease-out!important;-o-transition:transform 180ms ease-out!important;transition:transform 180ms ease-out!important;-webkit-transform-origin:center center;transform-origin:center center}.emby-select-focusscale:focus{-webkit-transform:scale(1.16);transform:scale(1.16);z-index:1}.emby-select+.fieldDescription{margin-top:.25em}.selectContainer{margin-bottom:1.8em;position:relative}.selectContainer-inline{display:-webkit-inline-box;display:-webkit-inline-flex;display:inline-flex;margin-bottom:0;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.selectLabel{display:block;margin-bottom:.25em;margin-right:.75em}.selectContainer-inline>.selectLabel{margin-bottom:0}.emby-select-withcolor{-webkit-appearance:none;-moz-appearance:none;appearance:none}.selectArrowContainer{position:absolute;right:.3em;top:.27em;color:inherit;pointer-events:none}.selectContainer-inline>.selectArrowContainer{top:initial;bottom:0}.selectArrow{margin-top:.35em;font-size:1.7em}.emby-select-iconbutton{-webkit-align-self:flex-end;align-self:flex-end}

View file

@ -1 +1 @@
define(["layoutManager","browser","actionsheet","css!./emby-select","registerElement"],function(layoutManager,browser,actionsheet){"use strict";function enableNativeMenu(){return!(!browser.edgeUwp&&!browser.xboxOne)||!browser.tizen&&!browser.orsay&&(!!browser.tv||!layoutManager.tv)}function triggerChange(select){var evt=document.createEvent("HTMLEvents");evt.initEvent("change",!1,!0),select.dispatchEvent(evt)}function setValue(select,value){select.value=value}function showActionSheet(select){var labelElem=getLabel(select),title=labelElem?labelElem.textContent||labelElem.innerText:null;actionsheet.show({items:select.options,positionTo:select,title:title}).then(function(value){setValue(select,value),triggerChange(select)})}function getLabel(select){for(var elem=select.previousSibling;elem&&"LABEL"!==elem.tagName;)elem=elem.previousSibling;return elem}function onFocus(e){var label=getLabel(this);label&&(label.classList.add("selectLabelFocused"),label.classList.remove("selectLabelUnfocused"))}function onBlur(e){var label=getLabel(this);label&&(label.classList.add("selectLabelUnfocused"),label.classList.remove("selectLabelFocused"))}function onMouseDown(e){e.button||enableNativeMenu()||(e.preventDefault(),showActionSheet(this))}function onKeyDown(e){switch(e.keyCode){case 13:return void(enableNativeMenu()||(e.preventDefault(),showActionSheet(this)));case 37:case 38:case 39:case 40:return void(layoutManager.tv&&e.preventDefault())}}var EmbySelectPrototype=Object.create(HTMLSelectElement.prototype),inputId=0;EmbySelectPrototype.createdCallback=function(){this.id||(this.id="embyselect"+inputId,inputId++),browser.firefox||this.classList.add("emby-select-withcolor"),this.addEventListener("mousedown",onMouseDown),this.addEventListener("keydown",onKeyDown),this.addEventListener("focus",onFocus),this.addEventListener("blur",onBlur)},EmbySelectPrototype.attachedCallback=function(){if(!this.classList.contains("emby-select")){this.classList.add("emby-select");var label=this.ownerDocument.createElement("label");label.innerHTML=this.getAttribute("label")||"",label.classList.add("selectLabel"),label.classList.add("selectLabelUnfocused"),label.htmlFor=this.id,this.parentNode.insertBefore(label,this),this.classList.contains("emby-select-withcolor")&&this.parentNode.insertAdjacentHTML("beforeend",'<div class="selectArrowContainer"><div style="visibility:hidden;">0</div><i class="selectArrow md-icon">&#xE313;</i></div>')}},EmbySelectPrototype.setLabel=function(text){var label=this.parentNode.querySelector("label");label.innerHTML=text},document.registerElement("emby-select",{prototype:EmbySelectPrototype,extends:"select"})});
define(["layoutManager","browser","actionsheet","css!./emby-select","registerElement"],function(layoutManager,browser,actionsheet){"use strict";function enableNativeMenu(){return!(!browser.edgeUwp&&!browser.xboxOne)||!browser.tizen&&!browser.orsay&&(!!browser.tv||!layoutManager.tv)}function triggerChange(select){var evt=document.createEvent("HTMLEvents");evt.initEvent("change",!1,!0),select.dispatchEvent(evt)}function setValue(select,value){select.value=value}function showActionSheet(select){var labelElem=getLabel(select),title=labelElem?labelElem.textContent||labelElem.innerText:null;actionsheet.show({items:select.options,positionTo:select,title:title}).then(function(value){setValue(select,value),triggerChange(select)})}function getLabel(select){for(var elem=select.previousSibling;elem&&"LABEL"!==elem.tagName;)elem=elem.previousSibling;return elem}function onFocus(e){var label=getLabel(this);label&&(label.classList.add("selectLabelFocused"),label.classList.remove("selectLabelUnfocused"))}function onBlur(e){var label=getLabel(this);label&&(label.classList.add("selectLabelUnfocused"),label.classList.remove("selectLabelFocused"))}function onMouseDown(e){e.button||enableNativeMenu()||(e.preventDefault(),showActionSheet(this))}function onKeyDown(e){switch(e.keyCode){case 13:return void(enableNativeMenu()||(e.preventDefault(),showActionSheet(this)));case 37:case 38:case 39:case 40:return void(layoutManager.tv&&e.preventDefault())}}var EmbySelectPrototype=Object.create(HTMLSelectElement.prototype),inputId=0;EmbySelectPrototype.createdCallback=function(){this.id||(this.id="embyselect"+inputId,inputId++),browser.firefox||this.classList.add("emby-select-withcolor"),layoutManager.tv&&this.classList.add("emby-select-focusscale"),this.addEventListener("mousedown",onMouseDown),this.addEventListener("keydown",onKeyDown),this.addEventListener("focus",onFocus),this.addEventListener("blur",onBlur)},EmbySelectPrototype.attachedCallback=function(){if(!this.classList.contains("emby-select")){this.classList.add("emby-select");var label=this.ownerDocument.createElement("label");label.innerHTML=this.getAttribute("label")||"",label.classList.add("selectLabel"),label.classList.add("selectLabelUnfocused"),label.htmlFor=this.id,this.parentNode.insertBefore(label,this),this.classList.contains("emby-select-withcolor")&&this.parentNode.insertAdjacentHTML("beforeend",'<div class="selectArrowContainer"><div style="visibility:hidden;">0</div><i class="selectArrow md-icon">&#xE313;</i></div>')}},EmbySelectPrototype.setLabel=function(text){var label=this.parentNode.querySelector("label");label.innerHTML=text},document.registerElement("emby-select",{prototype:EmbySelectPrototype,extends:"select"})});

File diff suppressed because one or more lines are too long

View file

@ -1 +1 @@
define(["dom","browser","events","emby-tabs","emby-button","emby-linkbutton"],function(dom,browser,events){"use strict";function enableTabsInFooter(){return!1}function ensureElements(enableInFooter){enableInFooter&&(footerTabsContainer||(footerTabsContainer=document.createElement("div"),footerTabsContainer.classList.add("footerTabs"),footerTabsContainer.classList.add("sectionTabs"),footerTabsContainer.classList.add("hide"))),headerTabsContainer||(headerTabsContainer=queryScope.querySelector(".headerTabs"))}function allowSwipe(target){function allowSwipeOn(elem){return!dom.parentWithTag(elem,"input")&&(!elem.classList||!elem.classList.contains("hiddenScrollX")&&!elem.classList.contains("smoothScrollX")&&!elem.classList.contains("animatedScrollX"))}for(var parent=target;null!=parent;){if(!allowSwipeOn(parent))return!1;parent=parent.parentNode}return!0}function configureSwipeTabs(view,tabsElem,getTabContainersFn){if(browser.touch){var onSwipeLeft=(getTabContainersFn().length,function(e,target){allowSwipe(target)&&view.contains(target)&&tabsElem.selectNext()}),onSwipeRight=function(e,target){allowSwipe(target)&&view.contains(target)&&tabsElem.selectPrevious()};require(["touchHelper"],function(TouchHelper){var touchHelper=new TouchHelper(view.parentNode.parentNode);events.on(touchHelper,"swipeleft",onSwipeLeft),events.on(touchHelper,"swiperight",onSwipeRight),view.addEventListener("viewdestroy",function(){touchHelper.destroy()})})}}function setTabs(view,selectedIndex,getTabsFn,getTabContainersFn,onBeforeTabChange,onTabChange){var enableInFooter=enableTabsInFooter();if(!view)return tabOwnerView&&(headerTabsContainer||(headerTabsContainer=queryScope.querySelector(".headerTabs")),ensureElements(enableInFooter),document.body.classList.remove("withSectionTabs"),headerTabsContainer.innerHTML="",headerTabsContainer.classList.add("hide"),footerTabsContainer&&(footerTabsContainer.innerHTML="",footerTabsContainer.classList.add("hide")),tabOwnerView=null),{tabsContainer:headerTabsContainer,replaced:!1};ensureElements(enableInFooter);var tabsContainerElem=enableInFooter?footerTabsContainer:headerTabsContainer;if(tabOwnerView||tabsContainerElem.classList.remove("hide"),tabOwnerView!==view){var index=0,indexAttribute=null==selectedIndex?"":' data-index="'+selectedIndex+'"',tabsHtml='<div is="emby-tabs"'+indexAttribute+' class="tabs-viewmenubar"><div class="emby-tabs-slider" style="white-space:nowrap;">'+getTabsFn().map(function(t){var tabClass="emby-tab-button";t.enabled===!1&&(tabClass+=" hide");var tabHtml;return t.cssClass&&(tabClass+=" "+t.cssClass),tabHtml=t.href?'<a href="'+t.href+'" is="emby-linkbutton" class="'+tabClass+'" data-index="'+index+'"><div class="emby-button-foreground">'+t.name+"</div></a>":'<button type="button" is="emby-button" class="'+tabClass+'" data-index="'+index+'"><div class="emby-button-foreground">'+t.name+"</div></button>",index++,tabHtml}).join("")+"</div></div>";return tabsContainerElem.innerHTML=tabsHtml,document.body.classList.add("withSectionTabs"),tabOwnerView=view,tabsElem=tabsContainerElem.querySelector('[is="emby-tabs"]'),configureSwipeTabs(view,tabsElem,getTabContainersFn),tabsElem.addEventListener("beforetabchange",function(e){var tabContainers=getTabContainersFn();if(null!=e.detail.previousIndex){var previousPanel=tabContainers[e.detail.previousIndex];previousPanel&&previousPanel.classList.remove("is-active")}var newPanel=tabContainers[e.detail.selectedTabIndex];newPanel&&newPanel.classList.add("is-active")}),onBeforeTabChange&&tabsElem.addEventListener("beforetabchange",onBeforeTabChange),onTabChange&&tabsElem.addEventListener("tabchange",onTabChange),!tabsElem.triggerBeforeTabChange,{tabsContainer:tabsContainerElem,tabs:tabsContainerElem.querySelector('[is="emby-tabs"]'),replaced:!0}}return tabsElem||(tabsElem=tabsContainerElem.querySelector('[is="emby-tabs"]')),tabsElem.selectedIndex(selectedIndex),tabOwnerView=view,{tabsContainer:tabsContainerElem,tabs:tabsElem,replaced:!1}}function selectedTabIndex(index){var tabsContainerElem=headerTabsContainer;tabsElem||(tabsElem=tabsContainerElem.querySelector('[is="emby-tabs"]')),null!=index?tabsElem.selectedIndex(index):tabsElem.triggerTabChange()}function getTabsElement(){return document.querySelector(".tabs-viewmenubar")}var tabOwnerView,footerTabsContainer,headerTabsContainer,tabsElem,queryScope=document.querySelector(".skinHeader");return{setTabs:setTabs,getTabsElement:getTabsElement,selectedTabIndex:selectedTabIndex}});
define(["dom","browser","events","emby-tabs","emby-button","emby-linkbutton"],function(dom,browser,events){"use strict";function enableTabsInFooter(){return!1}function ensureElements(enableInFooter){enableInFooter&&(footerTabsContainer||(footerTabsContainer=document.createElement("div"),footerTabsContainer.classList.add("footerTabs"),footerTabsContainer.classList.add("sectionTabs"),footerTabsContainer.classList.add("hide"))),headerTabsContainer||(headerTabsContainer=queryScope.querySelector(".headerTabs"))}function onViewTabsReady(){this.selectedIndex(this.readySelectedIndex),this.readySelectedIndex=null}function allowSwipe(target){function allowSwipeOn(elem){return!dom.parentWithTag(elem,"input")&&(!elem.classList||!elem.classList.contains("hiddenScrollX")&&!elem.classList.contains("smoothScrollX")&&!elem.classList.contains("animatedScrollX"))}for(var parent=target;null!=parent;){if(!allowSwipeOn(parent))return!1;parent=parent.parentNode}return!0}function configureSwipeTabs(view,tabsElem,getTabContainersFn){if(browser.touch){var onSwipeLeft=(getTabContainersFn().length,function(e,target){allowSwipe(target)&&view.contains(target)&&tabsElem.selectNext()}),onSwipeRight=function(e,target){allowSwipe(target)&&view.contains(target)&&tabsElem.selectPrevious()};require(["touchHelper"],function(TouchHelper){var touchHelper=new TouchHelper(view.parentNode.parentNode);events.on(touchHelper,"swipeleft",onSwipeLeft),events.on(touchHelper,"swiperight",onSwipeRight),view.addEventListener("viewdestroy",function(){touchHelper.destroy()})})}}function setTabs(view,selectedIndex,getTabsFn,getTabContainersFn,onBeforeTabChange,onTabChange){var enableInFooter=enableTabsInFooter();if(!view)return tabOwnerView&&(headerTabsContainer||(headerTabsContainer=queryScope.querySelector(".headerTabs")),ensureElements(enableInFooter),document.body.classList.remove("withSectionTabs"),headerTabsContainer.innerHTML="",headerTabsContainer.classList.add("hide"),footerTabsContainer&&(footerTabsContainer.innerHTML="",footerTabsContainer.classList.add("hide")),tabOwnerView=null),{tabsContainer:headerTabsContainer,replaced:!1};ensureElements(enableInFooter);var tabsContainerElem=enableInFooter?footerTabsContainer:headerTabsContainer;if(tabOwnerView||tabsContainerElem.classList.remove("hide"),tabOwnerView!==view){var index=0,indexAttribute=null==selectedIndex?"":' data-index="'+selectedIndex+'"',tabsHtml='<div is="emby-tabs"'+indexAttribute+' class="tabs-viewmenubar"><div class="emby-tabs-slider" style="white-space:nowrap;">'+getTabsFn().map(function(t){var tabClass="emby-tab-button";t.enabled===!1&&(tabClass+=" hide");var tabHtml;return t.cssClass&&(tabClass+=" "+t.cssClass),tabHtml=t.href?'<a href="'+t.href+'" is="emby-linkbutton" class="'+tabClass+'" data-index="'+index+'"><div class="emby-button-foreground">'+t.name+"</div></a>":'<button type="button" is="emby-button" class="'+tabClass+'" data-index="'+index+'"><div class="emby-button-foreground">'+t.name+"</div></button>",index++,tabHtml}).join("")+"</div></div>";return tabsContainerElem.innerHTML=tabsHtml,document.body.classList.add("withSectionTabs"),tabOwnerView=view,tabsElem=tabsContainerElem.querySelector('[is="emby-tabs"]'),configureSwipeTabs(view,tabsElem,getTabContainersFn),tabsElem.addEventListener("beforetabchange",function(e){var tabContainers=getTabContainersFn();if(null!=e.detail.previousIndex){var previousPanel=tabContainers[e.detail.previousIndex];previousPanel&&previousPanel.classList.remove("is-active")}var newPanel=tabContainers[e.detail.selectedTabIndex];newPanel&&newPanel.classList.add("is-active")}),onBeforeTabChange&&tabsElem.addEventListener("beforetabchange",onBeforeTabChange),onTabChange&&tabsElem.addEventListener("tabchange",onTabChange),tabsElem.selectedIndex?tabsElem.selectedIndex(selectedIndex):(tabsElem.readySelectedIndex=selectedIndex,tabsElem.addEventListener("ready",onViewTabsReady)),{tabsContainer:tabsContainerElem,tabs:tabsContainerElem.querySelector('[is="emby-tabs"]'),replaced:!0}}return tabsElem||(tabsElem=tabsContainerElem.querySelector('[is="emby-tabs"]')),tabsElem.selectedIndex(selectedIndex),tabOwnerView=view,{tabsContainer:tabsContainerElem,tabs:tabsElem,replaced:!1}}function selectedTabIndex(index){var tabsContainerElem=headerTabsContainer;tabsElem||(tabsElem=tabsContainerElem.querySelector('[is="emby-tabs"]')),null!=index?tabsElem.selectedIndex(index):tabsElem.triggerTabChange()}function getTabsElement(){return document.querySelector(".tabs-viewmenubar")}var tabOwnerView,footerTabsContainer,headerTabsContainer,tabsElem,queryScope=document.querySelector(".skinHeader");return{setTabs:setTabs,getTabsElement:getTabsElement,selectedTabIndex:selectedTabIndex}});

File diff suppressed because one or more lines are too long

View file

@ -609,5 +609,8 @@
"GenreValue": "Genre: {0}",
"GenresValue": "Genres: {0}",
"LinksValue": "Links: {0}",
"TagsValue": "Tags: {0}"
"TagsValue": "Tags: {0}",
"LabelAudio": "Audio:",
"LabelSubtitles": "Subtitles:",
"Off": "Off"
}

View file

@ -1 +1 @@
define(["playbackManager","userSettings","connectionManager"],function(playbackManager,userSettings,connectionManager){"use strict";function playThemeMedia(items,ownerId){var currentThemeItems=items.filter(function(i){return enabled(i.MediaType)});if(currentThemeItems.length){if(!currentOwnerId&&playbackManager.isPlaying())return;currentThemeIds=currentThemeItems.map(function(i){return i.Id}),playbackManager.play({items:currentThemeItems,fullscreen:!1,enableRemotePlayers:!1}).then(function(){currentOwnerId=ownerId})}else currentOwnerId&&playbackManager.stop(),currentOwnerId=null}function enabled(mediaType){return"Video"===mediaType?userSettings.enableThemeVideos():userSettings.enableThemeSongs()}function loadThemeMedia(item){var apiClient=connectionManager.getApiClient(item.ServerId);apiClient.getThemeMedia(apiClient.getCurrentUserId(),item.Id,!0).then(function(themeMediaResult){var ownerId=themeMediaResult.ThemeVideosResult.Items.length?themeMediaResult.ThemeVideosResult.OwnerId:themeMediaResult.ThemeSongsResult.OwnerId;if(ownerId!==currentOwnerId){var items=themeMediaResult.ThemeVideosResult.Items.length?themeMediaResult.ThemeVideosResult.Items:themeMediaResult.ThemeSongsResult.Items;playThemeMedia(items,ownerId)}})}var currentOwnerId,currentThemeIds=[];document.addEventListener("viewshow",function(e){var state=e.detail.state||{},item=state.item;if(item&&item.ServerId)return void loadThemeMedia(item);var viewOptions=e.detail.options||{};viewOptions.supportsThemeMedia||playThemeMedia([],null)},!0)});
define(["playbackManager","userSettings","connectionManager"],function(playbackManager,userSettings,connectionManager){"use strict";function playThemeMedia(items,ownerId){var currentThemeItems=items.filter(function(i){return enabled(i.MediaType)});if(currentThemeItems.length){if(!currentOwnerId&&playbackManager.isPlaying())return;currentThemeIds=currentThemeItems.map(function(i){return i.Id}),playbackManager.play({items:currentThemeItems,fullscreen:!1,enableRemotePlayers:!1}).then(function(){currentOwnerId=ownerId})}else currentOwnerId&&playbackManager.stop(),currentOwnerId=null}function enabled(mediaType){return"Video"===mediaType?userSettings.enableThemeVideos():userSettings.enableThemeSongs()}function loadThemeMedia(item){if(!item.CollectionType&&excludeTypes.indexOf(item.Type)===-1){var apiClient=connectionManager.getApiClient(item.ServerId);apiClient.getThemeMedia(apiClient.getCurrentUserId(),item.Id,!0).then(function(themeMediaResult){var ownerId=themeMediaResult.ThemeVideosResult.Items.length?themeMediaResult.ThemeVideosResult.OwnerId:themeMediaResult.ThemeSongsResult.OwnerId;if(ownerId!==currentOwnerId){var items=themeMediaResult.ThemeVideosResult.Items.length?themeMediaResult.ThemeVideosResult.Items:themeMediaResult.ThemeSongsResult.Items;playThemeMedia(items,ownerId)}})}}var currentOwnerId,currentThemeIds=[],excludeTypes=["CollectionFolder","UserView","Program","SeriesTimer","Person","TvChannel","Channel"];document.addEventListener("viewshow",function(e){var state=e.detail.state||{},item=state.item;if(item&&item.ServerId)return void loadThemeMedia(item);var viewOptions=e.detail.options||{};viewOptions.supportsThemeMedia||playThemeMedia([],null)},!0)});