From 9a8e23eb1ca77a74b2e63d1e5942c3f54013ebaf Mon Sep 17 00:00:00 2001 From: Russell2259 Date: Wed, 3 Jan 2024 20:48:45 +0000 Subject: [PATCH] stuff --- server/index.js | 10 ++- static/assets/css/main.css | 68 ++++++++++++++----- static/assets/js/settings.js | 123 ++++++++++++----------------------- static/assets/js/utils.js | 7 +- templates/sidebar.html | 10 ++- 5 files changed, 116 insertions(+), 102 deletions(-) diff --git a/server/index.js b/server/index.js index 5da3cb1..40353c8 100644 --- a/server/index.js +++ b/server/index.js @@ -23,6 +23,14 @@ const swPaths = [ '/assets/js/offline.js' ]; +app.get('/api/favicon', async (req, res) => { + const request = await fetch(`https://www.google.com/s2/favicons?domain=${req.query.domain}`); + const imageBuffer = Buffer.from(await request.arrayBuffer()); + + res.setHeader('content-type', request.headers.get('content-type')); + res.end(imageBuffer); +}); + app.get('/api/games', (req, res) => { /** * @type {Array.<{name: string, target: string, image: string, popular: boolean}>} @@ -304,4 +312,4 @@ server.on('upgrade', (req, socket, head) => { else socket.end(); }); -server.listen(port, () => console.log(`Polaris running\n\nPort: ${server.address().port}\nMode: ${mode}\nNode.js: ${process.version}`)); \ No newline at end of file +server.listen(port, () => console.log(`Polaris running\n\nPort: ${server.address().port}\nMode: ${mode === 'dev' ? 'development' : 'production'}\nNode.js: ${process.version}`)); \ No newline at end of file diff --git a/static/assets/css/main.css b/static/assets/css/main.css index 81a68f0..439f24e 100644 --- a/static/assets/css/main.css +++ b/static/assets/css/main.css @@ -1,10 +1,10 @@ @import url('https://site-assets.fontawesome.com/releases/v6.5.1/css/all.css'); -@import url('./fonts.css'); -@import url('./themes.css'); -@import url('./nav.css'); -@import url('./sidebar.css'); @import url('./dropdown.css'); +@import url('./sidebar.css'); @import url('./footer.css'); +@import url('./themes.css'); +@import url('./fonts.css'); +@import url('./nav.css'); * { font-family: 'Lato'; @@ -153,7 +153,7 @@ button { background-color: var(--button-bg); color: var(--text); transition: 0.5s; - font-size: 20px; + font-size: 2.3vh; font-family: 'Lato'; padding: 5px; padding-left: 10px; @@ -599,6 +599,7 @@ img.featured:hover { } @keyframes beat { + 0%, 50%, 100% { @@ -607,6 +608,7 @@ img.featured:hover { -ms-transform: translate(-50%, -50%) scale(1.25, 1.25) rotate(-5deg); transform: translate(-50%, -50%) scale(1.25, 1.25) rotate(-5deg); } + 30%, 80% { top: 50%; @@ -617,15 +619,47 @@ img.featured:hover { } @keyframes shake { - 0% { transform: translate(1px, 1px) rotate(0deg); } - 10% { transform: translate(-1px, -2px) rotate(-1deg); } - 20% { transform: translate(-3px, 0px) rotate(1deg); } - 30% { transform: translate(3px, 2px) rotate(0deg); } - 40% { transform: translate(1px, -1px) rotate(1deg); } - 50% { transform: translate(-1px, 2px) rotate(-1deg); } - 60% { transform: translate(-3px, 1px) rotate(0deg); } - 70% { transform: translate(3px, 1px) rotate(-1deg); } - 80% { transform: translate(-1px, -1px) rotate(1deg); } - 90% { transform: translate(1px, 2px) rotate(0deg); } - 100% { transform: translate(1px, -2px) rotate(-1deg); } - } \ No newline at end of file + 0% { + transform: translate(1px, 1px) rotate(0deg); + } + + 10% { + transform: translate(-1px, -2px) rotate(-1deg); + } + + 20% { + transform: translate(-3px, 0px) rotate(1deg); + } + + 30% { + transform: translate(3px, 2px) rotate(0deg); + } + + 40% { + transform: translate(1px, -1px) rotate(1deg); + } + + 50% { + transform: translate(-1px, 2px) rotate(-1deg); + } + + 60% { + transform: translate(-3px, 1px) rotate(0deg); + } + + 70% { + transform: translate(3px, 1px) rotate(-1deg); + } + + 80% { + transform: translate(-1px, -1px) rotate(1deg); + } + + 90% { + transform: translate(1px, 2px) rotate(0deg); + } + + 100% { + transform: translate(1px, -2px) rotate(-1deg); + } +} \ No newline at end of file diff --git a/static/assets/js/settings.js b/static/assets/js/settings.js index 426538e..8270bb7 100644 --- a/static/assets/js/settings.js +++ b/static/assets/js/settings.js @@ -1,80 +1,87 @@ +import { isScrollable, storage } from './utils.js'; import PolarisError from './error.js'; import Theme from './themes.js'; -const isScrollable = (element) => element.scrollWidth > element.clientWidth || element.scrollHeight > element.clientHeight; +const settingsStorage = storage('settings'); class Settings { constructor() { - if (this.get('panic_key')) document.querySelector('#panic_key').value = this.get('panic_key'); - if (this.get('panic_url')) document.querySelector('#panic_url').value = this.get('panic_url'); + if (settingsStorage.get('panic_key')) document.querySelector('#panic_key').value = settingsStorage.get('panic_key'); + if (settingsStorage.get('panic_url')) document.querySelector('#panic_url').value = settingsStorage.get('panic_url'); - if (this.get('cloak')) { - document.querySelector('#cloak_select').value = this.get('cloak'); + if (settingsStorage.get('cloak')) { + document.querySelector('#cloak_select').value = settingsStorage.get('cloak'); - if (this.get('cloak') == 'custom') { + if (settingsStorage.get('cloak') == 'custom') { document.querySelector('#custom_cloak').classList.remove('hidden'); document.querySelector('#title').addEventListener('input', () => { if (document.querySelector('#title').value) { - this.set('cloak_title', document.querySelector('#title').value); + settingsStorage.set('cloak_title', document.querySelector('#title').value); + document.querySelector('title').dataset.value = document.title; document.title = document.querySelector('#title').value; - } else document.title = 'Polaris'; + } else document.title = document.querySelector('title').dataset.value; }); document.querySelector('#domain').addEventListener('input', () => { if (document.querySelector('#domain').value) { - this.set('cloak_website', document.querySelector('#domain').value); - document.querySelector('link[rel=\'shortcut icon\']').href = 'https://www.google.com/s2/favicons?domain=' + document.querySelector('#domain').value; + settingsStorage.set('cloak_website', document.querySelector('#domain').value); + document.querySelector('link[rel=\'shortcut icon\']').href = '/api/favicon?domain=' + document.querySelector('#domain').value; } else document.querySelector('link[rel=\'shortcut icon\']').href = '/favicon.ico'; }); - if (this.get('cloak_title')) { - document.querySelector('#title').value = this.get('cloak_title'); - document.title = this.get('cloak_title'); + if (settingsStorage.get('cloak_title')) { + document.querySelector('#title').value = settingsStorage.get('cloak_title'); + document.querySelector('title').dataset.value = document.title; + document.title = settingsStorage.get('cloak_title'); } - if (this.get('cloak_website')) { - document.querySelector('#domain').value = this.get('cloak_website'); - document.querySelector('link[rel=\'shortcut icon\']').href = 'https://www.google.com/s2/favicons?domain=' + this.get('cloak_website'); + if (settingsStorage.get('cloak_website')) { + document.querySelector('#domain').value = settingsStorage.get('cloak_website'); + document.querySelector('link[rel=\'shortcut icon\']').href = '/api/favicon?domain=' + settingsStorage.get('cloak_website'); } - } else fetch('/assets/JSON/cloaks.json').then(res => res.json()).then(cloaks => { - if (cloaks[this.get('cloak')]) { - document.title = cloaks[this.get('cloak')].title; - document.querySelector('link[rel=\'shortcut icon\']').href = cloaks[this.get('cloak')].icon; - } else if (this.get('cloak') !== 'none') new PolarisError(`The cloak ${this.get('cloak')} does not exist`); - }); + } else fetch('/assets/JSON/cloaks.json') + .then(res => res.json()) + .then(cloaks => { + if (cloaks[settingsStorage.get('cloak')]) { + document.title = cloaks[settingsStorage.get('cloak')].title; + document.querySelector('link[rel=\'shortcut icon\']').href = cloaks[settingsStorage.get('cloak')].icon; + } else if (settingsStorage.get('cloak') !== 'none') new PolarisError(`The cloak ${settingsStorage.get('cloak')} does not exist`); + }); } fetch('/assets/JSON/cloaks.json').then(res => res.json()).then(cloaks => { document.querySelector('#cloak_select').addEventListener('change', () => { if (document.querySelector('#cloak_select').value == 'custom') { - this.set('cloak', document.querySelector('#cloak_select').value); + settingsStorage.set('cloak', document.querySelector('#cloak_select').value); document.querySelector('#custom_cloak').classList.remove('hidden'); document.querySelector('#title').addEventListener('input', () => { if (document.querySelector('#title').value) { - this.set('cloak_title', document.querySelector('#title').value); + settingsStorage.set('cloak_title', document.querySelector('#title').value); + document.querySelector('title').dataset.value = document.title; document.title = document.querySelector('#title').value; - } else document.title = 'Polaris'; + } else document.title = document.querySelector('title').dataset.value; }); document.querySelector('#domain').addEventListener('input', () => { if (document.querySelector('#domain').value) { - this.set('cloak_website', document.querySelector('#domain').value); - document.querySelector('link[rel=\'shortcut icon\']').href = 'https://www.google.com/s2/favicons?domain=' + document.querySelector('#domain').value; + settingsStorage.set('cloak_website', document.querySelector('#domain').value); + document.querySelector('link[rel=\'shortcut icon\']').href = '/api/favicon?domain=' + document.querySelector('#domain').value; } else document.querySelector('link[rel=\'shortcut icon\']').href = '/favicon.ico'; }); } else if (document.querySelector('#cloak_select').value == 'none') { - this.set('cloak', document.querySelector('#cloak_select').value); + settingsStorage.set('cloak', document.querySelector('#cloak_select').value); - document.title = 'Polaris'; + document.title = document.querySelector('title').dataset.value; document.querySelector('link[rel=\'shortcut icon\']').href = '/favicon.ico'; document.querySelector('#custom_cloak').classList.add('hidden'); } else { if (cloaks[document.querySelector('#cloak_select').value]) { + document.querySelector('title').dataset.value = document.title; document.title = cloaks[document.querySelector('#cloak_select').value].title; document.querySelector('link[rel=\'shortcut icon\']').href = cloaks[document.querySelector('#cloak_select').value].icon; - this.set('cloak', document.querySelector('#cloak_select').value); + settingsStorage.set('cloak', document.querySelector('#cloak_select').value); } else new PolarisError(`The cloak ${document.querySelector('#cloak_select').value} does not exist`); document.querySelector('#custom_cloak').classList.add('hidden'); @@ -83,21 +90,21 @@ class Settings { }); document.querySelector('#reset_panic').addEventListener('click', (e) => { - this.set('panic_key', ''); + settingsStorage.set('panic_key', ''); document.querySelector('#panic_key').value = 'No Key Selected'; }); document.querySelector('#panic_url').addEventListener('input', (e) => { - this.set('panic_url', document.querySelector('#panic_url').value); + settingsStorage.set('panic_url', document.querySelector('#panic_url').value); }); window.onkeydown = (e) => { if (document.querySelector('#panic_key') == document.activeElement) { document.querySelector('#panic_key').value = e.key; - this.set('panic_key', document.querySelector('#panic_key').value); + settingsStorage.set('panic_key', document.querySelector('#panic_key').value); } else { - if (e.key === this.get('panic_key')) { - if (this.get('panic_url')) window.location.href = this.get('panic_url'); + if (e.key === settingsStorage.get('panic_key')) { + if (settingsStorage.get('panic_url')) window.location.href = settingsStorage.get('panic_url'); else new PolarisError('A panic key was used but no url was found.'); } } @@ -155,54 +162,10 @@ class Settings { else document.querySelector('.scroll').classList.add('active'); }); }; - - set = (name, value) => { - if (!localStorage.getItem('settings')) localStorage.setItem('settings', JSON.stringify({})); - else { - try { - JSON.parse(localStorage.getItem('settings')); - } catch (e) { - localStorage.setItem('settings', JSON.stringify({})); - } - } - - const settings = JSON.parse(localStorage.getItem('settings')); - settings[name] = value; - localStorage.setItem('settings', JSON.stringify(settings)); - }; - - get = (name) => { - if (!localStorage.getItem('settings')) localStorage.setItem('settings', JSON.stringify({})); - else { - try { - JSON.parse(localStorage.getItem('settings')); - } catch (e) { - localStorage.setItem('settings', JSON.stringify({})); - } - } - - const settings = JSON.parse(localStorage.getItem('settings')); - return settings[name]; - } - - remove = (name) => { - if (!localStorage.getItem('settings')) localStorage.setItem('settings', JSON.stringify({})); - else { - try { - JSON.parse(localStorage.getItem('settings')); - } catch (e) { - localStorage.setItem('settings', JSON.stringify({})); - } - } - - const settings = JSON.parse(localStorage.getItem('settings')); - delete settings[name]; - localStorage.setItem('settings', JSON.stringify(settings)); - } } const load = () => { new Settings(); }; -export default { load, Settings }; +export default { load, Settings }; \ No newline at end of file diff --git a/static/assets/js/utils.js b/static/assets/js/utils.js index c2bbcab..dcc0825 100644 --- a/static/assets/js/utils.js +++ b/static/assets/js/utils.js @@ -133,6 +133,7 @@ const isValidURL = (url) => /^(http(s)?:\/\/)?([\w-]+\.)+[\w]{2,}(\/.*)?$/.test( const getVH = (value) => (value * Math.max(document.documentElement.clientHeight, window.innerHeight || 0)) / 100; const getVW = (value) => (value * Math.max(document.documentElement.clientWidth, window.innerWidth || 0)) / 100; +const isScrollable = (element) => element.scrollWidth > element.clientWidth || element.scrollHeight > element.clientHeight; export default { storage, @@ -142,7 +143,8 @@ export default { createViewPage, isValidURL, getVH, - getVW + getVW, + isScrollable }; export { @@ -153,5 +155,6 @@ export { createViewPage, isValidURL, getVH, - getVW + getVW, + isScrollable }; \ No newline at end of file diff --git a/templates/sidebar.html b/templates/sidebar.html index 9563c31..fc66e57 100644 --- a/templates/sidebar.html +++ b/templates/sidebar.html @@ -7,7 +7,8 @@

Panic Key

- +
@@ -46,7 +47,12 @@ -

Export Data

+

Export/Import Data

Coming soon!

+ +
+ + +
\ No newline at end of file