From 0e302015020ac48b1b89b5c39b648f4acaef872d Mon Sep 17 00:00:00 2001 From: 0xf8 <0xf8.dev@proton.me> Date: Wed, 1 Mar 2023 22:29:18 -0500 Subject: [PATCH] Fix popout alignment, gzip local storage cache array, add file watcher Signed-off-by: 0xf8 <0xf8.dev@proton.me> --- srv/package.json | 1 - srv/src/sync.ts | 29 +++++++++++++------- web/package.json | 11 +++++--- web/www/gallery.html.scss | 57 ++------------------------------------- web/www/index.html | 4 ++- web/www/settings.ts | 13 ++++++--- 6 files changed, 42 insertions(+), 73 deletions(-) diff --git a/srv/package.json b/srv/package.json index d94150c..9d21220 100644 --- a/srv/package.json +++ b/srv/package.json @@ -4,7 +4,6 @@ "main": "dist/server.js", "types": "dist/types.d.ts", "version": "0.0.0", - "license": "GLP-3.0-only", "scripts": { "dev": "npx parcel watch & npx nodemon dist/server.js", "build": "npx parcel build" diff --git a/srv/src/sync.ts b/srv/src/sync.ts index afbbef0..5975b90 100644 --- a/srv/src/sync.ts +++ b/srv/src/sync.ts @@ -10,7 +10,7 @@ You should have received a copy of the GNU General Public License along with Gal import { createHash } from "crypto"; import { Request, Response } from "express"; -import { readdirSync, existsSync, mkdirSync, statSync, readFileSync } from "fs"; +import { readdirSync, existsSync, mkdirSync, statSync, readFileSync, watch } from "fs"; import path from "path"; class Sync { @@ -35,7 +35,7 @@ class Sync { await this.update(); res(); } - }) + }); let c = createHash("sha1"); @@ -61,25 +61,36 @@ class Sync { pastchecksum: string[]; } + const state: Sync = new Sync(); +let lastUpdate = Date.now(); +watch(state.root, {}, (e, f) => { + let now = Date.now(); + + // If lastUpdate occured within 1 second + if (now - lastUpdate < 1000) { + lastUpdate = now; + return; + } + + lastUpdate = now; + state.update(); +}); + + let sync = async (req: Request, res: Response) => { try { switch (req.method) { case "GET": { // "Update me" res.status(405); - - // await state.update(); - // res.write(JSON.stringify({ - // checksum: state.checksum, - // files: state.files - // })); + break; } case "POST": { await state.update(); - let reqd; + let reqd: { action: string; checksum: string; }; try { reqd = JSON.parse(req.body); diff --git a/web/package.json b/web/package.json index 72a5ef3..5d3ff35 100644 --- a/web/package.json +++ b/web/package.json @@ -6,15 +6,21 @@ "www/settings.html" ], "version": "0.0.0", - "license": "GLP-3.0-only", + "license": "GPL-3.0-only", "scripts": { "dev": "npx parcel serve", "build": "npx parcel build" }, "devDependencies": { "@parcel/transformer-sass": "2.8.0", + "assert": "^2.0.0", + "browserify-zlib": "^0.2.0", + "buffer": "^5.5.0", + "events": "^3.1.0", "parcel": "latest", - "process": "^0.11.10" + "process": "^0.11.10", + "stream-browserify": "^3.0.0", + "util": "^0.12.3" }, "dependencies": { "@fortawesome/fontawesome-svg-core": "^6.2.0", @@ -31,6 +37,5 @@ "react": "^18.2.0", "react-dom": "^18.2.0" }, - "license": "GPL-3.0-only", "sourceMap": false } diff --git a/web/www/gallery.html.scss b/web/www/gallery.html.scss index bd28304..7185f1f 100644 --- a/web/www/gallery.html.scss +++ b/web/www/gallery.html.scss @@ -91,7 +91,6 @@ span#title { width: 100vw; justify-content: center; - align-content: center; z-index: 999; @@ -99,59 +98,7 @@ span#title { display: block; object-fit: contain; - border-radius: 8px; - } - - .contextmenu { - position: fixed; - display: flex; - - flex-direction: column; - padding: .4em 1em; - - justify-content: center; - align-items: center; - - background-color: rgba(0, 0, 0, 0.7); - - border: 2px rgba(0, 0, 0, 0.9) solid; - border-radius: 8px; - - max-width: 18vw; - - height: max-content; - width: max-content; - - hr { - width: 5em; - background-color: rgba(255, 255, 255, 0.5); - } - - :first-child { - font-weight: 600; - margin-bottom: .5em; - } - - :last-child { - margin-top: .4em; - } - - .option { - font-size: .9em; - - width: fit-content; - height: auto; - - border: 3px transparent solid; - background: transparent; - color: white; - - border-radius: 6px; - } - - .option:hover { - color: black; - background: white; - } + border-radius: 12px; + align-self: center; } } \ No newline at end of file diff --git a/web/www/index.html b/web/www/index.html index 283c663..1a7c99e 100644 --- a/web/www/index.html +++ b/web/www/index.html @@ -18,7 +18,9 @@ You should have received a copy of the GNU General Public License along with Gal - + + + diff --git a/web/www/settings.ts b/web/www/settings.ts index 67e4064..21092b3 100644 --- a/web/www/settings.ts +++ b/web/www/settings.ts @@ -8,7 +8,9 @@ Galerie is distributed in the hope that it will be useful, but WITHOUT ANY WARRA You should have received a copy of the GNU General Public License along with Galerie. If not, see . */ -let apiUrl: string = `${ location.protocol }//${location.hostname}:8856/`; +import { gzipSync, gunzipSync } from "zlib"; + +let apiUrl: string = `${location.protocol}//${location.hostname}:8856/`; class Favorites { private data: string[] = []; @@ -115,7 +117,10 @@ class Cache { async load(): Promise { console.log("Loading cache"); - this.cache = JSON.parse(localStorage.getItem("cache")) || []; + if (localStorage.getItem("cache")) + this.cache = JSON.parse(gunzipSync(Buffer.from(localStorage.getItem("cache"), "base64")).toString()); + else + this.cache = []; this.checksum = localStorage.getItem("cache.checksum"); if (!this.cache || !this.checksum) { @@ -152,7 +157,7 @@ class Cache { } private async update(): Promise { - localStorage.setItem("cache", JSON.stringify(this.cache)); + localStorage.setItem("cache", gzipSync(JSON.stringify(this.cache)).toString("base64")); localStorage.setItem("cache.checksum", this.checksum); } @@ -210,7 +215,7 @@ class Config { if (!localStorage.getItem("config")) localStorage.setItem("config", JSON.stringify(this.defaultConfig)); - + this.data = JSON.parse(localStorage.getItem("config")); this.verify();