itdominator
/
Better-Youtube-Plus
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fixing click dead zones; changesd dl icon

This commit is contained in:
itdominator 2023-09-23 18:04:15 -05:00
parent 5cf1ab851f
commit 9602ee3177
5 changed files with 77 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/icons/downloadVid.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 3.2 KiB

After

Width:  |  Height:  |  Size: 11 KiB

4
src/manifest.json
View File

@ -1,10 +1,10 @@
{ {
"manifest_version": 2, "manifest_version": 2,
"name": "Better Youtube +", "name": "Better Youtube +",
"version": "1.6.0", "version": "1.6.1",
"description": "Enhancements for Youtube to have a better experience.", "description": "Enhancements for Youtube to have a better experience.",
"applications": { "browser_specific_settings": {
"gecko": { "gecko": {
"id": "betterYoutube@itdominator.com" "id": "betterYoutube@itdominator.com"
} }

44
src/scripts/betterYoutube.js
View File

@ -1,11 +1,20 @@
(function() { (function() {
const menuTemplate = ` const menuTemplate = `
<div class="ytMenuStyle" id="enhancerMenuID" style="display: block;"> <ul class="ytMenuStyle" id="enhancerMenuID" style="display: block;">
<div id="ytThumbnailBttn" class="imageStyle" title="Video Thumbnails..."></div> <li>
<div id="ytLoopBttn" class="imageStyle" title="Start Loop..."/></div> <div id="ytThumbnailBttn" class="imageStyle" title="Video Thumbnails..."></div>
<div id="ytFloatBttn" class="imageStyle" title="Float Video Container"/></div> </li>
<div id="ytDownloadBttn" class="imageStyle" title="Download Video..."/></div> <li>
</div> <div id="ytLoopBttn" class="imageStyle" title="Start Loop..."/></div>
</li>
<li>
<div id="ytFloatBttn" class="imageStyle" title="Float Video Container"/></div>
</li>
<li>
<div id="ytDownloadBttn" class="imageStyle" title="Download Video..."/></div>
</li>
</ul>
` `
const slugTemplate = ` const slugTemplate = `
<div id="enhancerMenuID2"> <div id="enhancerMenuID2">
@ -22,12 +31,20 @@
</div> </div>
` `
const thumbnailTemplate = ` const thumbnailTemplate = `
<div id="ytThumbMenuID" class="ytThumbMenuStyle" style="display: none;"> <ul id="ytThumbMenuID" class="ytThumbMenuStyle" style="display: none;">
<a id="ytAMaxDefaultImgID" target="_blank" href=""><img id="ytMaxDefaultImgID" class="thumbImageStyle" src="" title="Max Resolution Default"/></a> <li>
<a id="ytAHqDefaultImgID" target="_blank" href=""><img id="ytHqDefaultImgID" class="thumbImageStyle" src="" title="High Quality Default"/></a> <a id="ytAMaxDefaultImgID" target="_blank" href=""><img id="ytMaxDefaultImgID" class="thumbImageStyle" src="" title="Max Resolution Default"/></a>
<a id="ytAMedDefaultImgID" target="_blank" href=""><img id="ytMqDefaultImgID" class="thumbImageStyle" src="" title="Medium Quality Default"></a> </li>
<a id="ytASdDefaultImgID" target="_blank" href=""><img id="ytSdDefaultImgID" class="thumbImageStyle" src="" title="Standard Quality Default"/></a> <li>
</div> <a id="ytAHqDefaultImgID" target="_blank" href=""><img id="ytHqDefaultImgID" class="thumbImageStyle" src="" title="High Quality Default"/></a>
</li>
<li>
<a id="ytAMedDefaultImgID" target="_blank" href=""><img id="ytMqDefaultImgID" class="thumbImageStyle" src="" title="Medium Quality Default"></a>
</li>
<li>
<a id="ytASdDefaultImgID" target="_blank" href=""><img id="ytSdDefaultImgID" class="thumbImageStyle" src="" title="Standard Quality Default"/></a>
</li>
</ul>
` `
const popedContainerTemplate = ` const popedContainerTemplate = `
<div id="draggable" style="display:none; block; top: 114px; left: 408px;"> <div id="draggable" style="display:none; block; top: 114px; left: 408px;">
@ -448,7 +465,8 @@
if(e.preventDefault) e.preventDefault(); if(e.preventDefault) e.preventDefault();
e.cancelBubble = true; e.cancelBubble = true;
e.returnValue = false; e.returnValue = false;
return false;
return false;
} }
} }

80
src/styles/betterYoutube.css
View File

@ -11,11 +11,11 @@ yt-formatted-string > a:hover {
/* ID CSS */ /* ID CSS */
#enhancerMenuID2, .ytThumbMenuStyle, .ytMenuStyle { #enhancerMenuID2, .ytThumbMenuStyle, .ytMenuStyle {
z-index: 100; z-index: 100;
position: fixed; position: fixed;
background: rgba(0,0,0,0.64); background: rgba(0,0,0,0.64);
margin: 0 auto; margin: 0 auto;
overflow: auto; overflow: auto;
} }
#enhancerMenuID2 { #enhancerMenuID2 {
@ -26,7 +26,7 @@ yt-formatted-string > a:hover {
} }
#enhancerMenuID, #enhancerMenuID2 { #enhancerMenuID, #enhancerMenuID2 {
z-index: 5; z-index: 9999;
} }
#volumeContainerID { #volumeContainerID {
@ -37,16 +37,16 @@ yt-formatted-string > a:hover {
} }
#draggable { #draggable {
z-index: 9999; z-index: 9999;
position: fixed; position: fixed;
right: 0px; right: 0px;
bottom: 0px; bottom: 0px;
width: 650px; width: 650px;
height: 400px; height: 400px;
padding-top: 50px; padding-top: 50px;
border-style: solid; border-style: solid;
border-color: rgba(0, 232, 255, 0.64); border-color: rgba(0, 232, 255, 0.64);
background: rgba(64, 64, 64, 0.64) background: rgba(64, 64, 64, 0.64)
} }
#rangeEndID, #rangeStartID { #rangeEndID, #rangeStartID {
@ -56,9 +56,9 @@ yt-formatted-string > a:hover {
} }
#slugCopyZone, #rangeEndID, #rangeStartID { #slugCopyZone, #rangeEndID, #rangeStartID {
text-align: center; text-align: center;
background: rgba(0,0,0,0.0); background: rgba(0,0,0,0.0);
color: #fff; color: #fff;
} }
@ -66,34 +66,42 @@ yt-formatted-string > a:hover {
.ytMenuStyle { .ytMenuStyle {
top: 40%; top: 40%;
width: 42px; width: 42px;
overflow: hidden;
} }
.ytThumbMenuStyle { .ytThumbMenuStyle {
display: none; display: none;
bottom: 20px; bottom: 20px;
}
.ytThumbMenuStyle > ul,
.ytThumbMenuStyle > li {
list-style: none;
}
.ytThumbMenuStyle > li {
float: left;
} }
.imageStyle { .imageStyle {
width: 42px; width: 42px;
height: 42px; height: 42px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-color: rgba(0,0,0,.64); background-color: rgba(0,0,0,.64);
background-size: 42px 42px; background-size: 42px 42px;
} }
.imageStyle:hover { .imageStyle:hover {
background: rgba(12,160,193,.64); background: rgba(12,160,193,.64);
cursor: pointer; cursor: pointer;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
background-size: 28px 28px; background-size: 28px 28px;
} }
.thumbImageStyle { .thumbImageStyle {
width: 200px; width: 200px;
height: 100px; height: 100px;
margin: 0em 1em 0em 1em; margin: 0em 1em 0em 1em;
float: left; float: left;
} }

BIN
src/yt.zip Normal file
View File

Binary file not shown.