Skip to content

Commit

Permalink
Closes #970
Browse files Browse the repository at this point in the history
  • Loading branch information
@ParticleCore
ParticleCore committed Mar 26, 2024
1 parent 3d53156 commit 277a033
Show file tree
Hide file tree
Showing 12 changed files with 196 additions and 30 deletions.
9 changes: 9 additions & 0 deletions src/chrome/css/content-script.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,15 @@
}
/* end | autoplay */

/* ini | autoplay channel trailer */
#c4-player.unstarted-mode:is(.playing-mode, .paused-mode):not(.buffering-mode) > *:not(.ytp-cued-thumbnail-overlay) {
display: none;
}
#c4-player > .ytp-cued-thumbnail-overlay > .ytp-cued-thumbnail-overlay-image {
background-size: contain !important;
}
/* end | autoplay channel trailer */

/* ini | video focus */
html #masthead-container,
html #secondary,
Expand Down
15 changes: 15 additions & 0 deletions src/chrome/html/options.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -281,6 +281,21 @@
</div>
</div>
</div>
<div class="settingGroup">
<div class="settingLabel">Channel</div>
<div class="settingOptions">
<div class="setting" data-id="autoplayChannelTrailer">
<label class="switch">
<input data-setting="autoplayChannelTrailer" type="checkbox">
<span class="slider"></span>
</label>
<div class="settingDescription">
<div class="settingDescription highlight">Autoplay channel trailer</div>
<div class="settingDescription">Channel trailers will play automatically. Does not override the browser settings</div>
</div>
</div>
</div>
</div>
<div class="settingGroup">
<div class="settingLabel">Channel tab</div>
<div class="settingOptions">
Expand Down
64 changes: 49 additions & 15 deletions src/chrome/js/background-inject.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -320,11 +320,17 @@ function mainScript(extensionId, SettingData, defaultSettings) {

const spacebar = 32;
const keyK = 75;
const containers = [
const moviePlayerContainers = [
"#player:has(#movie_player)",
"#player-container:has(#movie_player)",
"#ytd-player:has(#movie_player)",
"#movie_player"
"#movie_player",
].join(",");
const c4PlayerContainers = [
"#player:has(#c4-player)",
"#player-container:has(#c4-player)",
"#ytd-player:has(#c4-player)",
"#c4-player",
].join(",");

const onClick = event => {
Expand All @@ -333,8 +339,10 @@ function mainScript(extensionId, SettingData, defaultSettings) {

clearTimeout(timer);

canPlay = event.target.id !== "player-wrap"
&& document.querySelector(containers)?.contains(event.target) === true;
canPlay = event.target.id !== "player-wrap" && (
document.querySelector(moviePlayerContainers)?.contains(event.target) === true
|| document.querySelector(c4PlayerContainers)?.contains(event.target) === true
);

if (canPlay) {
previousVideoId = document.getElementById("movie_player")?.["getVideoData"]()?.["video_id"] || null;
Expand All @@ -343,6 +351,35 @@ function mainScript(extensionId, SettingData, defaultSettings) {

}

const isAllowed = target => {

const currentKey = lastKey;

lastKey = -1;

const isMoviePlayer = document.getElementById("movie_player")?.contains(target) === true;

if (isMoviePlayer) {
return iridiumSettings.autoplay
|| canPlay
|| previousVideoId === (document.getElementById("movie_player")?.["getVideoData"]()?.["video_id"] || "")
|| lastKey === keyK
|| lastKey === spacebar;
}

const isC4Player = document.getElementById("c4-player")?.contains(target) === true;

if (isC4Player) {
return iridiumSettings.autoplayChannelTrailer
|| canPlay
|| lastKey === keyK
|| lastKey === spacebar;
}

return true;

};

const override = () => {

const original = HTMLVideoElement.prototype.play?.["original"] || HTMLVideoElement.prototype.play;
Expand All @@ -352,16 +389,8 @@ function mainScript(extensionId, SettingData, defaultSettings) {
const moviePlayer = document.getElementById("movie_player");
const isMoviePlayer = moviePlayer?.contains(this) === true;
const currentVideoId = moviePlayer?.["getVideoData"]()?.["video_id"] || "";
const allowed = !isMoviePlayer
|| iridiumSettings.autoplay
|| canPlay
|| previousVideoId === currentVideoId
|| lastKey === keyK
|| lastKey === spacebar;

lastKey = -1;

if (allowed) {
if (isAllowed(this)) {

if (isMoviePlayer) {
previousVideoId = currentVideoId;
Expand Down Expand Up @@ -406,15 +435,19 @@ function mainScript(extensionId, SettingData, defaultSettings) {
lastKey = event.keyCode
};

let listenersActive = false;

const update = () => {
if (iridiumSettings.autoplay) {
if (iridiumSettings.autoplay && iridiumSettings.autoplayChannelTrailer) {
listenersActive = false;
window.removeEventListener("yt-navigate-start", onNavigate, false);
window.removeEventListener("popstate", onNavigate, true);
document.removeEventListener('keydown', onKeyEvent, true);
document.removeEventListener('keyup', onKeyEvent, true);
document.removeEventListener("click", onClick, true);
reset();
} else {
} else if (!listenersActive) {
listenersActive = true;
window.addEventListener("yt-navigate-start", onNavigate, false);
window.addEventListener("popstate", onNavigate, true);
document.addEventListener('keydown', onKeyEvent, true);
Expand All @@ -427,6 +460,7 @@ function mainScript(extensionId, SettingData, defaultSettings) {
update();

FeatureUpdater.register(SettingData.autoplay.id, update);
FeatureUpdater.register(SettingData.autoplayChannelTrailer.id, update);

return {};

Expand Down
4 changes: 4 additions & 0 deletions src/chrome/js/chrome-wrapper.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,10 @@
id: "logoSubscriptions",
default: false,
},
autoplayChannelTrailer: {
id: "autoplayChannelTrailer",
default: false,
},
channelTab: {
id: "channelTab",
default: "featured",
Expand Down
4 changes: 4 additions & 0 deletions src/chrome/js/content-script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,10 @@ const SettingData = {
id: "logoSubscriptions",
default: false,
},
autoplayChannelTrailer: {
id: "autoplayChannelTrailer",
default: false,
},
channelTab: {
id: "channelTab",
default: "featured",
Expand Down
17 changes: 17 additions & 0 deletions src/chrome/js/options.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -176,6 +176,20 @@ const Manager = {

Util.updateSingleSetting(settingId, newState);

},
updateAutoplayChannelTrailer: (newState, userInteraction) => {

const settingId = SettingData.autoplayChannelTrailer.id;
const ui = document.querySelector(`[data-setting=${settingId}]`);

if (ui != null && ui.checked !== newState) {
ui.checked = newState;
}

if (!userInteraction) return;

Util.updateSingleSetting(settingId, newState);

},
updateChannelTab: (newState, userInteraction) => {

Expand Down Expand Up @@ -753,6 +767,9 @@ const Util = {
case SettingData.logoSubscriptions.id:
Manager.updateLogoSubscriptions(value, userInteraction);
break;
case SettingData.autoplayChannelTrailer.id:
Manager.updateAutoplayChannelTrailer(value, userInteraction);
break;
case SettingData.channelTab.id:
Manager.updateChannelTab(value, userInteraction);
break;
Expand Down
4 changes: 4 additions & 0 deletions src/chrome/js/setting-data.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,10 @@ const SettingData = {
id: "logoSubscriptions",
default: false,
},
autoplayChannelTrailer: {
id: "autoplayChannelTrailer",
default: false,
},
channelTab: {
id: "channelTab",
default: "featured",
Expand Down
9 changes: 9 additions & 0 deletions src/firefox/css/content-script.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,15 @@
}
/* end | autoplay */

/* ini | autoplay channel trailer */
#c4-player.unstarted-mode:is(.playing-mode, .paused-mode):not(.buffering-mode) > *:not(.ytp-cued-thumbnail-overlay) {
display: none;
}
#c4-player > .ytp-cued-thumbnail-overlay > .ytp-cued-thumbnail-overlay-image {
background-size: contain !important;
}
/* end | autoplay channel trailer */

/* ini | video focus */
html #masthead-container,
html #secondary,
Expand Down
15 changes: 15 additions & 0 deletions src/firefox/html/options.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -281,6 +281,21 @@
</div>
</div>
</div>
<div class="settingGroup">
<div class="settingLabel">Channel</div>
<div class="settingOptions">
<div class="setting" data-id="autoplayChannelTrailer">
<label class="switch">
<input data-setting="autoplayChannelTrailer" type="checkbox">
<span class="slider"></span>
</label>
<div class="settingDescription">
<div class="settingDescription highlight">Autoplay channel trailer</div>
<div class="settingDescription">Channel trailers will play automatically. Does not override the browser settings</div>
</div>
</div>
</div>
</div>
<div class="settingGroup">
<div class="settingLabel">Channel tab</div>
<div class="settingOptions">
Expand Down
64 changes: 49 additions & 15 deletions src/firefox/js/background-inject.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -320,11 +320,17 @@ function mainScript(extensionId, SettingData, defaultSettings) {

const spacebar = 32;
const keyK = 75;
const containers = [
const moviePlayerContainers = [
"#player:has(#movie_player)",
"#player-container:has(#movie_player)",
"#ytd-player:has(#movie_player)",
"#movie_player"
"#movie_player",
].join(",");
const c4PlayerContainers = [
"#player:has(#c4-player)",
"#player-container:has(#c4-player)",
"#ytd-player:has(#c4-player)",
"#c4-player",
].join(",");

const onClick = event => {
Expand All @@ -333,8 +339,10 @@ function mainScript(extensionId, SettingData, defaultSettings) {

clearTimeout(timer);

canPlay = event.target.id !== "player-wrap"
&& document.querySelector(containers)?.contains(event.target) === true;
canPlay = event.target.id !== "player-wrap" && (
document.querySelector(moviePlayerContainers)?.contains(event.target) === true
|| document.querySelector(c4PlayerContainers)?.contains(event.target) === true
);

if (canPlay) {
previousVideoId = document.getElementById("movie_player")?.["getVideoData"]()?.["video_id"] || null;
Expand All @@ -343,6 +351,35 @@ function mainScript(extensionId, SettingData, defaultSettings) {

}

const isAllowed = target => {

const currentKey = lastKey;

lastKey = -1;

const isMoviePlayer = document.getElementById("movie_player")?.contains(target) === true;

if (isMoviePlayer) {
return iridiumSettings.autoplay
|| canPlay
|| previousVideoId === (document.getElementById("movie_player")?.["getVideoData"]()?.["video_id"] || "")
|| lastKey === keyK
|| lastKey === spacebar;
}

const isC4Player = document.getElementById("c4-player")?.contains(target) === true;

if (isC4Player) {
return iridiumSettings.autoplayChannelTrailer
|| canPlay
|| lastKey === keyK
|| lastKey === spacebar;
}

return true;

};

const override = () => {

const original = HTMLVideoElement.prototype.play?.["original"] || HTMLVideoElement.prototype.play;
Expand All @@ -352,16 +389,8 @@ function mainScript(extensionId, SettingData, defaultSettings) {
const moviePlayer = document.getElementById("movie_player");
const isMoviePlayer = moviePlayer?.contains(this) === true;
const currentVideoId = moviePlayer?.["getVideoData"]()?.["video_id"] || "";
const allowed = !isMoviePlayer
|| iridiumSettings.autoplay
|| canPlay
|| previousVideoId === currentVideoId
|| lastKey === keyK
|| lastKey === spacebar;

lastKey = -1;

if (allowed) {
if (isAllowed(this)) {

if (isMoviePlayer) {
previousVideoId = currentVideoId;
Expand Down Expand Up @@ -406,15 +435,19 @@ function mainScript(extensionId, SettingData, defaultSettings) {
lastKey = event.keyCode
};

let listenersActive = false;

const update = () => {
if (iridiumSettings.autoplay) {
if (iridiumSettings.autoplay && iridiumSettings.autoplayChannelTrailer) {
listenersActive = false;
window.removeEventListener("yt-navigate-start", onNavigate, false);
window.removeEventListener("popstate", onNavigate, true);
document.removeEventListener('keydown', onKeyEvent, true);
document.removeEventListener('keyup', onKeyEvent, true);
document.removeEventListener("click", onClick, true);
reset();
} else {
} else if (!listenersActive) {
listenersActive = true;
window.addEventListener("yt-navigate-start", onNavigate, false);
window.addEventListener("popstate", onNavigate, true);
document.addEventListener('keydown', onKeyEvent, true);
Expand All @@ -427,6 +460,7 @@ function mainScript(extensionId, SettingData, defaultSettings) {
update();

FeatureUpdater.register(SettingData.autoplay.id, update);
FeatureUpdater.register(SettingData.autoplayChannelTrailer.id, update);

return {};

Expand Down
Loading

0 comments on commit 277a033

Please sign in to comment.