v3.120-testing.2

code-charity · Jan 5, 2021 · 1af3ade · 1af3ade
1 parent c413a75
commit 1af3ade
Show file tree

Hide file tree

Showing 7 changed files with 341 additions and 86 deletions.
diff --git a/background.js b/background.js
@@ -54,6 +54,10 @@ function getTranslations(path) {
         });
     });
 
+    xhr.addEventListener('error', function() {
+        getTranslations('_locales/en/messages.json');
+    });
+
     xhr.open('GET', path, true);
     xhr.send();
 }

diff --git a/content-styles.css b/content-styles.css
@@ -53,6 +53,8 @@
 6.0 Channel
   6.1 Featured content
 7.0 Shortcuts
+8.0 Settings
+  8.1 ImprovedTube icon on YouTube
 ------------------------------------------------------------------------------*/
 
 /*------------------------------------------------------------------------------
@@ -375,7 +377,7 @@ html[it-header-position=hover_on_video_page][it-page-type='video'][it-search-foc
     transform: translateY(0%);
 }
 
-html[it-header-position=static] #masthead-container
+html[it-header-position=static] ytd-app:not([masthead-hidden_]) #masthead-container
 {
     position: relative;
     z-index: 999999999999;
@@ -5951,4 +5953,174 @@ html[it-channel-hide-featured-content=true] #secondary.ytd-two-column-browse-res
 
     color: #0ff;
     text-shadow: 1px 1px 2px #000;
-}
+}
+
+
+/*------------------------------------------------------------------------------
+8.0 SETTINGS
+------------------------------------------------------------------------------*/
+
+/*------------------------------------------------------------------------------
+8.1 IMPROVEDTUBE ICON ON YOUTUBE
+------------------------------------------------------------------------------*/
+
+html[it-improvedtube-youtube-icon='below_player'] .title.ytd-video-primary-info-renderer
+{
+    overflow: visible !important;
+}
+
+html[it-improvedtube-youtube-icon='below_player'] h1.watch-title-container
+{
+    display: inline-block !important;
+}
+
+html[it-improvedtube-youtube-icon='draggable'] .it-btn
+{
+    position: fixed;
+    z-index: 2147483645;
+    top: calc(100vh - 56px);
+    left: calc(100vw - 64px);
+}
+
+.it-btn
+{
+    z-index: 2147483645;
+
+    user-select: none;
+}
+
+#container.ytd-masthead > .it-btn
+{
+    margin: 0 12px 0 0;
+}
+
+.yt-masthead-logo-container > .it-btn
+{
+    float: left;
+
+    margin: 0 12px 0 0;
+}
+
+#end #buttons .it-btn
+{
+    margin: 3px 0 0 0;
+}
+
+#yt-masthead-user > .it-btn
+{
+    float: right;
+
+    margin: -2px 0 0 14px;
+}
+
+.title.ytd-video-primary-info-renderer > .it-btn,
+#watch-headline-title > .it-btn
+{
+    float: right;
+}
+
+.it-btn__scrim
+{
+    position: fixed;
+    z-index: 2147483645;
+    top: 0;
+    left: 0;
+
+    visibility: hidden;
+
+    width: 100%;
+    height: 100vh;
+
+    transition: 150ms;
+    pointer-events: none;
+
+    opacity: 0;
+    background: #000;
+}
+
+.it-btn__icon
+{
+    position: relative;
+    z-index: 2147483645;
+
+    width: 32px;
+    height: 32px;
+    margin: 0 0 2px 0;
+
+    cursor: pointer;
+
+    border-radius: 50%;
+    background: #f00;
+}
+
+.it-btn__icon::after
+{
+    position: absolute;
+    top: 9px;
+    left: 12px;
+
+    display: block;
+
+    content: '';
+
+    opacity: .9;
+    border-top: 7px solid transparent;
+    border-bottom: 7px solid transparent;
+    border-left: 11px solid #fff;
+}
+
+.it-btn__iframe
+{
+    position: absolute;
+    z-index: 2147483645;
+    top: 50px;
+
+    visibility: hidden;
+
+    width: 320px;
+    max-width: 80vw;
+    height: 500px;
+    max-height: 80vh;
+
+    transition: opacity 150ms;
+    pointer-events: none;
+
+    opacity: 0;
+}
+
+#end #buttons .it-btn__iframe,
+#yt-masthead-user .it-btn__iframe
+{
+    right: 0;
+    left: auto;
+}
+
+.it-btn.it-btn--active .it-btn__scrim
+{
+    visibility: visible;
+
+    pointer-events: all;
+
+    opacity: .5;
+}
+
+.it-btn.it-btn--active .it-btn__iframe
+{
+    visibility: visible;
+
+    pointer-events: all;
+
+    opacity: 1;
+}
+
+.it-btn--dragging,
+.it-btn--dragging .it-btn__icon,
+.it-btn--dragging .it-btn__iframe
+{
+    pointer-events: none !important;
+}
+
+.it-btn--dragging .it-btn__iframe
+{
+    opacity: .75 !important;
+}
diff --git a/manifest.json b/manifest.json
@@ -3,8 +3,8 @@
     "name": "*Improve YouTube!☕🧩 YouTube-&Video-Tools 🎞️🧪",
     "short_name": "ImprovedTube",
     "description": "Make YouTube tidy & powerful! YouTube Player Size Theme Quality Colors ad-block Playback Speed Style Playlist Channel H.264 Auto HD",
-    "version": "3.120",
-    "version_name": "3.120-testing",
+    "version": "3.121",
+    "version_name": "3.120-testing.1",
     "default_locale": "en",
     "icons": {
         "128": "assets/icons/128.png",

diff --git a/page.js b/page.js
@@ -1,13 +1,13 @@
 document.addEventListener('DOMContentLoaded', function() {
-    document.documentElement.innerHTML = [
-        '<!doctype html>',
-        '<html>',
-        '<head>',
-        '<meta charset="utf-8">',
-        '<meta name="viewport" content="width=device-width,initial-scale=1">',
-        '<title>ImprovedTube</title>',
-        '</head>',
-        '<body class="improvedtube-page"></body>',
-        '</html>'
-    ].join('');
+    document.documentElement.innerHTML = `
+        <!doctype html>
+        <html>
+            <head>
+                <meta charset="utf-8">
+                <meta name="viewport" content="width=device-width,initial-scale=1">
+                <title>ImprovedTube</title>
+            </head>
+            <body style="width:100%;overflow:auto"></body>
+        </html>
+        `;
 });