From c2ca78acae103469f01da9564dbe43019f43061a Mon Sep 17 00:00:00 2001 From: Tiger Oakes Date: Sat, 3 Feb 2024 16:24:20 -0800 Subject: [PATCH] Formatting pass --- editor.html | 2 +- index.html | 2 +- package.json | 6 ++++-- public/css/editor.css | 6 +++++- public/css/viewer.css | 26 +++++++++++++++++++++----- settings.html | 2 +- src/editor/canvas.js | 4 ++-- src/editor/export.js | 2 +- src/editor/layer.js | 2 +- src/editor/main.js | 14 +++++++------- src/viewer/dialog.js | 2 +- src/viewer/libs.js | 2 +- src/viewer/upload-icon.js | 8 ++++---- tsconfig.json | 6 +++--- vite.config.js | 2 +- 15 files changed, 54 insertions(+), 32 deletions(-) diff --git a/editor.html b/editor.html index 5f76cb9..1dc93ad 100644 --- a/editor.html +++ b/editor.html @@ -1,4 +1,4 @@ - + diff --git a/index.html b/index.html index 5f78ce1..4ef00ee 100644 --- a/index.html +++ b/index.html @@ -1,4 +1,4 @@ - + diff --git a/package.json b/package.json index 294ccaf..ab6e825 100644 --- a/package.json +++ b/package.json @@ -3,8 +3,10 @@ "private": true, "type": "module", "scripts": { - "lint": "prettier . --ignore-path .gitignore --check && eslint . --ignore-path .gitignore", - "format": "prettier . --ignore-path .gitignore --write && eslint . --ignore-path .gitignore --fix", + "lint": "prettier . --ignore-path .gitignore --check", + "postlint": "eslint . --ignore-path .gitignore", + "format": "prettier . --ignore-path .gitignore --write", + "postformat": "eslint . --ignore-path .gitignore --fix", "test": "npm run check && vitest", "check": "tsc --noEmit", "dev": "vite", diff --git a/public/css/editor.css b/public/css/editor.css index ecc6e7a..3b06fd8 100644 --- a/public/css/editor.css +++ b/public/css/editor.css @@ -86,7 +86,11 @@ input.focus + label.button--secondary { linear-gradient(45deg, transparent 75%, rgba(0, 0, 0, 0.2) 75%), linear-gradient(-45deg, transparent 75%, rgba(0, 0, 0, 0.2) 75%); background-size: 16px 16px; - background-position: 0 0, 0 8px, 8px -8px, -8px 0px; + background-position: + 0 0, + 0 8px, + 8px -8px, + -8px 0px; } .layer__preview--mask { background-image: none; diff --git a/public/css/viewer.css b/public/css/viewer.css index fcd98dd..e58fb22 100644 --- a/public/css/viewer.css +++ b/public/css/viewer.css @@ -8,8 +8,18 @@ body { margin: 0; min-height: calc(100vh - 1rem); /* Not sure why this works (: */ - font-family: 'Lato', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, - Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + font-family: + 'Lato', + -apple-system, + BlinkMacSystemFont, + 'Segoe UI', + Roboto, + Oxygen, + Ubuntu, + Cantarell, + 'Open Sans', + 'Helvetica Neue', + sans-serif; color: var(--text-color); background: var(--background); text-align: center; @@ -178,12 +188,16 @@ input:focus + label.button--primary, input.focus + label.button--primary input:focus + label.button--secondary, input.focus + label.button--secondary { background: #ffbf1d; - box-shadow: 0 1px 2px #3c40434d, 0 1px 3px 1px #3c404326; + box-shadow: + 0 1px 2px #3c40434d, + 0 1px 3px 1px #3c404326; } .button--primary:active, .button--secondary:active { background: #ffd567; - box-shadow: 0 1px 2px #3c40434d, 0 2px 6px 2px #3c404326; + box-shadow: + 0 1px 2px #3c40434d, + 0 2px 6px 2px #3c404326; } .button__row { @@ -339,7 +353,9 @@ input.focus + label.button--secondary { border-radius: 0px; -webkit-clip-path: inset(10% round 50%); clip-path: inset(10% round 50%); - transition: clip-path 0.3s ease, -webkit-clip-path 0.3s ease; + transition: + clip-path 0.3s ease, + -webkit-clip-path 0.3s ease; } .icon { transform: none; diff --git a/settings.html b/settings.html index dca3097..a373cbd 100644 --- a/settings.html +++ b/settings.html @@ -1,4 +1,4 @@ - + diff --git a/src/editor/canvas.js b/src/editor/canvas.js index d55723f..c964e25 100644 --- a/src/editor/canvas.js +++ b/src/editor/canvas.js @@ -94,7 +94,7 @@ export async function toUrl(canvas, blob) { if (blob && canvas.toBlob) { /** @type {Blob | null} */ const blob = await new Promise((resolve) => - canvas.toBlob(resolve, 'image/png') + canvas.toBlob(resolve, 'image/png'), ); return URL.createObjectURL(blob); } else { @@ -187,7 +187,7 @@ export class CanvasController { layer, canvases.map(({ canvas, size }) => { return { canvas, size, ctx: canvas.getContext('2d') }; - }) + }), ); this.draw(layer); } diff --git a/src/editor/export.js b/src/editor/export.js index dd114af..635bc67 100644 --- a/src/editor/export.js +++ b/src/editor/export.js @@ -60,7 +60,7 @@ async function download(controller) { if (url.startsWith('blob:')) { URL.revokeObjectURL(url); } - }) + }), ); try { diff --git a/src/editor/layer.js b/src/editor/layer.js index 122ac5d..a141779 100644 --- a/src/editor/layer.js +++ b/src/editor/layer.js @@ -25,7 +25,7 @@ export async function layersFromFiles(files) { const layer = createLayer('#ffffff', img); layer.name = file.name; return layer; - }) + }), ); } diff --git a/src/editor/main.js b/src/editor/main.js index f7e676d..35c364b 100644 --- a/src/editor/main.js +++ b/src/editor/main.js @@ -26,7 +26,7 @@ const template = document.querySelector('.layer__template'); const options = document.querySelector('.options'); /** @type {NodeListOf} */ const canvasContainers = document.querySelectorAll( - '.icon__mask, .icon__original' + '.icon__mask, .icon__original', ); /** @type {import("./history.js").History} */ @@ -53,13 +53,13 @@ function createCanvases(preview) { /** @type {HTMLCanvasElement} */ const backgroundPreview = document.querySelector( - '.layer__preview--background' + '.layer__preview--background', ); const canvases = createCanvases(backgroundPreview); layers.set( document.querySelector('input[name="layer"][value="background"'), - background + background, ); const newLayer = copyLayer(background); @@ -67,7 +67,7 @@ function createCanvases(preview) { history = new History( newLayer, document.querySelector('input[name="layer"][value="background"'), - 0 + 0, ); controller.add(background, canvases); @@ -305,18 +305,18 @@ if (window.EyeDropper) { for (const element of document.querySelectorAll('.toggle--layers')) { element.addEventListener('click', () => - document.body.classList.toggle('open') + document.body.classList.toggle('open'), ); } { const exportDialog = new DialogManager( - document.querySelector('.export-dialog') + document.querySelector('.export-dialog'), ); const lazyLoadSetup = lazy(() => import('./export.js').then(({ setupExportDialog }) => { exportDialog.setupContent = () => setupExportDialog(controller); - }) + }), ); for (const element of document.querySelectorAll('.toggle--export')) { diff --git a/src/viewer/dialog.js b/src/viewer/dialog.js index ad605f7..af6907b 100644 --- a/src/viewer/dialog.js +++ b/src/viewer/dialog.js @@ -12,7 +12,7 @@ export class DialogManager { * Title of the dialog, will be focused on when dialog is opened. */ this.title = dialog.querySelector( - `#${dialog.getAttribute('aria-labelledby')}` + `#${dialog.getAttribute('aria-labelledby')}`, ); /** * @type {NodeListOf} diff --git a/src/viewer/libs.js b/src/viewer/libs.js index 50af34c..866d9f2 100644 --- a/src/viewer/libs.js +++ b/src/viewer/libs.js @@ -42,6 +42,6 @@ if (document.monetization && ad) { } document.monetization.addEventListener( 'monetizationstart', - onMonetizationStart + onMonetizationStart, ); } diff --git a/src/viewer/upload-icon.js b/src/viewer/upload-icon.js index d7544c9..5cdf421 100644 --- a/src/viewer/upload-icon.js +++ b/src/viewer/upload-icon.js @@ -82,25 +82,25 @@ if (fileInput) { fileInput.addEventListener( 'change', () => updateDisplayedIcon(fileInput.files[0]), - pas + pas, ); // Update the displayed icon when a file is dropped in fileDrop.addEventListener( 'filedrop', (evt) => updateDisplayedIcon(evt.files[0]), - pas + pas, ); // File input focus polyfill for Firefox fileInput.addEventListener( 'focus', () => fileInput.classList.add('focus'), - pas + pas, ); fileInput.addEventListener( 'blur', () => fileInput.classList.remove('focus'), - pas + pas, ); } diff --git a/tsconfig.json b/tsconfig.json index 77fd10b..0eac1d3 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -5,7 +5,7 @@ "tests/**/*", "src/missing-types.d.ts", "*.mjs", - "*.cjs" + "*.cjs", ], "compilerOptions": { "allowJs": true, @@ -20,6 +20,6 @@ "noEmit": true, "baseUrl": ".", "types": ["node", "vite/client", "vite-plugin-pwa/client"], - "lib": ["dom", "dom.iterable", "es2015", "es2018.promise"] - } + "lib": ["dom", "dom.iterable", "es2015", "es2018.promise"], + }, } diff --git a/vite.config.js b/vite.config.js index 830bb05..e49551e 100644 --- a/vite.config.js +++ b/vite.config.js @@ -33,7 +33,7 @@ export default defineConfig({ }, }), webfont( - 'https://fonts.googleapis.com/css2?family=Lato:wght@400;900&display=swap' + 'https://fonts.googleapis.com/css2?family=Lato:wght@400;900&display=swap', ), pwa({ manifest: false,