Added more thumbnail options and changed control positions plus added on hovwr titles.
This commit is contained in:
@@ -14,12 +14,16 @@ function preSetupProc() {
|
||||
ytThumbImgMenu = document.createElement("DIV");
|
||||
ytEnhancerMenu = document.createElement("DIV");
|
||||
ytThumbnailBttn = document.createElement("IMG");
|
||||
ytMaxDefaultImg = document.createElement("IMG");
|
||||
ytHqDefaultImg = document.createElement("IMG");
|
||||
ytLoopBttn = document.createElement("IMG");
|
||||
ytFloatBttn = document.createElement("IMG");
|
||||
ytMaxDefaultImg = document.createElement("IMG");
|
||||
ytHqDefaultImg = document.createElement("IMG");
|
||||
ytMqDefaultImg = document.createElement("IMG");
|
||||
ytSdDefaultImg = document.createElement("IMG");
|
||||
ytAMaxDefaultImg = document.createElement("A");
|
||||
ytAHqDefaultImg = document.createElement("A");
|
||||
ytAMedDefaultImg = document.createElement("A");
|
||||
ytASdDefaultImg = document.createElement("A");
|
||||
|
||||
// Get nodes for page work
|
||||
mastHead = document.getElementById("masthead-container")
|
||||
@@ -31,22 +35,26 @@ function preSetupProc() {
|
||||
part = "https://img.youtube.com/vi/";
|
||||
|
||||
// Append to nodes as required
|
||||
ytThumbnailBttn.title = "Video Thumbnails...";
|
||||
ytLoopBttn.title = "Start Loop...";
|
||||
ytFloatBttn.title = "Float Video Container";
|
||||
|
||||
ytEnhancerMenu.appendChild(ytThumbnailBttn);
|
||||
ytEnhancerMenu.appendChild(ytLoopBttn);
|
||||
ytEnhancerMenu.appendChild(ytFloatBttn);
|
||||
|
||||
ytThumbnailBttn.src = browser.extension.getURL("/icons/thumbnailOff.png");
|
||||
ytLoopBttn.src = browser.extension.getURL("/icons/loopFalse.png");
|
||||
ytFloatBttn.src = browser.extension.getURL("/icons/floatPlayer.png");
|
||||
|
||||
// Insert
|
||||
document.body.appendChild(poppedContainer);
|
||||
document.body.appendChild(ytThumbImgMenu);
|
||||
document.body.appendChild(ytEnhancerMenu);
|
||||
ytAMaxDefaultImg.appendChild(ytMaxDefaultImg);
|
||||
ytAHqDefaultImg.appendChild(ytHqDefaultImg);
|
||||
ytAMedDefaultImg.appendChild(ytMqDefaultImg);
|
||||
ytASdDefaultImg.appendChild(ytSdDefaultImg);
|
||||
ytThumbImgMenu.appendChild(ytAMaxDefaultImg);
|
||||
ytThumbImgMenu.appendChild(ytAHqDefaultImg);
|
||||
ytThumbImgMenu.appendChild(ytAMedDefaultImg);
|
||||
ytThumbImgMenu.appendChild(ytASdDefaultImg);
|
||||
|
||||
// Set onclick actions
|
||||
ytThumbnailBttn.addEventListener("click", showThumbImageVew);
|
||||
@@ -57,14 +65,22 @@ function preSetupProc() {
|
||||
// Dragable window for floating video
|
||||
dragVideo(poppedContainer);
|
||||
|
||||
ytThumbnailBttn.src = browser.extension.getURL("/icons/thumbnailOff.png");
|
||||
ytLoopBttn.src = browser.extension.getURL("/icons/loopFalse.png");
|
||||
ytFloatBttn.src = browser.extension.getURL("/icons/floatPlayer.png");
|
||||
|
||||
// Set trget of Thumbnails of video
|
||||
ytAMaxDefaultImg.target = "_blank";
|
||||
ytAHqDefaultImg.target = "_blank";
|
||||
ytAMedDefaultImg.target = "_blank";
|
||||
ytASdDefaultImg.target = "_blank";
|
||||
|
||||
// Theming & Apply Styles
|
||||
ytThumbImgMenu.className = "ytThumbMenuStyle";
|
||||
ytMaxDefaultImg.className = "thumbImageStyle";
|
||||
ytHqDefaultImg.className = "thumbImageStyle";
|
||||
ytMqDefaultImg.className = "thumbImageStyle";
|
||||
ytSdDefaultImg.className = "thumbImageStyle";
|
||||
ytEnhancerMenu.className = "ytMenuStyle";
|
||||
ytThumbnailBttn.className = "imageStyle";
|
||||
ytLoopBttn.className = "imageStyle";
|
||||
@@ -78,8 +94,8 @@ function preSetupProc() {
|
||||
|
||||
// Functions
|
||||
function showThumbImageVew(e) {
|
||||
vdoPlyrAtts = video.baseURI; // Used for setting up thumbnails
|
||||
vdoPlyrAtts = vdoPlyrAtts.slice(32, 32+11);
|
||||
vdoPlyrAtts = video.baseURI; // Used for setting up thumbnails
|
||||
vdoPlyrAtts = vdoPlyrAtts.slice(32, 32+11);
|
||||
|
||||
videoSlug = vdoPlyrAtts;
|
||||
if (ytThumbImgMenu.style.display == "block") {
|
||||
@@ -88,8 +104,22 @@ function showThumbImageVew(e) {
|
||||
} else {
|
||||
ytAMaxDefaultImg.href = part + videoSlug + "/maxresdefault.jpg";
|
||||
ytAHqDefaultImg.href = part + videoSlug + "/hqdefault.jpg";
|
||||
ytAMedDefaultImg.href = part + videoSlug + "/mqdefault.jpg";
|
||||
ytASdDefaultImg.href = part + videoSlug + "/sddefault.jpg";
|
||||
ytMaxDefaultImg.src = part + videoSlug + "/maxresdefault.jpg";
|
||||
ytHqDefaultImg.src = part + videoSlug + "/hqdefault.jpg";
|
||||
ytMqDefaultImg.src = part + videoSlug + "/mqdefault.jpg";
|
||||
ytSdDefaultImg.src = part + videoSlug + "/sddefault.jpg";
|
||||
ytMaxDefaultImg.title = "Max Resolution Default";
|
||||
ytHqDefaultImg.title = "High Quality Default";
|
||||
ytMqDefaultImg.title = "Medium Quality Default";
|
||||
ytSdDefaultImg.title = "Standard Quality Default";
|
||||
|
||||
ytMaxDefaultImg.onerror = function() { ytMaxDefaultImg.src = "/icons/missing.png"; }
|
||||
ytHqDefaultImg.onerror = function() { ytHqDefaultImg.src = "/icons/missing.png"; }
|
||||
ytAMedDefaultImg.onerror = function() { ytAMedDefaultImg.src = "/icons/missing.png"; }
|
||||
ytASdDefaultImg.onerror = function() { ytASdDefaultImg.src = "/icons/missing.png"; }
|
||||
|
||||
ytThumbnailBttn.src = browser.extension.getURL("/icons/thumbnailOn.png");
|
||||
ytThumbImgMenu.style.display = "block";
|
||||
}
|
||||
@@ -98,11 +128,13 @@ function showThumbImageVew(e) {
|
||||
|
||||
function setLoop(e) {
|
||||
if (video.loop == false) {
|
||||
video.loop = true;
|
||||
ytLoopBttn.src = browser.extension.getURL("/icons/loopTrue.png");
|
||||
video.loop = true;
|
||||
ytLoopBttn.title = "Stop Loop...";
|
||||
ytLoopBttn.src = browser.extension.getURL("/icons/loopTrue.png");
|
||||
} else {
|
||||
video.loop = false;
|
||||
ytLoopBttn.src = browser.extension.getURL("/icons/loopFalse.png");
|
||||
ytLoopBttn.title = "Start Loop...";
|
||||
video.loop = false;
|
||||
ytLoopBttn.src = browser.extension.getURL("/icons/loopFalse.png");
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
Reference in New Issue
Block a user