406 lines
14 KiB
JavaScript
406 lines
14 KiB
JavaScript
let TheHref = document.location.href;
|
|
let TheTimeout = null;
|
|
let SettingsStay = false;
|
|
|
|
const StringArray = ["What was the video about? Can you give an in-depth explaination of what you did?",
|
|
"START - What are some things that you can do to improve this video? What can you start doing? List the sections you want improved WITH TIMESTAMPS.",
|
|
"STOP - What are things that shouldn't be done or should not have began in the first place?",
|
|
"CONTINUE - What can you keep doing to make the same effect happen? These are things that don't need to be changed.",
|
|
"You did it! No Further typing is needed."];
|
|
|
|
// Observe changes to the Href and do things accordingly.
|
|
const observer = new MutationObserver(mutations => {
|
|
if (TheHref !== document.location.href) {
|
|
TheHref = document.location.href;
|
|
clearTimeout(TheTimeout);
|
|
TheTimeout = setTimeout(() => VideoOrChannel(), 1500);
|
|
}
|
|
});
|
|
observer.observe(document.body, { childList: true, subtree: true });
|
|
|
|
// Do some things on load.
|
|
window.onload = function() {
|
|
setTimeout(() => {
|
|
VideoOrChannel();
|
|
}, 2000);
|
|
document.getElementsByTagName("ytcp-send-feedback-button")[0].remove();
|
|
if (document.location.href.includes("channel")) {
|
|
document.getElementsByTagName("ytcp-ve")[9].parentElement.remove();
|
|
SettingsStay = true;
|
|
}
|
|
};
|
|
|
|
// Simple function to not have stuff die.
|
|
function VideoOrChannel(){
|
|
if (TheHref.includes("channel") && SettingsStay == false) {
|
|
document.getElementsByTagName("ytcp-ve")[9].parentElement.remove();
|
|
SettingsStay = true;
|
|
}
|
|
|
|
if (document.location.href.includes("channel")) {
|
|
ModifyChannelElements();
|
|
}
|
|
else {
|
|
ModifyVideoElements();
|
|
}
|
|
}
|
|
|
|
// Remove and add elements in the video area.
|
|
function ModifyVideoElements() {
|
|
SettingsStay = false;
|
|
if (document.location.href.includes("analytics")) {
|
|
if (document.location.href.includes("tab-overview")) {
|
|
console.log("Do nothing here");
|
|
}
|
|
if (document.location.href.includes("tab-reach_viewers")) {
|
|
console.log("Do nothing here");
|
|
}
|
|
if (document.location.href.includes("tab-interest_viewers")) {
|
|
console.log("Do nothing here");
|
|
}
|
|
if (document.location.href.includes("tab-build_audience")) {
|
|
console.log("Do nothing here");
|
|
}
|
|
console.log("You are in analytics!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("editor")) {
|
|
console.log("You are in the editor!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("comments")) {
|
|
console.log("You are in comments!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("translations")) {
|
|
console.log("You are in the translations!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("copyright")) {
|
|
console.log("You are in copyright!");
|
|
return;
|
|
}
|
|
|
|
// Livestream is seperated? Why?
|
|
if (document.location.href.includes("livestreaming")) {
|
|
console.log("You are streemin!");
|
|
return;
|
|
}
|
|
console.log("You are in the overview!");
|
|
}
|
|
|
|
// Remove and add elements in the channel area.
|
|
function ModifyChannelElements() {
|
|
if (document.location.href.includes("videos") || document.location.href.includes("content")) {
|
|
if (document.getElementsByTagName("ytcp-primary-action-bar")[0].classList.contains("PersistentElements") == false) {
|
|
document.getElementsByTagName("ytcp-primary-action-bar")[0].classList.add("PersistentElements");
|
|
document.getElementsByTagName("tp-yt-paper-tab")[7].remove();
|
|
}
|
|
console.log("Content elements have been altered!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("analytics")) {
|
|
if (document.location.href.includes("tab-overview")) {
|
|
let Items = document.getElementsByTagName("yta-personalized-overview-bottom-card");
|
|
Items[0].remove();
|
|
if (document.getElementsByTagName("yta-section")[0].classList.contains("PersistentElements") == false) {
|
|
document.getElementsByTagName("yta-section")[0].classList.add("PersistentElements");
|
|
Items = document.getElementsByTagName("yta-entity-snapshot-carousel");
|
|
Items[0].remove();
|
|
}
|
|
|
|
// Create Topic Buttons.
|
|
browser.storage.local.get("TopicList").then(
|
|
(List) => {
|
|
let Card = document.createElement("tp-yt-paper-card");
|
|
Card.classList.add("staple-card");
|
|
Card.classList.add("style-scope");
|
|
Card.classList.add("yta-card-container");
|
|
Card.style.marginTop = "24px";
|
|
let Text = document.createElement("div");
|
|
Text.classList.add("style-scope");
|
|
Text.style.margin = "24px";
|
|
Text.style.fontSize = "18px";
|
|
Text.style.fontWeight = "bold";
|
|
Text.innerHTML = "Interesting topics from the week!";
|
|
Card.appendChild(Text);
|
|
document.getElementsByTagName("yta-key-metric-card")[0].appendChild(Card);
|
|
// Yes, if there is nothing in storage, this errors.
|
|
// This is my fix: ignore it. Also fuck off.
|
|
for (let i of Object.values(List)[0]) {
|
|
// Style elements
|
|
let Button = document.createElement("button");
|
|
Button.style.width = "45%";
|
|
Button.style.height = "50px";
|
|
Button.style.border = "25%";
|
|
Button.style.margin = "12px";
|
|
Button.style.background = "rgba(255, 255, 255, 0.1)";
|
|
Button.style.color = "white";
|
|
Button.style.border = "0px solid";
|
|
Button.style.borderRadius = "20px";
|
|
Button.style.fontSize = "20px";
|
|
Button.style.fontWeight = "bold";
|
|
// Events to behave like a button
|
|
Button.addEventListener("mouseenter", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.2)";
|
|
});
|
|
Button.addEventListener("mouseleave", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.1)";
|
|
});
|
|
Button.addEventListener("mousedown", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.15)";
|
|
});
|
|
Button.addEventListener("mouseup", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.2)";
|
|
});
|
|
Button.innerHTML = i;
|
|
i = i.replaceAll(" ", "+");
|
|
Button.addEventListener("click", (event) => {
|
|
document.location.href = "https://www.google.com/search?q=" + i + "&udm=7&tbs=qdr:w";
|
|
});
|
|
Card.appendChild(Button);
|
|
}
|
|
}
|
|
);
|
|
}
|
|
if (document.location.href.includes("tab-content")) {
|
|
console.log("Do nothing here");
|
|
}
|
|
if (document.location.href.includes("tab-build_audience")) {
|
|
console.log("Do nothing here");
|
|
}
|
|
if (document.location.href.includes("tab-research")) {
|
|
console.log("Do nothing here");
|
|
}
|
|
console.log("Analytic elements have been altered!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("comments")) {
|
|
console.log("You are in comments!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("translations")) {
|
|
console.log("You are in translations!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("copyright")) {
|
|
console.log("you are in copyright!");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("monetization")) {
|
|
console.log("You are in monitization");
|
|
return;
|
|
}
|
|
|
|
if (document.location.href.includes("editing")) {
|
|
console.log("You are in customization!");
|
|
return;
|
|
}
|
|
|
|
// Dashboard
|
|
// Remove the quick actions (they are useless)
|
|
if (document.getElementsByTagName("ytcp-quick-actions").length > 0) {
|
|
document.getElementsByTagName("ytcp-quick-actions")[0].remove();
|
|
}
|
|
|
|
// Adjust the cards in certain columns.
|
|
for (let Element of document.getElementsByTagName("ytcd-card")) {
|
|
// remove cards
|
|
if (Element.getAttribute("test-id") == "channel-dashboard-snapshot-card") {
|
|
Element.remove();
|
|
}
|
|
}
|
|
|
|
// Livestream is seperated? Why?
|
|
if (document.location.href.includes("livestreaming")) {
|
|
console.log("You are streemin!");
|
|
return;
|
|
}
|
|
|
|
// Past this point is the dashboard.
|
|
// Alter all of the columns to suit the needs of me.
|
|
let Counter = 0;
|
|
while (Counter <= 2) {
|
|
switch (Counter) {
|
|
case 0:
|
|
document.getElementsByTagName("ytcd-card-column")[Counter].setAttribute("style", "width: calc(50% - var(--card-margin));");
|
|
case 1:
|
|
document.getElementsByTagName("ytcd-card-column")[Counter].setAttribute("style", "width: calc(50% - var(--card-margin));");
|
|
break;
|
|
case 2:
|
|
document.getElementsByTagName("ytcd-card-column")[Counter].remove();
|
|
break;
|
|
}
|
|
Counter++;
|
|
}
|
|
|
|
// Create objects in the Dashboard.
|
|
// This if statement is for elements that don't go away once deleted.
|
|
const Dashboard = document.getElementsByTagName("ytcd-channel-dashboard")
|
|
if (document.getElementsByClassName("PersistentObject").length == 0) {
|
|
// Create the progress bar.
|
|
let Progress = document.createElement("div");
|
|
Progress.classList.add("PersistentObject");
|
|
// Style elements.
|
|
Progress.style.height = "50px";
|
|
Progress.style.width = "100% - 24px";
|
|
Progress.style.margin = "24px";
|
|
Progress.style.border = "1px solid rgba(255, 255, 255, 0.1";
|
|
// Create the inside of the progress bar.
|
|
let Meter = document.createElement("div");
|
|
// Style elements.
|
|
Meter.style.background = "rgb(255, 0, 0)";
|
|
Meter.classList.add("liquid");
|
|
Meter.style.width = "0%";
|
|
Meter.style.height = "100%";
|
|
Progress.appendChild(Meter);
|
|
// Place the progress bar on top.
|
|
Dashboard[0].parentElement.insertBefore(Progress, Dashboard[0]);
|
|
// Create the text box.
|
|
let Textbox = document.createElement("textarea");
|
|
// Style elements.
|
|
Textbox.style.marginLeft = "24px";
|
|
Textbox.style.marginRight = "24px";
|
|
Textbox.style.height = "200px";
|
|
Textbox.style.background = "rgba(0, 0, 0, 0.2)";
|
|
Textbox.style.border = "1px solid rgba(255, 255, 255, 0.1";
|
|
Textbox.style.color = "white";
|
|
Textbox.placeholder = StringArray[0];
|
|
Textbox.style.resize = "none";
|
|
Dashboard[0].parentElement.insertBefore(Textbox, Dashboard[0]);
|
|
// Create the continue button.
|
|
let Button = document.createElement("button");
|
|
// Style elements.
|
|
Button.style.width = "250px";
|
|
Button.style.height = "40px";
|
|
Button.style.border = "25%";
|
|
Button.style.margin = "24px";
|
|
Button.style.marginBottom = "0";
|
|
Button.innerHTML = "Continue";
|
|
Button.style.background = "rgba(255, 255, 255, 0.1)";
|
|
Button.style.color = "white";
|
|
Button.style.border = "0px solid";
|
|
Button.style.borderRadius = "20px";
|
|
Button.style.fontSize = "18px";
|
|
Button.style.fontWeight = "bold";
|
|
// Change style like a button
|
|
Button.addEventListener("mouseenter", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.2)";
|
|
});
|
|
Button.addEventListener("mouseleave", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.1)";
|
|
});
|
|
Button.addEventListener("mousedown", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.15)";
|
|
});
|
|
Button.addEventListener("mouseup", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.2)";
|
|
});
|
|
Button.addEventListener("click", (event) => {
|
|
// Button to not only progress the bar, but to also clear the textbox!
|
|
const Liquid = document.getElementsByClassName("liquid")[0];
|
|
if (Liquid.clientWidth != Liquid.parentElement.clientWidth) {
|
|
// If the thing is full, don't do anything
|
|
if (Liquid.clientWidth - 1 == Liquid.parentElement.clientWidth) {
|
|
Textbox.disabled = true;
|
|
}
|
|
else {
|
|
let BigAssCalc = (Liquid.clientWidth + (Liquid.parentElement.clientWidth / 4)) / Liquid.parentElement.clientWidth;
|
|
document.cookie = "ProgressAmount=" + (BigAssCalc * 100).toString() + ";max-age=28800";
|
|
Liquid.style.width = (BigAssCalc * 100) + "%";
|
|
Textbox.value = "";
|
|
Textbox.placeholder = StringArray[parseInt(Liquid.style.width) / 25];
|
|
}
|
|
}
|
|
});
|
|
Dashboard[0].parentElement.insertBefore(Button, Dashboard[0]);
|
|
// Check for cookies.
|
|
if (document.cookie.split("; ").find((row) => row.startsWith("ProgressAmount="))?.split("=")[1] != undefined) {
|
|
const Liquid = document.getElementsByClassName("liquid")[0];
|
|
document.getElementsByClassName("liquid")[0].style.width = document.cookie.split("; ").find((row) => row.startsWith("ProgressAmount="))?.split("=")[1] + "%";
|
|
Textbox.placeholder = StringArray[parseInt(Liquid.style.width) / 25];
|
|
if (Liquid.clientWidth - 1 == Liquid.parentElement.clientWidth) {
|
|
Textbox.disabled = true;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Elements that go away go here.
|
|
// Create Channel Buttons.
|
|
browser.storage.local.get("ChannelList").then(
|
|
(List) => {
|
|
let Card = document.createElement("ytcd-card");
|
|
Card.classList.add("card");
|
|
Card.classList.add("style-scope");
|
|
Card.classList.add("ytcd-card");
|
|
let Text = document.createElement("div");
|
|
Text.classList.add("title-text");
|
|
Text.classList.add("style-scope");
|
|
Text.classList.add("ytcd-list-card");
|
|
Text.classList.add("card-title");
|
|
Text.innerHTML = "Cool channels on YouYube!";
|
|
Text.style.fontSize = "18px";
|
|
Text.style.margin = "24px 24px 0px 24px";
|
|
Card.appendChild(Text);
|
|
Dashboard[0].getElementsByTagName("ytcd-card-column")[0].appendChild(Card);
|
|
// Yes, if there is nothing in storage, this errors.
|
|
// This is my fix: ignore it. Also fuck off.
|
|
for (let i of Object.values(List)[0]) {
|
|
// Style elements
|
|
let Button = document.createElement("button");
|
|
Button.style.minWidth = "300px";
|
|
Button.style.height = "30px";
|
|
Button.style.border = "25%";
|
|
Button.style.margin = "12px";
|
|
Button.style.background = "rgba(255, 255, 255, 0.1)";
|
|
Button.style.color = "white";
|
|
Button.style.border = "0px solid";
|
|
Button.style.borderRadius = "20px";
|
|
Button.style.fontSize = "13px";
|
|
Button.style.fontWeight = "bold";
|
|
// Change style like a button.
|
|
Button.addEventListener("mouseenter", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.2)";
|
|
});
|
|
Button.addEventListener("mouseleave", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.1)";
|
|
});
|
|
Button.addEventListener("mousedown", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.15)";
|
|
});
|
|
Button.addEventListener("mouseup", (event) => {
|
|
Button.style.background = "rgba(255, 255, 255, 0.2)";
|
|
});
|
|
// Different cases for what the user wants to do.
|
|
if (i.indexOf("http://") == 0) {
|
|
i = i.slice(7);
|
|
}
|
|
if (i.indexOf("https://") == 0) {
|
|
i = i.slice(8);
|
|
}
|
|
if (i.indexOf("@") == 0) {
|
|
i = "www.youtube.com/" + i;
|
|
}
|
|
if (i.indexOf("http://") != 0 && i.indexOf("https://") != 0 && i.indexOf("@") != 0 && i.indexOf("www.youtube.com")) {
|
|
console.warn("The extension has no idea what to do with this string. Please consider removing it.");
|
|
console.warn(i);
|
|
}
|
|
Button.innerHTML = i;
|
|
Button.addEventListener("click", (event) => {
|
|
document.location.href = "https://" + i;
|
|
});
|
|
Card.appendChild(Button);
|
|
}
|
|
}
|
|
);
|
|
console.log("Home elements have been altered!");
|
|
}
|