From 1af3ade0384c5d41884e8db0d61df1ab23005392 Mon Sep 17 00:00:00 2001 From: Victor Savinov Date: Tue, 5 Jan 2021 19:18:48 +0300 Subject: [PATCH] v3.120-testing.2 --- background.js | 4 + content-styles.css | 176 ++++++++++++++++++++++++++++++++++++- manifest.json | 4 +- page.js | 22 ++--- popup.js | 210 ++++++++++++++++++++++++++++++--------------- satus.js | 1 + youtube-scripts.js | 10 ++- 7 files changed, 341 insertions(+), 86 deletions(-) diff --git a/background.js b/background.js index 3e99e9e50..bf59fbb44 100644 --- 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 index 095aa73b3..72b6436e3 100644 --- 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; -} \ No newline at end of file +} + + +/*------------------------------------------------------------------------------ +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 index ea033c4bd..6127e1996 100644 --- 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 index 67668705f..126c248b4 100644 --- a/page.js +++ b/page.js @@ -1,13 +1,13 @@ document.addEventListener('DOMContentLoaded', function() { - document.documentElement.innerHTML = [ - '', - '', - '', - '', - '', - 'ImprovedTube', - '', - '', - '' - ].join(''); + document.documentElement.innerHTML = ` + + + + + + ImprovedTube + + + + `; }); \ No newline at end of file diff --git a/popup.js b/popup.js index f9d7d680b..045c7b072 100644 --- a/popup.js +++ b/popup.js @@ -753,67 +753,11 @@ Menu.header.section_end.button_vert.onClickRender.settings = { label: 'importSettings', onclick: function() { - try { - var input = document.createElement('input'); - - input.type = 'file'; - - input.addEventListener('change', function() { - var file_reader = new FileReader(); - - file_reader.onload = function() { - var data = JSON.parse(this.result); - - for (var i in data) { - satus.storage.set(i, data[i]); - } - - satus.render({ - type: 'dialog', - class: 'satus-dialog--confirm', - - message: { - type: 'text', - label: 'successfullyImportedSettings' - }, - section: { - type: 'section', - class: 'controls', - style: { - 'justify-content': 'flex-end', - 'display': 'flex' - }, - - cancel: { - type: 'button', - label: 'cancel', - onclick: function() { - var scrim = document.querySelectorAll('.satus-dialog__scrim'); - - scrim[scrim.length - 1].click(); - } - }, - ok: { - type: 'button', - label: 'OK', - onclick: function() { - var scrim = document.querySelectorAll('.satus-dialog__scrim'); - - scrim[scrim.length - 1].click(); - } - } - } - }); - }; - - file_reader.readAsText(this.files[0]); - }); - - input.click(); - } catch (err) { - chrome.runtime.sendMessage({ - name: 'dialog-error', - value: err + if (location.href.indexOf('/options.html') !== -1) { + importData(); + } else { + chrome.tabs.create({ + url: 'options.html?action=import' }); } } @@ -823,11 +767,13 @@ Menu.header.section_end.button_vert.onClickRender.settings = { label: 'exportSettings', onclick: function() { - chrome.runtime.sendMessage({ - name: 'download', - filename: 'improvedtube-settings.json', - value: satus.storage - }); + if (location.href.indexOf('/options.html') !== -1) { + exportData(); + } else { + chrome.tabs.create({ + url: 'options.html?action=export' + }); + } } }, reset_all_settings: { @@ -868,6 +814,8 @@ Menu.header.section_end.button_vert.onClickRender.settings = { satus.storage.clear(); + location.reload(); + scrim[scrim.length - 1].click(); } } @@ -3072,7 +3020,13 @@ satus.storage.import(function() { satus.locale.import(satus.storage.get('language'), function() { satus.modules.updateStorageKeys(Menu, function() { - satus.render(Menu, document.body); + if (location.href.indexOf('action=import') !== -1) { + importData(); + } else if (location.href.indexOf('action=export') !== -1) { + exportData(); + } else { + satus.render(Menu, document.body); + } }); }); }); @@ -3081,4 +3035,124 @@ chrome.storage.onChanged.addListener(function(changes) { for (var key in changes) { document.documentElement.setAttribute('it-' + key.replace(/_/g, '-'), changes[key].newValue); } -}); \ No newline at end of file +}); + + + + + +function importData() { + satus.render({ + type: 'dialog', + + select_file: { + type: 'button', + label: 'selectFile', + onclick: function() { + var input = document.createElement('input'); + + input.type = 'file'; + + input.addEventListener('change', function() { + var file_reader = new FileReader(); + + file_reader.onload = function() { + var data = JSON.parse(this.result); + + for (var key in data) { + satus.storage.set(key, data[key]); + } + + if (location.href.indexOf('action=import') !== -1) { + window.close(); + } else { + document.querySelector('.satus-dialog__scrim').click(); + + satus.render({ + type: 'dialog', + + message: { + type: 'text', + label: 'dataImportedSuccessfully' + }, + section: { + type: 'section', + class: 'controls', + + ok: { + type: 'button', + label: 'ok', + onclick: function() { + document.querySelector('.satus-dialog__scrim').click(); + } + } + } + }); + } + }; + + file_reader.readAsText(this.files[0]); + }); + + input.click(); + } + } + }); +} + +function exportData() { + var blob = new Blob([JSON.stringify(satus.storage.data)], { + type: 'application/json;charset=utf-8' + }); + + satus.render({ + type: 'dialog', + + export: { + type: 'button', + label: 'export', + onclick: function() { + chrome.permissions.request({ + permissions: ['downloads'] + }, function(granted) { + if (granted) { + chrome.downloads.download({ + url: URL.createObjectURL(blob), + filename: 'improvedtube.json', + saveAs: true + }, function() { + setTimeout(function() { + if (location.href.indexOf('action=export') !== -1) { + window.close(); + } else { + document.querySelector('.satus-dialog__scrim').click(); + + satus.render({ + type: 'dialog', + + message: { + type: 'text', + label: 'dataExportedSuccessfully' + }, + section: { + type: 'section', + class: 'controls', + + ok: { + type: 'button', + label: 'ok', + onclick: function() { + document.querySelector('.satus-dialog__scrim').click(); + } + } + } + }); + } + }, 100); + }); + } + }); + } + } + }); +} \ No newline at end of file diff --git a/satus.js b/satus.js index 0ade2fb0e..3ba5f1ed8 100644 --- a/satus.js +++ b/satus.js @@ -245,6 +245,7 @@ satus.locale.import = function(language, callback) { chrome.runtime.onMessage.addListener(listener); + console.log('_locales/' + language + '/messages.json'); chrome.runtime.sendMessage({ name: 'translation_request', path: '_locales/' + language + '/messages.json' diff --git a/youtube-scripts.js b/youtube-scripts.js index 4fe8176a7..04679f1b2 100644 --- a/youtube-scripts.js +++ b/youtube-scripts.js @@ -554,6 +554,7 @@ ImprovedTube.markWatchedVideos = function() { button.className = 'it-mark-watched' + (this.storage.watched && this.storage.watched[this.getParam(new URL(video_items[i].href || 'https://www.youtube.com/').search.substr(1), 'v')] ? ' watched' : ''); button.innerHTML = ''; + button.addEventListener('click', function(event) { var watched = this.classList.contains('watched') ? false : true; @@ -584,14 +585,14 @@ ImprovedTube.markWatchedVideos = function() { if (watched === true) { ImprovedTube.storage.watched[video_id] = { - title: item.querySelector('a#video-title, .title, .yt-lockup-title > a').innerText + title: item.querySelector('#video-title').innerText }; document.dispatchEvent(new CustomEvent('ImprovedTubeWatched', { detail: { action: 'set', id: video_id, - title: item.querySelector('a#video-title, .title, .yt-lockup-title > a').innerText + title: item.querySelector('#video-title').innerText } })); } else if (ImprovedTube.storage.watched[video_id]) { @@ -604,7 +605,9 @@ ImprovedTube.markWatchedVideos = function() { } })); } - } catch (err) {} + } catch (err) { + console.log(err); + } }); video_items[i].appendChild(button); @@ -615,6 +618,7 @@ ImprovedTube.markWatchedVideos = function() { document.addEventListener('ImprovedTubeWatched', function(event) { if (chrome && chrome.runtime) { + console.log(event.detail); chrome.runtime.sendMessage({ name: 'improvedtube-watched', data: {