From 3e71ff486a2cfd6c6e6e60ea7585ff2511068f9a Mon Sep 17 00:00:00 2001 From: LowMaster <79407666+RealLowMaster@users.noreply.github.com> Date: Fri, 15 Jul 2022 14:27:08 +0430 Subject: [PATCH] Update KeyManager and Loading and PopAlert Style --- CSS/action.css | 192 ++++++++---- JS/browser.js | 49 +-- JS/classes.js | 258 +--------------- JS/collections.js | 4 +- JS/comics.js | 210 ++++--------- JS/database.js | 56 ++-- JS/defualt-classes.js | 591 ++++++++++++++++++++++++++++++++++++ JS/image-optimizer.js | 21 +- JS/infos.js | 6 +- JS/{requires.js => main.js} | 73 ++++- JS/make-thumb.js | 60 ++-- JS/setting.js | 29 +- JS/startup.js | 50 ++- index.html | 15 +- itch.io-release.html | 12 +- task.txt | 5 +- 16 files changed, 960 insertions(+), 671 deletions(-) create mode 100644 JS/defualt-classes.js rename JS/{requires.js => main.js} (89%) diff --git a/CSS/action.css b/CSS/action.css index 6a93323..420709d 100644 --- a/CSS/action.css +++ b/CSS/action.css @@ -85,42 +85,125 @@ border-color: #1E8449; } -/* Loading */ -.waiting-loading { - display: none; - flex-flow: column; +/* Pop Alert */ +.pop-alert { + display: inline-block; + padding: 10px; + background-color: transparent; + color: #222; + border: 1px solid transparent; + border-radius: 4px; + font-size: 16px; + font-weight: 300; + position: fixed; + bottom: -42px; + left: 10px; + box-shadow: 0 5px 10px rgba(0,0,0,0.3); + transition: bottom .3s; + z-index: 999999999; + user-select: none; +} + +.pop-alert-primary { + background-color: #3498DB; + color: #fff; + border-color: #2E86C1; +} + +.pop-alert-danger { + background-color: #C0392B; + color: #fff; + border-color: #A93226; +} + +.pop-alert-warning { + background-color: #E67E22; + color: #fff; + border-color: #CA6F1E; +} + +.pop-alert-success { + background-color: #229954; + color: #fff; + border-color: #1E8449; +} + +.action-alert { + display: flex; justify-content: center; align-items: center; width: 100%; height: calc(100% - var(--topMenuSize)); - background-color: #000d; + background-color: var(--modifier-selected-bg); position: fixed; top: var(--topMenuSize); left: 0; - z-index: 999999; + z-index: 99999999999999; } -.waiting-loading > p { +.action-alert > div { display: block; - margin-bottom: 15px; - color: #fff; - text-align: center; - font-size: 16px; + width: 500px; + background-color: var(--secondary-bg); + padding: 10px; + box-shadow: 0 4px 8px 0 #000a; } -.waiting-loading > div { +.action-alert > div > p { display: block; - width: 450px; - height: 4px; - background-color: #ddd; + width: 100%; + margin: 5px 0 15px 0; + padding: 10px; + background-color: var(--secondary-bg-alt); + color: var(--primary-header); + border-radius: 3px; } -.waiting-loading > div > div { - display: block; - width: 0; - height: 100%; +.action-alert > div > div { margin: 5px } + +/* Pop Alert */ +.pop-alert { + display: inline-block; + min-width: 200px; + padding: 10px; + background-color: transparent; + color: #222; + border-width: 0 0 0 4px; + border-style: solid; + border-radius: 3px; + font-size: 16px; + font-weight: 300; + position: fixed; + bottom: -42px; + left: 10px; + box-shadow: 0 5px 10px rgba(0,0,0,0.3); + transition: bottom .3s; + z-index: 99999999999; + user-select: none; +} + +.pop-alert-primary { background-color: #3498DB; - transition: width .2s; + color: #fff; + border-color: #2E86C1; +} + +.pop-alert-danger { + background-color: #d34333; + color: #fff; + border-color: #a31002; +} + +.pop-alert-warning { + background-color: #E67E22; + color: #fff; + border-color: #c45c01; +} + +.pop-alert-success { + background-color: #229954; + color: #fff; + border-color: #1E8449; } /* Procress Panel */ @@ -162,19 +245,13 @@ transition: background-color .2s; } -.procress-panel > button:hover { - background-color: #fffa; -} +.procress-panel > button:hover { background-color: #fffa } .procress-panel > div:last-child { display: flex; flex-flow: row; width: calc(100% - 80px); height: calc(100% - 80px); - /* background-color: #fff; */ - /* border: 1px solid #ddd; */ - /* border-radius: 5px; */ - /* box-shadow: 9px 7px 40px -6px rgba(0,0,0,.25); */ z-index: +1; } @@ -284,45 +361,40 @@ border-color: #E67E22; } -/* Pop Alert */ -.pop-alert { - display: inline-block; - padding: 10px; - background-color: transparent; - color: #222; - border: 1px solid transparent; - border-radius: 4px; - font-size: 16px; - font-weight: 300; +/* Loading */ +.loading { + display: flex; + flex-flow: column; + justify-content: center; + align-items: center; + width: 100%; + height: calc(100% - var(--topMenuSize)); + background-color: #000d; position: fixed; - bottom: -42px; - left: 10px; - box-shadow: 0 5px 10px rgba(0,0,0,0.3); - transition: bottom .3s; - z-index: 999999999; - user-select: none; -} - -.pop-alert-primary { - background-color: #3498DB; - color: #fff; - border-color: #2E86C1; + top: var(--topMenuSize); + left: 0; + z-index: 999999; } -.pop-alert-danger { - background-color: #C0392B; +.loading > p { + display: block; + margin-bottom: 15px; color: #fff; - border-color: #A93226; + text-align: center; + font-size: 16px; } -.pop-alert-warning { - background-color: #E67E22; - color: #fff; - border-color: #CA6F1E; +.loading > div { + display: block; + width: 450px; + height: 4px; + background-color: #ddd; } -.pop-alert-success { - background-color: #229954; - color: #fff; - border-color: #1E8449; +.loading > div > div { + display: block; + width: 0; + height: 100%; + background-color: #3498DB; + transition: width .2s; } \ No newline at end of file diff --git a/JS/browser.js b/JS/browser.js index b71bdb9..44d648b 100644 --- a/JS/browser.js +++ b/JS/browser.js @@ -6,7 +6,7 @@ const bjp_m_p = document.getElementById('bjp-m-p') let browserHistoryIndex = 0, browserHistoryRowOpElement, br_history_selected_inputs = [], br_history_selected_indexs = [], resizeTabTimer, active_site = null, historyObserver, historyLaodCounter = 0, br_cmenu_info = null, brh_cb_save = null function openBrowser() { - keydownEventIndex = 3 + KeyManager.ChangeCategory('browser') afterDLReload = false imageLazyLoadingOptions.root = pageContainer imageLoadingObserver = new IntersectionObserver(ObserverFunction, imageLazyLoadingOptions) @@ -32,7 +32,7 @@ function closeBrowser() { document.getElementById('main').style.display = 'flex' closeSitePanel() closeBrowserHistory() - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') activeTabIndex = null activeTabComicId = null tabsPos = [] @@ -579,7 +579,7 @@ document.getElementById('browser-tool-search-form').addEventListener('submit', e e.preventDefault() closeSitePanel() closeBrowserHistory() - keydownEventIndex = 3 + KeyManager.ChangeCategory('browser') const input = document.getElementById('browser-tool-search-input') const checkText = input.value.replace(/ /g, '') if (checkText.length > 0) { @@ -1055,47 +1055,4 @@ function closeBRCMenu() { window.removeEventListener('wheel', closeBRCMenu) window.removeEventListener('resize', closeBRCMenu) window.removeEventListener('keydown', closeBRCMenu) -} - -// Key Event -function BrowserKeyEvents(ctrl, shift, key) { - if (ctrl) { - if (!shift) { - switch (key) { - case 37: - browserPrev() - break - case 39: - browserNext() - break - case 72: - toggleBrowserHistory() - break - case 78: - openSite(active_site) - break - case 81: - browserTabHome() - break - case 82: - browserTabReload() - break - case 83: - toggleSitePanel() - break - case 87: - if (activeTabComicId != null) removeTab(activeTabComicId) - break - } - - } else if (key == 84) openBrowserLastTabs() - } else { - if (!shift) { - switch (key) { - case 27: - closeBrowser() - break - } - } - } } \ No newline at end of file diff --git a/JS/classes.js b/JS/classes.js index 6a5a1c2..f50e42d 100644 --- a/JS/classes.js +++ b/JS/classes.js @@ -1,217 +1,3 @@ -class Loading { - #saveProcress = 0 - #loading - #txt - #procress - - constructor(times) { - this.times = (100/times) - this.id = `${new Date().getTime()}${Math.floor(Math.random() * 9)}` - this.#loading = document.createElement('div') - this.#loading.setAttribute('id', this.id) - this.#txt = document.createElement('p') - this.#txt.innerText = 'Loading...' - this.#procress = document.createElement('div') - this.#loading.setAttribute('class', 'waiting-loading') - this.#loading.appendChild(this.#txt) - const miniElement = document.createElement('div') - miniElement.appendChild(this.#procress) - this.#loading.appendChild(miniElement) - document.body.appendChild(this.#loading) - } - - forward(text) { - if (text != undefined) this.#txt.innerText = text - this.#saveProcress += this.times - this.#procress.style.width = this.#saveProcress+'%' - } - - changePercent(times) { - this.times = (100/times) - } - - reset(times) { - this.hide() - if (times != undefined) this.times = (100/times) - this.#loading.style.backgroundColor = '#000d' - this.#txt.style.color = '#fff' - this.#txt.innerText = 'Loading...' - this.#saveProcress = 0 - this.#procress.style.width = 0 - } - - hide() { this.#loading.style.display = 'none' } - - text(text) { this.#txt.innerHTML = text } - - show(text, bgColor, color) { - if (text != undefined) this.#txt.innerText = text - if (bgColor != undefined) this.#loading.style.backgroundColor = bgColor - if (color != undefined) this.#txt.style.color = color - this.#loading.style.display = 'flex' - } - - remove() { - this.#loading.remove() - } -} - -class ProcressPanel { - #saveProcress = 0 - #constainer - #closeBtn - #secendSide - #miniLogContainer - #logContainer - #txt - #procress - - constructor(times = 0) { - this.times = (100/times) - this.id = `pp${new Date().getTime()}` - this.#constainer = document.createElement('div') - this.#constainer.setAttribute('id', this.id) - this.#constainer.classList.add('procress-panel') - let elementContainer = document.createElement('div') - this.#constainer.appendChild(elementContainer) - this.#closeBtn = document.createElement('button') - this.#closeBtn.setAttribute('type', 'button') - this.#closeBtn.setAttribute('onclick', "this.parentElement.style.display='none'") - this.#closeBtn.innerText = 'X' - this.#constainer.appendChild(this.#closeBtn) - elementContainer = document.createElement('div') - this.#miniLogContainer = document.createElement('div') - elementContainer.appendChild(this.#miniLogContainer) - this.#secendSide = document.createElement('div') - this.#logContainer = document.createElement('div') - this.#secendSide.appendChild(this.#logContainer) - let element = document.createElement('div') - this.#txt = document.createElement('p') - this.#txt.innerText = 'Waiting...' - element.appendChild(this.#txt) - let miniElement = document.createElement('div') - this.#procress = document.createElement('div') - miniElement.appendChild(this.#procress) - element.appendChild(miniElement) - this.#secendSide.appendChild(element) - elementContainer.appendChild(this.#secendSide) - this.#constainer.appendChild(elementContainer) - document.body.appendChild(this.#constainer) - } - - forward(text) { - if (text != undefined) this.#txt.innerText = text - this.#saveProcress += this.times - this.#procress.style.width = this.#saveProcress+'%' - } - - changePercent(times = 0) { - this.times = (100/times) - this.#saveProcress = 0 - this.#procress.style.width = '0%' - } - - add(text, color) { - color = color || 'success' - const element = document.createElement('div') - - element.innerHTML = text - element.classList.add('pp-log') - element.classList.add(`pp-${color}`) - - this.#logContainer.appendChild(element) - } - - addMini(text, color) { - color = color || 'success' - const element = document.createElement('div') - - element.innerHTML = text - element.classList.add('pp-log') - element.classList.add(`pp-${color}`) - - this.#miniLogContainer.appendChild(element) - } - - clear() { - this.#logContainer.innerHTML = '' - } - - clearMini() { - this.#miniLogContainer.innerHTML = '' - } - - reset(times = 0) { - this.hide() - this.clear() - this.clearMini() - if (times != undefined) this.times = (100/times) - this.#txt.innerText = 'Waiting...' - this.#saveProcress = 0 - this.#procress.style.width = 0 - this.#constainer.children[0].setAttribute('onclick', "this.parentElement.style.display='none'") - this.#closeBtn.setAttribute('onclick', "this.parentElement.style.display='none'") - } - - hide() { this.#constainer.style.display = 'none' } - - show(text) { - if (text != undefined) this.#txt.innerHTML = text - this.#constainer.style.display = 'flex' - } - - text(text) { - this.#txt.innerHTML = text - } - - config(config = { miniLog:false, miniSize:30, bgClose:false, closeBtn:false, closeEvent:'e', closeBGEvent:'e' }) { - if (config.miniLog != undefined) { - if (config.miniLog) { - this.#constainer.setAttribute('mini', true) - if (config.miniSize != null && typeof(config.miniSize) == 'number') { - this.#miniLogContainer.style.flex = `0 0 ${config.miniSize}%` - this.#miniLogContainer.style.maxWidth = `${config.miniSize}%` - this.#secendSide.style.flex = `0 0 ${100 - config.miniSize}%` - this.#secendSide.style.maxWidth = `${100 - config.miniSize}%` - } else { - this.#miniLogContainer.style.flex = '0 0 30%' - this.#miniLogContainer.style.maxWidth = '30%' - this.#secendSide.style.flex = '0 0 70%' - this.#secendSide.style.maxWidth = '70%' - } - } else { - this.#constainer.removeAttribute('mini') - this.#miniLogContainer.style.flex = '0 0 0' - this.#miniLogContainer.style.maxWidth = '0' - this.#secendSide.style.flex = '0 0 100%' - this.#secendSide.style.maxWidth = '100%' - } - } - - if (config.bgClose != undefined) { - if (config.bgClose) this.#constainer.children[0].setAttribute('onclick', "this.parentElement.style.display='none'") - else this.#constainer.children[0].removeAttribute('onclick') - } - - if (config.closeBtn != undefined) { - if (config.closeBtn) this.#closeBtn.style.display = 'flex' - else this.#closeBtn.style.display = 'none' - } - - if (config.closeEvent != undefined) { - this.#closeBtn.setAttribute('onclick', config.closeEvent) - } - - if (config.closeBGEvent != undefined) { - this.#constainer.children[0].setAttribute('onclick', config.closeBGEvent) - } - } - - remove() { - this.#constainer.remove() - } -} - class Tab { constructor(id, scroll, search, jumpPage, thisPage, maxPage, site, isReloading, element, pageElement) { this.id = id @@ -419,7 +205,6 @@ class DownloadManager { #indexs #info #sort - #passKeyIndex #dlInfo constructor() { @@ -785,13 +570,12 @@ class DownloadManager { } OpenPanel() { - this.#passKeyIndex = keydownEventIndex - keydownEventIndex = null + KeyManager.stop = true document.getElementById('download-panel').setAttribute('active', '') } ClosePanel() { - keydownEventIndex = this.#passKeyIndex + KeyManager.stop = false document.getElementById('download-panel').removeAttribute('active') } } @@ -1348,7 +1132,6 @@ class Slider { constructor() { this.count = 0 this.activeIndex = 0 - this.passKeyEvent = null this.overview = false this.size = false this.firstTime = true @@ -1399,8 +1182,7 @@ class Slider { Open(index = null) { if (this.count == 0) { PopAlert('There is no Image!','warning'); return } - this.passKeyEvent = keydownEventIndex - keydownEventIndex = 2 + KeyManager.ChangeCategory('slider') if (index != null) this.Change(index) else this.Change(this.activeIndex) this.overview = false @@ -1412,7 +1194,7 @@ class Slider { } Close() { - keydownEventIndex = this.passKeyEvent + KeyManager.BackwardCategory() document.getElementById('comic-slider').style.display = 'none' this.img.setAttribute('src','') document.getElementById('d-p-t').removeAttribute('hov') @@ -1505,36 +1287,4 @@ class Slider { if (this.imgcon.scrollTop == this.img.clientHeight - this.imgcon.clientHeight) this.imgcon.style.borderBottomColor = '#5dade2' else this.imgcon.style.borderBottomColor = '#000' } - - SliderKeyEvents(ctrl, shift, key) { - if (ctrl) { - if (!shift) { - switch (key) { - case 37: - SliderManager.Prev() - break - case 39: - SliderManager.Next() - break - } - } - } else { - if (!shift) { - switch (key) { - case 27: - SliderManager.Close() - break - case 65: - SliderManager.Prev() - break - case 68: - SliderManager.Next() - break - case 79: - SliderManager.ToggleSize() - break - } - } - } - } } \ No newline at end of file diff --git a/JS/collections.js b/JS/collections.js index 52867e7..9071a4c 100644 --- a/JS/collections.js +++ b/JS/collections.js @@ -13,7 +13,7 @@ function CreateCollection(name) { } function openCollectionsPanel() { - keydownEventIndex = null + KeyManager.stop = true afterDLReload = false LoadCollections() document.getElementById('main').style.display = 'none' @@ -21,7 +21,7 @@ function openCollectionsPanel() { } function closeCollectionsPanel() { - keydownEventIndex = 0 + KeyManager.stop = false afterDLReload = true PageManager.Reload() document.getElementById('main').style.display = 'flex' diff --git a/JS/comics.js b/JS/comics.js index 245183e..5eb723b 100644 --- a/JS/comics.js +++ b/JS/comics.js @@ -170,7 +170,7 @@ function openComic(id) { in_comic = true id = id || null if (id == null) { error("Id Can't be Null."); return } - keydownEventIndex = null + KeyManager.ChangeCategory(null) const title_container = document.getElementById('c-p-t') let html = '', formatIndex = 0, name, image, ImagesCount, formats @@ -309,7 +309,7 @@ function openComic(id) { } comicPanel.scrollTop = 0 - keydownEventIndex = 1 + KeyManager.ChangeCategory('comic') }) } @@ -336,7 +336,7 @@ function loadImagesOneByOne(images, id) { function closeComicPanel() { comicPanel.style.display = 'none' - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') need_repair = [] in_comic = false off_site = null @@ -408,8 +408,7 @@ function closeComicPanelImageMenu() { // Delete Comic Image function deleteComicImage(id, index) { - loading.reset(0) - loading.show('Calculating...') + loading.Show(1, 'Calculating...') document.getElementById('comic-action-panel').style.display = 'none' comicImageContainer.innerHTML = '' @@ -420,8 +419,8 @@ function deleteComicImage(id, index) { closeComicPanel() db.comics.findOne({_id:id}, (err, doc) => { - if (err) { comicDeleting = false; error(err); openComic(id); loading.hide(); return } - if (doc == undefined) { comicDeleting = false; error('Comic Not Found.'); openComic(id); loading.hide(); return } + if (err) { comicDeleting = false; error(err); openComic(id); loading.Close(); return } + if (doc == undefined) { comicDeleting = false; error('Comic Not Found.'); openComic(id); loading.Close(); return } const ImageFormats = doc.f let format = null @@ -439,7 +438,7 @@ function deleteComicImage(id, index) { openComic(id) PopAlert('Image Has Been Deleted!') comicDeleting = false - loading.hide() + loading.Close() // console.log(ImageFormats, format, index, src) }) @@ -466,28 +465,26 @@ function askForDeletingComicImage(id, index) { function SetComicThumb(id, index) { if (isThumbing) return isThumbing = true - const passKeyEvent = keydownEventIndex - keydownEventIndex = null - loading.reset(3) - loading.show('Loading Comic') + KeyManager.stop = true + loading.Show(3, 'Loading Comic') db.comics.findOne({_id:id}, (err, doc) => { - if (err) { error(err); loading.hide(); isThumbing = false; keydownEventIndex = passKeyEvent; return } - if (doc == undefined) { error('Comic not Found.'); loading.hide(); isThumbing = false; keydownEventIndex = passKeyEvent; return } - loading.forward('Checking Existed Thumb') + if (err) { error(err); loading.Close(); isThumbing = false; KeyManager.stop = false; return } + if (doc == undefined) { error('Comic not Found.'); loading.Close(); isThumbing = false; KeyManager.stop = false; return } + loading.Forward('Checking Existed Thumb') const pass_thumb = `${dirUL}/thumbs/${doc.i}.jpg` if (fs.existsSync(pass_thumb)) { try { fs.unlinkSync(pass_thumb) } catch (dErr) { error('Could not Delete Existed Thumb -> '+dErr) - loading.hide() + loading.Close() isThumbing = false - keydownEventIndex = passKeyEvent + KeyManager.stop = false return } } - loading.forward('Get New Thumb Image URL') + loading.Forward('Get New Thumb Image URL') const ImageFormats = doc.f let format = null for (let i = 0; i < ImageFormats.length; i++) if (index >= ImageFormats[i][0] && index <= ImageFormats[i][1]) { format = ImageFormats[i][2]; break } @@ -495,25 +492,25 @@ function SetComicThumb(id, index) { if (!fs.existsSync(src)) { PageManager.Reload() error('Could not Find Image') - loading.hide() + loading.Close() isThumbing = false - keydownEventIndex = passKeyEvent + KeyManager.stop = false return } if (!fs.existsSync(dirUL+'/thumbs')) fs.mkdirSync(dirUL+'/thumbs') setTimeout(() => { sharp(src).resize(225, 315).jpeg().toFile(`${dirUL}/thumbs/${doc.i}.jpg`).then(() => { PageManager.Reload() - loading.forward() - loading.hide() + loading.Forward() + loading.Close() isThumbing = false - keydownEventIndex = passKeyEvent + KeyManager.stop = false }).catch(tErr => { PageManager.Reload() error('MakingThumb->Err: '+tErr) - loading.hide() + loading.Close() isThumbing = false - keydownEventIndex = passKeyEvent + KeyManager.stop = false return }) }, 1) @@ -529,14 +526,13 @@ function RepairAllComicInfos() { procressPanel.reset(0) procressPanel.show('Collecting Comics...') procressPanel.config({bgClose:false, closeBtn:true, closeEvent:'isRepairingContiue=false'}) - const passKeyEvent = keydownEventIndex - keydownEventIndex = null + KeyManager.ChangeCategory(null) repair_all_error_list = [] repair_all_looped = false db.comics.find({}, (err, doc) => { - if (err) { error('CollectingComics->Err: '+err); procressPanel.hide(); isRepairing = false; isRepairingContiue = false; keydownEventIndex = passKeyEvent; return } - if (doc == undefined || doc.length == 0) { PopAlert('There is no Comic Downloaded'); procressPanel.hide(); isRepairing = false; isRepairingContiue = false; keydownEventIndex = passKeyEvent; return } + if (err) { error('CollectingComics->Err: '+err); procressPanel.hide(); isRepairing = false; isRepairingContiue = false; KeyManager.BackwardCategory(); return } + if (doc == undefined || doc.length == 0) { PopAlert('There is no Comic Downloaded'); procressPanel.hide(); isRepairing = false; isRepairingContiue = false; KeyManager.BackwardCategory(); return } repair_all_list = [] for (let i = 0; i < doc.length; i++) repair_all_list.push([toCapitalize(doc[i].n), doc[i].s, doc[i].p, doc[i]._id]) @@ -561,7 +557,7 @@ function RepairAllComicLoop() { procressPanel.config({bgClose:true, closeBtn:true}) isRepairing = false isRepairingContiue = false - keydownEventIndex = 0 + KeyManager.BackwardCategory() PageManager.Reload() } return @@ -571,7 +567,7 @@ function RepairAllComicLoop() { isRepairing = false procressPanel.hide() procressPanel.reset(0) - keydownEventIndex = 0 + KeyManager.BackwardCategory() PageManager.Reload() return } @@ -605,8 +601,7 @@ function repairComicImages(repair_list) { // Export Comic function openComicExportPanel(id) { - passKeyEvent = keydownEventIndex - keydownEventIndex = null + KeyManager.ChangeCategory(null) document.getElementById('export-panel').style.display = 'flex' db.comics.findOne({_id:id}, (err, doc) => { if (err) { error('LoadingComicInfo->ERR: '+err); closeComicExportPanel(); return } @@ -617,7 +612,7 @@ function openComicExportPanel(id) { function closeComicExportPanel() { document.getElementById('export-panel').style.display = 'none' - keydownEventIndex = passKeyEvent + KeyManager.BackwardCategory() export_comic_id = null } @@ -633,18 +628,17 @@ function exportComicBrowseLocation() { function exportComic(filepath, filelist) { const JSZip = require('jszip') const flen = filelist.length - loading.reset(2) - loading.show(`Compressing...`) + loading.Show(2, 'Compressing...') setTimeout(() => { const zip = new JSZip() for (let i = 0; i < filelist.length; i++) zip.file(i+'.'+fileExt(filelist[i]), fs.readFileSync(filelist[i]), { base64: true }) - loading.forward(`Making File...`) + loading.Forward(`Making File...`) setTimeout(async() => { const content = await zip.generateAsync({ type: "nodebuffer" }) fs.writeFileSync(filepath, content) - loading.forward() - loading.hide() + loading.Forward() + loading.Close() PopAlert('Exporting Finished') }, 1) }, 1) @@ -742,30 +736,29 @@ function deleteComic(id) { } closeComicPanel() - loading.reset(0) - loading.show('Calculating...') + loading.Show(1, 'Calculating...') setTimeout(() => { db.comics.findOne({_id:id}, (err, doc) => { - if (err) { comicDeleting = false; loading.hide(); error(err); keydownEventIndex = 0; return } - if (doc == undefined) { comicDeleting = false; loading.hide(); error('Comic Not Found.'); keydownEventIndex = 0; return } + if (err) { comicDeleting = false; loading.Close(); error(err); KeyManager.ChangeCategory('default'); return } + if (doc == undefined) { comicDeleting = false; loading.Close(); error('Comic Not Found.'); KeyManager.ChangeCategory('default'); return } const ImagesId = doc.i const ImagesFormats = doc.f const ImagesCount = doc.c const site = doc.s const post_id = doc.p - loading.reset(4 + ImagesCount) - loading.show('Removing Comic From Database...') + loading.Close() + loading.Show(4 + ImagesCount, 'Removing Comic From Database...') const fix_removed_index = () => { FixComicIndex(true) - loading.forward() - loading.hide() + loading.Forward() + loading.Close() PopAlert('Comic Deleted.', 'warning') comicDeleting = false PageManager.Reload() - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') } @@ -777,14 +770,14 @@ function deleteComic(id) { haveDBComic.splice(haveIndex, 1) } try { jsonfile.writeFileSync(dirDB+'/have.lowdb', {s:haveDBSite,i:haveDBId,c:haveDBComic}) } catch(err) { error('SavingHaveDB->'+err); console.log(err) } - loading.forward('Fix Indexs...') + loading.Forward('Fix Indexs...') fix_removed_index() } const remove_comic = () => { db.comics.remove({_id:id}, {}, err => { - if (err) { comicDeleting = false; loading.hide(); error(err); keydownEventIndex = 0; return } - loading.forward('Deleting Comic Images...') + if (err) { comicDeleting = false; loading.Close(); error(err); KeyManager.ChangeCategory('default'); return } + loading.Forward('Deleting Comic Images...') remove_have() }) } @@ -821,14 +814,14 @@ function deleteComic(id) { try { fs.unlinkSync(thisUrl) } catch(err) { - loading.hide() + loading.Close() error(err) - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') return } } - loading.forward(`Deleting Comic Images (${i+1}/${ImagesCount})...`) + loading.Forward(`Deleting Comic Images (${i+1}/${ImagesCount})...`) } } @@ -838,7 +831,7 @@ function deleteComic(id) { console.error(`Couldn't Delete Folder: ${dirUL}/${id}${ImagesId}`) } - loading.forward('Removing Comic Groups From Database...') + loading.Forward('Removing Comic Groups From Database...') remove_comic() } @@ -866,14 +859,13 @@ function askForDeletingComic(id) { // Rename a Comic function openRenameComic(id) { - passKeyEvent = keydownEventIndex - keydownEventIndex = null + KeyManager.ChangeCategory(null) const panel = document.getElementById('comic-rename-panel') db.comics.findOne({_id:id}, (err, doc) => { if (err || doc == null) { error('FindingComic->Err: '+err) console.error(err) - keydownEventIndex = passKeyEvent + KeyManager.BackwardCategory() passKeyEvent = null return } @@ -890,7 +882,7 @@ function closeRenamePanel() { panel.style.display = 'none' panel.removeAttribute('cid') panel.children[1].children[0].value = null - keydownEventIndex = passKeyEvent + KeyManager.BackwardCategory() passKeyEvent = null } @@ -927,15 +919,14 @@ function askForClosingApp() { // Comic Properties function OpenComicProperties(comic_id) { - passKeyEvent = keydownEventIndex - keydownEventIndex = null + KeyManager.ChangeCategory(null) const container = document.getElementById('c-p-c') container.style.display = 'none' document.getElementById('comic-properties').style.display = 'flex' db.comics.findOne({_id:comic_id}, (err, doc) => { if (err || doc == null) { document.getElementById('comic-properties').style.display = 'none' - keydownEventIndex = passKeyEvent + KeyManager.BackwardCategory() passKeyEvent = null error(err) console.error(err) @@ -973,99 +964,6 @@ function OpenPath(path) { function CloseComicProperties() { document.getElementById('comic-properties').style.display = 'none' - keydownEventIndex = passKeyEvent + KeyManager.BackwardCategory() passKeyEvent = null -} - -// Key Event -function OfflineKeyEvents(ctrl, shift, key) { - if (ctrl) { - if (!shift) { - switch (key) { - case 66: - openBrowser() - break - case 72: - PageManager.Home() - break - case 82: - PageManager.Reload() - break - case 88: - openCollectionsPanel() - break - case 90: - PageManager.RandomJumpPage() - break - } - } - } else { - if (!shift) { - switch (key) { - case 27: - askForClosingApp() - break - case 39: - PageManager.Next() - break - case 37: - PageManager.Prev() - break - case 49: - openInfoPanel(0) - break - case 50: - openInfoPanel(1) - break - case 51: - openInfoPanel(2) - break - case 52: - openInfoPanel(3) - break - case 53: - openInfoPanel(4) - break - case 54: - openInfoPanel(5) - break - case 55: - openInfoPanel(6) - break - } - } - } -} - -function OfflineComicKeyEvents(ctrl, shift, key) { - if (ctrl) { - if (!shift) { - switch (key) { - case 69: - openComicExportPanel(Number(comicPanel.getAttribute('cid')), 1) - break - case 81: - keydownEventIndex = null - document.getElementById('comic-action-panel').style.display='flex' - break - case 82: - if (need_repair.length > 0) { - keydownEventIndex = null - repairComicImages() - } - break - case 83: - SliderManager.Open() - break - } - } - } else { - if (!shift) { - switch (key) { - case 27: - closeComicPanel() - break - } - } - } } \ No newline at end of file diff --git a/JS/database.js b/JS/database.js index 13881b9..1c728f7 100644 --- a/JS/database.js +++ b/JS/database.js @@ -36,7 +36,7 @@ function GetHave(site, id) { // Character function RepairCharacter(result, comicId) { if (result == null || result.length == 0) { - loading.hide() + loading.Close() db.comics.update({_id:comicId}, { $set: {h:null} }, {}, err => { if (err) console.error(err) PopAlert('This Comic has no Character.', 'danger') @@ -44,15 +44,15 @@ function RepairCharacter(result, comicId) { }) return } - loading.text('Listing Characters...') + loading.Text('Listing Characters...') const list = [] for (let i = 0; i < result.length; i++) list.push(result[i].name) - loading.text('Add Characters To Database...') + loading.Text('Add Characters To Database...') const newInfo = CreateCharacter(list) db.comics.update({_id:comicId}, { $set: {h:newInfo} }, {}, err => { - loading.hide() + loading.Close() openComicCharacters(comicId) if (err) { error('CharactersListUpdate->'+err); return } PopAlert('Comic Characters Has Been Repaired!') @@ -78,7 +78,7 @@ function CreateCharacter(list) { // Language function RepairLanguage(result, comicId) { if (result == null || result.length == 0) { - loading.hide() + loading.Close() db.comics.update({_id:comicId}, { $set: {l:null} }, {}, err => { if (err) console.error(err) PopAlert('This Comic has no Language.', 'danger') @@ -86,15 +86,15 @@ function RepairLanguage(result, comicId) { }) return } - loading.text('Listing Languages...') + loading.Text('Listing Languages...') const list = [] for (let i = 0; i < result.length; i++) list.push(result[i].name) - loading.text('Add Languages To Database...') + loading.Text('Add Languages To Database...') const newInfo = CreateLanguage(list) db.comics.update({_id:comicId}, { $set: {l:newInfo} }, {}, err => { - loading.hide() + loading.Close() openComicLanguages(comicId) if (err) { error('LanguagesListUpdate->'+err); return } PopAlert('Comic Languages Has Been Repaired!') @@ -120,7 +120,7 @@ function CreateLanguage(list) { // Category function RepairCategory(result, comicId) { if (result == null || result.length == 0) { - loading.hide() + loading.Close() db.comics.update({_id:comicId}, { $set: {e:null} }, {}, err => { if (err) console.error(err) PopAlert('This Comic has no Category.', 'danger') @@ -128,15 +128,15 @@ function RepairCategory(result, comicId) { }) return } - loading.text('Listing Categories...') + loading.Text('Listing Categories...') const list = [] for (let i = 0; i < result.length; i++) list.push(result[i].name) - loading.text('Add Categories To Database...') + loading.Text('Add Categories To Database...') const newInfo = CreateCategory(list) db.comics.update({_id:comicId}, { $set: {e:newInfo} }, {}, err => { - loading.hide() + loading.Close() openComicCategories(comicId) if (err) { error('CategoriesListUpdate->'+err); return } PopAlert('Comic Categories Has Been Repaired!') @@ -162,7 +162,7 @@ function CreateCategory(list) { // Groups function RepairGroup(result, comicId) { if (result == null || result.length == 0) { - loading.hide() + loading.Close() db.comics.update({_id:comicId}, { $set: {g:null} }, {}, err => { if (err) console.error(err) PopAlert('This Comic has no Group.', 'danger') @@ -170,15 +170,15 @@ function RepairGroup(result, comicId) { }) return } - loading.text('Listing Groups...') + loading.Text('Listing Groups...') const list = [] for (let i = 0; i < result.length; i++) list.push(result[i].name) - loading.text('Add Groups To Database...') + loading.Text('Add Groups To Database...') const newInfo = CreateGroup(list) db.comics.update({_id:comicId}, { $set: {g:newInfo} }, {}, err => { - loading.hide() + loading.Close() openComicGroups(comicId) if (err) { error('GroupsListUpdate->'+err); return } PopAlert('Comic Groups Has Been Repaired!') @@ -205,7 +205,7 @@ function CreateGroup(list) { // Artists function RepairArtist(result, comicId) { if (result == null || result.length == 0) { - loading.hide() + loading.Close() db.comics.update({_id:comicId}, { $set: {a:null} }, {}, err => { if (err) console.error(err) PopAlert('This Comic has no Artist.', 'danger') @@ -213,15 +213,15 @@ function RepairArtist(result, comicId) { }) return } - loading.text('Listing Artists...') + loading.Text('Listing Artists...') const list = [] for (let i = 0; i < result.length; i++) list.push(result[i].name) - loading.text('Add Artists To Database...') + loading.Text('Add Artists To Database...') const newInfo = CreateArtist(list) db.comics.update({_id:comicId}, { $set: {a:newInfo} }, {}, err => { - loading.hide() + loading.Close() openComicArtists(comicId) if (err) { error('ArtistsListUpdate->'+err); return } PopAlert('Comic Artists Has Been Repaired!') @@ -247,7 +247,7 @@ function CreateArtist(list) { // Parody function RepairParody(result, comicId) { if (result == null || result.length == 0) { - loading.hide() + loading.Close() db.comics.update({_id:comicId}, { $set: {d:null} }, {}, err => { if (err) console.error(err) PopAlert('This Comic has no Parody.', 'danger') @@ -255,15 +255,15 @@ function RepairParody(result, comicId) { }) return } - loading.text('Listing Parodies...') + loading.Text('Listing Parodies...') const list = [] for (let i = 0; i < result.length; i++) list.push(result[i].name) - loading.text('Add Parodies To Database...') + loading.Text('Add Parodies To Database...') const newInfo = CreateParody(list) db.comics.update({_id:comicId}, { $set: {d:newInfo} }, {}, err => { - loading.hide() + loading.Close() openComicParodies(comicId) if (err) { error('ParodiesListUpdate->'+err); return } PopAlert('Comic Parodies Has Been Repaired!') @@ -289,7 +289,7 @@ function CreateParody(list) { // Tag function RepairTag(result, comicId) { if (result == null || result.length == 0) { - loading.hide() + loading.Close() db.comics.update({_id:comicId}, { $set: {t:null} }, {}, err => { if (err) console.error(err) PopAlert('This Comic has no Tag.', 'danger') @@ -297,15 +297,15 @@ function RepairTag(result, comicId) { }) return } - loading.text('Listing Tags...') + loading.Text('Listing Tags...') const list = [] for (let i = 0; i < result.length; i++) list.push(result[i].name) - loading.text('Add Tags To Database...') + loading.Text('Add Tags To Database...') const newInfo = CreateTag(list) db.comics.update({_id:comicId}, { $set: {t:newInfo} }, {}, err => { - loading.hide() + loading.Close() openComicTags(comicId) if (err) { error('TagsListUpdate->'+err); return } PopAlert('Comic Tags Has Been Repaired!') diff --git a/JS/defualt-classes.js b/JS/defualt-classes.js new file mode 100644 index 0000000..f4fc2ee --- /dev/null +++ b/JS/defualt-classes.js @@ -0,0 +1,591 @@ +class HotKeyManager { + #backwardIndex + #index + #categories + #categoriesName + #public + #watching + + constructor() { + this.#backwardIndex = null + this.#index = null + this.#categories = [] + this.#categoriesName = [] + this.#public = [] + this.#watching = false + this.use_public = false + this.stop = false + this.saved_category = [] + window.addEventListener('keydown', e => { + this.CheckKeys(e) + if (this.use_public) this.CheckPublic(e) + }) + } + + AddPublicHotKey(ctrl, shift, alt, key, job) { + if (typeof ctrl !== 'boolean') throw "ctrl Type Should Be Boolean" + if (typeof shift !== 'boolean') throw "shift Type Should Be Boolean" + if (typeof alt !== 'boolean') throw "alt Type Should Be Boolean" + if (typeof key !== 'number') throw "key Type Should Be Number (int)" + if (typeof job !== 'string' && typeof job !== 'function') throw "Job Type Should Be String/Function" + this.#public.push([ctrl, shift, alt, key, job]) + } + + CheckPublic(event) { + if (this.stop) return + const l = this.#public.length + if (l == 0) return + for (let i = 0; i < l; i++) { + if (event.ctrlKey != this.#public[i][0]) continue + if (event.shiftKey != this.#public[i][1]) continue + if (event.altKey != this.#public[i][2]) continue + if (event.keyCode != this.#public[i][3]) continue + event.preventDefault() + if (typeof this.#public[i][4] === 'function') this.#public[i][4]() + else try { eval(this.#public[i][4]) } catch(err) { console.error(err) } + break + } + } + + AddCategory(name) { + if (name.replace(/ /g, '').length == 0) throw "Name is Required" + if (this.#categoriesName.indexOf(name.toLowerCase()) > -1) throw "Category Already Exists" + const index = this.#categoriesName.length + this.#categoriesName[index] = name.toLowerCase() + this.#categories[index] = [[],[],[],[],[]] + } + + AddHotKey(category, ctrl, shift, alt, key, job) { + if (typeof ctrl !== 'boolean') throw "ctrl Type Should Be Boolean" + if (typeof shift !== 'boolean') throw "shift Type Should Be Boolean" + if (typeof alt !== 'boolean') throw "alt Type Should Be Boolean" + if (typeof key !== 'number') throw "key Type Should Be Number (int)" + if (typeof job !== 'string' && typeof job !== 'function') throw "Job Type Should Be String/Function" + if (typeof category === 'number') { + if (this.#categories[category] == undefined || this.#categories[category] == null) throw "Category Not Found." + } else if (typeof category === 'string') { + const cat_index = this.#categoriesName.indexOf(category.toLowerCase()) + if (cat_index < 0) throw "Category Not Found" + category = cat_index + } else throw "Category Type Should Be Number (int) Or String" + const index = this.#categories[category][0].length + this.#categories[category][0][index] = ctrl + this.#categories[category][1][index] = shift + this.#categories[category][2][index] = alt + this.#categories[category][3][index] = key + this.#categories[category][4][index] = job + } + + ChangeCategory(NameOrNumber) { + let index + + if (NameOrNumber == null) index = null + else if (typeof NameOrNumber === 'number') { + if (this.#categories[NameOrNumber] == undefined || this.#categories[NameOrNumber] == null) throw "Category Not Found." + } else { + index = this.#categoriesName.indexOf(NameOrNumber.toLowerCase()) + if (index < 0) throw "Couldn't Find Category" + } + this.#backwardIndex = this.#index + this.#index = index + } + + BackwardCategory() { + const saveIndex = this.#backwardIndex + this.#backwardIndex = this.#index + this.#index = saveIndex + } + + CheckKeys(event) { + if (this.#watching) { + console.log({KeyName:event.key,KeyCode:event.keyCode,isCtrl:event.ctrlKey,isShift:event.shiftKey,isAlt:event.altKey}) + return + } + if (this.stop) return + if (this.#index == null) return + const key = event.keyCode, ctrl = event.ctrlKey, shift = event.shiftKey, alt = event.altKey + const index = this.#categories[this.#index][3].indexOf(key) + + if (index < 0) return + if (ctrl != this.#categories[this.#index][0][index]) return + if (shift != this.#categories[this.#index][1][index]) return + if (alt != this.#categories[this.#index][2][index]) return + + event.preventDefault() + + if (typeof this.#categories[this.#index][4][index] === 'function') this.#categories[this.#index][4][index]() + else eval(this.#categories[this.#index][4][index]) + } + + SaveCategory(index = 0, value = null) { this.saved_category[index] = value == null ? this.#index : value } + LoadCategory(index = 0) { this.#index = this.saved_category[index] } + + Watching() { + this.#watching = !this.#watching + console.log("Watching Mode "+(this.#watching ? "on" : "off")) + } +} + +class Loading { + #element + #text + #slider + #max + #percent + #times + + constructor() { + this.#element = null + this.#text = null + this.#slider = null + this.#max = 0 + this.#percent = 0 + this.#times = 0 + } + + Show(per, txt = 'Loading...') { + if (typeof per !== 'number') throw "Percent Should Be Number (int)." + if (this.#element != null) this.Close() + KeyManager.stop = true + this.#max = per + this.#times = 100 / per + this.#percent = 0 + const element = document.createElement('div') + element.classList.add('loading') + this.#text = document.createElement('p') + this.#text.innerText = txt + element.appendChild(this.#text) + const procress = document.createElement('div') + this.#slider = document.createElement('div') + procress.appendChild(this.#slider) + element.appendChild(procress) + this.#element = element + document.body.appendChild(element) + } + + Close() { + if (this.#element == null) return + try { this.#element.remove() } catch(err) { console.error(err) } + this.#element = null + this.#text = null + this.#slider = null + this.#max = 0 + this.#times = 0 + this.#percent = 0 + KeyManager.stop = false + } + + Backward(txt) { + this.#percent-- + if (this.#percent < 0) this.#percent = 0 + this.#slider.style.width = (this.#percent * this.#times)+'%' + if (txt != null) this.#text.innerText = txt + } + + Forward(txt) { + this.#percent++ + if (this.#percent > this.#max) this.#percent = this.#max + this.#slider.style.width = (this.#percent * this.#times)+'%' + if (txt != null) this.#text.innerText = txt + } + + ChangePercent(per) { + if (this.#element == null) return + if (typeof per !== 'number') throw "Percent Should Be Number (int)." + this.#max = per + this.#times = 100 / per + if (this.#percent > per) this.#percent = per + this.#slider.style.width = (this.#percent * this.#times)+'%' + } + + Change(index, txt) { + if (index != null) { + if (index < 0) index = 0 + if (index > this.#max) index = this.#max + this.#percent = index + this.#slider.style.width = (index * this.#times)+'%' + } + if (txt != null) this.#text.innerText = txt + } + + Text(txt) { + this.#text.innerText = txt; + } +} + +class ProcressPanel { + #saveProcress = 0 + #constainer + #closeBtn + #secendSide + #miniLogContainer + #logContainer + #txt + #procress + + constructor(times = 0) { + this.times = (100/times) + this.id = `pp${new Date().getTime()}` + this.#constainer = document.createElement('div') + this.#constainer.setAttribute('id', this.id) + this.#constainer.classList.add('procress-panel') + let elementContainer = document.createElement('div') + this.#constainer.appendChild(elementContainer) + this.#closeBtn = document.createElement('button') + this.#closeBtn.setAttribute('type', 'button') + this.#closeBtn.setAttribute('onclick', "this.parentElement.style.display='none'") + this.#closeBtn.innerText = 'X' + this.#constainer.appendChild(this.#closeBtn) + elementContainer = document.createElement('div') + this.#miniLogContainer = document.createElement('div') + elementContainer.appendChild(this.#miniLogContainer) + this.#secendSide = document.createElement('div') + this.#logContainer = document.createElement('div') + this.#secendSide.appendChild(this.#logContainer) + let element = document.createElement('div') + this.#txt = document.createElement('p') + this.#txt.innerText = 'Waiting...' + element.appendChild(this.#txt) + let miniElement = document.createElement('div') + this.#procress = document.createElement('div') + miniElement.appendChild(this.#procress) + element.appendChild(miniElement) + this.#secendSide.appendChild(element) + elementContainer.appendChild(this.#secendSide) + this.#constainer.appendChild(elementContainer) + document.body.appendChild(this.#constainer) + } + + forward(text) { + if (text != undefined) this.#txt.innerText = text + this.#saveProcress += this.times + this.#procress.style.width = this.#saveProcress+'%' + } + + changePercent(times = 0) { + this.times = (100/times) + } + + add(text, color) { + color = color || 'success' + const element = document.createElement('div') + + element.innerHTML = text + element.classList.add('pp-log') + element.classList.add(`pp-${color}`) + + this.#logContainer.appendChild(element) + } + + addMini(text, color) { + color = color || 'success' + const element = document.createElement('div') + + element.innerHTML = text + element.classList.add('pp-log') + element.classList.add(`pp-${color}`) + + this.#miniLogContainer.appendChild(element) + } + + clear() { + this.#logContainer.innerHTML = '' + } + + clearMini() { + this.#miniLogContainer.innerHTML = '' + } + + reset(times = 0) { + this.hide() + this.clear() + this.clearMini() + if (times != undefined) this.times = (100/times) + this.#txt.innerText = 'Waiting...' + this.#saveProcress = 0 + this.#procress.style.width = 0 + this.#constainer.children[0].setAttribute('onclick', "this.parentElement.style.display='none'") + this.#closeBtn.setAttribute('onclick', "this.parentElement.style.display='none'") + } + + hide() { this.#constainer.style.display = 'none' } + + show(text) { + if (text != undefined) this.#txt.innerHTML = text + this.#constainer.style.display = 'flex' + } + + text(text) { + this.#txt.innerHTML = text + } + + config(config = { miniLog:false, miniSize:30, bgClose:false, closeBtn:false, closeEvent:'event' }) { + if (config.miniLog != undefined) { + if (config.miniLog) { + this.#constainer.setAttribute('mini', true) + if (config.miniSize != null && typeof(config.miniSize) == 'number') { + this.#miniLogContainer.style.flex = `0 0 ${config.miniSize}%` + this.#miniLogContainer.style.maxWidth = `${config.miniSize}%` + this.#secendSide.style.flex = `0 0 ${100 - config.miniSize}%` + this.#secendSide.style.maxWidth = `${100 - config.miniSize}%` + } else { + this.#miniLogContainer.style.flex = '0 0 30%' + this.#miniLogContainer.style.maxWidth = '30%' + this.#secendSide.style.flex = '0 0 70%' + this.#secendSide.style.maxWidth = '70%' + } + } else { + this.#constainer.removeAttribute('mini') + this.#miniLogContainer.style.flex = '0 0 0' + this.#miniLogContainer.style.maxWidth = '0' + this.#secendSide.style.flex = '0 0 100%' + this.#secendSide.style.maxWidth = '100%' + } + } + + if (config.bgClose != undefined) { + if (config.bgClose) this.#constainer.children[0].setAttribute('onclick', "this.parentElement.style.display='none'") + else this.#constainer.children[0].removeAttribute('onclick') + } + + if (config.closeBtn != undefined) { + if (config.closeBtn) this.#closeBtn.style.display = 'flex' + else this.#closeBtn.style.display = 'none' + } + + if (config.closeEvent != undefined) { + this.#constainer.children[0].setAttribute('onclick', config.closeEvent) + this.#closeBtn.setAttribute('onclick', config.closeEvent) + } + } + + remove() { + this.#constainer.remove() + } +} + +class ContextMenuManager { + #menu + #menuNames + #menuOptions + #element + + constructor() { + this.#menu = [] + this.#menuNames = [] + this.#menuOptions = [] + this.#element = null + this.save = null + window.addEventListener('mouseup', e => { if (this.#element != null && e.which == 1) this.CloseMenu() }) + window.addEventListener('click', () => { if (this.#element != null) this.CloseMenu() }) + window.addEventListener('wheel', () => { if (this.#element != null) this.CloseMenu() }) + window.addEventListener('resize', () => { if (this.#element != null) this.CloseMenu() }) + window.addEventListener('keydown', () => { if (this.#element != null) this.CloseMenu() }) + } + + AddEvent(menu, element, save = null) { + if (typeof menu === 'number') { + if (this.#menu[menu] == undefined || this.#menu[menu] == null) throw "Menu Not Found." + } else if (typeof menu === 'string') { + const cat_index = this.#menuNames.indexOf(menu.toLowerCase()) + if (cat_index < 0) throw "Menu Not Found" + menu = cat_index + } else throw "Menu Type Should Be Number (int) Or String" + + if (typeof element === 'string') { + const ele = document.getElementById(element) || null + if (ele == null) throw "Element Not Found!" + ele.addEventListener('contextmenu', () => {this.ShowMenu(menu, save)}) + } else if (typeof element === 'object') { + try { + element.addEventListener('contextmenu', () => { this.ShowMenu(menu, save) }) + } catch(err) { + throw err + } + } else throw "Element Not Found!" + } + + AddMenu(name, useLanguageAlign = false, rtl = false) { + if (name == null || name.replace(/ /g, '').length == 0) throw "Name is Required." + if (this.#menuNames.indexOf(name.toLowerCase()) > -1) throw "Menu Already Exists." + if (typeof useLanguageAlign !== 'boolean') throw "Use Language Align Should Be Boolean." + if (!useLanguageAlign) { + if (typeof rtl !== 'boolean') throw "rtl Should Be Boolean." + } else rtl = null + + + + const index = this.#menuNames.length + this.#menuNames[index] = name.toLowerCase() + this.#menuOptions[index] = [useLanguageAlign, rtl] + this.#menu[index] = [] + return index + } + + ConfigMenu(menu, useLanguageAlign = false, rtl = false) { + if (typeof menu === 'number') { + if (this.#menu[menu] == undefined || this.#menu[menu] == null) throw "Menu Not Found." + } else if (typeof menu === 'string') { + const cat_index = this.#menuNames.indexOf(menu.toLowerCase()) + if (cat_index < 0) throw "Menu Not Found" + menu = cat_index + } else throw "Menu Type Should Be Number (int) Or String" + + if (typeof useLanguageAlign !== 'boolean') throw "Use Language Align Should Be Boolean." + if (!useLanguageAlign) { + if (typeof rtl !== 'boolean') throw "rtl Should Be Boolean." + } else rtl = null + + this.#menuOptions[menu] = [useLanguageAlign, rtl] + } + + AddItem(menu, config) { + if (typeof config !== 'object') throw "Config Type Should Be Object" + + if (typeof menu === 'number') { + if (this.#menu[menu] == undefined || this.#menu[menu] == null) throw "Menu Not Found." + } else if (typeof menu === 'string') { + const cat_index = this.#menuNames.indexOf(menu.toLowerCase()) + if (cat_index < 0) throw "Menu Not Found" + menu = cat_index + } else throw "Menu Type Should Be Number (int) Or String" + + const obj = {} + if (typeof config.text === 'string' && config.text.replace(/ /g, '').length > 0) { + obj.text = config.text + if (typeof config.active === 'boolean') obj.active = config.active + else obj.active = true + if (config.click != null) { + if (typeof config.click === 'string' || typeof config.click === 'function') obj.click = config.click + else throw "Click Should Be String or Function!" + } + if (typeof config.icon === 'string') obj.icon = config.icon + else obj.icon = null + } + this.#menu[menu].push(obj) + } + + SetActiveItem(menu, index, state) { + if (typeof menu === 'number') { + if (this.#menu[menu] == undefined || this.#menu[menu] == null) throw "Menu Not Found." + } else if (typeof menu === 'string') { + const cat_index = this.#menuNames.indexOf(menu.toLowerCase()) + if (cat_index < 0) throw "Menu Not Found" + menu = cat_index + } else throw "Menu Type Should Be Number (int) Or String" + if (typeof index !== 'number') throw "Index should be Number (int)" + if (typeof state !== 'boolean') throw "State should be boolean" + if (this.#menu[menu][index] != null) { + this.#menu[menu][index].active = state + } + } + + RemoveMenu(menu) { + if (typeof menu === 'number') { + if (this.#menu[menu] == undefined || this.#menu[menu] == null) throw "Menu Not Found." + } else if (typeof menu === 'string') { + const cat_index = this.#menuNames.indexOf(menu.toLowerCase()) + if (cat_index < 0) throw "Menu Not Found" + menu = cat_index + } else throw "Menu Type Should Be Number (int) Or String" + this.#menu.splice(menu, 1) + this.#menuNames.splice(menu, 1) + this.#menuOptions.splice(menu, 1) + } + + RemoveItem(menu, index) { + if (typeof menu === 'number') { + if (this.#menu[menu] == undefined || this.#menu[menu] == null) throw "Menu Not Found." + } else if (typeof menu === 'string') { + const cat_index = this.#menuNames.indexOf(menu.toLowerCase()) + if (cat_index < 0) throw "Menu Not Found" + menu = cat_index + } else throw "Menu Type Should Be Number (int) Or String" + if (index >= this.menu[menu].length) return + this.menu[menu].splice(index, 1) + } + + ConfigItem(menu, index, config) { + if (typeof menu === 'number') { + if (this.#menu[menu] == undefined || this.#menu[menu] == null) throw "Menu Not Found." + } else if (typeof menu === 'string') { + const cat_index = this.#menuNames.indexOf(menu.toLowerCase()) + if (cat_index < 0) throw "Menu Not Found" + menu = cat_index + } else throw "Menu Type Should Be Number (int) Or String" + if (index >= this.menu[menu].length) return + + const obj = {} + if (typeof config.text === 'string' || config.text.replace(/ /g, '').length > 0) { + obj.text = config.text + if (typeof config.active === 'boolean') obj.active = config.active + else obj.active = true + if (config.click != null) { + if (typeof config.click === 'string' || typeof config.click === 'function') obj.click = config.click + else throw "Click Should Be String or Function!" + } + if (typeof config.icon === 'string') obj.icon = config.icon + else obj.icon = null + } + this.#menu[menu][index] = obj + } + + ShowMenu(menu, saver = null) { + if (typeof menu === 'number') { + if (this.#menu[menu] == undefined || this.#menu[menu] == null) throw "Menu Not Found." + } else if (typeof menu === 'string') { + const cat_index = this.#menuNames.indexOf(menu.toLowerCase()) + if (cat_index < 0) throw "Menu Not Found" + menu = cat_index + } else throw "Menu Type Should Be Number (int) Or String" + this.CloseMenu() + const e = window.event + + const container = document.createElement('div') + container.classList.add('context-menu') + let save + + for (let i = 0, l = this.#menu[menu].length; i < l; i++) { + if (this.#menu[menu][i].active) { + if (this.#menu[menu][i].text != undefined) { + if (this.#menu[menu][i].click != undefined) { + save = document.createElement('div') + if (this.#menu[menu][i].icon !== null) { + const icon = Icon(this.#menu[menu][i].icon, true) + if (icon != null) save.appendChild(icon) + const save2 = document.createElement('span') + save2.innerText = Language(this.#menu[menu][i].text) + save.appendChild(save2) + } else save.innerText = Language(this.#menu[menu][i].text) + + + if (typeof this.#menu[menu][i].click === 'string') save.onmousedown = e => { if (e.which != 2) eval(this.#menu[menu][i].click); this.CloseMenu() } + else if (typeof this.#menu[menu][i].click === 'function') save.onmousedown = e => { if (e.which != 2) this.#menu[menu][i].click(); this.CloseMenu() } + container.appendChild(save) + } else { + save = document.createElement('p') + save.innerText = Language(this.#menu[menu][i].text) + container.appendChild(save) + } + } else { + save = document.createElement('span') + container.appendChild(save) + } + } + } + if (saver != null) this.save = saver + document.body.appendChild(container) + this.#element = container + let x = e.clientX, y = e.clientY + if (window.innerWidth <= x+container.clientWidth) x = window.innerWidth - container.clientWidth + if (window.innerHeight <= y+container.clientHeight) y = window.innerHeight - container.clientHeight + container.style.top = y+'px' + container.style.left = x+'px' + } + + CloseMenu() { + if (this.#element == null) return + try { this.#element.remove() } catch(err) { console.error(err) } + this.#element = null + } +} \ No newline at end of file diff --git a/JS/image-optimizer.js b/JS/image-optimizer.js index 8fd0e1b..73801a9 100644 --- a/JS/image-optimizer.js +++ b/JS/image-optimizer.js @@ -4,7 +4,7 @@ let optimizeLog = [], optimizeFullSize = 0, optimizeConvertSize = 0, isOptimzing // Optimize Single Comic function OptimizeComicImages(comic_id, opened_comic, keyEvent) { if (opened_comic && Downloader.HasDownload()) { error("You Can't Optimze Image When you are Downloading Something and Opening Offline Comic, Close and Optimize with Right Click!"); return } - keydownEventIndex = null + KeyManager.ChangeCategory(null) isOptimizing = true optimizeLog = [] optimizeFullSize = 0 @@ -33,7 +33,7 @@ function OptimizeComicImages(comic_id, opened_comic, keyEvent) { procressPanel.hide() if (opened_comic) openComic(comic_id) isOptimizing = false - keydownEventIndex = keyEvent + KeyManager.BackwardCategory() return } db.comics.findOne({ _id:comic_id }, (err, doc) => { @@ -42,7 +42,7 @@ function OptimizeComicImages(comic_id, opened_comic, keyEvent) { error(err) if (opened_comic) openComic(comic_id) isOptimizing = false - keydownEventIndex = keyEvent + KeyManager.BackwardCategory() return } @@ -83,14 +83,14 @@ function OptimizeComicImages(comic_id, opened_comic, keyEvent) { error("MovingTemp: "+err) if (opened_comic) openComic(comic_id) isOptimizing = false - keydownEventIndex = keyEvent + KeyManager.BackwardCategory() return } } procressPanel.forward(`Optimizing Image (0/${urls.length})...`) convertImagesToOptimize(urls, 0, comic_id, image, () => { if (opened_comic) openComic(comic_id) - keydownEventIndex = keyEvent + KeyManager.BackwardCategory() }) }, 10) }) @@ -256,8 +256,7 @@ function startOptimizingAll() { if (isOptimizing) return isOptimizing = true isOptimzingContiue = true - const passKeyEventIndex = keydownEventIndex - keydownEventIndex = null + KeyManager.ChangeCategory(null) optimizeAllFullSize = 0 optimizeAllConvertSize = 0 @@ -266,14 +265,14 @@ function startOptimizingAll() { procressPanel.show('Calculating...') db.comics.find({}, (err, doc) => { - if (err) { error('CollectingComics->Err: '+err); procressPanel.reset(0); isOptimizing = false; isOptimzingContiue = false; keydownEventIndex = passKeyEventIndex; return } - if (doc == undefined || doc.length == 0) { PopAlert('There is no Comic Downloaded.', 'warning'); procressPanel.reset(0); isOptimizing = false; isOptimzingContiue = false; keydownEventIndex = passKeyEventIndex; return } + if (err) { error('CollectingComics->Err: '+err); procressPanel.reset(0); isOptimizing = false; isOptimzingContiue = false; KeyManager.BackwardCategory(); return } + if (doc == undefined || doc.length == 0) { PopAlert('There is no Comic Downloaded.', 'warning'); procressPanel.reset(0); isOptimizing = false; isOptimzingContiue = false; KeyManager.BackwardCategory(); return } const collected_comics = [] for (let i = 0; i < doc.length; i++) { if (typeof doc[i].o != 'number') collected_comics.push([toCapitalize(doc[i].n), doc[i].i, doc[i].c, doc[i].f, doc[i]._id]) } - if (collected_comics.length == 0) { PopAlert('All Comics are Optimized!'); procressPanel.reset(0); isOptimizing = false; isOptimzingContiue = false; keydownEventIndex = passKeyEventIndex; return } + if (collected_comics.length == 0) { PopAlert('All Comics are Optimized!'); procressPanel.reset(0); isOptimizing = false; isOptimzingContiue = false; KeyManager.BackwardCategory(); return } OptimizeAll(collected_comics, 0, collected_comics.length) }) @@ -344,7 +343,7 @@ function OptimizeAll(docList, index, maxLength, list) { if (setting.notification_optimization_finish && remote.Notification.isSupported()) new remote.Notification({title: 'Comics Optimization Finished.', body: doc.n}).show() isOptimizing = false isOptimzingContiue = false - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') PopAlert('Comic Images Has Been Optimize') return } diff --git a/JS/infos.js b/JS/infos.js index 34752a3..127398c 100644 --- a/JS/infos.js +++ b/JS/infos.js @@ -2,7 +2,7 @@ const infoContainer = document.getElementById('i-p-i-c') let info_panel_index = null function openInfoPanel(index) { - keydownEventIndex = null + KeyManager.ChangeCategory(null) info_panel_index = index const title = document.getElementById('i-p-t') switch(index) { @@ -36,7 +36,7 @@ function openInfoPanel(index) { break } document.getElementById('info-panel').style.display = 'block' - keydownEventIndex = 5 + KeyManager.ChangeCategory('info') } function MakeInfoContent(list) { @@ -54,7 +54,7 @@ function MakeInfoContent(list) { } function closeInfoPanel() { - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') document.getElementById('info-panel').style.display = 'none' info_panel_index = null document.getElementById('i-p-s-i').value = null diff --git a/JS/requires.js b/JS/main.js similarity index 89% rename from JS/requires.js rename to JS/main.js index c32ef65..0b73e7a 100644 --- a/JS/requires.js +++ b/JS/main.js @@ -59,16 +59,8 @@ const sites = [ downloader: 'nhentaiDownloader({id})' } ] -const keydownEvents = [ - 'OfflineKeyEvents({ctrl},{shift},{key})', // 0 - 'OfflineComicKeyEvents({ctrl},{shift},{key})', // 1 - 'SliderManager.SliderKeyEvents({ctrl},{shift},{key})', // 2 - 'BrowserKeyEvents({ctrl},{shift},{key})', // 3 - 'SettingKeyEvents({ctrl},{shift},{key})', // 4 - 'InfoKeyEvents({ctrl},{shift},{key})' // 5 -] -const ThisWindow = remote.getCurrentWindow(), loading = new Loading(9), Downloader = new DownloadManager(), PageManager = new OfflinePageManager(), db = {}, procressPanel = new ProcressPanel(0), SliderManager = new Slider(), update_number = 15 -let comicDeleting = false, wt_fps = 20, dirDB, dirUL, dirBU, dirTmp, isOptimizing = false, browserLastTabs = [], tabsHistory = [], dirHistory = '', keydownEventIndex = 0, new_update, save_value = null, save_value2 = null, afterDLReload = true, setting, openedMenuTabIndex, copiedTab = null, tabs = [], lastComicId, searchTimer, activeTabComicId = null, activeTabIndex = null, tabsPos = [], tabsPosParent = [], isUpdating = false, collectionsDB = [], groupsDB = [], artistsDB = [], parodiesDB = [], tagsDB = [], charactersDB = [], languagesDB = [], categoriesDB = [], comicGroupsDB = [], comicArtistsDB = [], comicParodiesDB = [], comicTagsDB = [], comicCharactersDB = [], comicLanguagesDB = [], comicCategoriesDB = [], indexDB = [], haveDBSite = [], haveDBId = [], haveDBComic = [] +const ThisWindow = remote.getCurrentWindow(), loading = new Loading(), KeyManager = new HotKeyManager(), Downloader = new DownloadManager(), PageManager = new OfflinePageManager(), db = {}, procressPanel = new ProcressPanel(0), SliderManager = new Slider(), update_number = 15 +let comicDeleting = false, wt_fps = 20, dirDB, dirUL, dirBU, dirTmp, isOptimizing = false, browserLastTabs = [], tabsHistory = [], dirHistory = '', new_update, save_value = null, save_value2 = null, afterDLReload = true, setting, openedMenuTabIndex, copiedTab = null, tabs = [], lastComicId, searchTimer, activeTabComicId = null, activeTabIndex = null, tabsPos = [], tabsPosParent = [], isUpdating = false, collectionsDB = [], groupsDB = [], artistsDB = [], parodiesDB = [], tagsDB = [], charactersDB = [], languagesDB = [], categoriesDB = [], comicGroupsDB = [], comicArtistsDB = [], comicParodiesDB = [], comicTagsDB = [], comicCharactersDB = [], comicLanguagesDB = [], comicCategoriesDB = [], indexDB = [], haveDBSite = [], haveDBId = [], haveDBComic = [] // Set Windows Closing Event function closeApp() { @@ -96,8 +88,7 @@ function closeApp() { } - loading.reset(0) - loading.show('Shutting Down') + loading.Show(1, 'Shutting Down') const tabsElement = tabsContainer.children if (tabsElement.length > 0) { for (let i = 0; i < tabsElement.length; i++) addHistory(tabs[Number(tabsElement[i].getAttribute('ti'))], tabsElement[i].children[0].innerText) @@ -1133,4 +1124,60 @@ function ObserverFunction(entries, imageLoadingObserver) { }) } -let imageLoadingObserver = new IntersectionObserver(ObserverFunction, imageLazyLoadingOptions) \ No newline at end of file +let imageLoadingObserver = new IntersectionObserver(ObserverFunction, imageLazyLoadingOptions) + +function SetHotKeys() { + KeyManager.AddPublicHotKey(false, false, false, 122, ChangeScreenMode) + KeyManager.use_public = true + + KeyManager.AddCategory('default') // 0 + KeyManager.AddHotKey('default', true, false, false, 66, openBrowser) + KeyManager.AddHotKey('default', true, false, false, 72, 'PageManager.Home()') + KeyManager.AddHotKey('default', true, false, false, 82, 'PageManager.Reload()') + KeyManager.AddHotKey('default', true, false, false, 88, 'openCollectionsPanel()') + KeyManager.AddHotKey('default', true, false, false, 92, 'PageManager.RandomJumpPage()') + KeyManager.AddHotKey('default', false, false, false, 27, askForClosingApp) + KeyManager.AddHotKey('default', false, false, false, 37, 'PageManager.Prev()') + KeyManager.AddHotKey('default', false, false, false, 39, 'PageManager.Next()') + KeyManager.AddHotKey('default', false, false, false, 49, 'openInfoPanel(0)') + KeyManager.AddHotKey('default', false, false, false, 50, 'openInfoPanel(1)') + KeyManager.AddHotKey('default', false, false, false, 51, 'openInfoPanel(2)') + KeyManager.AddHotKey('default', false, false, false, 52, 'openInfoPanel(3)') + KeyManager.AddHotKey('default', false, false, false, 53, 'openInfoPanel(4)') + KeyManager.AddHotKey('default', false, false, false, 54, 'openInfoPanel(5)') + KeyManager.AddHotKey('default', false, false, false, 55, 'openInfoPanel(6)') + + KeyManager.AddCategory('comic') // 1 + KeyManager.AddHotKey('comic', true, false, false, 69, "openComicExportPanel(Number(comicPanel.getAttribute('cid')), 1)") + KeyManager.AddHotKey('comic', true, false, false, 81, "KeyManager.ChangeCategory(null);document.getElementById('comic-action-panel').style.display='flex'") + KeyManager.AddHotKey('comic', true, false, false, 82, 'if (need_repair.length > 0) {KeyManager.ChangeCategory(null);repairComicImages()}') + KeyManager.AddHotKey('comic', true, false, false, 83, 'SliderManager.Open()') + KeyManager.AddHotKey('comic', false, false, false, 27, closeComicPanel) + + KeyManager.AddCategory('slider') // 2 + KeyManager.AddHotKey('slider', true, false, false, 37, 'SliderManager.Prev()') + KeyManager.AddHotKey('slider', true, false, false, 39, 'SliderManager.Next()') + KeyManager.AddHotKey('slider', false, false, false, 27, 'SliderManager.Close()') + KeyManager.AddHotKey('slider', false, false, false, 65, 'SliderManager.Prev()') + KeyManager.AddHotKey('slider', false, false, false, 68, 'SliderManager.Next()') + KeyManager.AddHotKey('slider', false, false, false, 79, 'SliderManager.ToggleSize()') + + KeyManager.AddCategory('browser') // 3 + KeyManager.AddHotKey('browser', true, false, false, 37, browserPrev) + KeyManager.AddHotKey('browser', true, false, false, 39, browserNext) + KeyManager.AddHotKey('browser', true, false, false, 72, toggleBrowserHistory) + KeyManager.AddHotKey('browser', true, false, false, 78, 'openSite(active_site)') + KeyManager.AddHotKey('browser', true, false, false, 81, browserTabHome) + KeyManager.AddHotKey('browser', true, false, false, 82, browserTabReload) + KeyManager.AddHotKey('browser', true, false, false, 83, toggleSitePanel) + KeyManager.AddHotKey('browser', true, false, false, 87, 'if (activeTabComicId != null) removeTab(activeTabComicId)') + KeyManager.AddHotKey('browser', true, true, false, 84, openBrowserLastTabs) + KeyManager.AddHotKey('browser', false, false, false, 27, closeBrowser) + + KeyManager.AddCategory('setting') // 4 + KeyManager.AddHotKey('setting', true, false, false, 83, 'saveSetting(false)') + KeyManager.AddHotKey('setting', false, false, false, 27, closeSetting) + + KeyManager.AddCategory('info') // 5 + KeyManager.AddHotKey('info', false, false, false, 27, closeInfoPanel) +} \ No newline at end of file diff --git a/JS/make-thumb.js b/JS/make-thumb.js index 18da6e3..5a7992f 100644 --- a/JS/make-thumb.js +++ b/JS/make-thumb.js @@ -1,13 +1,12 @@ let thumbErrLog = [] function makeThumb(reCreate) { - keydownEventIndex = null + KeyManager.ChangeCategory(null) thumbErrLog = [] if (!fs.existsSync(dirUL+'/thumbs')) fs.mkdirSync(dirUL+'/thumbs') db.comics.find({}, (err, doc) => { - if (err) { error(err); keydownEventIndex = 0; return } - loading.reset(0) - loading.show(`Checking Thumbs...`) + if (err) { error(err); KeyManager.ChangeCategory('default'); return } + loading.Show(1, 'Checking Thumbs...') document.getElementById('main').style.display = 'none' const scrollTop = document.getElementById('main-body').scrollTop @@ -52,19 +51,19 @@ function checkThumbs(doc, reCreate, scrollTop) { } if (list.length > 0) { - loading.changePercent(list.length) - loading.forward(`Making Thumbs (0/${list.length})...`) + loading.ChangePercent(list.length) + loading.Forward(`Making Thumbs (0/${list.length})...`) createThumb(list, 0) } else if (thumbErrLog.length == 0) { - loading.hide() + loading.Close() document.getElementById('main').style.display = 'flex' - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') PopAlert('All Thumbs Made Successfuly.') PageManager.Reload() } else { - loading.hide() + loading.Close() document.getElementById('main').style.display = 'flex' - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') errorList(thumbErrLog) PageManager.Reload() } @@ -72,30 +71,30 @@ function checkThumbs(doc, reCreate, scrollTop) { function createThumb(list, index, scrollTop) { sharp(list[index][0]).resize(225, 315).jpeg({ mozjpeg: true }).toFile(`${dirUL}/thumbs/${list[index][1]}.jpg`).then(() => { - loading.forward(`Making Thumbs (${index+1}/${list.length})...`) + loading.Forward(`Making Thumbs (${index+1}/${list.length})...`) if (index != list.length - 1) { setTimeout(() => { createThumb(list, index + 1, scrollTop) }, 1) } else { - loading.hide() + loading.Close() document.getElementById('main').style.display = 'flex' - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') PageManager.Reload() if (thumbErrLog.length == 0) PopAlert('All Thumbs Made Successfuly.') else errorList(thumbErrLog) } }).catch(err => { - loading.forward(`Making Thumbs (${index+1}/${list.length})...`) + loading.Forward(`Making Thumbs (${index+1}/${list.length})...`) thumbErrLog.push(err) if (index != list.length - 1) { setTimeout(() => { createThumb(list, index + 1, scrollTop) }, 1) } else { - loading.hide() + loading.Close() document.getElementById('main').style.display = 'flex' - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') PageManager.Reload() if (thumbErrLog.length == 0) PopAlert('All Thumbs Made Successfuly.') else errorList(thumbErrLog) @@ -104,15 +103,14 @@ function createThumb(list, index, scrollTop) { } function makeThumbForAComic(id, keyEvents) { - keydownEventIndex = null + KeyManager.ChangeCategory(null) if (!fs.existsSync(dirUL+'/thumbs')) fs.mkdirSync(dirUL+'/thumbs') db.comics.findOne({_id:id}, (err, doc) => { - if (err) { error(err); keydownEventIndex = keyEvents; return } + if (err) { error(err); KeyManager.BackwardCategory(); return } if (doc == undefined) { error('Comic Not Found'); return } const scrollTop = document.getElementById('main-body').scrollTop PageManager.container.innerHTML = '' - loading.reset(3) - loading.show(`Checking Thumbs...`) + loading.Show(3, 'Checking Thumbs...') setTimeout(() => { const image = doc.i @@ -120,9 +118,9 @@ function makeThumbForAComic(id, keyEvents) { if (!fs.existsSync(url)) { error('This Comic First Image Is not Downloaded, we cannot make Thumb From It.') - loading.hide() + loading.Close() PageManager.Reload() - keydownEventIndex = keyEvents + KeyManager.BackwardCategory() return } @@ -135,30 +133,30 @@ function makeThumbForAComic(id, keyEvents) { } if (fs.existsSync(url)) { - loading.forward('Making Thumbs...') + loading.Forward('Making Thumbs...') setTimeout(() => { sharp(url).resize(225, 315).jpeg().toFile(`${dirUL}/thumbs/${image}.jpg`).then(() => { - loading.forward() - loading.hide() + loading.Forward() + loading.Close() PopAlert('Thumbs Made Successfuly.') const comic_thumb_optimize_btn = document.getElementById('c-a-p-o-t') comic_thumb_optimize_btn.setAttribute('class', 'warning-action') comic_thumb_optimize_btn.innerText = 'ReMake Thumb' PageManager.Reload() - keydownEventIndex = keyEvents + KeyManager.BackwardCategory() }).catch(err => { - loading.forward() - loading.hide() + loading.Forward() + loading.Close() error('MakeThumb: '+err) PageManager.Reload() - keydownEventIndex = keyEvents + KeyManager.BackwardCategory() }) }, 10) } else { - loading.hide() + loading.Close() error("Image Not Found, Comic: "+doc.n) PageManager.Reload() - keydownEventIndex = keyEvents + KeyManager.BackwardCategory() } }, 10) }) diff --git a/JS/setting.js b/JS/setting.js index d94a36e..e45f862 100644 --- a/JS/setting.js +++ b/JS/setting.js @@ -62,7 +62,7 @@ function setLuanchTimeSettings(reloadSettingPanel) { function saveSetting(justSave) { let reload = false if (justSave == false) { - keydownEventIndex = null + KeyManager.ChangeCategory(null) const style = document.documentElement.style const waiting_quality = Number(document.getElementById('s_waiting_quality').getAttribute('value')) const lazy_loading = document.getElementById('s_lazy_loading').checked @@ -125,14 +125,14 @@ function saveSetting(justSave) { if (!Downloader.HasDownload()) ThisWindow.reload() else PopAlert('You cannot Change Saving Location when downloading.', 'danger') } else { - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') document.getElementById('setting-panel').style.display = 'none' document.getElementById('main').style.display = 'flex' } } function openSetting() { - keydownEventIndex = 4 + KeyManager.ChangeCategory('setting') const panel = document.getElementById('setting-panel') panel.style.display = 'block' panel.scrollTop = 0 @@ -142,7 +142,7 @@ function openSetting() { function closeSetting() { document.getElementById('setting-panel').style.display = 'none' setLuanchTimeSettings(true) - keydownEventIndex = 0 + KeyManager.ChangeCategory('default') document.getElementById('main').style.display = 'flex' } @@ -177,25 +177,4 @@ function BackUp(filename = null, callback = null) { if (callback != null) callback() else PopAlert('Backup Finished') }, 1) -} - -// Key Events -function SettingKeyEvents(ctrl,shift,key) { - if (ctrl) { - if (!shift) { - switch (key) { - case 83: - saveSetting(false) - break - } - } - } else { - if (!shift) { - switch (key) { - case 27: - closeSetting() - break - } - } - } } \ No newline at end of file diff --git a/JS/startup.js b/JS/startup.js index 37e3630..78859b4 100644 --- a/JS/startup.js +++ b/JS/startup.js @@ -10,7 +10,7 @@ function test() { function AfterDatabaseDoneOnStartup() { try { - loading.forward('Set Settings...') + loading.Forward('Set Settings...') setLuanchTimeSettings(false) } catch(err) { error("Startup->SetLuanchSetting->Err: "+err) @@ -18,7 +18,7 @@ function AfterDatabaseDoneOnStartup() { } try { - loading.forward('Set Sites...') + loading.Forward('Set Sites...') SetSite() } catch(err) { error("Startup->SetSites->Err: "+err) @@ -26,7 +26,7 @@ function AfterDatabaseDoneOnStartup() { } try { - loading.forward('Load Comics...') + loading.Forward('Load Comics...') PageManager.Load(1) } catch(err) { error("Startup->LoadComics->Err: "+err) @@ -34,9 +34,10 @@ function AfterDatabaseDoneOnStartup() { } try { - loading.forward() + loading.Forward() document.getElementById('main').style.display = 'flex' - loading.hide() + loading.Close() + KeyManager.ChangeCategory('default') } catch(err) { error("Startup->HideLoading->Err: "+err) console.error(err) @@ -77,7 +78,7 @@ function makeSubFolder(sfComicsDoc, sfLength, index) { if (!fs.existsSync(subFolder)) fs.mkdirSync(subFolder) if(typeof formats[0] === "undefined") { - loading.forward(`Making SubFolders (${index + 1}/${sfLength})`) + loading.Forward(`Making SubFolders (${index + 1}/${sfLength})`) setTimeout(() => { makeSubFolder(sfComicsDoc, sfLength, index + 1) }, 1) @@ -106,7 +107,7 @@ function makeSubFolder(sfComicsDoc, sfLength, index) { } } - loading.forward(`Making SubFolders (${index + 1}/${sfLength})`) + loading.Forward(`Making SubFolders (${index + 1}/${sfLength})`) if (index + 1 == sfLength) { UpdateIndex(2, true) @@ -119,7 +120,7 @@ function makeSubFolder(sfComicsDoc, sfLength, index) { } document.addEventListener("DOMContentLoaded", () => { - loading.show('Getting Setting...', '#fff', '#222') + loading.Show(10, 'Getting Setting...') try { ChangeSizes() } catch(err) { @@ -135,7 +136,7 @@ document.addEventListener("DOMContentLoaded", () => { } try { - loading.forward('Getting Directories...') + loading.Forward('Getting Directories...') GetDirection() } catch(err) { error("Startup->GetDirections->Err: "+err) @@ -143,7 +144,7 @@ document.addEventListener("DOMContentLoaded", () => { } try { - loading.forward('Creating Databases...') + loading.Forward('Creating Databases...') CreateDatabase() } catch(err) { error("Startup->CreateDatabase->Err: "+err) @@ -151,7 +152,7 @@ document.addEventListener("DOMContentLoaded", () => { } try { - loading.forward('Checking Settings...') + loading.Forward('Checking Settings...') CheckSettings() } catch(err) { error("Startup->CheckSettings->Err: "+err) @@ -159,7 +160,7 @@ document.addEventListener("DOMContentLoaded", () => { } try { - loading.forward('Set Window Event...') + loading.Forward('Set Window Event...') window.onresize = () => { updateTabSize(); ChangeSizes() } tabsContainer.addEventListener('contextmenu', e => { @@ -176,28 +177,24 @@ document.addEventListener("DOMContentLoaded", () => { } try { - window.addEventListener('click', () => { - browserTabMenu.style.display = 'none' - browserPasteMenu.style.display = 'none' - }) - window.addEventListener('keydown', e => { - if (keydownEventIndex != null) eval(keydownEvents[keydownEventIndex].replace('{ctrl}', e.ctrlKey).replace('{shift}', e.shiftKey).replace('{key}', e.which)) - }) + loading.Forward("SetHotKeys..") + SetHotKeys() } catch(err) { - error("Startup->SetClickEvents->Err: "+err) - console.error(err) + console.log(err) + error("Startup->SettingHotKeys->ERR::"+err) } try { - window.addEventListener('keydown', e => { - if (!e.ctrlKey && !e.shiftKey && e.keyCode == 122) ChangeScreenMode() + window.addEventListener('click', () => { + browserTabMenu.style.display = 'none' + browserPasteMenu.style.display = 'none' }) } catch(err) { - error("Startup->SetFullScreenEvents->Err: "+err) + error("Startup->SetClickEvents->Err: "+err) console.error(err) } - loading.forward('Checking SubFolder...') + loading.Forward('Checking SubFolder...') const IndexLoadCheck = () => { if (indexDB.length < 3) { setTimeout(IndexLoadCheck, 250); return } for (let i = 0; i < indexDB.length; i++) if (indexDB[i] == undefined) { setTimeout(IndexLoadCheck, 250); return } @@ -215,8 +212,7 @@ document.addEventListener("DOMContentLoaded", () => { AfterDatabaseDoneOnStartup() } else { const sfLength = doc.length - loading.reset(sfLength) - loading.show(`Making SubFolders (0/${sfLength})`) + loading.Show(sfLength, `Making SubFolders (0/${sfLength})`) setTimeout(() => { makeSubFolder(doc, sfLength, 0) }, 100) } }) diff --git a/index.html b/index.html index 04e8264..d19a9d9 100644 --- a/index.html +++ b/index.html @@ -10,9 +10,11 @@ + + + - + @@ -88,12 +91,12 @@
If you found any bug Please Write it In Comments!
-If you have any suggestion Please Write it In Comments or Email Me! Thank you ;)
-If you have any question about Project Like What's going on, Tell Me! (mehdi.enayatzadeh83@gmail.com)
If you found any bugs Please Write them In the Comments!
+If you have any suggestions Please Write them In the Comments or Email Me! Thank you ;)
+If you have any questions about Project Like What's going on, Tell Me! (mehdi.enayatzadeh83@gmail.com)