Feature/#161 autoscroll w2g #176

Merged
Serraniel merged 7 commits from feature/#161-autoscroll-w2g into develop 2021-02-13 21:42:24 +01:00
3 changed files with 52 additions and 1 deletions

View file

@ -53,6 +53,8 @@
<h3>Watch2gether</h3> <h3>Watch2gether</h3>
<input type="checkbox" id="w2gDisplayCharacterCounter" data-default-value="true" /> <input type="checkbox" id="w2gDisplayCharacterCounter" data-default-value="true" />
<label for="w2gDisplayCharacterCounter">Display character count in chat</label><br /> <label for="w2gDisplayCharacterCounter">Display character count in chat</label><br />
<input type="checkbox" id="w2gAutoscrollToUnseen" data-default-value="true" />
<label for="w2gAutoscrollToUnseen">Autoscroll to the first unseen episode</label><br />
<input type="checkbox" id="w2gAutotoggleHide" data-default-value="true" /> <input type="checkbox" id="w2gAutotoggleHide" data-default-value="true" />
<label for="w2gAutotoggleHide">Autotoggle the Hide-Button for w2g</label><br /> <label for="w2gAutotoggleHide">Autotoggle the Hide-Button for w2g</label><br />

View file

@ -19,6 +19,8 @@ export const SETTINGS_playerAutoplayAfterFocusGain = 'playerAutoplayAfterFocusGa
// w2g // w2g
export const SETTINGS_w2gDisplayCharacterCounter = 'w2gDisplayCharacterCounter'; export const SETTINGS_w2gDisplayCharacterCounter = 'w2gDisplayCharacterCounter';
export const SETTINGS_w2gAutotoggleHide = 'w2gAutotoggleHide'; export const SETTINGS_w2gAutotoggleHide = 'w2gAutotoggleHide';
export const SETTINGS_w2gAutoscrollToUnseen = 'w2gAutoscrollToUnseen';
class Configuration { class Configuration {
settingsCache: Map<string, boolean>; settingsCache: Map<string, boolean>;

View file

@ -1,6 +1,6 @@
import * as core from '../utils/aniwatchCore'; import * as core from '../utils/aniwatchCore';
import { v4 as uuidv4 } from 'uuid'; import { v4 as uuidv4 } from 'uuid';
import { getGlobalConfiguration, SETTINGS_w2gDisplayCharacterCounter, SETTINGS_w2gAutotoggleHide } from '../configuration/configuration'; import { getGlobalConfiguration, SETTINGS_w2gDisplayCharacterCounter, SETTINGS_w2gAutotoggleHide, SETTINGS_w2gAutoscrollToUnseen } from '../configuration/configuration';
import { assigned } from '../utils/helpers'; import { assigned } from '../utils/helpers';
import { findPlayerElement } from "../enhancements/anilyr"; import { findPlayerElement } from "../enhancements/anilyr";
@ -13,21 +13,42 @@ export function init(): void {
core.runAfterLoad(() => { core.runAfterLoad(() => {
manipulateChatInput(); manipulateChatInput();
}, "^/watch2gether/.*$"); }, "^/watch2gether/.*$");
core.runAfterLocationChange(() => { core.runAfterLocationChange(() => {
manipulateChatInput(); manipulateChatInput();
}, "^/watch2gether/.*$"); }, "^/watch2gether/.*$");
} }
}); });
getGlobalConfiguration().getProperty(SETTINGS_w2gAutotoggleHide, value => { getGlobalConfiguration().getProperty(SETTINGS_w2gAutotoggleHide, value => {
if (value) { if (value) {
core.runAfterLoad(() => { core.runAfterLoad(() => {
addAutohideListener(); addAutohideListener();
}, "^/watch2gether/.*$"); }, "^/watch2gether/.*$");
core.runAfterLocationChange(() => { core.runAfterLocationChange(() => {
addAutohideListener(); addAutohideListener();
}, "^/watch2gether/.*$"); }, "^/watch2gether/.*$");
} }
}); });
getGlobalConfiguration().getProperty(SETTINGS_w2gAutoscrollToUnseen, value => {
if (value) {
core.runAfterLoad(() => {
let element = findSearchResults();
if (assigned(element)) {
scrollSearchResults(element);
}
}, "^/watch2gether/.*$");
core.runAfterLocationChange(() => {
let element = findSearchResults();
if (assigned(element)) {
scrollSearchResults(element);
}
}, "^/watch2gether/.*$");
}
});
} }
function manipulateChatInput(): void { function manipulateChatInput(): void {
@ -104,3 +125,29 @@ function addAutohideListener(): void {
}) })
} }
} }
function scrollSearchResults(searchRes: Element): void {
let observer = new MutationObserver(mutations => {
let scrollTarget = searchRes.querySelector('md-list-item:not(.animelist-completed):not(.animelist-completed-add)') as HTMLElement;
if (assigned(scrollTarget)) {
// The node isn´t in its correct position directly when it´s added so we wait a small bit of time before we start scrolling.
// Also works for long loading lists which need more time to load than we wait (for example One Piece).
window.setTimeout(() => {
// scroll container to episode first
searchRes.scrollTop = scrollTarget.offsetTop;
// then scroll page to episode if neccessarry
scrollTarget.scrollIntoView({ behavior: "smooth", block: "nearest" });
}, 500);
}
});
observer.observe(searchRes, {
childList: true,
});
}
function findSearchResults(): Element {
return document.querySelector('.search-results .ep-view');
}