mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
new videoJS skin, fixed auto play of playlist
This commit is contained in:
parent
d453f9419f
commit
050b5909fc
3 changed files with 66 additions and 37 deletions
|
@ -852,13 +852,16 @@ progress {
|
||||||
|
|
||||||
|
|
||||||
/* VideoJS overrides */
|
/* VideoJS overrides */
|
||||||
.vjs-default-skin .vjs-menu-button {
|
#videoWindow.tubecss .vjs-controls {
|
||||||
|
height: 5em!important;
|
||||||
|
}
|
||||||
|
#videoWindow.tubecss .vjs-menu-button {
|
||||||
width: 1.5em;
|
width: 1.5em;
|
||||||
border: 0;
|
border: 0;
|
||||||
background: none;
|
background: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-default-skin .vjs-play-control {
|
#videoWindow.tubecss .vjs-play-control {
|
||||||
width: 2em;
|
width: 2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -867,13 +870,13 @@ progress {
|
||||||
width: auto !important;
|
width: auto !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-default-skin .vjs-menu-button.vjs-quality-button div {
|
#videoWindow.tubecss .vjs-menu-button.vjs-quality-button div {
|
||||||
background: url("images/media/quality.png");
|
background: url("images/media/quality.png");
|
||||||
height: 16px;
|
height: 16px;
|
||||||
width: 16px;
|
width: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-default-skin .vjs-chapter-button div {
|
#videoWindow.tubecss .vjs-chapter-button div {
|
||||||
background: url("images/media/chapter.png");
|
background: url("images/media/chapter.png");
|
||||||
height: 16px;
|
height: 16px;
|
||||||
width: 16px;
|
width: 16px;
|
||||||
|
@ -885,26 +888,26 @@ progress {
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-chapter-button.vjs-menu-button ul li {
|
.vjs-chapter-button.vjs-menu-button ul li {
|
||||||
width: auto;
|
width: auto;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-default-skin .vjs-menu-button.vjs-stop-button {
|
#videoWindow.tubecss .vjs-menu-button.vjs-stop-button {
|
||||||
float: left;
|
float: left;
|
||||||
background: none;
|
background: none;
|
||||||
border: 0;
|
border: 0;
|
||||||
width: 2.5em;
|
width: 2.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-default-skin .vjs-menu-button.vjs-stop-button div {
|
#videoWindow.tubecss .vjs-menu-button.vjs-stop-button div {
|
||||||
background: url("images/media/stop.png");
|
background: url("images/media/stop.png");
|
||||||
height: 26px;
|
height: 26px;
|
||||||
width: 26px;
|
width: 26px;
|
||||||
margin: -.7em .5em auto 0;
|
margin: -.7em .5em auto 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-subtitle-button div {
|
.vjs-subtitle-button div {
|
||||||
background-position: -25px -75px !important;
|
background-position: -25px -75px !important;
|
||||||
|
@ -916,14 +919,14 @@ progress {
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-subtitle-button.vjs-menu-button ul li {
|
.vjs-subtitle-button.vjs-menu-button ul li {
|
||||||
width: auto;
|
width: auto;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-default-skin .vjs-menu-button.vjs-language-button div {
|
#videoWindow.tubecss .vjs-menu-button.vjs-language-button div {
|
||||||
background: url("images/media/language.png") !important;
|
background: url("images/media/language.png") !important;
|
||||||
height: 16px;
|
height: 16px;
|
||||||
width: 16px;
|
width: 16px;
|
||||||
|
@ -935,9 +938,30 @@ progress {
|
||||||
overflow-y: scroll;
|
overflow-y: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
.vjs-language-button.vjs-menu-button ul li {
|
.vjs-language-button.vjs-menu-button ul li {
|
||||||
width: auto;
|
width: auto;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
font-size: 1.1em;
|
font-size: 1.1em;
|
||||||
padding-right: 10px;
|
padding-right: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#videoWindow.tubecss .vjs-mute-control {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
#videoWindow.tubecss .vjs-volume-control {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
top: auto;
|
||||||
|
left: 4em;
|
||||||
|
}
|
||||||
|
#videoWindow.tubecss .vjs-time-controls, #videoWindow.tubecss .vjs-time-divider {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
top: auto;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
|
#videoWindow.tubecss .vjs-time-divider {
|
||||||
|
bottom: 0.4em;
|
||||||
|
}
|
|
@ -169,7 +169,7 @@
|
||||||
baseParams['StartTimeTicks'] = startPosition;
|
baseParams['StartTimeTicks'] = startPosition;
|
||||||
}
|
}
|
||||||
|
|
||||||
var html = '<video id="videoWindow" class="itemVideo video-js vjs-default-skin"></video>';
|
var html = '<video id="videoWindow" class="itemVideo video-js tubecss"></video>';
|
||||||
|
|
||||||
var nowPlayingBar = $('#nowPlayingBar');
|
var nowPlayingBar = $('#nowPlayingBar');
|
||||||
//hide stop button
|
//hide stop button
|
||||||
|
@ -235,9 +235,9 @@
|
||||||
(this).addEvent("play", updateProgress);
|
(this).addEvent("play", updateProgress);
|
||||||
|
|
||||||
(this).addEvent("ended", function () {
|
(this).addEvent("ended", function () {
|
||||||
MediaPlayer.stopVideo();
|
//MediaPlayer.stopVideo();
|
||||||
|
//Playlist.playNext();
|
||||||
Playlist.playNext();
|
MediaPlayer.stop();
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
});
|
||||||
|
@ -402,7 +402,7 @@
|
||||||
|
|
||||||
self.playNext = function (itemId) {
|
self.playNext = function (itemId) {
|
||||||
ApiClient.getItem(Dashboard.getCurrentUserId(), itemId).done(function (item) {
|
ApiClient.getItem(Dashboard.getCurrentUserId(), itemId).done(function (item) {
|
||||||
Playlist.playNext(item);
|
Playlist.addNext(item);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -31,8 +31,13 @@
|
||||||
|
|
||||||
self.playNext = function (item) {
|
self.playNext = function (item) {
|
||||||
if (typeof self.queue[0] != "undefined") {
|
if (typeof self.queue[0] != "undefined") {
|
||||||
//MediaPlayer.play(new Array(self.queue[0]));
|
MediaPlayer.play(new Array(self.queue[0]));
|
||||||
//self.queue.shift();
|
self.queue.shift();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
self.addNext = function (item) {
|
||||||
|
if (typeof self.queue[0] != "undefined") {
|
||||||
self.queue.unshift(item);
|
self.queue.unshift(item);
|
||||||
}else {
|
}else {
|
||||||
self.add(item);
|
self.add(item);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue