Update betterYoutube.js
Fixed script to manage new html tagging of Youtube.
This commit is contained in:
parent
c2a9492690
commit
20c9921f77
|
@ -3,13 +3,13 @@ var ytThumbImgMenu, ytEnhancerMenu; // Menu systems
|
|||
var ytThumbnailBttn, ytMaxDefaultImg, ytHqDefaultImg, // Buttons & Images
|
||||
ytLoopBttn, ytFloatBttn, ytAMaxDefaultImg, ytAHqDefaultImg;
|
||||
|
||||
var mastHead, video, mainPlayerWindow, poppedVdoContr; // Video accessor
|
||||
var mainContentArea; // Youtube Player container
|
||||
var mastHead, mainContentArea, playerWindow; // Youtube Player container
|
||||
var video, mainPlayerWindow, poppedContainer; // Video accessor
|
||||
var vdoPlyrAtts; // Player attributes
|
||||
var part; // Image part
|
||||
var part, videoSlug, temp; // Image part
|
||||
|
||||
function setupContentandInsert() {
|
||||
poppedVdoContr = document.createElement("DIV");
|
||||
function preSetupProc() {
|
||||
poppedContainer = document.createElement("DIV");
|
||||
ytThumbImgMenu = document.createElement("DIV");
|
||||
ytEnhancerMenu = document.createElement("DIV");
|
||||
ytThumbnailBttn = document.createElement("IMG");
|
||||
|
@ -19,16 +19,16 @@ function setupContentandInsert() {
|
|||
ytFloatBttn = document.createElement("IMG");
|
||||
ytAMaxDefaultImg = document.createElement("A");
|
||||
ytAHqDefaultImg = document.createElement("A");
|
||||
video = document.getElementsByTagName("video")[0];
|
||||
mastHead = document.getElementById("masthead");
|
||||
|
||||
part = "//i.ytimg.com/vi/";
|
||||
|
||||
// Get nodes for page work
|
||||
mastHead = document.getElementById("yt-masthead-container"); // Search bar area
|
||||
mainContentArea = document.getElementById("page-container"); // BT control insert area and bg color setup
|
||||
mainPlayerWindow = document.getElementById("player-mole-container"); // Set up for insert to floating container
|
||||
vdoPlyrAtts = document.getElementById("page").attributes; // Used for setting up thumbnails
|
||||
video = document.getElementsByTagName("video")[0]; // Video Controler
|
||||
part = "https://img.youtube.com/vi/";
|
||||
|
||||
// Append to nodes as required
|
||||
mainContentArea = $("ytd-watch");
|
||||
mainPlayerWindow = $("#player-container").parent();
|
||||
vdoPlyrAtts = mainContentArea[0].attributes;
|
||||
ytEnhancerMenu.appendChild(ytThumbnailBttn);
|
||||
ytEnhancerMenu.appendChild(ytLoopBttn);
|
||||
ytEnhancerMenu.appendChild(ytFloatBttn);
|
||||
|
@ -38,9 +38,9 @@ function setupContentandInsert() {
|
|||
ytFloatBttn.src = browser.extension.getURL("icons/floatPlayer.png");
|
||||
|
||||
// Insert
|
||||
document.body.appendChild(poppedVdoContr);
|
||||
mainContentArea[0].appendChild(ytThumbImgMenu);
|
||||
mainContentArea[0].appendChild(ytEnhancerMenu);
|
||||
document.body.appendChild(poppedContainer);
|
||||
document.body.appendChild(ytThumbImgMenu);
|
||||
document.body.appendChild(ytEnhancerMenu);
|
||||
ytAMaxDefaultImg.appendChild(ytMaxDefaultImg);
|
||||
ytAHqDefaultImg.appendChild(ytHqDefaultImg);
|
||||
ytThumbImgMenu.appendChild(ytAMaxDefaultImg);
|
||||
|
@ -53,13 +53,12 @@ function setupContentandInsert() {
|
|||
video.addEventListener("wheel", manageVolume);
|
||||
|
||||
// Dragable window for floating video
|
||||
dragVideo(poppedVdoContr);
|
||||
dragVideo(poppedContainer);
|
||||
|
||||
// Set trget of Thumbnails of video
|
||||
ytAMaxDefaultImg.target = "_blank";
|
||||
ytAHqDefaultImg.target = "_blank";
|
||||
|
||||
|
||||
// Theming & Apply Styles
|
||||
ytThumbImgMenu.className = "ytThumbMenuStyle";
|
||||
ytMaxDefaultImg.className = "thumbImageStyle";
|
||||
|
@ -68,26 +67,29 @@ function setupContentandInsert() {
|
|||
ytThumbnailBttn.className = "imageStyle";
|
||||
ytLoopBttn.className = "imageStyle";
|
||||
ytFloatBttn.className = "imageStyle";
|
||||
poppedVdoContr.id = "draggable";
|
||||
poppedVdoContr.style.display = "none";
|
||||
mainContentArea[0].style = "background: #C0C0C0;";
|
||||
mastHead.style = "background: #C0C0C0;";
|
||||
poppedContainer.id = "draggable";
|
||||
poppedContainer.style.display = "none";
|
||||
mastHead.style = "background: #868686;";
|
||||
mainContentArea.style = "background: #868686;";
|
||||
}
|
||||
|
||||
// Functions
|
||||
function showThumbImageVew(e) {
|
||||
temp = vdoPlyrAtts[1].value;
|
||||
temp = temp.replace(" watch video-", "");
|
||||
videoSlug = temp.replace(" clearfix", "");
|
||||
|
||||
if (ytThumbImgMenu.style.display == "block") {
|
||||
ytThumbImgMenu.style.display = "none";
|
||||
ytThumbnailBttn.src = browser.extension.getURL("icons/thumbnailOff.png");
|
||||
} else {
|
||||
ytAMaxDefaultImg.href = part + vdoPlyrAtts[0].value + "/maxresdefault.jpg";
|
||||
ytAHqDefaultImg.href = part + vdoPlyrAtts[0].value + "/hqdefault.jpg";
|
||||
ytMaxDefaultImg.src = part + vdoPlyrAtts[0].value + "/maxresdefault.jpg";
|
||||
ytHqDefaultImg.src = part + vdoPlyrAtts[0].value + "/hqdefault.jpg";
|
||||
ytAMaxDefaultImg.href = part + videoSlug + "/maxresdefault.jpg";
|
||||
ytAHqDefaultImg.href = part + videoSlug + "/hqdefault.jpg";
|
||||
ytMaxDefaultImg.src = part + videoSlug + "/maxresdefault.jpg";
|
||||
ytHqDefaultImg.src = part + videoSlug + "/hqdefault.jpg";
|
||||
ytThumbnailBttn.src = browser.extension.getURL("icons/thumbnailOn.png");
|
||||
ytThumbImgMenu.style.display = "block";
|
||||
}
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
|
@ -103,14 +105,14 @@ function setLoop(e) {
|
|||
}
|
||||
|
||||
function toggleFloat() {
|
||||
playerWindow = document.getElementById("player-container");
|
||||
playerWindow = document.getElementById("player-api");
|
||||
|
||||
if(poppedVdoContr.style.display == "none"){
|
||||
poppedVdoContr.appendChild(playerWindow);
|
||||
poppedVdoContr.style.display = "block";
|
||||
if(poppedContainer.style.display == "none"){
|
||||
poppedContainer.appendChild(playerWindow);
|
||||
poppedContainer.style.display = "block";
|
||||
} else {
|
||||
mainPlayerWindow[0].insertBefore(playerWindow, mainPlayerWindow[0].firstChild);
|
||||
poppedVdoContr.style.display = "none";
|
||||
mainPlayerWindow.insertBefore(playerWindow, mainPlayerWindow.firstChild);
|
||||
poppedContainer.style.display = "none";
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -166,8 +168,4 @@ function dragVideo(elmnt) {
|
|||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
// load after important dom elements are present
|
||||
$(document).arrive("#player-container", function() {
|
||||
setupContentandInsert();
|
||||
});
|
||||
preSetupProc();
|
||||
|
|
Loading…
Reference in New Issue