${index}
`);
// language=html
const SettingsPanel = `
`;
function scrollToElement(ele) {
window.scroll(0, ele?.offsetTop || 0);
}
const doClick = (selector) => document.querySelector(selector)?.dispatchEvent(new Event('click'));
function doScrolling(sign) {
if (useSettings().zoom === -1000) {
const currentPage = [...document.querySelectorAll('.MangaPage')].findIndex((element) => element.offsetTop - window.scrollY > 10);
scrollToElement(document.querySelector(`#Page${currentPage + sign}`));
}
else {
window.scrollBy({
top: (sign * window.innerHeight) / 2,
behavior: 'smooth',
});
}
}
const keybinds = [
{
name: 'Scroll Up',
keys: ['ArrowUp', 'KeyW', 'Numpad8'],
action() {
doScrolling(-1);
},
},
{
name: 'Scroll Down',
keys: ['ArrowDown', 'KeyS', 'Numpad2'],
action() {
doScrolling(1);
},
},
{
name: 'Next Chapter',
keys: ['ArrowRight', 'Period', 'KeyD', 'Numpad6'],
action() {
doClick('#next');
},
},
{
name: 'Prev Chapter',
keys: ['ArrowLeft', 'Comma', 'KeyA', 'Numpad4'],
action() {
doClick('#prev');
},
},
{
name: 'Zoom Enlarge',
keys: ['Equal', 'NumpadAdd', 'KeyE'],
action() {
doClick('#enlarge');
},
},
{
name: 'Zoom Reduce',
keys: ['Minus', 'NumpadSubtract', 'KeyQ'],
action() {
doClick('#reduce');
},
},
{
name: 'Zoom Restore',
keys: ['Digit9', 'NumpadDivide', 'KeyR'],
action() {
doClick('#restore');
},
},
{
name: 'Zoom Fit Width',
keys: ['Digit0', 'NumpadMultiply', 'KeyF'],
action() {
doClick('#fitWidth');
},
},
{
name: 'Zoom Fit Height',
keys: ['KeyH'],
action() {
doClick('#fitHeight');
},
},
{
name: 'Open Settings',
keys: ['Slash', 'Numpad5', 'KeyX'],
action() {
doClick('#settings');
},
},
{
name: 'View Mode WebComic',
keys: ['KeyC'],
action() {
doClick('#webComic');
},
},
{
name: 'View Mode Vertical',
keys: ['KeyV'],
action() {
doClick('#verticalMode');
},
},
{
name: 'View Mode Left to Right',
keys: ['KeyN'],
action() {
doClick('#rtlMode');
},
},
{
name: 'View Mode Right to Left',
keys: ['KeyB'],
action() {
doClick('#ltrMode');
},
},
];
const usedKeys = keybinds.flatMap((kb) => kb.keys);
function processKey(e) {
if (e.ctrlKey || e.altKey || e.shiftKey || e.metaKey || !usedKeys.some((i) => i === e.code))
return true;
e.preventDefault();
e.stopPropagation();
e.stopImmediatePropagation();
const keyBindings = keybinds.find((kb) => kb.keys.some((key) => key === e.code));
logScript('Keyboard:', e.code, /* ' Event:', e, */ 'Entry', keyBindings);
keyBindings?.action();
return false;
}
// Clean key press configurations and set some when specified
function hotkeys() {
document.onkeydown = null;
document.onkeyup = null;
document.onkeypress = null;
window.onkeydown = null;
window.onkeyup = null;
window.onkeypress = null;
window.onload = null;
document.body.onload = null;
document.addEventListener('keydown', processKey);
}
function formatKeyName(key) {
let formatted = key;
formatted = formatted.replace('Key', '');
formatted = formatted.replace('Digit', '');
formatted = formatted.replace('Numpad', 'Numpad ');
formatted = formatted.replace('Subtract', '-');
formatted = formatted.replace('Add', '+');
formatted = formatted.replace('Minus', '-');
formatted = formatted.replace('Equal', '=');
formatted = formatted.replace('Divide', '/');
formatted = formatted.replace('Multiply', '*');
formatted = formatted.replace('Comma', ',');
formatted = formatted.replace('Period', '.');
formatted = formatted.replace('Slash', '/');
formatted = formatted.replace('ArrowUp', '↑');
formatted = formatted.replace('ArrowDown', '↓');
formatted = formatted.replace('ArrowRight', '→');
formatted = formatted.replace('ArrowLeft', '←');
return formatted;
}
const keybindings = keybinds
.map((kb) => {
const keys = kb.keys.map((key) => `
${listPages(manga.pages, begin).join('')}
${SettingsPanel}
${KeybindingsPanel}
${BookmarkPanel}
`;
function buttonBookmarks() {
document.querySelector('#BookmarksPanel')?.classList.toggle('visible');
document.querySelector('#BookmarksOverlay')?.classList.toggle('visible');
}
function eraseBookmarks(elem) {
elem.addEventListener('click', (event) => {
const target = event.currentTarget.value;
const marks = useSettings().bookmarks.filter((el) => el.url !== target);
if (target === window.location.href) {
document.querySelector('#MangaOnlineViewer')?.classList.toggle('bookmarked');
}
logScript(`Bookmark Removed ${target}`);
Swal.fire({
title: 'Bookmark Removed',
timer: 10000,
icon: 'error',
});
updateSettings({ bookmarks: marks });
reloadBookmarks();
document.querySelectorAll('.BookmarkItem .erase')?.forEach(eraseBookmarks);
});
}
function buttonBookmark(elem) {
elem.addEventListener('click', (event) => {
document.querySelector('#MangaOnlineViewer')?.classList.toggle('bookmarked');
const num = parseInt(event.currentTarget.parentElement?.querySelector('.PageIndex')
?.textContent || '0', 10);
const mark = {
url: window.location.href,
page: num,
date: Date.now(),
};
const found = useSettings().bookmarks.some((el) => el.url === mark.url);
if (found) {
updateSettings({ bookmarks: useSettings().bookmarks.filter((el) => el.url !== mark.url) });
Swal.fire({
title: 'Bookmark Removed',
timer: 10000,
icon: 'error',
});
}
else {
updateSettings({ bookmarks: [...useSettings().bookmarks, mark] });
Swal.fire({
title: 'Saved Bookmark',
html: `Next time you open this chapter it will resume from: