summaryrefslogtreecommitdiffstats
path: root/assets
diff options
context:
space:
mode:
Diffstat (limited to 'assets')
-rw-r--r--assets/css/darktheme.css37
-rw-r--r--assets/css/default.css151
-rw-r--r--assets/css/lighttheme.css16
-rw-r--r--assets/css/videojs-vtt-thumbnails-fix.css3
-rw-r--r--assets/js/embed.js9
-rw-r--r--assets/js/player.js41
-rw-r--r--assets/js/themes.js15
-rw-r--r--assets/js/watch.js9
8 files changed, 207 insertions, 74 deletions
diff --git a/assets/css/darktheme.css b/assets/css/darktheme.css
deleted file mode 100644
index 92da15b6..00000000
--- a/assets/css/darktheme.css
+++ /dev/null
@@ -1,37 +0,0 @@
-a:hover,
-a:active {
- color: rgb(0, 182, 240);
-}
-
-a {
- color: #a0a0a0;
- text-decoration: none;
-}
-
-body {
- background-color: rgba(35, 35, 35, 1);
- color: #f0f0f0;
-}
-
-.pure-form legend {
- color: #f0f0f0;
-}
-
-.pure-menu-heading {
- color: #f0f0f0;
-}
-
-input,
-select,
-textarea {
- color: rgba(35, 35, 35, 1);
-}
-
-.pure-form input[type="file"] {
- color: #f0f0f0;
-}
-
-.navbar > .searchbar input {
- background-color: inherit;
- color: inherit;
-}
diff --git a/assets/css/default.css b/assets/css/default.css
index b7a77be6..e403e606 100644
--- a/assets/css/default.css
+++ b/assets/css/default.css
@@ -20,7 +20,7 @@ body {
height: auto;
}
-.channel-owner {
+body a.channel-owner {
background-color: #008bec;
color: #fff;
border-radius: 9px;
@@ -101,15 +101,19 @@ div {
padding-right: 10px;
}
+body a.pure-button {
+ color: rgba(0,0,0,.8);
+}
+
button.pure-button-primary,
-a.pure-button-primary,
+body a.pure-button-primary,
.channel-owner:hover {
background-color: #a0a0a0;
color: rgba(35, 35, 35, 1);
}
button.pure-button-primary:hover,
-a.pure-button-primary:hover {
+body a.pure-button-primary:hover {
background-color: rgba(0, 182, 240, 1);
color: #fff;
}
@@ -282,7 +286,7 @@ input[type="search"]::-webkit-search-cancel-button {
text-align: center;
}
-.footer a {
+body .footer a {
color: inherit;
text-decoration: underline;
}
@@ -485,3 +489,142 @@ video.video-js {
margin-top: -0.81666em;
margin-left: -1.5em;
}
+
+/*
+ * Light theme
+ */
+
+.light-theme a:hover,
+.light-theme a:active {
+ color: #075A9E !important;
+}
+
+.light-theme a.pure-button-primary:hover {
+ color: #fff !important;
+}
+
+.light-theme a {
+ color: #335d7a;
+ text-decoration: none;
+}
+
+/* All links that do not fit with the default color goes here */
+.light-theme a:not([data-id]) > .icon,
+.light-theme .pure-u-lg-1-5 > .h-box > a[href^="/watch?"],
+.light-theme .playlist-restricted > ol > li > a {
+ color: #303030;
+}
+
+.light-theme .pure-menu-heading {
+ color: #565d64;
+}
+
+@media (prefers-color-scheme: light) {
+ .no-theme a:hover,
+ .no-theme a:active {
+ color: #075A9E !important;
+ }
+
+ .no-theme a.pure-button-primary:hover {
+ color: #fff !important;
+ }
+
+ .no-theme a {
+ color: #335d7a;
+ text-decoration: none;
+ }
+
+ /* All links that do not fit with the default color goes here */
+ .no-theme a:not([data-id]) > .icon,
+ .no-theme .pure-u-lg-1-5 > .h-box > a[href^="/watch?"],
+ .no-theme .playlist-restricted > ol > li > a {
+ color: #303030;
+ }
+
+ .light-theme .pure-menu-heading {
+ color: #565d64;
+ }
+}
+
+/*
+ * Dark theme
+ */
+
+.dark-theme a:hover,
+.dark-theme a:active {
+ color: rgb(0, 182, 240);
+}
+
+.dark-theme a {
+ color: #a0a0a0;
+ text-decoration: none;
+}
+
+body.dark-theme {
+ background-color: rgba(35, 35, 35, 1);
+ color: #f0f0f0;
+}
+
+.dark-theme .pure-form legend {
+ color: #f0f0f0;
+}
+
+.dark-theme .pure-menu-heading {
+ color: #f0f0f0;
+}
+
+.dark-theme input,
+.dark-theme select,
+.dark-theme textarea {
+ color: rgba(35, 35, 35, 1);
+}
+
+.dark-theme .pure-form input[type="file"] {
+ color: #f0f0f0;
+}
+
+.dark-theme .navbar > .searchbar input {
+ background-color: inherit;
+ color: inherit;
+}
+
+@media (prefers-color-scheme: dark) {
+ .no-theme a:hover,
+ .no-theme a:active {
+ color: rgb(0, 182, 240);
+ }
+
+ .no-theme a {
+ color: #a0a0a0;
+ text-decoration: none;
+ }
+
+ body.no-theme {
+ background-color: rgba(35, 35, 35, 1);
+ color: #f0f0f0;
+ }
+
+ .no-theme .pure-form legend {
+ color: #f0f0f0;
+ }
+
+ .no-theme .pure-menu-heading {
+ color: #f0f0f0;
+ }
+
+ .no-theme input,
+ .no-theme select,
+ .no-theme textarea {
+ color: rgba(35, 35, 35, 1);
+ }
+
+ .no-theme .pure-form input[type="file"] {
+ color: #f0f0f0;
+ }
+
+ .no-theme .navbar > .searchbar input {
+ background-color: inherit;
+ color: inherit;
+ }
+}
+
diff --git a/assets/css/lighttheme.css b/assets/css/lighttheme.css
deleted file mode 100644
index 73706bb7..00000000
--- a/assets/css/lighttheme.css
+++ /dev/null
@@ -1,16 +0,0 @@
-a:hover,
-a:active {
- color: #167ac6 !important;
-}
-
-a {
- color: #61809b;
- text-decoration: none;
-}
-
-/* All links that do not fit with the default color goes here */
-a:not([data-id]) > .icon,
-.pure-u-lg-1-5 > .h-box > a[href^="/watch?"],
-.playlist-restricted > ol > li > a {
- color: #303030;
-}
diff --git a/assets/css/videojs-vtt-thumbnails-fix.css b/assets/css/videojs-vtt-thumbnails-fix.css
deleted file mode 100644
index 8b62cf0c..00000000
--- a/assets/css/videojs-vtt-thumbnails-fix.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.video-js .vjs-vtt-thumbnail-display {
- max-width: 158px;
-}
diff --git a/assets/js/embed.js b/assets/js/embed.js
index 99d2fc53..9d0be0ea 100644
--- a/assets/js/embed.js
+++ b/assets/js/embed.js
@@ -31,6 +31,11 @@ function get_playlist(plid, retries) {
player.on('ended', function () {
var url = new URL('https://example.com/embed/' + xhr.response.nextVideo);
+ url.searchParams.set('list', plid);
+ if (!plid.startsWith('RD')) {
+ url.searchParams.set('index', xhr.response.index);
+ }
+
if (video_data.params.autoplay || video_data.params.continue_autoplay) {
url.searchParams.set('autoplay', '1');
}
@@ -47,10 +52,6 @@ function get_playlist(plid, retries) {
url.searchParams.set('local', video_data.params.local);
}
- url.searchParams.set('list', plid);
- if (!plid.startsWith('RD')) {
- url.searchParams.set('index', xhr.response.index);
- }
location.assign(url.pathname + url.search);
});
}
diff --git a/assets/js/player.js b/assets/js/player.js
index f79fbbf3..fcba43d8 100644
--- a/assets/js/player.js
+++ b/assets/js/player.js
@@ -41,8 +41,16 @@ var shareOptions = {
embedCode: "<iframe id='ivplayer' width='640' height='360' src='" + embed_url + "' style='border:none;'></iframe>"
}
+videojs.Hls.xhr.beforeRequest = function(options) {
+ if (options.uri.indexOf('local=true') === -1) {
+ options.uri = options.uri + '?local=true';
+ }
+ return options;
+};
+
var player = videojs('player', options);
+
if (location.pathname.startsWith('/embed/')) {
player.overlay({
overlays: [{
@@ -146,6 +154,35 @@ if (video_data.params.autoplay) {
if (!video_data.params.listen && video_data.params.quality === 'dash') {
player.httpSourceSelector();
+
+ if (video_data.params.quality_dash != "auto") {
+ player.ready(() => {
+ player.on("loadedmetadata", () => {
+ const qualityLevels = Array.from(player.qualityLevels()).sort((a, b) => a.height - b.height);
+ let targetQualityLevel;
+ switch (video_data.params.quality_dash) {
+ case "best":
+ targetQualityLevel = qualityLevels.length - 1;
+ break;
+ case "worst":
+ targetQualityLevel = 0;
+ break;
+ default:
+ const targetHeight = Number.parseInt(video_data.params.quality_dash, 10);
+ for (let i = 0; i < qualityLevels.length; i++) {
+ if (qualityLevels[i].height <= targetHeight) {
+ targetQualityLevel = i;
+ } else {
+ break;
+ }
+ }
+ }
+ for (let i = 0; i < qualityLevels.length; i++) {
+ qualityLevels[i].enabled = (i == targetQualityLevel);
+ }
+ });
+ });
+ }
}
player.vttThumbnails({
@@ -502,4 +539,6 @@ window.addEventListener('keydown', e => {
}());
// Since videojs-share can sometimes be blocked, we defer it until last
-player.share(shareOptions);
+if (player.share) {
+ player.share(shareOptions);
+}
diff --git a/assets/js/themes.js b/assets/js/themes.js
index c600073d..543b849e 100644
--- a/assets/js/themes.js
+++ b/assets/js/themes.js
@@ -2,7 +2,7 @@ var toggle_theme = document.getElementById('toggle_theme');
toggle_theme.href = 'javascript:void(0);';
toggle_theme.addEventListener('click', function () {
- var dark_mode = document.getElementById('dark_theme').media === 'none';
+ var dark_mode = document.body.classList.contains("light-theme");
var url = '/toggle_theme?redirect=false';
var xhr = new XMLHttpRequest();
@@ -22,7 +22,7 @@ window.addEventListener('storage', function (e) {
}
});
-window.addEventListener('load', function () {
+window.addEventListener('DOMContentLoaded', function () {
window.localStorage.setItem('dark_mode', document.getElementById('dark_mode_pref').textContent);
// Update localStorage if dark mode preference changed on preferences page
update_mode(window.localStorage.dark_mode);
@@ -50,13 +50,18 @@ function scheme_switch (e) {
}
function set_mode (bool) {
- document.getElementById('dark_theme').media = !bool ? 'none' : '';
- document.getElementById('light_theme').media = bool ? 'none' : '';
-
if (bool) {
+ // dark
toggle_theme.children[0].setAttribute('class', 'icon ion-ios-sunny');
+ document.body.classList.remove('no-theme');
+ document.body.classList.remove('light-theme');
+ document.body.classList.add('dark-theme');
} else {
+ // light
toggle_theme.children[0].setAttribute('class', 'icon ion-ios-moon');
+ document.body.classList.remove('no-theme');
+ document.body.classList.remove('dark-theme');
+ document.body.classList.add('light-theme');
}
}
diff --git a/assets/js/watch.js b/assets/js/watch.js
index e9ad2ddc..05530f3d 100644
--- a/assets/js/watch.js
+++ b/assets/js/watch.js
@@ -154,6 +154,11 @@ function get_playlist(plid, retries) {
player.on('ended', function () {
var url = new URL('https://example.com/watch?v=' + xhr.response.nextVideo);
+ url.searchParams.set('list', plid);
+ if (!plid.startsWith('RD')) {
+ url.searchParams.set('index', xhr.response.index);
+ }
+
if (video_data.params.autoplay || video_data.params.continue_autoplay) {
url.searchParams.set('autoplay', '1');
}
@@ -170,10 +175,6 @@ function get_playlist(plid, retries) {
url.searchParams.set('local', video_data.params.local);
}
- url.searchParams.set('list', plid);
- if (!plid.startsWith('RD')) {
- url.searchParams.set('index', xhr.response.index);
- }
location.assign(url.pathname + url.search);
});
}