diff --git a/manifest.json b/manifest.json index d88089d..0ec3a7d 100644 --- a/manifest.json +++ b/manifest.json @@ -1,7 +1,7 @@ { "name": "Furbooru Tagging Assistant", "description": "Experimental extension with a set of tools to make the tagging faster and easier. Made specifically for Furbooru.", - "version": "0.3.2", + "version": "0.3.3", "browser_specific_settings": { "gecko": { "id": "furbooru-tagging-assistant@thecore.city" diff --git a/package-lock.json b/package-lock.json index c78ff81..50cf5af 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,13 +1,14 @@ { "name": "furbooru-tagging-assistant", - "version": "0.3.2", + "version": "0.3.3", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "furbooru-tagging-assistant", - "version": "0.3.2", + "version": "0.3.3", "dependencies": { + "@fortawesome/fontawesome-free": "^6.7.1", "lz-string": "^1.5.0" }, "devDependencies": { @@ -405,6 +406,14 @@ "node": ">=12" } }, + "node_modules/@fortawesome/fontawesome-free": { + "version": "6.7.1", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.7.1.tgz", + "integrity": "sha512-ALIk/MOh5gYe1TG/ieS5mVUsk7VUIJTJKPMK9rFFqOgfp0Q3d5QiBXbcOMwUvs37fyZVCz46YjOE6IFeOAXCHA==", + "engines": { + "node": ">=6" + } + }, "node_modules/@jridgewell/gen-mapping": { "version": "0.3.3", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz", @@ -2395,6 +2404,11 @@ "dev": true, "optional": true }, + "@fortawesome/fontawesome-free": { + "version": "6.7.1", + "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-6.7.1.tgz", + "integrity": "sha512-ALIk/MOh5gYe1TG/ieS5mVUsk7VUIJTJKPMK9rFFqOgfp0Q3d5QiBXbcOMwUvs37fyZVCz46YjOE6IFeOAXCHA==" + }, "@jridgewell/gen-mapping": { "version": "0.3.3", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz", diff --git a/package.json b/package.json index 92044cd..0817b99 100644 --- a/package.json +++ b/package.json @@ -1,13 +1,13 @@ { "name": "furbooru-tagging-assistant", - "version": "0.3.2", + "version": "0.3.3", "private": true, "scripts": { "build": "npm run build:popup && npm run build:extension", "build:popup": "vite build", "build:extension": "node build-extension.js", - "check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json", - "check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch" + "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json", + "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch" }, "devDependencies": { "@sveltejs/adapter-auto": "^3.0.0", @@ -24,6 +24,7 @@ }, "type": "module", "dependencies": { + "@fortawesome/fontawesome-free": "^6.7.1", "lz-string": "^1.5.0" } } diff --git a/src/app.d.ts b/src/app.d.ts index 9b049f4..3735081 100644 --- a/src/app.d.ts +++ b/src/app.d.ts @@ -1,24 +1,31 @@ // See https://kit.svelte.dev/docs/types#app // for information about these interfaces +import MaintenanceProfile from "$entities/MaintenanceProfile.ts"; + declare global { - namespace App { - // interface Error {} - // interface Locals {} - // interface PageData {} - // interface PageState {} - // interface Platform {} - type LinkTarget = "_blank" | "_self" | "_parent" | "_top"; - type IconName = ( - "tag" - | "paint-brush" - | "arrow-left" - | "info-circle" - | "wrench" - | "globe" - | "plus" - | "file-export" - ); + namespace App { + // interface Error {} + // interface Locals {} + // interface PageData {} + // interface PageState {} + // interface Platform {} + type LinkTarget = "_blank" | "_self" | "_parent" | "_top"; + type IconName = ( + "tag" + | "paint-brush" + | "arrow-left" + | "info-circle" + | "wrench" + | "globe" + | "plus" + | "file-export" + | "trash" + ); + + interface EntityNamesMap { + profiles: MaintenanceProfile; } + } } export {}; diff --git a/src/components/maintenance/ProfileView.svelte b/src/components/maintenance/ProfileView.svelte index 7a01c62..d3084bb 100644 --- a/src/components/maintenance/ProfileView.svelte +++ b/src/components/maintenance/ProfileView.svelte @@ -1,5 +1,5 @@ + + + Back +
+
+{#if targetProfile} +

+ Do you want to remove profile "{targetProfile.settings.name}"? This action is irreversible. +

+ +
+ Yes + No +
+{:else} +

Loading...

+{/if} diff --git a/src/routes/features/maintenance/[id]/edit/+page.svelte b/src/routes/features/maintenance/[id]/edit/+page.svelte index 498671c..f87e2cb 100644 --- a/src/routes/features/maintenance/[id]/edit/+page.svelte +++ b/src/routes/features/maintenance/[id]/edit/+page.svelte @@ -8,7 +8,7 @@ import {page} from "$app/stores"; import {goto} from "$app/navigation"; import {maintenanceProfilesStore} from "$stores/maintenance-profiles-store.js"; - import MaintenanceProfile from "$entities/MaintenanceProfile.js"; + import MaintenanceProfile from "$entities/MaintenanceProfile.ts"; /** @type {string} */ let profileId = $page.params.id; @@ -46,16 +46,6 @@ await targetProfile.save(); await goto('/features/maintenance/' + targetProfile.id); } - - async function deleteProfile() { - if (!targetProfile) { - console.warn('Attempting to delete the profile, but the profile is not loaded yet.'); - return; - } - - await targetProfile.delete(); - await goto('/features/maintenance'); - } @@ -75,7 +65,4 @@
Save Profile - {#if profileId !== 'new'} - Delete Profile - {/if}
diff --git a/src/routes/features/maintenance/[id]/export/+page.svelte b/src/routes/features/maintenance/[id]/export/+page.svelte index d4e2191..ea8e2a3 100644 --- a/src/routes/features/maintenance/[id]/export/+page.svelte +++ b/src/routes/features/maintenance/[id]/export/+page.svelte @@ -7,13 +7,9 @@ import FormContainer from "$components/ui/forms/FormContainer.svelte"; import FormControl from "$components/ui/forms/FormControl.svelte"; import EntitiesTransporter from "$lib/extension/EntitiesTransporter.ts"; - import MaintenanceProfile from "$entities/MaintenanceProfile.js"; + import MaintenanceProfile from "$entities/MaintenanceProfile.ts"; const profileId = $page.params.id; - - /** - * @type {import('$lib/extension/entities/MaintenanceProfile.js').default|undefined} - */ const profile = $maintenanceProfilesStore.find(profile => profile.id === profileId); const profilesTransporter = new EntitiesTransporter(MaintenanceProfile); diff --git a/src/routes/features/maintenance/import/+page.svelte b/src/routes/features/maintenance/import/+page.svelte index 6f83c11..ad01898 100644 --- a/src/routes/features/maintenance/import/+page.svelte +++ b/src/routes/features/maintenance/import/+page.svelte @@ -2,7 +2,7 @@ import Menu from "$components/ui/menu/Menu.svelte"; import MenuItem from "$components/ui/menu/MenuItem.svelte"; import FormContainer from "$components/ui/forms/FormContainer.svelte"; - import MaintenanceProfile from "$entities/MaintenanceProfile.js"; + import MaintenanceProfile from "$entities/MaintenanceProfile.ts"; import FormControl from "$components/ui/forms/FormControl.svelte"; import ProfileView from "$components/maintenance/ProfileView.svelte"; import {maintenanceProfilesStore} from "$stores/maintenance-profiles-store.js"; diff --git a/src/stores/maintenance-profiles-store.js b/src/stores/maintenance-profiles-store.js index 792d212..95e1a70 100644 --- a/src/stores/maintenance-profiles-store.js +++ b/src/stores/maintenance-profiles-store.js @@ -1,5 +1,5 @@ import {writable} from "svelte/store"; -import MaintenanceProfile from "$lib/extension/entities/MaintenanceProfile.js"; +import MaintenanceProfile from "$entities/MaintenanceProfile.ts"; import MaintenanceSettings from "$lib/extension/settings/MaintenanceSettings.js"; /** diff --git a/src/styles/content/listing.scss b/src/styles/content/listing.scss index 7251a96..54b4496 100644 --- a/src/styles/content/listing.scss +++ b/src/styles/content/listing.scss @@ -177,6 +177,21 @@ object-fit: contain; width: 100%; height: 100%; + opacity: 1; + } + + .spinner { + position: fixed; + opacity: 0; + left: 50vw; + top: 50vh; + transform: translate(-50%, -50%); + font-size: 64px; + text-shadow: 0 0 15px black; + } + + img, video, .spinner { + transition: opacity .25s ease; } &.shown { @@ -188,4 +203,14 @@ opacity: var(--opacity, 1); transition: none; } + + &.loading { + img, video { + opacity: 0.25; + } + + .spinner { + opacity: 1; + } + } } diff --git a/src/styles/injectable/icons.scss b/src/styles/injectable/icons.scss index 7c3d1d6..3626710 100644 --- a/src/styles/injectable/icons.scss +++ b/src/styles/injectable/icons.scss @@ -1,6 +1,6 @@ -@mixin insert-icon($icon_src) { - mask-image: url($icon_src); - -webkit-mask-image: url($icon_src); +@mixin insert-icon($url) { + mask-image: $url; + -webkit-mask-image: $url; } .icon { @@ -11,33 +11,37 @@ } .icon.icon-tag { - @include insert-icon('/img/tag.svg'); + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/tag.svg')); } .icon.icon-paint-brush { - @include insert-icon('/img/paint-brush.svg'); + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/paintbrush.svg')); } .icon.icon-arrow-left { - @include insert-icon('/img/arrow-left.svg'); + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/arrow-left.svg')); } .icon.icon-info-circle { - @include insert-icon('/img/info-circle.svg'); + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/circle-info.svg')); } .icon.icon-wrench { - @include insert-icon('/img/wrench.svg'); + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/wrench.svg')); } .icon.icon-globe { - @include insert-icon('/img/globe.svg'); + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/globe.svg')); } .icon.icon-plus { - @include insert-icon('/img/plus.svg'); + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/plus.svg')); } .icon.icon-file-export { - @include insert-icon('/img/file-export.svg'); + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/file-export.svg')); +} + +.icon.icon-trash { + @include insert-icon(url('@fortawesome/fontawesome-free/svgs/solid/trash.svg')); } diff --git a/static/img/arrow-left.svg b/static/img/arrow-left.svg deleted file mode 100644 index f9f2ea7..0000000 --- a/static/img/arrow-left.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - diff --git a/static/img/file-export.svg b/static/img/file-export.svg deleted file mode 100644 index 10d1474..0000000 --- a/static/img/file-export.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/static/img/globe.svg b/static/img/globe.svg deleted file mode 100644 index b257859..0000000 --- a/static/img/globe.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - diff --git a/static/img/info-circle.svg b/static/img/info-circle.svg deleted file mode 100644 index 3336011..0000000 --- a/static/img/info-circle.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - diff --git a/static/img/paint-brush.svg b/static/img/paint-brush.svg deleted file mode 100644 index 61cd19e..0000000 --- a/static/img/paint-brush.svg +++ /dev/null @@ -1,3 +0,0 @@ - - - \ No newline at end of file diff --git a/static/img/plus.svg b/static/img/plus.svg deleted file mode 100644 index ac6edcf..0000000 --- a/static/img/plus.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - diff --git a/static/img/tag.svg b/static/img/tag.svg deleted file mode 100644 index 251b492..0000000 --- a/static/img/tag.svg +++ /dev/null @@ -1,6 +0,0 @@ - - - - - diff --git a/static/img/wrench.svg b/static/img/wrench.svg deleted file mode 100644 index c7e7ce2..0000000 --- a/static/img/wrench.svg +++ /dev/null @@ -1,5 +0,0 @@ - - - - - diff --git a/jsconfig.json b/tsconfig.json similarity index 100% rename from jsconfig.json rename to tsconfig.json diff --git a/vite.config.js b/vite.config.ts similarity index 57% rename from vite.config.js rename to vite.config.ts index 3270d6c..d55cc05 100644 --- a/vite.config.js +++ b/vite.config.ts @@ -2,7 +2,11 @@ import {sveltekit} from '@sveltejs/kit/vite'; import {defineConfig} from 'vite'; export default defineConfig({ + build: { + // SVGs imported from the FA6 don't need to be inlined! + assetsInlineLimit: 0 + }, plugins: [ sveltekit(), - ] + ], });