update view animations

dashboard-ui/bower_components/emby-webcomponents/images/imagehelper.js

@@ -1 +1 @@
-define(["lazyLoader","imageFetcher","layoutManager","browser","appSettings","require"],function(lazyLoader,imageFetcher,layoutManager,browser,appSettings,require){"use strict";function fillImage(elem,source,enableEffects){source||(source=elem.getAttribute("data-src")),source&&fillImageElement(elem,source,enableEffects)}function fillImageElement(elem,source,enableEffects){imageFetcher.loadImage(elem,source).then(function(){var fillingVibrant=fillVibrant(elem,source);!enableFade||layoutManager.tv||enableEffects===!1||fillingVibrant||fadeIn(elem),elem.removeAttribute("data-src")})}function fillVibrant(img,url,canvas,canvasContext){var vibrantElement=img.getAttribute("data-vibrant");return!!vibrantElement&&(window.Vibrant?(fillVibrantOnLoaded(img,url,vibrantElement,canvas,canvasContext),!0):(require(["vibrant"],function(){fillVibrantOnLoaded(img,url,vibrantElement,canvas,canvasContext)}),!0))}function fillVibrantOnLoaded(img,url,vibrantElement){vibrantElement=document.getElementById(vibrantElement),vibrantElement&&requestIdleCallback(function(){getVibrantInfoFromElement(img,url).then(function(vibrantInfo){var swatch=vibrantInfo.split("|");if(swatch.length){var index=0;vibrantElement.style.backgroundColor=swatch[index],vibrantElement.style.color=swatch[index+1]}})})}function getVibrantInfoFromElement(elem,url){return new Promise(function(resolve,reject){require(["vibrant"],function(){if("IMG"===elem.tagName)return void resolve(getVibrantInfo(elem,url));var img=new Image;img.onload=function(){resolve(getVibrantInfo(img,url))},img.src=url})})}function getSettingsKey(url){var parts=url.split("://");url=parts[parts.length-1],url=url.substring(url.indexOf("/")+1),url=url.split("?")[0];var cacheKey="vibrant31";return cacheKey+url}function getCachedVibrantInfo(url){return appSettings.get(getSettingsKey(url))}function getVibrantInfo(img,url){var value=getCachedVibrantInfo(url);if(value)return value;var vibrant=new Vibrant(img),swatches=vibrant.swatches();value="";var swatch=swatches.DarkVibrant;return value+=getSwatchString(swatch),appSettings.set(getSettingsKey(url),value),value}function getSwatchString(swatch){return swatch?swatch.getHex()+"|"+swatch.getBodyTextColor()+"|"+swatch.getTitleTextColor():"||"}function fadeIn(elem){var duration=layoutManager.tv?160:300,keyframes=[{opacity:"0",offset:0},{opacity:"1",offset:1}],timing={duration:duration,iterations:1};elem.animate(keyframes,timing)}function lazyChildren(elem){lazyLoader.lazyChildren(elem,fillImage)}function getPrimaryImageAspectRatio(items){for(var values=[],i=0,length=items.length;i<length;i++){var ratio=items[i].PrimaryImageAspectRatio||0;ratio&&(values[values.length]=ratio)}if(!values.length)return null;values.sort(function(a,b){return a-b});var result,half=Math.floor(values.length/2);result=values.length%2?values[half]:(values[half-1]+values[half])/2;var aspect2x3=2/3;if(Math.abs(aspect2x3-result)<=.15)return aspect2x3;var aspect16x9=16/9;if(Math.abs(aspect16x9-result)<=.2)return aspect16x9;if(Math.abs(1-result)<=.15)return 1;var aspect4x3=4/3;return Math.abs(aspect4x3-result)<=.15?aspect4x3:result}function fillImages(elems){for(var i=0,length=elems.length;i<length;i++){var elem=elems[0];fillImage(elem)}}var requestIdleCallback=window.requestIdleCallback||function(fn){fn()},self={},enableFade=browser.animate&&!browser.slow;return self.fillImages=fillImages,self.lazyImage=fillImage,self.lazyChildren=lazyChildren,self.getPrimaryImageAspectRatio=getPrimaryImageAspectRatio,self.getCachedVibrantInfo=getCachedVibrantInfo,self.getVibrantInfoFromElement=getVibrantInfoFromElement,self});
+define(["lazyLoader","imageFetcher","layoutManager","browser","appSettings","require","css!./style"],function(lazyLoader,imageFetcher,layoutManager,browser,appSettings,require){"use strict";function fillImage(elem,source,enableEffects){source||(source=elem.getAttribute("data-src")),source&&fillImageElement(elem,source,enableEffects)}function fillImageElement(elem,source,enableEffects){imageFetcher.loadImage(elem,source).then(function(){var fillingVibrant=fillVibrant(elem,source);!enableFade||layoutManager.tv||enableEffects===!1||fillingVibrant||fadeIn(elem),elem.removeAttribute("data-src")})}function fillVibrant(img,url,canvas,canvasContext){var vibrantElement=img.getAttribute("data-vibrant");return!!vibrantElement&&(window.Vibrant?(fillVibrantOnLoaded(img,url,vibrantElement,canvas,canvasContext),!0):(require(["vibrant"],function(){fillVibrantOnLoaded(img,url,vibrantElement,canvas,canvasContext)}),!0))}function fillVibrantOnLoaded(img,url,vibrantElement){vibrantElement=document.getElementById(vibrantElement),vibrantElement&&requestIdleCallback(function(){getVibrantInfoFromElement(img,url).then(function(vibrantInfo){var swatch=vibrantInfo.split("|");if(swatch.length){var index=0;vibrantElement.style.backgroundColor=swatch[index],vibrantElement.style.color=swatch[index+1]}})})}function getVibrantInfoFromElement(elem,url){return new Promise(function(resolve,reject){require(["vibrant"],function(){if("IMG"===elem.tagName)return void resolve(getVibrantInfo(elem,url));var img=new Image;img.onload=function(){resolve(getVibrantInfo(img,url))},img.src=url})})}function getSettingsKey(url){var parts=url.split("://");url=parts[parts.length-1],url=url.substring(url.indexOf("/")+1),url=url.split("?")[0];var cacheKey="vibrant31";return cacheKey+url}function getCachedVibrantInfo(url){return appSettings.get(getSettingsKey(url))}function getVibrantInfo(img,url){var value=getCachedVibrantInfo(url);if(value)return value;var vibrant=new Vibrant(img),swatches=vibrant.swatches();value="";var swatch=swatches.DarkVibrant;return value+=getSwatchString(swatch),appSettings.set(getSettingsKey(url),value),value}function getSwatchString(swatch){return swatch?swatch.getHex()+"|"+swatch.getBodyTextColor()+"|"+swatch.getTitleTextColor():"||"}function fadeIn(elem){var cssClass=layoutManager.tv?"lazy-image-fadein-fast":"lazy-image-fadein";elem.classList.add(cssClass)}function lazyChildren(elem){lazyLoader.lazyChildren(elem,fillImage)}function getPrimaryImageAspectRatio(items){for(var values=[],i=0,length=items.length;i<length;i++){var ratio=items[i].PrimaryImageAspectRatio||0;ratio&&(values[values.length]=ratio)}if(!values.length)return null;values.sort(function(a,b){return a-b});var result,half=Math.floor(values.length/2);result=values.length%2?values[half]:(values[half-1]+values[half])/2;var aspect2x3=2/3;if(Math.abs(aspect2x3-result)<=.15)return aspect2x3;var aspect16x9=16/9;if(Math.abs(aspect16x9-result)<=.2)return aspect16x9;if(Math.abs(1-result)<=.15)return 1;var aspect4x3=4/3;return Math.abs(aspect4x3-result)<=.15?aspect4x3:result}function fillImages(elems){for(var i=0,length=elems.length;i<length;i++){var elem=elems[0];fillImage(elem)}}var requestIdleCallback=window.requestIdleCallback||function(fn){fn()},self={},enableFade=!browser.slow;return self.fillImages=fillImages,self.lazyImage=fillImage,self.lazyChildren=lazyChildren,self.getPrimaryImageAspectRatio=getPrimaryImageAspectRatio,self.getCachedVibrantInfo=getCachedVibrantInfo,self.getVibrantInfoFromElement=getVibrantInfoFromElement,self});

dashboard-ui/bower_components/emby-webcomponents/images/style.css

@@ -0,0 +1 @@
+.lazy-image-fadein{-webkit-animation:lazy-image-fadein .3s ease-in normal both;animation:lazy-image-fadein .3s ease-in normal both}.lazy-image-fadein-fast{-webkit-animation:lazy-image-fadein 160ms ease-in normal both;animation:lazy-image-fadein 160ms ease-in normal both}@-webkit-keyframes lazy-image-fadein{from{opacity:0}to{opacity:1}}@keyframes lazy-image-fadein{from{opacity:0}to{opacity:1}}

dashboard-ui/bower_components/emby-webcomponents/itemhovermenu/itemhovermenu.css

@@ -1 +1 @@
-.cardOverlayTarget{position:absolute;right:0;left:0;bottom:0;top:0;background-color:rgba(0,0,0,.85);z-index:1;line-height:initial;font-size:initial}.cardOverlayInner{padding:.5em;color:#fff;text-align:left;font-size:90%}.cardOverlayMediaInfo{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-flex-wrap:wrap;flex-wrap:wrap;margin:1em 0;color:#ddd}.cardOverlayButtons{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-flex-wrap:wrap;flex-wrap:wrap}.cardOverlayFab{margin-right:.25em!important}.withHoverMenu{overflow:hidden}@media all and (max-width:1200px){.cardOverlayInner{padding-left:7px;padding-right:7px}}
+.cardOverlayTarget{position:absolute;right:0;left:0;bottom:0;top:0;background-color:rgba(0,0,0,.85);z-index:1;line-height:initial;font-size:initial;-webkit-transition:-webkit-transform .2s ease-out;-o-transition:transform .2s ease-out;transition:transform .2s ease-out;-webkit-transform:translateY(100%);transform:translateY(100%)}.cardOverlayTarget-open{-webkit-transform:none;transform:none}.cardOverlayInner{padding:.5em;color:#fff;text-align:left;font-size:90%}.cardOverlayMediaInfo{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-flex-wrap:wrap;flex-wrap:wrap;margin:1em 0;color:#ddd}.cardOverlayButtons{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-flex-wrap:wrap;flex-wrap:wrap}.cardOverlayFab{margin-right:.25em!important}.withHoverMenu{overflow:hidden}@media all and (max-width:1200px){.cardOverlayInner{padding-left:7px;padding-right:7px}}

dashboard-ui/bower_components/emby-webcomponents/layoutmanager.js

@@ -1 +1 @@
-define(["browser","appSettings","events"],function(browser,appSettings,events){"use strict";function setLayout(self,layout,selectedLayout){layout===selectedLayout?(self[layout]=!0,document.documentElement.classList.add("layout-"+layout)):(self[layout]=!1,document.documentElement.classList.remove("layout-"+layout))}function LayoutManager(){var self=this;self.setLayout=function(layout,save){layout&&"auto"!==layout?(setLayout(self,"mobile",layout),setLayout(self,"tv",layout),setLayout(self,"desktop",layout),save!==!1&&appSettings.set("layout",layout)):(self.autoLayout(),save!==!1&&appSettings.set("layout","")),events.trigger(self,"modechange")},self.getSavedLayout=function(layout){return appSettings.get("layout")},self.autoLayout=function(){browser.mobile?self.setLayout("mobile",!1):browser.tv||browser.xboxOne?self.setLayout("tv",!1):self.setLayout(self.undetectedAutoLayout||"desktop",!1)},self.init=function(){var saved=self.getSavedLayout();saved?self.setLayout(saved,!1):self.autoLayout()}}return new LayoutManager});
+define(["browser","appSettings","events"],function(browser,appSettings,events){"use strict";function setLayout(self,layout,selectedLayout){layout===selectedLayout?(self[layout]=!0,document.documentElement.classList.add("layout-"+layout)):(self[layout]=!1,document.documentElement.classList.remove("layout-"+layout))}function LayoutManager(){var self=this;self.setLayout=function(layout,save){layout&&"auto"!==layout?(setLayout(self,"mobile",layout),setLayout(self,"tv",layout),setLayout(self,"desktop",layout),save!==!1&&appSettings.set("layout",layout)):(self.autoLayout(),save!==!1&&appSettings.set("layout","")),events.trigger(self,"modechange")},self.getSavedLayout=function(layout){return appSettings.get("layout")},self.autoLayout=function(){browser.mobile?self.setLayout("mobile",!1):browser.tv||browser.xboxOne?self.setLayout("tv",!1):self.setLayout(self.defaultLayout||"tv",!1)},self.init=function(){var saved=self.getSavedLayout();saved?self.setLayout(saved,!1):self.autoLayout()}}return new LayoutManager});

dashboard-ui/bower_components/emby-webcomponents/viewmanager/viewcontainer-lite.js

@@ -1 +1 @@
-define(["browser","dom","css!./viewcontainer-lite"],function(browser,dom){"use strict";function enableAnimation(){return!browser.tv&&(!forceDisableAnimation&&browser.supportsCssAnimation())}function loadView(options){if(!options.cancel){cancelActiveAnimations();var selected=selectedPageIndex,previousAnimatable=selected===-1?null:allPages[selected],pageIndex=selected+1;pageIndex>=pageContainerCount&&(pageIndex=0);var view=document.createElement("div");options.type&&view.setAttribute("data-type",options.type);var properties=[];options.fullscreen&&properties.push("fullscreen"),properties.length&&view.setAttribute("data-properties",properties.join(",")),view.innerHTML=options.view;var currentPage=allPages[pageIndex],animatable=view;return view.classList.add("mainAnimatedPage"),currentPage?(triggerDestroy(currentPage),mainAnimatedPages.replaceChild(view,currentPage)):mainAnimatedPages.appendChild(view),allPages[pageIndex]=view,onBeforeChange&&onBeforeChange(view,!1,options),beforeAnimate(allPages,pageIndex,selected),animate(animatable,previousAnimatable,options.transition,options.isBack).then(function(){return selectedPageIndex=pageIndex,currentUrls[pageIndex]=options.url,!options.cancel&&previousAnimatable&&afterAnimate(allPages,pageIndex),view})}}function beforeAnimate(allPages,newPageIndex,oldPageIndex){for(var i=0,length=allPages.length;i<length;i++)newPageIndex===i||oldPageIndex===i||allPages[i].classList.add("hide")}function afterAnimate(allPages,newPageIndex){for(var i=0,length=allPages.length;i<length;i++)newPageIndex===i||allPages[i].classList.add("hide")}function animate(newAnimatedPage,oldAnimatedPage,transition,isBack){if(enableAnimation()&&oldAnimatedPage){if("slide"===transition)return slide(newAnimatedPage,oldAnimatedPage,transition,isBack);if("fade"===transition)return fade(newAnimatedPage,oldAnimatedPage,transition,isBack)}return Promise.resolve()}function slide(newAnimatedPage,oldAnimatedPage,transition,isBack){return new Promise(function(resolve,reject){var duration=450,animations=[];oldAnimatedPage&&(isBack?setAnimation(oldAnimatedPage,"view-slideright-r "+duration+"ms ease-out normal both"):setAnimation(oldAnimatedPage,"view-slideleft-r "+duration+"ms ease-out normal both"),animations.push(oldAnimatedPage)),isBack?setAnimation(newAnimatedPage,"view-slideright "+duration+"ms ease-out normal both"):setAnimation(newAnimatedPage,"view-slideleft "+duration+"ms ease-out normal both"),animations.push(newAnimatedPage),currentAnimations=animations;var onAnimationComplete=function(){dom.removeEventListener(newAnimatedPage,dom.whichAnimationEvent(),onAnimationComplete,{once:!0}),resolve()};dom.addEventListener(newAnimatedPage,dom.whichAnimationEvent(),onAnimationComplete,{once:!0})})}function fade(newAnimatedPage,oldAnimatedPage,transition,isBack){return new Promise(function(resolve,reject){var duration=400,animations=[];oldAnimatedPage&&(setAnimation(oldAnimatedPage,"view-fadeout "+duration+"ms ease-out normal both"),animations.push(oldAnimatedPage)),setAnimation(newAnimatedPage,"view-fadein "+duration+"ms ease-in normal both"),animations.push(newAnimatedPage),currentAnimations=animations;var onAnimationComplete=function(){dom.removeEventListener(newAnimatedPage,dom.whichAnimationEvent(),onAnimationComplete,{once:!0}),resolve()};dom.addEventListener(newAnimatedPage,dom.whichAnimationEvent(),onAnimationComplete,{once:!0})})}function setAnimation(elem,value){requestAnimationFrame(function(){elem.style.animation=value})}function cancelActiveAnimations(){for(var animations=currentAnimations,i=0,length=animations.length;i<length;i++)animations[i].animation="none"}function setOnBeforeChange(fn){onBeforeChange=fn}function tryRestoreView(options){var url=options.url,index=currentUrls.indexOf(url);if(index!==-1){var animatable=allPages[index],view=animatable;if(view){if(options.cancel)return;cancelActiveAnimations();var selected=selectedPageIndex,previousAnimatable=selected===-1?null:allPages[selected];return onBeforeChange&&onBeforeChange(view,!0,options),beforeAnimate(allPages,index,selected),animatable.classList.remove("hide"),animate(animatable,previousAnimatable,options.transition,options.isBack).then(function(){return selectedPageIndex=index,!options.cancel&&previousAnimatable&&afterAnimate(allPages,index),view})}}return Promise.reject()}function triggerDestroy(view){view.dispatchEvent(new CustomEvent("viewdestroy",{cancelable:!1}))}function reset(){allPages=[],currentUrls=[],mainAnimatedPages.innerHTML="",selectedPageIndex=-1}var onBeforeChange,mainAnimatedPages=document.querySelector(".mainAnimatedPages"),allPages=[],currentUrls=[],pageContainerCount=3,selectedPageIndex=-1,forceDisableAnimation=navigator.userAgent.toLowerCase().indexOf("embytheaterpi")!==-1,currentAnimations=[];return{loadView:loadView,tryRestoreView:tryRestoreView,reset:reset,setOnBeforeChange:setOnBeforeChange}});
+define(["browser","dom","layoutManager","css!./viewcontainer-lite"],function(browser,dom,layoutManager){"use strict";function enableAnimation(){return!browser.tv&&(!forceDisableAnimation&&browser.supportsCssAnimation())}function loadView(options){if(!options.cancel){cancelActiveAnimations();var selected=selectedPageIndex,previousAnimatable=selected===-1?null:allPages[selected],pageIndex=selected+1;pageIndex>=pageContainerCount&&(pageIndex=0);var view=document.createElement("div");options.type&&view.setAttribute("data-type",options.type);var properties=[];options.fullscreen&&properties.push("fullscreen"),properties.length&&view.setAttribute("data-properties",properties.join(",")),view.innerHTML=options.view;var currentPage=allPages[pageIndex],animatable=view;return view.classList.add("mainAnimatedPage"),currentPage?(triggerDestroy(currentPage),mainAnimatedPages.replaceChild(view,currentPage)):mainAnimatedPages.appendChild(view),allPages[pageIndex]=view,onBeforeChange&&onBeforeChange(view,!1,options),beforeAnimate(allPages,pageIndex,selected),animate(animatable,previousAnimatable,options.transition,options.isBack).then(function(){return selectedPageIndex=pageIndex,currentUrls[pageIndex]=options.url,!options.cancel&&previousAnimatable&&afterAnimate(allPages,pageIndex),view})}}function beforeAnimate(allPages,newPageIndex,oldPageIndex){for(var i=0,length=allPages.length;i<length;i++)newPageIndex===i||oldPageIndex===i||allPages[i].classList.add("hide")}function afterAnimate(allPages,newPageIndex){for(var i=0,length=allPages.length;i<length;i++)newPageIndex===i||allPages[i].classList.add("hide")}function animate(newAnimatedPage,oldAnimatedPage,transition,isBack){if(enableAnimation()&&oldAnimatedPage){if("slide"===transition)return slide(newAnimatedPage,oldAnimatedPage,transition,isBack);if("fade"===transition)return fade(newAnimatedPage,oldAnimatedPage,transition,isBack)}return Promise.resolve()}function slide(newAnimatedPage,oldAnimatedPage,transition,isBack){return new Promise(function(resolve,reject){var duration=450,animations=[];oldAnimatedPage&&(isBack?setAnimation(oldAnimatedPage,"view-slideright-r "+duration+"ms ease-out normal both"):setAnimation(oldAnimatedPage,"view-slideleft-r "+duration+"ms ease-out normal both"),animations.push(oldAnimatedPage)),isBack?setAnimation(newAnimatedPage,"view-slideright "+duration+"ms ease-out normal both"):setAnimation(newAnimatedPage,"view-slideleft "+duration+"ms ease-out normal both"),animations.push(newAnimatedPage),currentAnimations=animations;var onAnimationComplete=function(){dom.removeEventListener(newAnimatedPage,dom.whichAnimationEvent(),onAnimationComplete,{once:!0}),resolve()};dom.addEventListener(newAnimatedPage,dom.whichAnimationEvent(),onAnimationComplete,{once:!0})})}function fade(newAnimatedPage,oldAnimatedPage,transition,isBack){return new Promise(function(resolve,reject){var duration=layoutManager.tv?450:160,animations=[];newAnimatedPage.style.opacity=0,setAnimation(newAnimatedPage,"view-fadein "+duration+"ms ease-in normal both"),animations.push(newAnimatedPage),oldAnimatedPage&&(setAnimation(oldAnimatedPage,"view-fadeout "+duration+"ms ease-out normal both"),animations.push(oldAnimatedPage)),currentAnimations=animations;var onAnimationComplete=function(){dom.removeEventListener(newAnimatedPage,dom.whichAnimationEvent(),onAnimationComplete,{once:!0}),resolve()};dom.addEventListener(newAnimatedPage,dom.whichAnimationEvent(),onAnimationComplete,{once:!0})})}function setAnimation(elem,value){requestAnimationFrame(function(){elem.style.animation=value})}function cancelActiveAnimations(){for(var animations=currentAnimations,i=0,length=animations.length;i<length;i++)animations[i].animation="none"}function setOnBeforeChange(fn){onBeforeChange=fn}function tryRestoreView(options){var url=options.url,index=currentUrls.indexOf(url);if(index!==-1){var animatable=allPages[index],view=animatable;if(view){if(options.cancel)return;cancelActiveAnimations();var selected=selectedPageIndex,previousAnimatable=selected===-1?null:allPages[selected];return onBeforeChange&&onBeforeChange(view,!0,options),beforeAnimate(allPages,index,selected),animatable.classList.remove("hide"),animate(animatable,previousAnimatable,options.transition,options.isBack).then(function(){return selectedPageIndex=index,!options.cancel&&previousAnimatable&&afterAnimate(allPages,index),view})}}return Promise.reject()}function triggerDestroy(view){view.dispatchEvent(new CustomEvent("viewdestroy",{cancelable:!1}))}function reset(){allPages=[],currentUrls=[],mainAnimatedPages.innerHTML="",selectedPageIndex=-1}var onBeforeChange,mainAnimatedPages=document.querySelector(".mainAnimatedPages"),allPages=[],currentUrls=[],pageContainerCount=3,selectedPageIndex=-1,forceDisableAnimation=navigator.userAgent.toLowerCase().indexOf("embytheaterpi")!==-1,currentAnimations=[];return{loadView:loadView,tryRestoreView:tryRestoreView,reset:reset,setOnBeforeChange:setOnBeforeChange}});