merge branch master into controllers
3
.gitignore
vendored
|
@ -81,6 +81,9 @@ build/Release
|
|||
node_modules/
|
||||
jspm_packages/
|
||||
|
||||
# Dependency lockfile
|
||||
package-lock.json
|
||||
|
||||
# TypeScript v1 declaration files
|
||||
typings/
|
||||
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
<a href="https://translate.jellyfin.org/projects/jellyfin/jellyfin-web/?utm_source=widget">
|
||||
<img src="https://translate.jellyfin.org/widgets/jellyfin/-/jellyfin-web/svg-badge.svg" alt="Translation Status"/>
|
||||
</a>
|
||||
</br>
|
||||
<br/>
|
||||
<a href="https://opencollective.com/jellyfin">
|
||||
<img alt="Donate" src="https://img.shields.io/opencollective/all/jellyfin.svg?label=backers"/>
|
||||
</a>
|
||||
|
@ -53,7 +53,7 @@ Jellyfin Web is the frontend used for most of the clients available for end user
|
|||
git clone https://github.com/jellyfin/jellyfin-web.git
|
||||
cd jellyfin-web
|
||||
```
|
||||
2. Install build dependencies in the project directory via npm.
|
||||
2. Install build dependencies in the project directory.
|
||||
```sh
|
||||
yarn install
|
||||
```
|
||||
|
|
20
package.json
|
@ -5,12 +5,14 @@
|
|||
"repository": "https://github.com/jellyfin/jellyfin-web",
|
||||
"license": "GPL-2.0-or-later",
|
||||
"devDependencies": {
|
||||
"autoprefixer": "^9.7.3",
|
||||
"clean-webpack-plugin": "^3.0.0",
|
||||
"copy-webpack-plugin": "^5.0.3",
|
||||
"copy-webpack-plugin": "^5.1.1",
|
||||
"css-loader": "^2.1.0",
|
||||
"eslint": "^5.16.0",
|
||||
"file-loader": "^3.0.1",
|
||||
"html-webpack-plugin": "^3.2.0",
|
||||
"postcss-loader": "^3.0.0",
|
||||
"style-loader": "^0.23.1",
|
||||
"webpack": "^4.41.0",
|
||||
"webpack-cli": "^3.3.9",
|
||||
|
@ -33,9 +35,25 @@
|
|||
"shaka-player": "^2.5.5",
|
||||
"sortablejs": "^1.9.0",
|
||||
"swiper": "^3.4.2",
|
||||
"libass-wasm": "^2.1.1",
|
||||
"webcomponents.js": "^0.7.24",
|
||||
"whatwg-fetch": "^1.1.1"
|
||||
},
|
||||
"browserslist": [
|
||||
"last 2 Firefox versions",
|
||||
"last 2 Chrome versions",
|
||||
"last 2 ChromeAndroid versions",
|
||||
"last 2 Safari versions",
|
||||
"last 2 iOS versions",
|
||||
"last 2 Edge versions",
|
||||
"Chrome 38",
|
||||
"Chrome 47",
|
||||
"Chrome 53",
|
||||
"Chrome 56",
|
||||
"Chrome 63",
|
||||
"Explorer 11",
|
||||
"Firefox ESR"
|
||||
],
|
||||
"scripts": {
|
||||
"serve": "webpack-dev-server --config webpack.dev.js --open",
|
||||
"build": "webpack --config webpack.prod.js",
|
||||
|
|
5
postcss.config.js
Normal file
|
@ -0,0 +1,5 @@
|
|||
module.exports = {
|
||||
plugins: [
|
||||
require('autoprefixer')
|
||||
]
|
||||
}
|
|
@ -1,7 +1,6 @@
|
|||
.dashboardColumn,
|
||||
.dashboardSections {
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.dashboardFooter {
|
||||
|
@ -15,8 +14,6 @@
|
|||
|
||||
progress {
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
margin: 0;
|
||||
background: #ccc !important
|
||||
}
|
||||
|
@ -76,23 +73,17 @@ progress[aria-valuenow]:before {
|
|||
div[data-role=controlgroup] a[data-role=button] {
|
||||
display: inline-block !important;
|
||||
margin: 0 !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
-webkit-border-radius: 0;
|
||||
border-radius: 0
|
||||
}
|
||||
|
||||
div[data-role=controlgroup] a[data-role=button]:first-child {
|
||||
-webkit-border-bottom-left-radius: .3125em;
|
||||
border-bottom-left-radius: .3125em;
|
||||
-webkit-border-top-left-radius: .3125em;
|
||||
border-top-left-radius: .3125em
|
||||
}
|
||||
|
||||
div[data-role=controlgroup] a[data-role=button]:last-child {
|
||||
-webkit-border-bottom-right-radius: .3125em;
|
||||
border-bottom-right-radius: .3125em;
|
||||
-webkit-border-top-right-radius: .3125em;
|
||||
border-top-right-radius: .3125em
|
||||
}
|
||||
|
||||
|
@ -146,23 +137,14 @@ div[data-role=controlgroup] a.ui-btn-active {
|
|||
}
|
||||
|
||||
.dashboardSections {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column
|
||||
}
|
||||
|
||||
.dashboardColumn {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1
|
||||
}
|
||||
|
||||
|
@ -171,7 +153,6 @@ div[data-role=controlgroup] a.ui-btn-active {
|
|||
}
|
||||
|
||||
.dashboardSection {
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
margin: 0 0 2em
|
||||
}
|
||||
|
@ -187,11 +168,7 @@ div[data-role=controlgroup] a.ui-btn-active {
|
|||
|
||||
@media all and (min-width:70em) {
|
||||
.dashboardSections {
|
||||
-webkit-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: normal;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row
|
||||
}
|
||||
|
||||
|
@ -296,7 +273,6 @@ div[data-role=controlgroup] a.ui-btn-active {
|
|||
}
|
||||
|
||||
.sessionNowPlayingContent {
|
||||
-webkit-background-size: cover;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
|
@ -395,7 +371,6 @@ div[data-role=controlgroup] a.ui-btn-active {
|
|||
}
|
||||
|
||||
.disabledUser {
|
||||
-webkit-filter: grayscale(100%);
|
||||
filter: grayscale(100%)
|
||||
}
|
||||
|
||||
|
@ -416,9 +391,7 @@ div[data-role=controlgroup] a.ui-btn-active {
|
|||
}
|
||||
|
||||
a[data-role=button] {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-webkit-user-select: none;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
cursor: pointer !important;
|
||||
font-family: inherit !important;
|
||||
font-weight: 500 !important;
|
||||
|
@ -430,37 +403,21 @@ a[data-role=button] {
|
|||
background: #292929 !important;
|
||||
}
|
||||
|
||||
@-webkit-keyframes rotating {
|
||||
from {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0)
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes rotating {
|
||||
from {
|
||||
-webkit-transform: rotate(0);
|
||||
transform: rotate(0)
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg)
|
||||
}
|
||||
}
|
||||
|
||||
.rotatingCircle {
|
||||
-webkit-animation: rotating 2s linear infinite;
|
||||
animation: rotating 2s linear infinite
|
||||
}
|
||||
|
||||
.pluginPreviewImg {
|
||||
-webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
|
||||
box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37)
|
||||
}
|
||||
|
|
@ -4,7 +4,6 @@ html {
|
|||
|
||||
html {
|
||||
font-size: 93%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
text-size-adjust: 100%;
|
||||
}
|
||||
|
|
@ -15,7 +15,6 @@
|
|||
.headerSelectedPlayer,
|
||||
.itemMiscInfo,
|
||||
.navMenuOptionText {
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden
|
||||
}
|
||||
|
@ -25,7 +24,7 @@
|
|||
}
|
||||
|
||||
.itemDetailPage {
|
||||
padding-top: 4em !important
|
||||
padding-top: 0em !important
|
||||
}
|
||||
|
||||
.standalonePage {
|
||||
|
@ -48,8 +47,6 @@
|
|||
z-index: 1;
|
||||
margin: 0 !important;
|
||||
top: 6.9em !important;
|
||||
-webkit-transition: -webkit-transform .2s ease-out;
|
||||
-o-transition: transform .2s ease-out;
|
||||
transition: transform .2s ease-out
|
||||
}
|
||||
|
||||
|
@ -58,17 +55,14 @@
|
|||
}
|
||||
|
||||
.headerUserImage {
|
||||
-webkit-background-size: contain;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
-webkit-border-radius: 100em;
|
||||
border-radius: 100em;
|
||||
display: inline-block
|
||||
}
|
||||
|
||||
.headerUserButtonRound div {
|
||||
-webkit-border-radius: 100em;
|
||||
border-radius: 100em;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
|
@ -76,7 +70,6 @@
|
|||
}
|
||||
|
||||
.headerButton {
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0
|
||||
}
|
||||
|
||||
|
@ -90,34 +83,25 @@
|
|||
}
|
||||
|
||||
.pageTitle {
|
||||
display: -webkit-inline-box;
|
||||
display: -webkit-inline-flex;
|
||||
display: inline-flex;
|
||||
margin: 0 0 0 .5em;
|
||||
margin: .3em 0 0 .5em;
|
||||
height: 1.7em;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-flex-shrink: 1;
|
||||
flex-shrink: 1
|
||||
}
|
||||
|
||||
.headerLeft,
|
||||
.skinHeader {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.detailButton-mobile,
|
||||
.skinHeader {
|
||||
-webkit-flex-direction: column;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.pageTitleWithLogo {
|
||||
background-position: left center;
|
||||
-webkit-background-size: contain;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
width: 13.2em
|
||||
|
@ -137,7 +121,7 @@
|
|||
|
||||
.headerLeft,
|
||||
.headerRight {
|
||||
-webkit-box-align: center
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.hiddenViewMenuBar .skinHeader {
|
||||
|
@ -150,12 +134,10 @@
|
|||
|
||||
.headerLeft {
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1;
|
||||
overflow: hidden
|
||||
overflow: hidden;
|
||||
justify-content: left;
|
||||
}
|
||||
|
||||
.sectionTabs {
|
||||
|
@ -163,13 +145,8 @@
|
|||
}
|
||||
|
||||
.headerRight {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: end;
|
||||
-webkit-justify-content: flex-end;
|
||||
justify-content: flex-end
|
||||
}
|
||||
|
||||
|
@ -178,27 +155,19 @@
|
|||
}
|
||||
|
||||
.navMenuOption {
|
||||
display: -webkit-box !important;
|
||||
display: -webkit-flex !important;
|
||||
display: flex !important;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
padding: .9em 0 .9em 2.4em !important;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1;
|
||||
font-weight: 400 !important;
|
||||
margin: 0 !important;
|
||||
-webkit-border-radius: 0 !important;
|
||||
border-radius: 0 !important
|
||||
}
|
||||
|
||||
.navMenuOptionIcon {
|
||||
margin-right: 1.2em;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0
|
||||
}
|
||||
|
||||
|
@ -212,8 +181,6 @@
|
|||
}
|
||||
|
||||
.dashboardDocument .skinBody {
|
||||
-webkit-transition: left ease-in-out .3s, padding ease-in-out .3s;
|
||||
-o-transition: left ease-in-out .3s, padding ease-in-out .3s;
|
||||
transition: left ease-in-out .3s, padding ease-in-out .3s;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
@ -233,6 +200,7 @@
|
|||
}
|
||||
|
||||
@media all and (min-width:40em) {
|
||||
|
||||
.dashboardDocument .adminDrawerLogo,
|
||||
.dashboardDocument .mainDrawerButton {
|
||||
display: none !important
|
||||
|
@ -242,9 +210,7 @@
|
|||
z-index: inherit !important;
|
||||
left: 0 !important;
|
||||
top: 0 !important;
|
||||
-webkit-transform: none !important;
|
||||
transform: none !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
width: 20.205em !important;
|
||||
font-size: 94%
|
||||
|
@ -281,14 +247,9 @@
|
|||
}
|
||||
|
||||
.headerTabs {
|
||||
-webkit-align-self: center;
|
||||
align-self: center;
|
||||
width: auto;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
margin-top: -3.34em;
|
||||
position: relative;
|
||||
|
@ -346,8 +307,6 @@
|
|||
}
|
||||
|
||||
.flexPageTabContent.is-active {
|
||||
display: -webkit-box !important;
|
||||
display: -webkit-flex !important;
|
||||
display: flex !important
|
||||
}
|
||||
|
||||
|
@ -363,7 +322,6 @@
|
|||
margin: 1.5em 0;
|
||||
background: #222;
|
||||
padding: .8em .8em .8em 3em;
|
||||
-webkit-border-radius: .3em;
|
||||
border-radius: .3em;
|
||||
position: relative
|
||||
}
|
||||
|
@ -422,8 +380,9 @@
|
|||
}
|
||||
|
||||
.itemBackdrop {
|
||||
-webkit-background-size: cover;
|
||||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
height: 50vh;
|
||||
position: relative
|
||||
}
|
||||
|
@ -435,41 +394,73 @@
|
|||
right: 0
|
||||
}
|
||||
|
||||
.itemBackdropFader {
|
||||
position: absolute;
|
||||
bottom: -1px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 15vh
|
||||
}
|
||||
|
||||
.desktopMiscInfoContainer {
|
||||
position: absolute;
|
||||
bottom: .75em
|
||||
}
|
||||
|
||||
.layout-mobile .detailPagePrimaryContainer {
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.layout-tv .detailPagePrimaryContainer {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.detailPagePrimaryContainer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-content: center;
|
||||
position: sticky;
|
||||
background-color: #101010;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.infoWrapper {
|
||||
flex: 1 0 0;
|
||||
}
|
||||
|
||||
.infoText {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.detailPageSecondaryContainer {
|
||||
margin: 1.25em 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding-left: 2%;
|
||||
padding-right: 2%;
|
||||
}
|
||||
|
||||
.layout-mobile .detailImageContainer,
|
||||
.layout-tv .detailImageContainer {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.detailImageContainer {
|
||||
margin-right: 2em;
|
||||
width: 280px;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
margin-left: .6em
|
||||
margin: 1.25em 0;
|
||||
position: sticky;
|
||||
top: 15%;
|
||||
float: left;
|
||||
width: 22.786458333333332vw;
|
||||
}
|
||||
|
||||
.detailPagePrimaryContent {
|
||||
position: relative;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1
|
||||
}
|
||||
|
||||
.detailLogo {
|
||||
width: 21.3em;
|
||||
height: 5em;
|
||||
width: 25em;
|
||||
height: 9.375em;
|
||||
position: absolute;
|
||||
top: 13.5%;
|
||||
right: 19.5%;
|
||||
-webkit-background-size: contain;
|
||||
top: 14.5%;
|
||||
right: 10.5%;
|
||||
background-size: contain
|
||||
}
|
||||
|
||||
|
@ -498,13 +489,8 @@
|
|||
}
|
||||
|
||||
.itemDetailImage {
|
||||
width: 100%;
|
||||
-webkit-box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
|
||||
box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37)
|
||||
}
|
||||
|
||||
.thumbDetailImageContainer {
|
||||
width: 400px
|
||||
width: 100% !important;
|
||||
box-shadow: 0 .0725em .29em 0 rgba(0, 0, 0, .37);
|
||||
}
|
||||
|
||||
@media all and (max-width:62.5em) {
|
||||
|
@ -512,36 +498,11 @@
|
|||
position: relative
|
||||
}
|
||||
|
||||
.detailImageContainer {
|
||||
position: absolute;
|
||||
top: -90px;
|
||||
left: 5%;
|
||||
width: auto
|
||||
}
|
||||
|
||||
.itemDetailImage {
|
||||
height: 120px;
|
||||
width: auto !important
|
||||
}
|
||||
|
||||
.btnPlaySimple {
|
||||
display: none !important
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (min-width:62.5em) {
|
||||
.itemBackdrop {
|
||||
display: none
|
||||
}
|
||||
|
||||
.detailPagePrimaryContainer {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
margin-bottom: 3em
|
||||
}
|
||||
}
|
||||
|
||||
@media all and (max-width:75em) {
|
||||
.lnkSibling {
|
||||
display: none !important
|
||||
|
@ -597,8 +558,7 @@
|
|||
|
||||
.detailButton-mobile,
|
||||
.mainDetailButtons {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.itemName {
|
||||
|
@ -619,18 +579,14 @@
|
|||
|
||||
.mainDetailButtons {
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
margin: 1em 0
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.recordingFields button {
|
||||
margin-left: 0;
|
||||
margin-right: .5em;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0
|
||||
}
|
||||
|
||||
|
@ -641,11 +597,7 @@
|
|||
.detailButton-mobile {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
margin: 0 !important;
|
||||
padding: .5em .7em !important
|
||||
|
@ -677,18 +629,9 @@
|
|||
}
|
||||
|
||||
.detailButton-mobile-content {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
|
@ -699,11 +642,8 @@
|
|||
}
|
||||
|
||||
.detailImageProgressContainer {
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
right: 1px;
|
||||
left: 1px;
|
||||
text-align: center
|
||||
margin-left: 6px;
|
||||
width: 21.886458333333332vw;
|
||||
}
|
||||
|
||||
.detailButton-mobile-text {
|
||||
|
@ -723,7 +663,7 @@
|
|||
}
|
||||
|
||||
@media all and (min-width:62.5em) {
|
||||
.detailButton-mobile {
|
||||
.detailFloatingButton {
|
||||
display: none !important
|
||||
}
|
||||
|
||||
|
@ -745,21 +685,14 @@
|
|||
}
|
||||
|
||||
.itemMiscInfo {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
@media all and (max-width:31.25em) {
|
||||
.mobileDetails .itemMiscInfo {
|
||||
text-align: center;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
|
@ -775,13 +708,11 @@
|
|||
.detailPageContent {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
padding-top: 3em
|
||||
}
|
||||
|
||||
@media all and (max-width:62.5em) {
|
||||
.detailPageContent-nodetailimg {
|
||||
padding-top: 0;
|
||||
margin-top: -3em
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -851,7 +782,6 @@
|
|||
}
|
||||
|
||||
.btnSyncComplete i {
|
||||
-webkit-border-radius: 100em;
|
||||
border-radius: 100em
|
||||
}
|
||||
|
||||
|
@ -860,14 +790,9 @@
|
|||
}
|
||||
|
||||
.mediaInfoIcons {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
margin: 1em 0;
|
||||
-webkit-flex-wrap: wrap;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
|
||||
|
@ -892,17 +817,19 @@
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* these next two rules are for the scroller element headers */
|
||||
.sectionTitleContainer-cards {
|
||||
margin-bottom: 0;
|
||||
margin: 0;
|
||||
padding-top: 1.25em;
|
||||
}
|
||||
|
||||
.sectionTitle-cards {
|
||||
margin-bottom: 0;
|
||||
div:not(.sectionTitleContainer-cards) > .sectionTitle-cards {
|
||||
margin: 0;
|
||||
padding-top: 1.25em;
|
||||
}
|
||||
|
||||
.sectionTitleButton {
|
||||
margin-left: 1.5em !important;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0
|
||||
}
|
||||
|
||||
|
@ -912,22 +839,17 @@
|
|||
|
||||
.sectionTitleIconButton {
|
||||
margin-left: 1.5em !important;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0;
|
||||
font-size: 84% !important;
|
||||
padding: .5em !important
|
||||
}
|
||||
|
||||
.horizontalItemsContainer {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex
|
||||
}
|
||||
|
||||
.sectionTitleTextButton {
|
||||
margin: 0 !important;
|
||||
display: -webkit-inline-box !important;
|
||||
display: -webkit-inline-flex !important;
|
||||
display: inline-flex !important;
|
||||
color: inherit !important
|
||||
}
|
||||
|
@ -999,8 +921,6 @@
|
|||
}
|
||||
|
||||
.itemsViewSettingsContainer {
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center
|
||||
}
|
||||
|
|
@ -28,17 +28,13 @@
|
|||
|
||||
.jstree-wholerow-hovered {
|
||||
background: #38c !important;
|
||||
-webkit-border-radius: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important
|
||||
}
|
||||
|
||||
.jstree-default .jstree-hovered {
|
||||
background: 0 0 !important;
|
||||
-webkit-border-radius: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
box-shadow: none !important;
|
||||
color: #fff !important
|
||||
}
|
|
@ -1,6 +1,5 @@
|
|||
.scrollX {
|
||||
overflow-x: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow-y: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
@ -10,13 +9,11 @@
|
|||
}
|
||||
|
||||
.hiddenScrollX, .layout-tv .scrollX {
|
||||
-ms-overflow-style: none;
|
||||
/* Can't do this because it not only hides the scrollbar, but also prevents scrolling */
|
||||
/*overflow: -moz-scrollbars-none;*/
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.hiddenScrollX-forced {
|
||||
overflow: -moz-scrollbars-none;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.hiddenScrollX::-webkit-scrollbar, .layout-tv .scrollX::-webkit-scrollbar {
|
||||
|
@ -26,25 +23,21 @@
|
|||
|
||||
.scrollY {
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.smoothScrollY {
|
||||
overflow-y: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow-x: hidden;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
.hiddenScrollY, .layout-tv .smoothScrollY {
|
||||
-ms-overflow-style: none;
|
||||
/* Can't do this because it not only hides the scrollbar, but also prevents scrolling */
|
||||
/*overflow: -moz-scrollbars-none;*/
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.hiddenScrollY-forced {
|
||||
overflow: -moz-scrollbars-none;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
|
||||
.hiddenScrollY::-webkit-scrollbar, .layout-tv .smoothScrollY::-webkit-scrollbar, .layout-tv .scrollY::-webkit-scrollbar {
|
|
@ -20,18 +20,12 @@ html {
|
|||
|
||||
.layout-mobile,
|
||||
.layout-tv {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
background-color: transparent !important;
|
||||
-webkit-font-smoothing: antialiased
|
||||
}
|
||||
|
||||
.mainAnimatedPage {
|
|
@ -1,8 +1,6 @@
|
|||
.chapterThumbTextContainer,
|
||||
.videoOsdBottom {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.osdPoster img,
|
||||
|
@ -14,13 +12,10 @@
|
|||
}
|
||||
|
||||
.osdHeader {
|
||||
-webkit-transition: opacity .3s ease-out;
|
||||
-o-transition: opacity .3s ease-out;
|
||||
transition: opacity .3s ease-out;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
background: rgba(0, 0, 0, 0.7) !important;
|
||||
-webkit-backdrop-filter: none !important;
|
||||
backdrop-filter: none !important;
|
||||
color: #eee !important;
|
||||
}
|
||||
|
@ -34,17 +29,13 @@
|
|||
}
|
||||
|
||||
.chapterThumbContainer {
|
||||
-webkit-box-shadow: 0 0 1.9vh #000;
|
||||
box-shadow: 0 0 1.9vh #000;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1;
|
||||
position: relative
|
||||
}
|
||||
|
||||
.chapterThumb {
|
||||
background-position: center center;
|
||||
-webkit-background-size: contain;
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
border: 0;
|
||||
|
@ -90,20 +81,12 @@
|
|||
position: fixed;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
padding: 1%;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: normal;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
will-change: opacity;
|
||||
-webkit-transition: opacity 0.3s ease-out;
|
||||
-o-transition: opacity 0.3s ease-out;
|
||||
transition: opacity 0.3s ease-out;
|
||||
color: #fff;
|
||||
user-select: none;
|
||||
-webkit-touch-callout: none
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.videoOsdBottom-hidden {
|
||||
|
@ -111,49 +94,35 @@
|
|||
}
|
||||
|
||||
.osdControls {
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1
|
||||
}
|
||||
|
||||
.videoOsdBottom .buttons {
|
||||
padding: .25em 0 0;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.osdVolumeSliderContainer {
|
||||
width: 9em;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1
|
||||
}
|
||||
|
||||
.osdMediaInfo,
|
||||
.volumeButtons {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
-webkit-box-align: center
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.volumeButtons {
|
||||
margin: 0 .5em 0 auto;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.osdTimeText {
|
||||
margin-left: 1em;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none
|
||||
}
|
||||
|
||||
|
@ -167,15 +136,10 @@
|
|||
position: absolute;
|
||||
height: auto;
|
||||
width: 100%;
|
||||
-webkit-box-shadow: 0 0 1.9vh #000;
|
||||
box-shadow: 0 0 1.9vh #000;
|
||||
border: .08em solid #222;
|
||||
user-drag: none;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-drag: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none
|
||||
user-select: none
|
||||
}
|
||||
|
||||
.osdTitle,
|
||||
|
@ -185,7 +149,6 @@
|
|||
|
||||
.osdMediaInfo {
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
|
@ -194,23 +157,14 @@
|
|||
}
|
||||
|
||||
.osdTextContainer {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
margin-bottom: .7em;
|
||||
padding-left: .5em
|
||||
}
|
||||
|
||||
.osdMainTextContainer {
|
||||
-webkit-box-align: baseline;
|
||||
-webkit-align-items: baseline;
|
||||
align-items: baseline
|
||||
}
|
||||
|
||||
|
@ -218,12 +172,13 @@
|
|||
margin-left: auto;
|
||||
}
|
||||
|
||||
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
|
||||
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
|
||||
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
|
||||
@keyframes spin {
|
||||
100% {
|
||||
transform:rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
.osdMediaStatus .animate {
|
||||
-webkit-animation:spin 4s linear infinite;
|
||||
-moz-animation:spin 4s linear infinite;
|
||||
animation:spin 4s linear infinite;
|
||||
}
|
||||
|
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 3.5 KiB |
4
src/assets/img/devices/android.svg
Normal file
|
@ -0,0 +1,4 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M24 19H0a13.6 13.6 0 0 1 2.21-6.07A11.2 11.2 0 0 1 5.87 9.4l.41-.23-2.02-3.41a.51.51 0 0 1 .17-.7.5.5 0 0 1 .69.18l2.08 3.5a12.62 12.62 0 0 1 4.84-.9 12.2 12.2 0 0 1 4.75.9l2.07-3.5a.5.5 0 0 1 .7-.17.51.51 0 0 1 .16.7L17.7 9.19l.5.28a11.38 11.38 0 0 1 3.63 3.62A14.48 14.48 0 0 1 24 19zm-7.5-4.48a1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1 1 1 0 0 0-1 1zm-11 0a1 1 0 0 0 1 1 1 1 0 0 0 1-1 1 1 0 0 0-1-1 1 1 0 0 0-1 1z"/>
|
||||
</svg>
|
After Width: | Height: | Size: 551 B |
Before Width: | Height: | Size: 863 B After Width: | Height: | Size: 863 B |
Before Width: | Height: | Size: 1.4 KiB After Width: | Height: | Size: 1.4 KiB |
Before Width: | Height: | Size: 2.5 KiB After Width: | Height: | Size: 2.5 KiB |
Before Width: | Height: | Size: 345 B After Width: | Height: | Size: 345 B |
11
src/assets/img/devices/kodi.svg
Normal file
|
@ -0,0 +1,11 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="24" height="24" version="1.1" viewBox="0 0 6.35 6.35" xmlns="http://www.w3.org/2000/svg">
|
||||
<g transform="translate(-36.173 -93.796)">
|
||||
<g transform="matrix(.08 0 0 .08 40.527 88.485)">
|
||||
<path d="m53.295 119.35v-39.688h79.375v79.375h-79.375z" fill="#fcfdfd" stroke-width=".26458"/>
|
||||
</g>
|
||||
<g transform="matrix(1.3761 0 0 1.3825 -26.63 -38.456)" fill="#fff">
|
||||
<path transform="matrix(.08 0 0 .08 40.527 88.485)" d="m86.822 141.89c-4.738-4.7596-5.2168-5.3235-5.2168-6.1442 0-0.82158 0.47505-1.3787 5.2329-6.1365 4.7552-4.7552 5.3153-5.2329 6.1353-5.2329 0.81617 0 1.3676 0.46161 5.7678 4.8286 4.8692 4.8324 5.6182 5.7452 5.6182 6.8466 0 0.41218-1.5697 2.1641-5.2274 5.834-4.8206 4.8367-5.3 5.2449-6.1603 5.2449-0.86046 0-1.3378-0.40681-6.1497-5.2406zm22.168-12.455c-0.43656-0.27248-2.9071-2.6371-5.4901-5.2547-4.1957-4.2519-4.6964-4.8534-4.6964-5.6418 0-0.7938 0.52954-1.414 5.2644-6.1655 4.6582-4.6746 5.362-5.2829 6.1127-5.2829 0.75071 0 1.4546 0.60829 6.1127 5.2829 4.7729 4.7898 5.2644 5.3668 5.2644 6.1818 0 0.81542-0.48628 1.3851-5.2394 6.1382-5.6104 5.6104-5.7707 5.7142-7.3283 4.742zm-40.16-5.2731c-3.5636-3.5816-4.9518-5.1483-4.9518-5.5886 0-0.75745 9.3384-10.601 10.057-10.601 0.2584 0 0.54208 0.18833 0.63041 0.41851s0.1606 4.7624 0.1606 10.072c0 9.1098-0.10948 10.677-0.74606 10.677-0.10905 0-2.4266-2.2396-5.1501-4.9768zm13.2-1.5272c-0.08833-0.23018-0.1606-5.3558-0.1606-11.39 0-8.9734 0.06852-11.102 0.37621-11.686 0.20691-0.39296 2.447-2.7683 4.9781-5.2785 4.3226-4.2871 4.6624-4.5641 5.5987-4.5641 0.94583 0 1.2591 0.26717 6.1277 5.2255 4.658 4.7439 5.1315 5.3102 5.1376 6.1439 6e-3 0.85888-0.67407 1.6-10.506 11.443-5.782 5.7887-10.71 10.525-10.952 10.525s-0.51144-0.18833-0.59977-0.41852z" fill="#fff" stroke-width=".26458"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 1.8 KiB |
Before Width: | Height: | Size: 1,015 B After Width: | Height: | Size: 1,015 B |
Before Width: | Height: | Size: 683 B After Width: | Height: | Size: 683 B |
Before Width: | Height: | Size: 453 B After Width: | Height: | Size: 453 B |
Before Width: | Height: | Size: 833 B After Width: | Height: | Size: 833 B |
Before Width: | Height: | Size: 1.8 KiB After Width: | Height: | Size: 1.8 KiB |
Before Width: | Height: | Size: 2.3 KiB After Width: | Height: | Size: 2.3 KiB |
Before Width: | Height: | Size: 241 B After Width: | Height: | Size: 241 B |
Before Width: | Height: | Size: 861 B After Width: | Height: | Size: 861 B |
Before Width: | Height: | Size: 2.6 KiB After Width: | Height: | Size: 2.6 KiB |
Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 39 KiB |
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 43 KiB |
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 43 KiB |
Before Width: | Height: | Size: 48 KiB After Width: | Height: | Size: 48 KiB |
Before Width: | Height: | Size: 45 KiB After Width: | Height: | Size: 45 KiB |
Before Width: | Height: | Size: 57 KiB After Width: | Height: | Size: 57 KiB |
Before Width: | Height: | Size: 52 KiB After Width: | Height: | Size: 52 KiB |
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 49 KiB |
Before Width: | Height: | Size: 46 KiB After Width: | Height: | Size: 46 KiB |
Before Width: | Height: | Size: 26 KiB After Width: | Height: | Size: 26 KiB |
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
Before Width: | Height: | Size: 29 KiB After Width: | Height: | Size: 29 KiB |
Before Width: | Height: | Size: 33 KiB After Width: | Height: | Size: 33 KiB |
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 42 KiB |
Before Width: | Height: | Size: 41 KiB After Width: | Height: | Size: 41 KiB |
Before Width: | Height: | Size: 41 KiB After Width: | Height: | Size: 41 KiB |
Before Width: | Height: | Size: 44 KiB After Width: | Height: | Size: 44 KiB |
Before Width: | Height: | Size: 31 KiB After Width: | Height: | Size: 31 KiB |
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 36 KiB |
Before Width: | Height: | Size: 45 KiB After Width: | Height: | Size: 45 KiB |
Before Width: | Height: | Size: 43 KiB After Width: | Height: | Size: 43 KiB |
|
@ -17,7 +17,7 @@ _define("fetch", function() {
|
|||
});
|
||||
|
||||
// flvjs
|
||||
var flvjs = require("flv.js");
|
||||
var flvjs = require("flv.js").default;
|
||||
_define("flvjs", function() {
|
||||
return flvjs;
|
||||
});
|
||||
|
@ -54,7 +54,7 @@ _define("native-promise-only", function() {
|
|||
});
|
||||
|
||||
// resize-observer-polyfill
|
||||
var resize = require("resize-observer-polyfill");
|
||||
var resize = require("resize-observer-polyfill").default;
|
||||
_define("resize-observer-polyfill", function() {
|
||||
return resize;
|
||||
});
|
||||
|
@ -73,7 +73,7 @@ _define("swiper", function() {
|
|||
});
|
||||
|
||||
// sortable
|
||||
var sortable = require("sortablejs");
|
||||
var sortable = require("sortablejs").default;
|
||||
_define("sortable", function() {
|
||||
return sortable;
|
||||
});
|
||||
|
@ -90,3 +90,9 @@ require("libjass/libjass.css");
|
|||
_define("libjass", function() {
|
||||
return libjass;
|
||||
});
|
||||
|
||||
// libass-wasm
|
||||
var libass_wasm = require("libass-wasm");
|
||||
_define("JavascriptSubtitlesOctopus", function() {
|
||||
return libass_wasm;
|
||||
});
|
||||
|
|
|
@ -37,11 +37,12 @@
|
|||
box-shadow: none;
|
||||
flex-shrink: 0;
|
||||
border-radius: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.actionSheetMenuItem:focus {
|
||||
.actionSheetMenuItem:focus {
|
||||
transform: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.actionsheetListItemBody {
|
||||
padding: .4em 1em .4em .6em !important;
|
||||
|
@ -104,7 +105,7 @@
|
|||
}
|
||||
|
||||
.actionsheet-xlargeFont {
|
||||
font-size: 112%!important;
|
||||
font-size: 112% !important;
|
||||
}
|
||||
|
||||
.btnCloseActionSheet {
|
||||
|
|
|
@ -278,6 +278,7 @@ define(["appSettings", "browser", "events", "htmlMediaHelper"], function (appSet
|
|||
features.push("targetblank");
|
||||
// allows users to connect to more than one server
|
||||
//features.push("multiserver");
|
||||
features.push("screensaver");
|
||||
|
||||
if (!browser.orsay && !browser.tizen && !browser.msie && (browser.firefox || browser.ps4 || browser.edge || cueSupported())) {
|
||||
features.push("subtitleappearancesettings");
|
||||
|
|
56
src/components/backdropscreensaver/plugin.js
Normal file
|
@ -0,0 +1,56 @@
|
|||
define(["connectionManager"], function (connectionManager) {
|
||||
|
||||
return function () {
|
||||
|
||||
var self = this;
|
||||
|
||||
self.name = "Backdrop ScreenSaver";
|
||||
self.type = "screensaver";
|
||||
self.id = "backdropscreensaver";
|
||||
self.supportsAnonymous = false;
|
||||
|
||||
var currentSlideshow;
|
||||
|
||||
self.show = function () {
|
||||
|
||||
var query = {
|
||||
ImageTypes: "Backdrop",
|
||||
EnableImageTypes: "Backdrop",
|
||||
IncludeItemTypes: "Movie,Series,MusicArtist",
|
||||
SortBy: "Random",
|
||||
Recursive: true,
|
||||
Fields: "Taglines",
|
||||
ImageTypeLimit: 1,
|
||||
StartIndex: 0,
|
||||
Limit: 200
|
||||
};
|
||||
|
||||
var apiClient = connectionManager.currentApiClient();
|
||||
apiClient.getItems(apiClient.getCurrentUserId(), query).then(function (result) {
|
||||
|
||||
if (result.Items.length) {
|
||||
|
||||
require(["slideshow"], function (slideshow) {
|
||||
|
||||
var newSlideShow = new slideshow({
|
||||
showTitle: true,
|
||||
cover: true,
|
||||
items: result.Items
|
||||
});
|
||||
|
||||
newSlideShow.show();
|
||||
currentSlideshow = newSlideShow;
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
self.hide = function () {
|
||||
|
||||
if (currentSlideshow) {
|
||||
currentSlideshow.hide();
|
||||
currentSlideshow = null;
|
||||
}
|
||||
};
|
||||
}
|
||||
});
|
|
@ -18,7 +18,6 @@ button {
|
|||
padding: 0;
|
||||
display: block;
|
||||
color: inherit !important;
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
outline: none !important;
|
||||
cursor: pointer;
|
||||
contain: layout style;
|
||||
|
@ -80,10 +79,9 @@ button {
|
|||
margin: 0.6em;
|
||||
transition: none;
|
||||
border: 0 solid transparent;
|
||||
/* These both are needed in case cardBox is a button */
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
outline: none !important;
|
||||
contain: layout style;
|
||||
contain: layout;
|
||||
contain: style;
|
||||
}
|
||||
|
||||
.card.show-focus:not(.show-animation) .cardBox {
|
||||
|
@ -148,7 +146,6 @@ button {
|
|||
background-size: cover;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center center;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
@ -182,7 +179,6 @@ button {
|
|||
margin: 0 !important;
|
||||
/* Needed in safari */
|
||||
height: 100%;
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
outline: none !important;
|
||||
contain: strict;
|
||||
}
|
||||
|
@ -247,7 +243,7 @@ button {
|
|||
}
|
||||
|
||||
.coveredImage {
|
||||
background-size: 100% 100%;
|
||||
background-size: cover;
|
||||
background-position: center center;
|
||||
}
|
||||
|
||||
|
@ -346,7 +342,6 @@ button {
|
|||
border: 0 !important;
|
||||
padding: 0 !important;
|
||||
cursor: pointer;
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
outline: none !important;
|
||||
color: inherit;
|
||||
vertical-align: middle;
|
||||
|
@ -627,7 +622,7 @@ button {
|
|||
|
||||
@media (min-width: 43.75em) {
|
||||
.overflowSquareCard, .overflowPortraitCard {
|
||||
width: 23.3vw;
|
||||
width: 23.1vw;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -643,13 +638,13 @@ button {
|
|||
}
|
||||
|
||||
.overflowSquareCard, .overflowPortraitCard {
|
||||
width: 23.3vw;
|
||||
width: 23.1vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media (orientation: landscape) and (min-width: 48.125em) {
|
||||
.overflowBackdropCard, .overflowSmallBackdropCard {
|
||||
width: 23.3vw;
|
||||
width: 23.1vw;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -661,13 +656,13 @@ button {
|
|||
|
||||
@media (min-width: 50em) {
|
||||
.overflowSquareCard, .overflowPortraitCard {
|
||||
width: 18.4vw;
|
||||
width: 18.5vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 75em) {
|
||||
.overflowBackdropCard, .overflowSmallBackdropCard {
|
||||
width: 23.3vw;
|
||||
width: 23.1vw;
|
||||
}
|
||||
|
||||
.overflowSquareCard, .overflowPortraitCard {
|
||||
|
|
|
@ -892,7 +892,8 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'focusMana
|
|||
} else {
|
||||
|
||||
if (item.EndDate && item.ProductionYear) {
|
||||
lines.push(item.ProductionYear + ' - ' + datetime.parseISO8601Date(item.EndDate).getFullYear());
|
||||
var endYear = datetime.parseISO8601Date(item.EndDate).getFullYear();
|
||||
lines.push(item.ProductionYear + ((endYear === item.ProductionYear) ? '' : (' - ' + endYear)));
|
||||
} else {
|
||||
lines.push(item.ProductionYear || '');
|
||||
}
|
||||
|
|
|
@ -16,7 +16,6 @@
|
|||
.dialog {
|
||||
margin: 0;
|
||||
border-radius: .2em;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
will-change: transform, opacity;
|
||||
|
|
|
@ -6,6 +6,7 @@
|
|||
justify-content: center;
|
||||
min-width:104px;
|
||||
min-height:24px;
|
||||
padding-top: 1.25em;
|
||||
z-index: 1;
|
||||
color: #ffffff;
|
||||
display: flex;
|
||||
|
|
|
@ -8,21 +8,15 @@
|
|||
}
|
||||
|
||||
/* align first card in scroller to heading */
|
||||
.emby-scroller .card:first-of-type > .cardBox {
|
||||
.itemsContainer > .card > .cardBox {
|
||||
margin-left: 0;
|
||||
margin-right: 1.2em;
|
||||
}
|
||||
|
||||
/* align heading for normal item containers */
|
||||
/* still not ideal solution but better than the last method */
|
||||
.verticalSection > .itemsContainer .cardBox {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
@media all and (max-width:50em) {
|
||||
.emby-scroller {
|
||||
.layout-tv .emby-scroller,
|
||||
.layout-mobile .emby-scroller {
|
||||
padding-left: 3.3%;
|
||||
padding-right: 3.3%;
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
|
@ -22,7 +22,7 @@
|
|||
|
||||
.emby-tab-button.show-focus:focus {
|
||||
/* these buttons are small so scale larger than usual */
|
||||
transform: scale(1.6) !important;
|
||||
transform: scale(1.3) !important;
|
||||
background: 0 !important;
|
||||
}
|
||||
|
||||
|
|
|
@ -5,7 +5,6 @@
|
|||
margin-top: 0 !important;
|
||||
margin-bottom: 0 !important;
|
||||
margin-right: 0 !important;
|
||||
-webkit-border-radius: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
max-height: none !important;
|
||||
max-width: none !important
|
||||
|
|
|
@ -13,13 +13,11 @@
|
|||
.homeLibraryIcon {
|
||||
margin-left: .5em;
|
||||
margin-right: .5em;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0
|
||||
}
|
||||
|
||||
.homeLibraryText {
|
||||
white-space: nowrap;
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden
|
||||
}
|
||||
|
|
|
@ -2,11 +2,8 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
|
|||
"use strict";
|
||||
|
||||
function getDefaultProfile() {
|
||||
|
||||
return new Promise(function (resolve, reject) {
|
||||
|
||||
require(['browserdeviceprofile'], function (profileBuilder) {
|
||||
|
||||
resolve(profileBuilder({}));
|
||||
});
|
||||
});
|
||||
|
@ -14,28 +11,22 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
|
|||
|
||||
var fadeTimeout;
|
||||
function fade(instance, elem, startingVolume) {
|
||||
|
||||
instance._isFadingOut = true;
|
||||
|
||||
// Need to record the starting volume on each pass rather than querying elem.volume
|
||||
// This is due to iOS safari not allowing volume changes and always returning the system volume value
|
||||
|
||||
var newVolume = Math.max(0, startingVolume - 0.15);
|
||||
console.log('fading volume to ' + newVolume);
|
||||
elem.volume = newVolume;
|
||||
|
||||
if (newVolume <= 0) {
|
||||
|
||||
instance._isFadingOut = false;
|
||||
return Promise.resolve();
|
||||
}
|
||||
|
||||
return new Promise(function (resolve, reject) {
|
||||
|
||||
cancelFadeTimeout();
|
||||
|
||||
fadeTimeout = setTimeout(function () {
|
||||
|
||||
fade(instance, elem, newVolume).then(resolve, reject);
|
||||
}, 100);
|
||||
});
|
||||
|
@ -50,7 +41,6 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
|
|||
}
|
||||
|
||||
function supportsFade() {
|
||||
|
||||
if (browser.tv) {
|
||||
// Not working on tizen.
|
||||
// We could possibly enable on other tv's, but all smart tv browsers tend to be pretty primitive
|
||||
|
@ -68,9 +58,7 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
|
|||
}
|
||||
|
||||
function enableHlsPlayer(url, item, mediaSource, mediaType) {
|
||||
|
||||
if (!htmlMediaHelper.enableHlsJsPlayer(mediaSource.RunTimeTicks, mediaType)) {
|
||||
|
||||
return Promise.reject();
|
||||
}
|
||||
|
||||
|
@ -86,21 +74,18 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
|
|||
url: url,
|
||||
type: 'HEAD'
|
||||
}).then(function (response) {
|
||||
|
||||
var contentType = (response.headers.get('Content-Type') || '').toLowerCase();
|
||||
if (contentType === 'application/x-mpegurl') {
|
||||
resolve();
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
|
||||
}, reject);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function HtmlAudioPlayer() {
|
||||
|
||||
var self = this;
|
||||
|
||||
self.name = 'Html Audio Player';
|
||||
|
@ -114,11 +99,9 @@ define(['events', 'browser', 'require', 'apphost', 'appSettings', 'htmlMediaHelp
|
|||
|
||||
self._started = false;
|
||||
self._timeUpdated = false;
|
||||
|
||||
self._currentTime = null;
|
||||
|
||||
var elem = createMediaElement(options);
|
||||
|
||||
return setCurrentSrc(elem, options);
|
||||
};
|
||||
|
||||
|
|
|
@ -27,6 +27,14 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
return _supportsTextTracks;
|
||||
}
|
||||
|
||||
function supportsCanvas() {
|
||||
return !!document.createElement('canvas').getContext;
|
||||
}
|
||||
|
||||
function supportsWebWorkers() {
|
||||
return !!window.Worker;
|
||||
}
|
||||
|
||||
function enableNativeTrackSupport(currentSrc, track) {
|
||||
|
||||
if (track) {
|
||||
|
@ -185,6 +193,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
|
||||
var lastCustomTrackMs = 0;
|
||||
var currentClock;
|
||||
var currentSubtitlesOctopus;
|
||||
var currentAssRenderer;
|
||||
var customTrackIndex = -1;
|
||||
|
||||
|
@ -962,6 +971,12 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
currentClock = null;
|
||||
self._currentAspectRatio = null;
|
||||
|
||||
var octopus = currentSubtitlesOctopus;
|
||||
if (octopus) {
|
||||
octopus.dispose();
|
||||
}
|
||||
currentSubtitlesOctopus = null;
|
||||
|
||||
var renderer = currentAssRenderer;
|
||||
if (renderer) {
|
||||
renderer.setEnabled(false);
|
||||
|
@ -1026,6 +1041,22 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
lastCustomTrackMs = 0;
|
||||
}
|
||||
|
||||
function renderWithSubtitlesOctopus(videoElement, track, item) {
|
||||
var attachments = self._currentPlayOptions.mediaSource.MediaAttachments || [];
|
||||
var options = {
|
||||
video: videoElement,
|
||||
subUrl: getTextTrackUrl(track, item),
|
||||
fonts: attachments.map(i => i.DeliveryUrl),
|
||||
workerUrl: appRouter.baseUrl() + "/libraries/subtitles-octopus-worker.js",
|
||||
onError: function() {
|
||||
htmlMediaHelper.onErrorInternal(self, 'mediadecodeerror')
|
||||
}
|
||||
};
|
||||
require(['JavascriptSubtitlesOctopus'], function(SubtitlesOctopus) {
|
||||
currentSubtitlesOctopus = new SubtitlesOctopus(options);
|
||||
});
|
||||
}
|
||||
|
||||
function renderWithLibjass(videoElement, track, item) {
|
||||
|
||||
var rendererSettings = {};
|
||||
|
@ -1072,6 +1103,15 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
});
|
||||
}
|
||||
|
||||
function renderSsaAss(videoElement, track, item) {
|
||||
if (supportsCanvas() && supportsWebWorkers()) {
|
||||
renderWithSubtitlesOctopus(videoElement, track, item);
|
||||
} else {
|
||||
console.log('rendering subtitles with libjass');
|
||||
renderWithLibjass(videoElement, track, item);
|
||||
}
|
||||
}
|
||||
|
||||
function onVideoResize() {
|
||||
if (browser.iOS) {
|
||||
// the new sizes will be delayed for about 500ms with wkwebview
|
||||
|
@ -1182,7 +1222,7 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
var format = (track.Codec || '').toLowerCase();
|
||||
if (format === 'ssa' || format === 'ass') {
|
||||
// libjass is needed here
|
||||
renderWithLibjass(videoElement, track, item);
|
||||
renderSsaAss(videoElement, track, item);
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -1483,6 +1523,10 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
}
|
||||
}
|
||||
|
||||
if (browser.safari || browser.iOS || browser.iPad) {
|
||||
list.push('AirPlay')
|
||||
}
|
||||
|
||||
list.push('SetBrightness');
|
||||
list.push("SetAspectRatio")
|
||||
|
||||
|
@ -1591,6 +1635,31 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
return false;
|
||||
};
|
||||
|
||||
HtmlVideoPlayer.prototype.isAirPlayEnabled = function () {
|
||||
|
||||
if (document.AirPlayEnabled) {
|
||||
return document.AirplayElement ? true : false;
|
||||
}
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
HtmlVideoPlayer.prototype.setAirPlayEnabled = function (isEnabled) {
|
||||
var video = this._mediaElement;
|
||||
|
||||
if (document.AirPlayEnabled) {
|
||||
if (video) {
|
||||
if (isEnabled) {
|
||||
video.requestAirPlay().catch(onAirPlayError);
|
||||
} else {
|
||||
document.exitAirPLay().catch(onAirPlayError);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
video.webkitShowPlaybackTargetPicker();
|
||||
}
|
||||
};
|
||||
|
||||
HtmlVideoPlayer.prototype.setBrightness = function (val) {
|
||||
|
||||
var elem = this._mediaElement;
|
||||
|
@ -1744,6 +1813,10 @@ define(['browser', 'require', 'events', 'apphost', 'loading', 'dom', 'playbackMa
|
|||
return this.setPictureInPictureEnabled(!this.isPictureInPictureEnabled());
|
||||
};
|
||||
|
||||
HtmlVideoPlayer.prototype.toggleAirPlay = function () {
|
||||
return this.setAirPlayEnabled(!this.isAirPlayEnabled());
|
||||
};
|
||||
|
||||
HtmlVideoPlayer.prototype.getBufferedRanges = function () {
|
||||
var mediaElement = this._mediaElement;
|
||||
if (mediaElement) {
|
||||
|
|
|
@ -24,6 +24,10 @@
|
|||
z-index: 1000;
|
||||
}
|
||||
|
||||
.videoPlayerContainer .libassjs-canvas-parent {
|
||||
order: -1;
|
||||
}
|
||||
|
||||
video::-webkit-media-controls {
|
||||
display: none !important;
|
||||
}
|
||||
|
@ -38,7 +42,6 @@ video::-webkit-media-controls {
|
|||
.htmlvideoplayer::cue {
|
||||
background-color: transparent;
|
||||
text-shadow: 0.14em 0.14em 0.14em rgba(0, 0, 0, 1);
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
|
|
|
@ -18,21 +18,9 @@
|
|||
|
||||
.lazy-image-fadein {
|
||||
opacity: 0;
|
||||
-webkit-animation-duration: .8s;
|
||||
-moz-animation-duration: .8s;
|
||||
-o-animation-duration: .8s;
|
||||
animation-duration: .8s;
|
||||
-webkit-animation-name: popInAnimation;
|
||||
-moz-animation-name: popInAnimation;
|
||||
-o-animation-name: popInAnimation;
|
||||
animation-name: popInAnimation;
|
||||
-webkit-animation-fill-mode: forwards;
|
||||
-moz-animation-fill-mode: forwards;
|
||||
-o-animation-fill-mode: forwards;
|
||||
animation-fill-mode: forwards;
|
||||
-webkit-animation-timing-function: cubic-bezier(0,0,.5,1);
|
||||
-moz-animation-timing-function: cubic-bezier(0,0,.5,1);
|
||||
-o-animation-timing-function: cubic-bezier(0,0,.5,1);
|
||||
animation-timing-function: cubic-bezier(0,0,.5,1);
|
||||
}
|
||||
|
||||
|
|
|
@ -74,7 +74,7 @@ define(['dialogHelper', 'connectionManager', 'dom', 'loading', 'scrollHelper', '
|
|||
return false;
|
||||
}
|
||||
|
||||
if (file.type !== "image/png" && file.type !== "image/x-png" && file.type !== "image/jpeg") {
|
||||
if (!file.type.startsWith("image/")) {
|
||||
require(['toast'], function (toast) {
|
||||
toast(globalize.translate('MessageImageFileTypeAllowed'));
|
||||
});
|
||||
|
|
|
@ -22,7 +22,7 @@
|
|||
<div class="imageEditor-dropZone fieldDescription">
|
||||
<div>${LabelDropImageHere}</div>
|
||||
<output id="imageOutput" class="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/png,image/x-png,image/jpeg" id="uploadImage" name="uploadImage" style="position: absolute;top:0;left:0;right:0;bottom:0;width:100%;opacity:0;" />
|
||||
<input type="file" accept="image/*" id="uploadImage" name="uploadImage" style="position: absolute;top:0;left:0;right:0;bottom:0;width:100%;opacity:0;" />
|
||||
</div>
|
||||
<div id="fldUpload" class="hide">
|
||||
<br />
|
||||
|
|
|
@ -14,7 +14,6 @@
|
|||
|
||||
.indicator {
|
||||
border-radius: 100em;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
@ -43,7 +42,6 @@
|
|||
|
||||
.countIndicator {
|
||||
border-radius: 100em;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
@ -55,7 +53,6 @@
|
|||
|
||||
.playedIndicator {
|
||||
border-radius: 100em;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
@ -67,7 +64,6 @@
|
|||
.videoIndicator {
|
||||
background: #444;
|
||||
border-radius: 100em;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
|
|
@ -115,7 +115,6 @@ define(['datetime', 'itemHelper', 'css!./indicators.css', 'material-icons'], fun
|
|||
}
|
||||
|
||||
function getTimerIndicator(item) {
|
||||
|
||||
var status;
|
||||
|
||||
if (item.Type === 'SeriesTimer') {
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<div class="formDialogHeader">
|
||||
<button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1"><i class="md-icon">arrow_back</i></button>
|
||||
<h3 class="formDialogHeaderTitle">
|
||||
${HeaderMediaInfo}
|
||||
</h3>
|
||||
<button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1">
|
||||
<i class="md-icon">arrow_back</i>
|
||||
</button>
|
||||
<h3 class="formDialogHeaderTitle">${HeaderMediaInfo}</h3>
|
||||
</div>
|
||||
|
||||
<div class="formDialogContent smoothScrollY">
|
||||
|
|
|
@ -2,9 +2,7 @@
|
|||
<button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1">
|
||||
<i class="md-icon">arrow_back</i>
|
||||
</button>
|
||||
<h3 class="formDialogHeaderTitle">
|
||||
${Identify}
|
||||
</h3>
|
||||
<h3 class="formDialogHeaderTitle">${Identify}</h3>
|
||||
</div>
|
||||
|
||||
<div class="formDialogContent smoothScrollY">
|
||||
|
@ -17,16 +15,13 @@
|
|||
<div class="txtPath fieldDescription"></div>
|
||||
</div>
|
||||
<div class="inputContainer">
|
||||
<input is="emby-input" type="text" id="txtLookupName" class="identifyField" data-lookup="Name"
|
||||
label="${LabelName}" />
|
||||
<input is="emby-input" type="text" id="txtLookupName" class="identifyField" data-lookup="Name" label="${LabelName}" />
|
||||
</div>
|
||||
<div class="fldLookupYear inputContainer">
|
||||
<input is="emby-input" type="number" id="txtLookupYear" class="identifyField" data-lookup="Year"
|
||||
pattern="[0-9]*" min="1800" label="${LabelYear}" />
|
||||
<input is="emby-input" type="number" id="txtLookupYear" class="identifyField" data-lookup="Year" pattern="[0-9]*" min="1800" label="${LabelYear}" />
|
||||
</div>
|
||||
|
||||
<div class="identifyProviderIds">
|
||||
</div>
|
||||
<div class="identifyProviderIds"></div>
|
||||
|
||||
<div class="formDialogFooter">
|
||||
<button is="emby-button" type="submit" class="raised button-submit block formDialogFooterItem">
|
||||
|
@ -34,14 +29,13 @@
|
|||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<div class="identificationSearchResults hide">
|
||||
|
||||
<div class="identificationSearchResults hide">
|
||||
<h1>${SearchResults}</h1>
|
||||
<div class="identificationSearchResultList itemsContainer vertical-wrap"></div>
|
||||
</div>
|
||||
|
||||
<form class="identifyOptionsForm hide" style="margin:auto;">
|
||||
|
||||
<br />
|
||||
<div class="selectedSearchResult"></div>
|
||||
<br />
|
||||
|
@ -51,8 +45,7 @@
|
|||
</label>
|
||||
|
||||
<div class="formDialogFooter">
|
||||
<button is="emby-button" type="submit"
|
||||
class="raised button-submit block btnSubmit formDialogFooterItem">
|
||||
<button is="emby-button" type="submit" class="raised button-submit block btnSubmit formDialogFooterItem">
|
||||
<span>${ButtonOk}</span>
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
@ -126,20 +126,20 @@
|
|||
align-self: center;
|
||||
justify-self: center;
|
||||
margin: auto;
|
||||
color: rgba(255, 255, 255, .6);
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: rgba(0, 0, 0, 0.4);
|
||||
font-size: 1.6em;
|
||||
background: transparent;
|
||||
transition: transform 200ms ease-out;
|
||||
transition: 200ms ease-out;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.listItemImageButton:hover {
|
||||
color: #00a4dc;
|
||||
background: rgba(0, 164, 220, 0.2);
|
||||
transform: scale(1.2, 1.2);
|
||||
}
|
||||
|
||||
.listItemImageButton-icon {
|
||||
background: rgba(0,0,0,.4);
|
||||
border: 0.1em solid currentColor;
|
||||
border-radius: 100em;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
|
@ -7,20 +7,11 @@
|
|||
|
||||
.mdlSpinnerActive {
|
||||
display: inline-block;
|
||||
-webkit-animation: mdl-spinner__container-rotate 1568.23529412ms linear infinite;
|
||||
animation: mdl-spinner__container-rotate 1568.23529412ms linear infinite;
|
||||
}
|
||||
|
||||
@-webkit-keyframes mdl-spinner__container-rotate {
|
||||
to {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mdl-spinner__container-rotate {
|
||||
to {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
@ -37,7 +28,6 @@
|
|||
}
|
||||
|
||||
.mdl-spinner__layer-1-active {
|
||||
-webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-1-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
}
|
||||
|
||||
|
@ -46,7 +36,6 @@
|
|||
}
|
||||
|
||||
.mdl-spinner__layer-2-active {
|
||||
-webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-2-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
}
|
||||
|
||||
|
@ -55,7 +44,6 @@
|
|||
}
|
||||
|
||||
.mdl-spinner__layer-3-active {
|
||||
-webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-3-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
}
|
||||
|
||||
|
@ -64,90 +52,39 @@
|
|||
}
|
||||
|
||||
.mdl-spinner__layer-4-active {
|
||||
-webkit-animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
animation: mdl-spinner__fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, mdl-spinner__layer-4-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
}
|
||||
|
||||
@-webkit-keyframes mdl-spinner__fill-unfill-rotate {
|
||||
12.5% {
|
||||
-webkit-transform: rotate(135deg);
|
||||
transform: rotate(135deg);
|
||||
}
|
||||
|
||||
25% {
|
||||
-webkit-transform: rotate(270deg);
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
|
||||
37.5% {
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(540deg);
|
||||
transform: rotate(540deg);
|
||||
}
|
||||
|
||||
62.5% {
|
||||
-webkit-transform: rotate(675deg);
|
||||
transform: rotate(675deg);
|
||||
}
|
||||
|
||||
75% {
|
||||
-webkit-transform: rotate(810deg);
|
||||
transform: rotate(810deg);
|
||||
}
|
||||
|
||||
87.5% {
|
||||
-webkit-transform: rotate(945deg);
|
||||
transform: rotate(945deg);
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: rotate(1080deg);
|
||||
transform: rotate(1080deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mdl-spinner__fill-unfill-rotate {
|
||||
12.5% {
|
||||
-webkit-transform: rotate(135deg);
|
||||
transform: rotate(135deg);
|
||||
}
|
||||
|
||||
25% {
|
||||
-webkit-transform: rotate(270deg);
|
||||
transform: rotate(270deg);
|
||||
}
|
||||
|
||||
37.5% {
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(540deg);
|
||||
transform: rotate(540deg);
|
||||
}
|
||||
|
||||
62.5% {
|
||||
-webkit-transform: rotate(675deg);
|
||||
transform: rotate(675deg);
|
||||
}
|
||||
|
||||
75% {
|
||||
-webkit-transform: rotate(810deg);
|
||||
transform: rotate(810deg);
|
||||
}
|
||||
|
||||
87.5% {
|
||||
-webkit-transform: rotate(945deg);
|
||||
transform: rotate(945deg);
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: rotate(1080deg);
|
||||
transform: rotate(1080deg);
|
||||
}
|
||||
}
|
||||
|
@ -161,32 +98,6 @@
|
|||
* - https://github.com/Polymer/paper-spinner/issues/9
|
||||
* - https://code.google.com/p/chromium/issues/detail?id=436255
|
||||
*/
|
||||
@-webkit-keyframes mdl-spinner__layer-1-fade-in-out {
|
||||
from {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
25% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
26% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
89% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
90% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mdl-spinner__layer-1-fade-in-out {
|
||||
from {
|
||||
opacity: 0.99;
|
||||
|
@ -213,28 +124,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes mdl-spinner__layer-2-fade-in-out {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
15% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
25% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
51% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mdl-spinner__layer-2-fade-in-out {
|
||||
from {
|
||||
opacity: 0;
|
||||
|
@ -257,28 +146,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes mdl-spinner__layer-3-fade-in-out {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
40% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
75% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
76% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mdl-spinner__layer-3-fade-in-out {
|
||||
from {
|
||||
opacity: 0;
|
||||
|
@ -301,28 +168,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes mdl-spinner__layer-4-fade-in-out {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
65% {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
75% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
90% {
|
||||
opacity: 0.99;
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mdl-spinner__layer-4-fade-in-out {
|
||||
from {
|
||||
opacity: 0;
|
||||
|
@ -366,7 +211,6 @@
|
|||
border-color: inherit;
|
||||
border-bottom-color: transparent !important;
|
||||
border-radius: 50%;
|
||||
-webkit-animation: none;
|
||||
animation: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
@ -377,91 +221,47 @@
|
|||
|
||||
.mdl-spinner__circleLeft {
|
||||
border-right-color: transparent !important;
|
||||
-webkit-transform: rotate(129deg);
|
||||
transform: rotate(129deg);
|
||||
}
|
||||
|
||||
.mdl-spinner__circleLeft-active {
|
||||
-webkit-animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
animation: mdl-spinner__left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
}
|
||||
|
||||
.mdl-spinner__circleRight {
|
||||
left: -100%;
|
||||
border-left-color: transparent !important;
|
||||
-webkit-transform: rotate(-129deg);
|
||||
transform: rotate(-129deg);
|
||||
}
|
||||
|
||||
.mdl-spinner__circleRight-active {
|
||||
-webkit-animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
animation: mdl-spinner__right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
|
||||
}
|
||||
|
||||
@-webkit-keyframes mdl-spinner__left-spin {
|
||||
from {
|
||||
-webkit-transform: rotate(130deg);
|
||||
transform: rotate(130deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(-5deg);
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: rotate(130deg);
|
||||
transform: rotate(130deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mdl-spinner__left-spin {
|
||||
from {
|
||||
-webkit-transform: rotate(130deg);
|
||||
transform: rotate(130deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(-5deg);
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: rotate(130deg);
|
||||
transform: rotate(130deg);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes mdl-spinner__right-spin {
|
||||
from {
|
||||
-webkit-transform: rotate(-130deg);
|
||||
transform: rotate(-130deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(5deg);
|
||||
transform: rotate(5deg);
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: rotate(-130deg);
|
||||
transform: rotate(-130deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes mdl-spinner__right-spin {
|
||||
from {
|
||||
-webkit-transform: rotate(-130deg);
|
||||
transform: rotate(-130deg);
|
||||
}
|
||||
|
||||
50% {
|
||||
-webkit-transform: rotate(5deg);
|
||||
transform: rotate(5deg);
|
||||
}
|
||||
|
||||
to {
|
||||
-webkit-transform: rotate(-130deg);
|
||||
transform: rotate(-130deg);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6,14 +6,11 @@ define(['require', 'css!./loadingLegacy'], function (require) {
|
|||
return {
|
||||
show: function () {
|
||||
var elem = loadingElem;
|
||||
|
||||
if (!elem) {
|
||||
|
||||
elem = document.createElement("img");
|
||||
elem.src = require.toUrl('.').split('?')[0] + '/loader2.gif';
|
||||
elem.src = require.toUrl('.').split('?')[0] + '/loader.gif';
|
||||
|
||||
loadingElem = elem;
|
||||
|
||||
elem.classList.add('loading-spinner');
|
||||
|
||||
document.body.appendChild(elem);
|
||||
|
@ -23,9 +20,7 @@ define(['require', 'css!./loadingLegacy'], function (require) {
|
|||
},
|
||||
hide: function () {
|
||||
var elem = loadingElem;
|
||||
|
||||
if (elem) {
|
||||
|
||||
elem.classList.add('hide');
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,3 +0,0 @@
|
|||
{
|
||||
"main": "loading.js"
|
||||
}
|
|
@ -2,14 +2,12 @@ define(['loading', 'events', 'dialogHelper', 'dom', 'layoutManager', 'scrollHelp
|
|||
'use strict';
|
||||
|
||||
function showDialog(instance, options, template) {
|
||||
|
||||
var dialogOptions = {
|
||||
removeOnClose: true,
|
||||
scrollY: false
|
||||
};
|
||||
|
||||
var enableTvLayout = layoutManager.tv;
|
||||
|
||||
if (enableTvLayout) {
|
||||
dialogOptions.size = 'fullscreen';
|
||||
}
|
||||
|
@ -48,7 +46,6 @@ define(['loading', 'events', 'dialogHelper', 'dom', 'layoutManager', 'scrollHelp
|
|||
instance.dlg = dlg;
|
||||
|
||||
return dialogHelper.open(dlg).then(function () {
|
||||
|
||||
if (enableTvLayout) {
|
||||
scrollHelper.centerFocus.off(dlg.querySelector('.formDialogContent'), false);
|
||||
}
|
||||
|
@ -58,12 +55,10 @@ define(['loading', 'events', 'dialogHelper', 'dom', 'layoutManager', 'scrollHelp
|
|||
}
|
||||
|
||||
function LoadingDialog(options) {
|
||||
|
||||
this.options = options;
|
||||
}
|
||||
|
||||
LoadingDialog.prototype.show = function () {
|
||||
|
||||
var instance = this;
|
||||
loading.show();
|
||||
|
||||
|
@ -76,15 +71,12 @@ define(['loading', 'events', 'dialogHelper', 'dom', 'layoutManager', 'scrollHelp
|
|||
};
|
||||
|
||||
LoadingDialog.prototype.setTitle = function (title) {
|
||||
|
||||
};
|
||||
|
||||
LoadingDialog.prototype.setText = function (text) {
|
||||
|
||||
};
|
||||
|
||||
LoadingDialog.prototype.hide = function () {
|
||||
|
||||
if (this.dlg) {
|
||||
dialogHelper.close(this.dlg);
|
||||
this.dlg = null;
|
||||
|
@ -92,7 +84,6 @@ define(['loading', 'events', 'dialogHelper', 'dom', 'layoutManager', 'scrollHelp
|
|||
};
|
||||
|
||||
LoadingDialog.prototype.destroy = function () {
|
||||
|
||||
this.dlg = null;
|
||||
this.options = null;
|
||||
};
|
||||
|
|
Before Width: | Height: | Size: 39 KiB After Width: | Height: | Size: 39 KiB |
192
src/components/logoscreensaver/plugin.js
Normal file
|
@ -0,0 +1,192 @@
|
|||
define(["pluginManager"], function (pluginManager) {
|
||||
|
||||
return function () {
|
||||
|
||||
var self = this;
|
||||
|
||||
self.name = "Logo ScreenSaver";
|
||||
self.type = "screensaver";
|
||||
self.id = "logoscreensaver";
|
||||
self.supportsAnonymous = true;
|
||||
|
||||
var interval;
|
||||
|
||||
function animate() {
|
||||
|
||||
var animations = [
|
||||
|
||||
bounceInLeft,
|
||||
bounceInRight,
|
||||
swing,
|
||||
tada,
|
||||
wobble,
|
||||
rotateIn,
|
||||
rotateOut
|
||||
];
|
||||
|
||||
var elem = document.querySelector(".logoScreenSaverImage");
|
||||
|
||||
if (elem && elem.animate) {
|
||||
var random = getRandomInt(0, animations.length - 1);
|
||||
|
||||
animations[random](elem, 1);
|
||||
}
|
||||
}
|
||||
|
||||
function getRandomInt(min, max) {
|
||||
return Math.floor(Math.random() * (max - min + 1)) + min;
|
||||
}
|
||||
|
||||
function bounceInLeft(elem, iterations) {
|
||||
var keyframes = [
|
||||
{ transform: "translate3d(-3000px, 0, 0)", opacity: "0", offset: 0 },
|
||||
{ transform: "translate3d(25px, 0, 0)", opacity: "1", offset: 0.6 },
|
||||
{ transform: "translate3d(-100px, 0, 0)", offset: 0.75 },
|
||||
{ transform: "translate3d(5px, 0, 0)", offset: 0.9 },
|
||||
{ transform: "none", opacity: "1", offset: 1 }];
|
||||
var timing = { duration: 900, iterations: iterations, easing: "cubic-bezier(0.215, 0.610, 0.355, 1.000)" };
|
||||
return elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function bounceInRight(elem, iterations) {
|
||||
var keyframes = [
|
||||
{ transform: "translate3d(3000px, 0, 0)", opacity: "0", offset: 0 },
|
||||
{ transform: "translate3d(-25px, 0, 0)", opacity: "1", offset: 0.6 },
|
||||
{ transform: "translate3d(100px, 0, 0)", offset: 0.75 },
|
||||
{ transform: "translate3d(-5px, 0, 0)", offset: 0.9 },
|
||||
{ transform: "none", opacity: "1", offset: 1 }];
|
||||
var timing = { duration: 900, iterations: iterations, easing: "cubic-bezier(0.215, 0.610, 0.355, 1.000)" };
|
||||
return elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function shake(elem, iterations) {
|
||||
var keyframes = [
|
||||
{ transform: "translate3d(0, 0, 0)", offset: 0 },
|
||||
{ transform: "translate3d(-10px, 0, 0)", offset: 0.1 },
|
||||
{ transform: "translate3d(10px, 0, 0)", offset: 0.2 },
|
||||
{ transform: "translate3d(-10px, 0, 0)", offset: 0.3 },
|
||||
{ transform: "translate3d(10px, 0, 0)", offset: 0.4 },
|
||||
{ transform: "translate3d(-10px, 0, 0)", offset: 0.5 },
|
||||
{ transform: "translate3d(10px, 0, 0)", offset: 0.6 },
|
||||
{ transform: "translate3d(-10px, 0, 0)", offset: 0.7 },
|
||||
{ transform: "translate3d(10px, 0, 0)", offset: 0.8 },
|
||||
{ transform: "translate3d(-10px, 0, 0)", offset: 0.9 },
|
||||
{ transform: "translate3d(0, 0, 0)", offset: 1 }];
|
||||
var timing = { duration: 900, iterations: iterations };
|
||||
return elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function swing(elem, iterations) {
|
||||
var keyframes = [
|
||||
{ transform: "translate(0%)", offset: 0 },
|
||||
{ transform: "rotate3d(0, 0, 1, 15deg)", offset: 0.2 },
|
||||
{ transform: "rotate3d(0, 0, 1, -10deg)", offset: 0.4 },
|
||||
{ transform: "rotate3d(0, 0, 1, 5deg)", offset: 0.6 },
|
||||
{ transform: "rotate3d(0, 0, 1, -5deg)", offset: 0.8 },
|
||||
{ transform: "rotate3d(0, 0, 1, 0deg)", offset: 1 }];
|
||||
var timing = { duration: 900, iterations: iterations };
|
||||
return elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function tada(elem, iterations) {
|
||||
var keyframes = [
|
||||
{ transform: "scale3d(1, 1, 1)", offset: 0 },
|
||||
{ transform: "scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)", offset: 0.1 },
|
||||
{ transform: "scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)", offset: 0.2 },
|
||||
{ transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)", offset: 0.3 },
|
||||
{ transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)", offset: 0.4 },
|
||||
{ transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)", offset: 0.5 },
|
||||
{ transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)", offset: 0.6 },
|
||||
{ transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)", offset: 0.7 },
|
||||
{ transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)", offset: 0.8 },
|
||||
{ transform: "scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)", offset: 0.9 },
|
||||
{ transform: "scale3d(1, 1, 1)", offset: 1 }];
|
||||
var timing = { duration: 900, iterations: iterations };
|
||||
return elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function wobble(elem, iterations) {
|
||||
var keyframes = [
|
||||
{ transform: "translate(0%)", offset: 0 },
|
||||
{ transform: "translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)", offset: 0.15 },
|
||||
{ transform: "translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)", offset: 0.45 },
|
||||
{ transform: "translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)", offset: 0.6 },
|
||||
{ transform: "translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)", offset: 0.75 },
|
||||
{ transform: "translateX(0%)", offset: 1 }];
|
||||
var timing = { duration: 900, iterations: iterations };
|
||||
return elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function rotateIn(elem, iterations) {
|
||||
var transformOrigin = elem.style["transform-origin"];
|
||||
var keyframes = [{ transform: "rotate3d(0, 0, 1, -200deg)", opacity: "0", transformOrigin: "center", offset: 0 },
|
||||
{ transform: "none", opacity: "1", transformOrigin: "center", offset: 1 }];
|
||||
var timing = { duration: 900, iterations: iterations };
|
||||
return elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function rotateOut(elem, iterations) {
|
||||
var transformOrigin = elem.style["transform-origin"];
|
||||
var keyframes = [{ transform: "none", opacity: "1", transformOrigin: "center", offset: 0 },
|
||||
{ transform: "rotate3d(0, 0, 1, 200deg)", opacity: "0", transformOrigin: "center", offset: 1 }];
|
||||
var timing = { duration: 900, iterations: iterations };
|
||||
return elem.animate(keyframes, timing);
|
||||
|
||||
}
|
||||
|
||||
function fadeOut(elem, iterations) {
|
||||
var keyframes = [
|
||||
{ opacity: "1", offset: 0 },
|
||||
{ opacity: "0", offset: 1 }];
|
||||
var timing = { duration: 400, iterations: iterations };
|
||||
return elem.animate(keyframes, timing);
|
||||
}
|
||||
|
||||
function stopInterval() {
|
||||
if (interval) {
|
||||
clearInterval(interval);
|
||||
interval = null;
|
||||
}
|
||||
}
|
||||
|
||||
self.show = function () {
|
||||
|
||||
require(["css!" + pluginManager.mapPath(self, "style.css")], function () {
|
||||
|
||||
var elem = document.querySelector(".logoScreenSaver");
|
||||
|
||||
if (!elem) {
|
||||
elem = document.createElement("div");
|
||||
elem.classList.add("logoScreenSaver");
|
||||
document.body.appendChild(elem);
|
||||
|
||||
elem.innerHTML = '<img class="logoScreenSaverImage" src="' + pluginManager.mapPath(self, "logowhite.png") + '" />';
|
||||
}
|
||||
|
||||
stopInterval();
|
||||
interval = setInterval(animate, 3000);
|
||||
});
|
||||
};
|
||||
|
||||
self.hide = function () {
|
||||
|
||||
stopInterval();
|
||||
|
||||
var elem = document.querySelector(".logoScreenSaver");
|
||||
|
||||
if (elem) {
|
||||
|
||||
var onAnimationFinish = function () {
|
||||
elem.parentNode.removeChild(elem);
|
||||
};
|
||||
|
||||
if (elem.animate) {
|
||||
var animation = fadeOut(elem, 1);
|
||||
animation.onfinish = onAnimationFinish;
|
||||
} else {
|
||||
onAnimationFinish();
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
});
|
18
src/components/logoscreensaver/style.css
Normal file
|
@ -0,0 +1,18 @@
|
|||
.logoScreenSaver {
|
||||
background: #101010;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 1000;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.logoScreenSaverImage {
|
||||
height: 120px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -60px;
|
||||
margin-left: -197px;
|
||||
}
|
|
@ -69,10 +69,7 @@
|
|||
}
|
||||
|
||||
.closedCaptionMediaInfoText {
|
||||
/*padding: .24em .4em;*/
|
||||
font-weight: bold;
|
||||
/*font-size: inherit;*/
|
||||
/*background: rgba(81, 81, 81, .7);*/
|
||||
}
|
||||
|
||||
.mediaInfoOfficialRating {
|
||||
|
|
|
@ -9,29 +9,20 @@
|
|||
.touch-menu-la {
|
||||
background-color: #FFF;
|
||||
will-change: transform;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-transition: -webkit-transform ease-out 40ms, left ease-out 260ms;
|
||||
-o-transition: transform ease-out 40ms, left ease-out 260ms;
|
||||
transition: transform ease-out 40ms, left ease-out 260ms;
|
||||
z-index: 1099
|
||||
}
|
||||
|
||||
.touch-menu-la.transition {
|
||||
-webkit-transition: -webkit-transform ease-out 240ms, left ease-out 260ms;
|
||||
-o-transition: transform ease-out 240ms, left ease-out 260ms;
|
||||
transition: transform ease-out 240ms, left ease-out 260ms
|
||||
}
|
||||
|
||||
.drawer-open {
|
||||
-webkit-box-shadow: 2px 0 12px rgba(0, 0, 0, .4);
|
||||
box-shadow: 2px 0 12px rgba(0, 0, 0, .4)
|
||||
}
|
||||
|
||||
.scrollContainer {
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1
|
||||
}
|
||||
|
||||
|
@ -41,8 +32,6 @@
|
|||
background-color: #000;
|
||||
opacity: 0;
|
||||
z-index: 1098;
|
||||
-webkit-transition: opacity ease-in-out .38s, visibility ease-in-out .38s;
|
||||
-o-transition: opacity ease-in-out .38s, visibility ease-in-out .38s;
|
||||
transition: opacity ease-in-out .38s, visibility ease-in-out .38s;
|
||||
will-change: opacity;
|
||||
background-color: rgba(0, 0, 0, .3)
|
||||
|
|
|
@ -1540,6 +1540,11 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla
|
|||
return player.togglePictureInPicture();
|
||||
};
|
||||
|
||||
self.toggleAirPlay = function (player) {
|
||||
player = player || self._currentPlayer;
|
||||
return player.toggleAirPlay();
|
||||
};
|
||||
|
||||
self.getSubtitleStreamIndex = function (player) {
|
||||
|
||||
player = player || self._currentPlayer;
|
||||
|
@ -3854,6 +3859,9 @@ define(['events', 'datetime', 'appSettings', 'itemHelper', 'pluginManager', 'pla
|
|||
if (player.supports('PictureInPicture')) {
|
||||
list.push('PictureInPicture');
|
||||
}
|
||||
if (player.supports('AirPlay')) {
|
||||
list.push('AirPlay');
|
||||
}
|
||||
if (player.supports('SetBrightness')) {
|
||||
list.push('SetBrightness');
|
||||
}
|
||||
|
|
|
@ -1,10 +1,5 @@
|
|||
.nowPlayingInfoContainer {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: normal;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row
|
||||
}
|
||||
|
||||
|
@ -21,27 +16,20 @@
|
|||
}
|
||||
|
||||
.nowPlayingInfoButtons {
|
||||
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
|
||||
}
|
||||
|
||||
.nowPlayingInfoControls,
|
||||
.nowPlayingTime {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.nowPlayingPageImageContainer {
|
||||
width: 20%;
|
||||
margin-right: .25em;
|
||||
position: relative;
|
||||
-webkit-flex-shrink: 0;
|
||||
flex-shrink: 0
|
||||
}
|
||||
|
||||
|
@ -52,16 +40,9 @@
|
|||
}
|
||||
|
||||
.nowPlayingInfoControls {
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: normal;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
|
@ -70,25 +51,15 @@
|
|||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
-webkit-box-shadow: 0 0 1.9vh #000;
|
||||
box-shadow: 0 0 1.9vh #000;
|
||||
border: .1em solid #222;
|
||||
user-drag: none;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-drag: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none
|
||||
}
|
||||
|
||||
@media all and (orientation:portrait) and (max-width:50em) {
|
||||
.nowPlayingInfoContainer {
|
||||
-webkit-box-orient: vertical !important;
|
||||
-webkit-box-direction: normal !important;
|
||||
-webkit-flex-direction: column !important;
|
||||
flex-direction: column !important;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
|
@ -102,8 +73,6 @@
|
|||
}
|
||||
|
||||
.nowPlayingInfoButtons {
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
|
@ -131,33 +100,20 @@
|
|||
|
||||
.nowPlayingTime {
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
margin: 0 1em
|
||||
}
|
||||
|
||||
.nowPlayingSecondaryButtons {
|
||||
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;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center
|
||||
}
|
||||
|
||||
@media all and (min-width:50em) {
|
||||
.nowPlayingSecondaryButtons {
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1;
|
||||
-webkit-box-pack: end;
|
||||
-webkit-justify-content: flex-end;
|
||||
justify-content: flex-end
|
||||
}
|
||||
}
|
||||
|
@ -174,15 +130,13 @@
|
|||
|
||||
.smallBackdropPosterItem .cardOverlayInner>div {
|
||||
white-space: nowrap;
|
||||
-o-text-overflow: ellipsis;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden
|
||||
}
|
||||
|
||||
.playlistIndexIndicatorImage {
|
||||
-webkit-background-size: initial initial !important;
|
||||
background-size: initial !important;
|
||||
background-image: url(../../img/equalizer.gif) !important;
|
||||
background-image: url(assets/img/equalizer.gif) !important;
|
||||
}
|
||||
|
||||
.hideVideoButtons .videoButton {
|
||||
|
|
132
src/components/screensavermanager.js
Normal file
|
@ -0,0 +1,132 @@
|
|||
define(["events", "playbackManager", "pluginManager", "inputManager", "connectionManager", "userSettings"], function (events, playbackManager, pluginManager, inputManager, connectionManager, userSettings) {
|
||||
"use strict";
|
||||
|
||||
function getMinIdleTime() {
|
||||
// Returns the minimum amount of idle time required before the screen saver can be displayed
|
||||
//time units used Millisecond
|
||||
return 180000;
|
||||
}
|
||||
|
||||
var lastFunctionalEvent = 0;
|
||||
|
||||
function getFunctionalEventIdleTime() {
|
||||
return new Date().getTime() - lastFunctionalEvent;
|
||||
}
|
||||
|
||||
events.on(playbackManager, "playbackstop", function (e, stopInfo) {
|
||||
var state = stopInfo.state;
|
||||
if (state.NowPlayingItem && state.NowPlayingItem.MediaType == "Video") {
|
||||
lastFunctionalEvent = new Date().getTime();
|
||||
}
|
||||
});
|
||||
|
||||
function getScreensaverPlugin(isLoggedIn) {
|
||||
|
||||
var option;
|
||||
try {
|
||||
option = userSettings.get("screensaver", false);
|
||||
} catch (err) {
|
||||
option = isLoggedIn ? "backdropscreensaver" : "logoscreensaver";
|
||||
}
|
||||
|
||||
var plugins = pluginManager.ofType("screensaver");
|
||||
|
||||
for (var i = 0, length = plugins.length; i < length; i++) {
|
||||
var plugin = plugins[i];
|
||||
|
||||
if (plugin.id === option) {
|
||||
return plugin;
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
function ScreenSaverManager() {
|
||||
|
||||
var self = this;
|
||||
var activeScreenSaver;
|
||||
|
||||
function showScreenSaver(screensaver) {
|
||||
|
||||
if (activeScreenSaver) {
|
||||
throw new Error("An existing screensaver is already active.");
|
||||
}
|
||||
|
||||
console.log("Showing screensaver " + screensaver.name);
|
||||
|
||||
screensaver.show();
|
||||
activeScreenSaver = screensaver;
|
||||
|
||||
if (screensaver.hideOnClick !== false) {
|
||||
window.addEventListener("click", hide, true);
|
||||
}
|
||||
if (screensaver.hideOnMouse !== false) {
|
||||
window.addEventListener("mousemove", hide, true);
|
||||
}
|
||||
if (screensaver.hideOnKey !== false) {
|
||||
window.addEventListener("keydown", hide, true);
|
||||
}
|
||||
}
|
||||
|
||||
function hide() {
|
||||
if (activeScreenSaver) {
|
||||
console.log("Hiding screensaver");
|
||||
activeScreenSaver.hide();
|
||||
activeScreenSaver = null;
|
||||
}
|
||||
|
||||
window.removeEventListener("click", hide, true);
|
||||
window.removeEventListener("mousemove", hide, true);
|
||||
window.removeEventListener("keydown", hide, true);
|
||||
}
|
||||
|
||||
self.isShowing = function () {
|
||||
return activeScreenSaver != null;
|
||||
};
|
||||
|
||||
self.show = function () {
|
||||
var isLoggedIn;
|
||||
var apiClient = connectionManager.currentApiClient();
|
||||
|
||||
if (apiClient && apiClient.isLoggedIn()) {
|
||||
isLoggedIn = true;
|
||||
}
|
||||
|
||||
var screensaver = getScreensaverPlugin(isLoggedIn);
|
||||
|
||||
if (screensaver) {
|
||||
showScreenSaver(screensaver);
|
||||
}
|
||||
};
|
||||
|
||||
self.hide = function () {
|
||||
hide();
|
||||
};
|
||||
|
||||
function onInterval() {
|
||||
|
||||
if (self.isShowing()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (inputManager.idleTime() < getMinIdleTime()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (getFunctionalEventIdleTime < getMinIdleTime()) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (playbackManager.isPlayingVideo()) {
|
||||
return;
|
||||
}
|
||||
|
||||
self.show();
|
||||
}
|
||||
|
||||
setInterval(onInterval, 10000);
|
||||
}
|
||||
|
||||
return new ScreenSaverManager();
|
||||
});
|
|
@ -1,3 +0,0 @@
|
|||
{
|
||||
"main": "serverNotifications.js"
|
||||
}
|
|
@ -4,20 +4,15 @@ define(['connectionManager', 'playbackManager', 'events', 'inputManager', 'focus
|
|||
var serverNotifications = {};
|
||||
|
||||
function notifyApp() {
|
||||
|
||||
inputManager.notify();
|
||||
}
|
||||
|
||||
function displayMessage(cmd) {
|
||||
|
||||
var args = cmd.Arguments;
|
||||
|
||||
if (args.TimeoutMs) {
|
||||
|
||||
require(['toast'], function (toast) {
|
||||
toast({ title: args.Header, text: args.Text });
|
||||
});
|
||||
|
||||
} else {
|
||||
require(['alert'], function (alert) {
|
||||
alert({ title: args.Header, text: args.Text });
|
||||
|
@ -146,14 +141,10 @@ define(['connectionManager', 'playbackManager', 'events', 'inputManager', 'focus
|
|||
}
|
||||
|
||||
function onMessageReceived(e, msg) {
|
||||
|
||||
var apiClient = this;
|
||||
|
||||
if (msg.MessageType === "Play") {
|
||||
|
||||
notifyApp();
|
||||
var serverId = apiClient.serverInfo().Id;
|
||||
|
||||
if (msg.Data.PlayCommand === "PlayNext") {
|
||||
playbackManager.queueNext({ ids: msg.Data.ItemIds, serverId: serverId });
|
||||
} else if (msg.Data.PlayCommand === "PlayLast") {
|
||||
|
@ -169,9 +160,7 @@ define(['connectionManager', 'playbackManager', 'events', 'inputManager', 'focus
|
|||
serverId: serverId
|
||||
});
|
||||
}
|
||||
|
||||
} else if (msg.MessageType === "Playstate") {
|
||||
|
||||
if (msg.Data.Command === 'Stop') {
|
||||
inputManager.trigger('stop');
|
||||
} else if (msg.Data.Command === 'Pause') {
|
||||
|
@ -193,22 +182,17 @@ define(['connectionManager', 'playbackManager', 'events', 'inputManager', 'focus
|
|||
var cmd = msg.Data;
|
||||
processGeneralCommand(cmd, apiClient);
|
||||
} else if (msg.MessageType === "UserDataChanged") {
|
||||
|
||||
if (msg.Data.UserId === apiClient.getCurrentUserId()) {
|
||||
|
||||
for (var i = 0, length = msg.Data.UserDataList.length; i < length; i++) {
|
||||
events.trigger(serverNotifications, 'UserDataChanged', [apiClient, msg.Data.UserDataList[i]]);
|
||||
}
|
||||
}
|
||||
} else {
|
||||
|
||||
events.trigger(serverNotifications, msg.MessageType, [apiClient, msg.Data]);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
function bindEvents(apiClient) {
|
||||
|
||||
events.off(apiClient, "message", onMessageReceived);
|
||||
events.on(apiClient, "message", onMessageReceived);
|
||||
}
|
||||
|
@ -229,7 +213,6 @@ define(['connectionManager', 'playbackManager', 'events', 'inputManager', 'focus
|
|||
connectionManager.getApiClients().forEach(bindEvents);
|
||||
|
||||
events.on(connectionManager, 'apiclientcreated', function (e, newApiClient) {
|
||||
|
||||
bindEvents(newApiClient);
|
||||
});
|
||||
|
||||
|
|
|
@ -72,7 +72,7 @@ define(['apphost', 'userSettings', 'browser', 'events', 'pluginManager', 'backdr
|
|||
|
||||
selectedTheme = selectedTheme || defaultTheme;
|
||||
return {
|
||||
stylesheetPath: require.toUrl('components/themes/' + selectedTheme.id + '/theme.css'),
|
||||
stylesheetPath: require.toUrl('themes/' + selectedTheme.id + '/theme.css'),
|
||||
themeId: selectedTheme.id
|
||||
};
|
||||
}
|
||||
|
|
|
@ -41,9 +41,6 @@
|
|||
height: auto;
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
-moz-transform: translate(-50%, -50%);
|
||||
transform: translate(-50%, -50%);
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
|
|
|
@ -40,8 +40,6 @@
|
|||
margin-right: 1%;
|
||||
top: 2.5em;
|
||||
height: 1.4em;
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex-grow: 1;
|
||||
flex-grow: 1;
|
||||
border-radius: .3em;
|
||||
z-index: 1;
|
||||
|
|
|
@ -11,7 +11,6 @@
|
|||
background-color: rgba(0, 0, 0, 0.7);
|
||||
color: #fff;
|
||||
user-select: none;
|
||||
-webkit-touch-callout: none;
|
||||
}
|
||||
|
||||
.upNextDialog-hidden {
|
||||
|
@ -67,8 +66,4 @@
|
|||
border: 0;
|
||||
user-drag: none;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-drag: none;
|
||||
-webkit-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
|
|
|
@ -41,20 +41,22 @@ define(["browser", "dom", "layoutManager", "css!components/viewManager/viewConta
|
|||
var isPluginpage = -1 !== options.url.toLowerCase().indexOf("/configurationpage");
|
||||
var newViewInfo = normalizeNewView(options, isPluginpage);
|
||||
var newView = newViewInfo.elem;
|
||||
var modulesToLoad = [];
|
||||
|
||||
if (isPluginpage) {
|
||||
require(["legacyDashboard"]);
|
||||
modulesToLoad.push("legacyDashboard");
|
||||
}
|
||||
|
||||
if (newViewInfo.hasjQuerySelect) {
|
||||
require(["legacySelectMenu"]);
|
||||
modulesToLoad.push("legacySelectMenu");
|
||||
}
|
||||
|
||||
if (newViewInfo.hasjQueryChecked) {
|
||||
require(["fnchecked"]);
|
||||
modulesToLoad.push("fnchecked");
|
||||
}
|
||||
|
||||
return new Promise(function (resolve) {
|
||||
require(modulesToLoad, function () {
|
||||
var currentPage = allPages[pageIndex];
|
||||
|
||||
if (currentPage) {
|
||||
|
@ -121,6 +123,7 @@ define(["browser", "dom", "layoutManager", "css!components/viewManager/viewConta
|
|||
resolve(view);
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
|