From e7a479097012bb34760f3d8adb5769c5b61d07b6 Mon Sep 17 00:00:00 2001 From: Serraniel Date: Sun, 25 Oct 2020 11:54:36 +0100 Subject: [PATCH 1/7] #91 Added base script file --- src/javascript/enhancements/watch2getherChat.js | 12 ++++++++++++ src/javascript/index.js | 4 +++- 2 files changed, 15 insertions(+), 1 deletion(-) create mode 100644 src/javascript/enhancements/watch2getherChat.js diff --git a/src/javascript/enhancements/watch2getherChat.js b/src/javascript/enhancements/watch2getherChat.js new file mode 100644 index 0000000..e611c1f --- /dev/null +++ b/src/javascript/enhancements/watch2getherChat.js @@ -0,0 +1,12 @@ +import * as core from '../utils/aniwatchCore'; +import * as helper from '../utils/helpers'; + +export function init() { + core.runAfterLoad(() => { + manipulateChatInput(); + }, "^/watch2gether/.*$"); +} + +function manipulateChatInput(){ + +} \ No newline at end of file diff --git a/src/javascript/index.js b/src/javascript/index.js index 9d86b8a..f09fe58 100644 --- a/src/javascript/index.js +++ b/src/javascript/index.js @@ -6,6 +6,7 @@ import { initHelpers } from './utils/helpers'; import { init as animeRequests } from './enhancements/animeRequests'; import { init as languageDisplay } from './enhancements/languageDisplay'; import { init as quickSearch } from './enhancements/quickSearch'; +import { init as watch2getherChat } from './enhancements/watch2getherChat'; // core initCore(); @@ -16,4 +17,5 @@ initHelpers(); // enhancements animeRequests(); languageDisplay(); -quickSearch(); \ No newline at end of file +quickSearch(); +watch2getherChat(); \ No newline at end of file -- 2.43.5 From 3125e6720f77fdcd4934f8359c6f9de731a1d059 Mon Sep 17 00:00:00 2001 From: Serraniel Date: Sun, 25 Oct 2020 12:47:32 +0100 Subject: [PATCH 2/7] #91 Added base implementation for chat counter Adds uuid dependency to create guids --- package-lock.json | 24 ++++++++++-- package.json | 4 +- .../enhancements/watch2getherChat.js | 38 +++++++++++++++++-- src/stylesheets/aniwatchplus.scss | 3 +- .../enhancements/_watch2gether.scss | 21 ++++++++++ 5 files changed, 81 insertions(+), 9 deletions(-) create mode 100644 src/stylesheets/enhancements/_watch2gether.scss diff --git a/package-lock.json b/package-lock.json index d63b08e..ac58357 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10735,6 +10735,14 @@ "tough-cookie": "~2.5.0", "tunnel-agent": "^0.6.0", "uuid": "^3.3.2" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==", + "dev": true + } } }, "require-directory": { @@ -11873,6 +11881,15 @@ "requires": { "temp-dir": "^1.0.0", "uuid": "^3.0.1" + }, + "dependencies": { + "uuid": { + "version": "3.4.0", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", + "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==", + "dev": true, + "optional": true + } } }, "ternary-stream": { @@ -12439,10 +12456,9 @@ } }, "uuid": { - "version": "3.4.0", - "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.4.0.tgz", - "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==", - "dev": true + "version": "8.3.1", + "resolved": "https://registry.npmjs.org/uuid/-/uuid-8.3.1.tgz", + "integrity": "sha512-FOmRr+FmWEIG8uhZv6C2bTgEVXsHk08kE7mPlrBbEe+c3r9pjceVPgupIfNIhc4yx55H69OXANrUaSuu9eInKg==" }, "v8flags": { "version": "3.2.0", diff --git a/package.json b/package.json index bcbe472..8f7fe19 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,9 @@ "email": "mail@serraniel.dev" }, "homepage": "https://github.com/Serraniel/AniwatchPlus#readme", - "dependencies": {}, + "dependencies": { + "uuid": "^8.3.1" + }, "devDependencies": { "@babel/compat-data": "^7.12.1", "@babel/core": "^7.12.3", diff --git a/src/javascript/enhancements/watch2getherChat.js b/src/javascript/enhancements/watch2getherChat.js index e611c1f..c8a207e 100644 --- a/src/javascript/enhancements/watch2getherChat.js +++ b/src/javascript/enhancements/watch2getherChat.js @@ -1,12 +1,44 @@ import * as core from '../utils/aniwatchCore'; import * as helper from '../utils/helpers'; +import { v4 as uuidv4 } from 'uuid'; export function init() { core.runAfterLoad(() => { - manipulateChatInput(); + manipulateChatInput(); }, "^/watch2gether/.*$"); } -function manipulateChatInput(){ - +function manipulateChatInput() { + let textarea = document.querySelector('.chat-input textarea'); + + // avoid duplicate registration + if (typeof textarea.dataset.charCounterId !== 'undefined') { + return; + } +} + +function addCharCounter(textarea) { + let chatDiv = textarea.parentElement.parentElement; // div with chat input and controls + let controlRow = chatDiv.children[1]; // row with controls + let btn = controlRow.querySelector('button'); // find send button + + let counterSpan = document.createElement('span'); // create span for counter + counterSpan.classList.add('awp-w2g-chatCounter'); + + // id and "connection" + let counterId = `awp-${v4()}` + counterSpan.id = counterId; + textarea.dataset.charCounterId = counterId; + + btn.parentElement.inserBefore(counterSpan, btn); // and insert in front of the button + + textarea.addEventListener('keypress keyup', () => { + let current = textarea.value.length; + let max = textarea.maxLength; + + counterSpan.innerText = `${current} / ${max}`; + + // animation if at max + counterSpan.classList.toggle('awp-w2g-chatCounter-max', current >= max); + }); } \ No newline at end of file diff --git a/src/stylesheets/aniwatchplus.scss b/src/stylesheets/aniwatchplus.scss index cdcb559..0fcd7c1 100644 --- a/src/stylesheets/aniwatchplus.scss +++ b/src/stylesheets/aniwatchplus.scss @@ -2,4 +2,5 @@ @import './vars/colors'; // enhancements -@import './enhancements/lists.scss'; \ No newline at end of file +@import './enhancements/lists'; +@import './enhancements/watch2gether' \ No newline at end of file diff --git a/src/stylesheets/enhancements/_watch2gether.scss b/src/stylesheets/enhancements/_watch2gether.scss new file mode 100644 index 0000000..731dc5e --- /dev/null +++ b/src/stylesheets/enhancements/_watch2gether.scss @@ -0,0 +1,21 @@ +.awp { + &-w2g { + &-chatCounter { + white-space: nowrap; + + &-max { + animation: shake 0.1s ease-in-out 0.1s 3 alternate; + + @keyframes shake { + from { + transform: rotate(3deg); + } + to { + transform-origin: center center; + transform: rotate(-3deg); + } + } + } + } + } +} -- 2.43.5 From 93747d5cfdee17fc98d656fada0a0f64f24e25cd Mon Sep 17 00:00:00 2001 From: Serraniel Date: Sun, 25 Oct 2020 13:02:24 +0100 Subject: [PATCH 3/7] #91 added comment why this does not work yet --- src/javascript/enhancements/watch2getherChat.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/javascript/enhancements/watch2getherChat.js b/src/javascript/enhancements/watch2getherChat.js index c8a207e..4a5fac6 100644 --- a/src/javascript/enhancements/watch2getherChat.js +++ b/src/javascript/enhancements/watch2getherChat.js @@ -3,6 +3,7 @@ import * as helper from '../utils/helpers'; import { v4 as uuidv4 } from 'uuid'; export function init() { + // UPS // runAfterLoad is not what we want...wait for runAfterLocationChange.... core.runAfterLoad(() => { manipulateChatInput(); }, "^/watch2gether/.*$"); -- 2.43.5 From abb4c05857a7baaf452e70754579b2c2505dc0b2 Mon Sep 17 00:00:00 2001 From: Serraniel Date: Mon, 26 Oct 2020 20:30:50 +0100 Subject: [PATCH 4/7] #94 Prepared empty functionality module --- src/javascript/enhancements/anilyr.js | 10 ++++++++++ src/javascript/index.js | 2 ++ 2 files changed, 12 insertions(+) create mode 100644 src/javascript/enhancements/anilyr.js diff --git a/src/javascript/enhancements/anilyr.js b/src/javascript/enhancements/anilyr.js new file mode 100644 index 0000000..d0cda71 --- /dev/null +++ b/src/javascript/enhancements/anilyr.js @@ -0,0 +1,10 @@ +import * as core from '../utils/aniwatchCore'; +import * as helper from '../utils/helpers'; + +export function init() { + core.registerScript(node => { + // run the scripts + + }, "^/anime/[0-9]*/[0-9]*$"); +} + diff --git a/src/javascript/index.js b/src/javascript/index.js index 9d86b8a..b58cb94 100644 --- a/src/javascript/index.js +++ b/src/javascript/index.js @@ -3,6 +3,7 @@ import { initCore } from './utils/aniwatchCore'; // helper import { initHelpers } from './utils/helpers'; // enhancements +import { init as anilyr } from './enhancements/anilyr'; import { init as animeRequests } from './enhancements/animeRequests'; import { init as languageDisplay } from './enhancements/languageDisplay'; import { init as quickSearch } from './enhancements/quickSearch'; @@ -14,6 +15,7 @@ initCore(); initHelpers(); // enhancements +anilyr(); animeRequests(); languageDisplay(); quickSearch(); \ No newline at end of file -- 2.43.5 From f8b0dbbe3fc45937d22e7faedf2fd283365cb07a Mon Sep 17 00:00:00 2001 From: Serraniel Date: Mon, 26 Oct 2020 20:42:34 +0100 Subject: [PATCH 5/7] #94 Added empty observer for the player --- src/javascript/enhancements/anilyr.js | 20 ++++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/src/javascript/enhancements/anilyr.js b/src/javascript/enhancements/anilyr.js index d0cda71..76db373 100644 --- a/src/javascript/enhancements/anilyr.js +++ b/src/javascript/enhancements/anilyr.js @@ -1,10 +1,26 @@ import * as core from '../utils/aniwatchCore'; import * as helper from '../utils/helpers'; +const SCREENSHOT_TOOLTIP_ID = 'anilyr-screenshots-tooltip'; + export function init() { core.registerScript(node => { - // run the scripts - + if (helper.isHtmlElement(node) && node.id === SCREENSHOT_TOOLTIP_ID) { + observeScreenshotTooltip(node); + } }, "^/anime/[0-9]*/[0-9]*$"); } +function observeScreenshotTooltip(tooltip) { + let observer = new MutationObserver(mutations => { + mutations.forEach(mutation => { + + }); + }); + + observer.observe(tooltip, { + attributes: true, + attributeOldValue: true, + attributeFilter: ['style'], + }); +} \ No newline at end of file -- 2.43.5 From 9ada3dbee6eec4d5a9ed0eab0680c58052fc2973 Mon Sep 17 00:00:00 2001 From: Serraniel Date: Mon, 26 Oct 2020 20:46:03 +0100 Subject: [PATCH 6/7] #94 Detect closed tooltip --- src/javascript/enhancements/anilyr.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/javascript/enhancements/anilyr.js b/src/javascript/enhancements/anilyr.js index 76db373..dc6ecbf 100644 --- a/src/javascript/enhancements/anilyr.js +++ b/src/javascript/enhancements/anilyr.js @@ -14,7 +14,10 @@ export function init() { function observeScreenshotTooltip(tooltip) { let observer = new MutationObserver(mutations => { mutations.forEach(mutation => { - + // Switched to invisible + if(!mutation.oldValue.includes('display: none') && mutation.target.style.display == 'none') { + console.log('SCREENSHOT TOOLTIP CLOSED'); + } }); }); -- 2.43.5 From 4099841d4b705c3d761377bbff75e9d84aba402d Mon Sep 17 00:00:00 2001 From: Serraniel Date: Mon, 26 Oct 2020 20:52:51 +0100 Subject: [PATCH 7/7] #94 Detect player and resume video --- src/javascript/enhancements/anilyr.js | 25 ++++++++++++++++++++++--- 1 file changed, 22 insertions(+), 3 deletions(-) diff --git a/src/javascript/enhancements/anilyr.js b/src/javascript/enhancements/anilyr.js index dc6ecbf..f80ebd8 100644 --- a/src/javascript/enhancements/anilyr.js +++ b/src/javascript/enhancements/anilyr.js @@ -2,6 +2,7 @@ import * as core from '../utils/aniwatchCore'; import * as helper from '../utils/helpers'; const SCREENSHOT_TOOLTIP_ID = 'anilyr-screenshots-tooltip'; +const PLAYER_ID = 'player'; export function init() { core.registerScript(node => { @@ -15,8 +16,11 @@ function observeScreenshotTooltip(tooltip) { let observer = new MutationObserver(mutations => { mutations.forEach(mutation => { // Switched to invisible - if(!mutation.oldValue.includes('display: none') && mutation.target.style.display == 'none') { - console.log('SCREENSHOT TOOLTIP CLOSED'); + if (!mutation.oldValue.includes('display: none') && mutation.target.style.display == 'none') { + let player = findPlayer(); + if(typeof player !== 'undefined'){ + resumePlayer(player); + } } }); }); @@ -24,6 +28,21 @@ function observeScreenshotTooltip(tooltip) { observer.observe(tooltip, { attributes: true, attributeOldValue: true, - attributeFilter: ['style'], + attributeFilter: ['style'], }); +} + +function findPlayer() { + const PLAYER_TAG_NAME = 'VIDEO'; // tagName gives UpperCase + + let playerCandidate = document.getElementById(PLAYER_ID); + if (playerCandidate.tagName === PLAYER_TAG_NAME) { + return playerCandidate; + } + + return undefined; +} + +function resumePlayer(player) { + player.play(); } \ No newline at end of file -- 2.43.5