From 0789fd3ae1351db0b7a12859ce989391aafff789 Mon Sep 17 00:00:00 2001 From: ThatOneCalculator Date: Wed, 6 Jul 2022 21:24:39 -0700 Subject: [PATCH] Flush style --- packages/backend/src/server/web/error.css | 98 ------------------- packages/backend/src/server/web/flush.css | 16 +++ .../backend/src/server/web/views/flush.pug | 76 +++++++------- 3 files changed, 55 insertions(+), 135 deletions(-) delete mode 100644 packages/backend/src/server/web/error.css create mode 100644 packages/backend/src/server/web/flush.css diff --git a/packages/backend/src/server/web/error.css b/packages/backend/src/server/web/error.css deleted file mode 100644 index 9f8f90501..000000000 --- a/packages/backend/src/server/web/error.css +++ /dev/null @@ -1,98 +0,0 @@ -* { - font-family: BIZ UDGothic, Roboto, HelveticaNeue, Arial, sans-serif; -} - -body, -html { - background-color: #222; - color: #dfddcc; - justify-content: center; - margin: auto; - width: 80%; - padding: 10px; - text-align: center; -} - -button { - border-radius: 999px; - padding: 0px 12px 0px 12px; - border: none; - cursor: pointer; - margin-bottom: 12px; -} - -.button-big { - background: linear-gradient(90deg, rgb(134, 179, 0), rgb(74, 179, 0)); - line-height: 50px; -} - -.button-big:hover { - background: rgb(153, 204, 0); -} - -.button-small { - background: #444; - line-height: 40px; -} - -.button-small:hover { - background: #555; -} - -.button-label-big { - color: #222; - font-weight: bold; - font-size: 20px; - padding: 12px; -} - -.button-label-small { - color: rgb(153, 204, 0); - font-size: 16px; - padding: 12px; -} - -a { - color: rgb(134, 179, 0); - text-decoration: none; -} - -p, -li { - font-size: 16px; -} - -.dont-worry, -#msg { - font-size: 18px; -} - -.icon-warning { - color: #dec340; - height: 4rem; -} - -h1 { - font-size: 32px; -} - -code { - font-family: Fira, FiraCode, monospace; -} - -details { - background: #333; - margin-bottom: 2rem; - padding: 0.5rem 1rem; - border-radius: 5px; - justify-content: center; - margin: auto; -} - -summary { - cursor: pointer; -} - -summary > * { - display: inline; -} diff --git a/packages/backend/src/server/web/flush.css b/packages/backend/src/server/web/flush.css new file mode 100644 index 000000000..6610eb466 --- /dev/null +++ b/packages/backend/src/server/web/flush.css @@ -0,0 +1,16 @@ +* { + font-family: BIZ UDGothic, Roboto, HelveticaNeue, Arial, sans-serif; +} +body, +html { + background-color: #222; + color: #dfddcc; + justify-content: center; + margin: auto; + padding: 10px; + text-align: center; +} +a { + color: rgb(134, 179, 0); + text-decoration: none; +} diff --git a/packages/backend/src/server/web/views/flush.pug b/packages/backend/src/server/web/views/flush.pug index b08f61c73..4aa5700b4 100644 --- a/packages/backend/src/server/web/views/flush.pug +++ b/packages/backend/src/server/web/views/flush.pug @@ -6,48 +6,50 @@ html meta(name='application-name' content='Misskey') title Flushing Misskey style - include ../error.css - #msg - script. - const msg = document.getElementById('msg'); - const successText = `\nSuccess Flush! Back to Misskey\n成功しました。Misskeyを開き直してください。`; + include ../flush.css - message('Start flushing.'); + body + #msg + script. + const msg = document.getElementById('msg'); + const successText = `\nSuccess Flush! Back to Misskey\n成功しました。Misskeyを開き直してください。`; - (async function() { - try { - localStorage.clear(); - message('localStorage cleared.'); + message('Start flushing.'); - const idbPromises = ['MisskeyClient', 'keyval-store'].map((name, i, arr) => new Promise((res, rej) => { - const delidb = indexedDB.deleteDatabase(name); - delidb.onsuccess = () => res(message(`indexedDB "${name}" cleared. (${i + 1}/${arr.length})`)); - delidb.onerror = e => rej(e) - })); + (async function() { + try { + localStorage.clear(); + message('localStorage cleared.'); - await Promise.all(idbPromises); + const idbPromises = ['MisskeyClient', 'keyval-store'].map((name, i, arr) => new Promise((res, rej) => { + const delidb = indexedDB.deleteDatabase(name); + delidb.onsuccess = () => res(message(`indexedDB "${name}" cleared. (${i + 1}/${arr.length})`)); + delidb.onerror = e => rej(e) + })); - if (navigator.serviceWorker.controller) { - navigator.serviceWorker.controller.postMessage('clear'); - await navigator.serviceWorker.getRegistrations() - .then(registrations => { - return Promise.all(registrations.map(registration => registration.unregister())); - }) - .catch(e => { throw Error(e) }); + await Promise.all(idbPromises); + + if (navigator.serviceWorker.controller) { + navigator.serviceWorker.controller.postMessage('clear'); + await navigator.serviceWorker.getRegistrations() + .then(registrations => { + return Promise.all(registrations.map(registration => registration.unregister())); + }) + .catch(e => { throw Error(e) }); + } + + message(successText); + } catch (e) { + message(`\n${e}\n\nFlush Failed. Please retry.\n失敗しました。もう一度試してみてください。`); + message(`\nIf you retry more than 3 times, clear the browser cache or contact to instance admin.\n3回以上試しても失敗する場合、ブラウザのキャッシュを消去し、それでもだめならインスタンス管理者に連絡してみてください。\n`) + + console.error(e); + setTimeout(() => { + location = '/'; + }, 10000) } + })(); - message(successText); - } catch (e) { - message(`\n${e}\n\nFlush Failed. Please retry.\n失敗しました。もう一度試してみてください。`); - message(`\nIf you retry more than 3 times, clear the browser cache or contact to instance admin.\n3回以上試しても失敗する場合、ブラウザのキャッシュを消去し、それでもだめならインスタンス管理者に連絡してみてください。\n`) - - console.error(e); - setTimeout(() => { - location = '/'; - }, 10000) + function message(text) { + msg.insertAdjacentHTML('beforeend', `

[${(new Date()).toString()}] ${text.replace(/\n/g,'
')}

`) } - })(); - - function message(text) { - msg.insertAdjacentHTML('beforeend', `

[${(new Date()).toString()}] ${text.replace(/\n/g,'
')}

`) - }