diff --git a/webui/.eslintrc.cjs b/webui/.eslintrc.cjs
index 252e67b..d443827 100644
--- a/webui/.eslintrc.cjs
+++ b/webui/.eslintrc.cjs
@@ -28,15 +28,21 @@ module.exports = {
}
}
],
- rules: {
- "svelte/valid-compile": ["error", { "ignoreWarnings": true }],
- "@typescript-eslint/no-explicit-any": "warn",
- "@typescript-eslint/no-unused-vars": ["warn", {
- argsIgnorePattern: "^_",
- varsIgnorePattern: "^_"
- }],
- "no-console": ["error", {
- allow: ["debug", "warn", "error"]
- }],
- },
+ rules: {
+ 'svelte/valid-compile': ['error', { ignoreWarnings: true }],
+ '@typescript-eslint/no-explicit-any': 'warn',
+ '@typescript-eslint/no-unused-vars': [
+ 'warn',
+ {
+ argsIgnorePattern: '^_',
+ varsIgnorePattern: '^_'
+ }
+ ],
+ 'no-console': [
+ 'error',
+ {
+ allow: ['debug', 'warn', 'error']
+ }
+ ]
+ }
};
diff --git a/webui/README.md b/webui/README.md
index 76c32b5..bb2350d 100644
--- a/webui/README.md
+++ b/webui/README.md
@@ -1,6 +1,6 @@
-*Psst — looking for a more complete solution? Check out [SvelteKit](https://kit.svelte.dev), the official framework for building web applications of all sizes, with a beautiful development experience and flexible filesystem-based routing.*
+_Psst — looking for a more complete solution? Check out [SvelteKit](https://kit.svelte.dev), the official framework for building web applications of all sizes, with a beautiful development experience and flexible filesystem-based routing._
-*Looking for a shareable component template instead? You can [use SvelteKit for that as well](https://kit.svelte.dev/docs#packaging) or the older [sveltejs/component-template](https://github.com/sveltejs/component-template)*
+_Looking for a shareable component template instead? You can [use SvelteKit for that as well](https://kit.svelte.dev/docs#packaging) or the older [sveltejs/component-template](https://github.com/sveltejs/component-template)_
---
@@ -15,8 +15,7 @@ npx degit sveltejs/template svelte-app
cd svelte-app
```
-*Note that you will need to have [Node.js](https://nodejs.org) installed.*
-
+_Note that you will need to have [Node.js](https://nodejs.org) installed._
## Get started
@@ -49,12 +48,11 @@ npm run build
You can run the newly built app with `npm run start`. This uses [sirv](https://github.com/lukeed/sirv), which is included in your package.json's `dependencies` so that the app will work when you deploy to platforms like [Heroku](https://heroku.com).
-
## Single-page app mode
By default, sirv will only respond to requests that match files in `public`. This is to maximise compatibility with static fileservers, allowing you to deploy your app anywhere.
-If you're building a single-page app (SPA) with multiple routes, sirv needs to be able to respond to requests for *any* path. You can make it so by editing the `"start"` command in package.json:
+If you're building a single-page app (SPA) with multiple routes, sirv needs to be able to respond to requests for _any_ path. You can make it so by editing the `"start"` command in package.json:
```js
"start": "sirv public --single"
diff --git a/webui/package.json b/webui/package.json
index 60d54c3..1a3c10c 100644
--- a/webui/package.json
+++ b/webui/package.json
@@ -1,68 +1,68 @@
{
- "name": "upend-kestrel",
- "version": "2.0.0",
- "private": true,
- "type": "module",
- "scripts": {
- "dev": "vite dev",
- "build": "vite build",
- "preview": "vite preview",
- "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
- "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
- "lint": "prettier --check . && eslint .",
- "format": "prettier --write ."
- },
- "devDependencies": {
- "@sveltejs/adapter-auto": "^3.0.0",
- "@sveltejs/kit": "^2.0.0",
- "@sveltejs/vite-plugin-svelte": "^3.0.0",
- "@types/eslint": "8.56.0",
- "@typescript-eslint/eslint-plugin": "^6.0.0",
- "@typescript-eslint/parser": "^6.0.0",
- "eslint": "^8.56.0",
- "eslint-config-prettier": "^9.1.0",
- "eslint-plugin-svelte": "^2.35.1",
- "prettier": "^3.1.1",
- "prettier-plugin-svelte": "^3.1.2",
- "svelte": "^4.2.7",
- "svelte-check": "^3.6.0",
- "tslib": "^2.4.1",
- "typescript": "^5.0.0",
- "vite": "^5.0.3"
- },
- "dependencies": {
- "@ibm/plex": "^6.3.0",
- "@recogito/annotorious": "^2.7.11",
- "@types/d3": "^7.4.3",
- "@types/debug": "^4.1.12",
- "@types/dompurify": "^3.0.5",
- "@types/lodash": "^4.14",
- "@types/marked": "^4.3.2",
- "@types/node": "^18.19.8",
- "@types/three": "^0.160.0",
- "@types/wavesurfer.js": "^6.0.12",
- "@upnd/upend": "file:../tools/upend_js",
- "@upnd/wasm-web": "file:../tools/upend_wasm/pkg-web",
- "boxicons": "^2.1.4",
- "d3": "^7.8.5",
- "date-fns": "^2.30.0",
- "debug": "^4.3.4",
- "dompurify": "^2.4.7",
- "filesize": "^8.0.7",
- "history": "^5.3.0",
- "i18next": "^22.5.1",
- "lodash": "^4.17.21",
- "lru-cache": "^6.0.0",
- "marked": "^4.3.0",
- "match-sorter": "^6.3.1",
- "mitt": "^3.0.1",
- "normalize.css": "^8.0.1",
- "sass": "^1.66.1",
- "sirv-cli": "^2.0.2",
- "sswr": "^1.11.0",
- "svelte-i18next": "^1.2.2",
- "three": "^0.147.0",
- "vite-plugin-static-copy": "^0.13.1",
- "wavesurfer.js": "^6.6.4"
- }
+ "name": "upend-kestrel",
+ "version": "2.0.0",
+ "private": true,
+ "type": "module",
+ "scripts": {
+ "dev": "vite dev",
+ "build": "vite build",
+ "preview": "vite preview",
+ "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+ "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+ "lint": "prettier --check . && eslint .",
+ "format": "prettier --write ."
+ },
+ "devDependencies": {
+ "@sveltejs/adapter-auto": "^3.0.0",
+ "@sveltejs/kit": "^2.0.0",
+ "@sveltejs/vite-plugin-svelte": "^3.0.0",
+ "@types/eslint": "8.56.0",
+ "@typescript-eslint/eslint-plugin": "^6.0.0",
+ "@typescript-eslint/parser": "^6.0.0",
+ "eslint": "^8.56.0",
+ "eslint-config-prettier": "^9.1.0",
+ "eslint-plugin-svelte": "^2.35.1",
+ "prettier": "^3.1.1",
+ "prettier-plugin-svelte": "^3.1.2",
+ "svelte": "^4.2.7",
+ "svelte-check": "^3.6.0",
+ "tslib": "^2.4.1",
+ "typescript": "^5.0.0",
+ "vite": "^5.0.3"
+ },
+ "dependencies": {
+ "@ibm/plex": "^6.3.0",
+ "@recogito/annotorious": "^2.7.11",
+ "@types/d3": "^7.4.3",
+ "@types/debug": "^4.1.12",
+ "@types/dompurify": "^3.0.5",
+ "@types/lodash": "^4.14",
+ "@types/marked": "^4.3.2",
+ "@types/node": "^18.19.8",
+ "@types/three": "^0.160.0",
+ "@types/wavesurfer.js": "^6.0.12",
+ "@upnd/upend": "file:../tools/upend_js",
+ "@upnd/wasm-web": "file:../tools/upend_wasm/pkg-web",
+ "boxicons": "^2.1.4",
+ "d3": "^7.8.5",
+ "date-fns": "^2.30.0",
+ "debug": "^4.3.4",
+ "dompurify": "^2.4.7",
+ "filesize": "^8.0.7",
+ "history": "^5.3.0",
+ "i18next": "^22.5.1",
+ "lodash": "^4.17.21",
+ "lru-cache": "^6.0.0",
+ "marked": "^4.3.0",
+ "match-sorter": "^6.3.1",
+ "mitt": "^3.0.1",
+ "normalize.css": "^8.0.1",
+ "sass": "^1.66.1",
+ "sirv-cli": "^2.0.2",
+ "sswr": "^1.11.0",
+ "svelte-i18next": "^1.2.2",
+ "three": "^0.147.0",
+ "vite-plugin-static-copy": "^0.13.1",
+ "wavesurfer.js": "^6.6.4"
+ }
}
diff --git a/webui/src/lib/api.ts b/webui/src/lib/api.ts
index 99f0a8e..0cb7876 100644
--- a/webui/src/lib/api.ts
+++ b/webui/src/lib/api.ts
@@ -1,6 +1,6 @@
-import { UpEndApi } from "@upnd/upend";
-import { UpEndWasmExtensionsWeb } from "@upnd/upend/wasm/web";
-import wasmURL from "@upnd/wasm-web/upend_wasm_bg.wasm?url";
+import { UpEndApi } from '@upnd/upend';
+import { UpEndWasmExtensionsWeb } from '@upnd/upend/wasm/web';
+import wasmURL from '@upnd/wasm-web/upend_wasm_bg.wasm?url';
const wasm = new UpEndWasmExtensionsWeb(wasmURL);
-export default new UpEndApi({ instanceUrl: "/", wasmExtensions: wasm });
+export default new UpEndApi({ instanceUrl: '/', wasmExtensions: wasm });
diff --git a/webui/src/lib/components/BrowseAdd.svelte b/webui/src/lib/components/BrowseAdd.svelte
index 338f6f4..9f1b8ea 100644
--- a/webui/src/lib/components/BrowseAdd.svelte
+++ b/webui/src/lib/components/BrowseAdd.svelte
@@ -1,90 +1,90 @@
(editable = true)}
- on:keydown={(ev) => {
- if (["Space", "Enter"].includes(ev.key)) editable = true;
- }}
+ class="view"
+ class:editable
+ on:click={() => (editable = true)}
+ on:keydown={(ev) => {
+ if (['Space', 'Enter'].includes(ev.key)) editable = true;
+ }}
>
-
-
-
- {#if editable}
-
- {
- dispatch("input", ev.detail);
- editable = false;
- }}
- on:focus={(ev) => {
- if (!ev.detail) editable = false;
- }}
- />
-
- {/if}
+
+
+
+ {#if editable}
+
+ {
+ dispatch('input', ev.detail);
+ editable = false;
+ }}
+ on:focus={(ev) => {
+ if (!ev.detail) editable = false;
+ }}
+ />
+
+ {/if}
diff --git a/webui/src/lib/components/display/UpEntry.svelte b/webui/src/lib/components/display/UpEntry.svelte
index f33ae85..88ddab5 100644
--- a/webui/src/lib/components/display/UpEntry.svelte
+++ b/webui/src/lib/components/display/UpEntry.svelte
@@ -1,67 +1,58 @@
-
-
-
-
- {$attributeLabels[entry.attribute] || entry.attribute}
-
-
- {#if entry.value.t === "Address"}
-
- {:else}
- {entry.value.c}
- {/if}
-
+
+
+
+
+ {$attributeLabels[entry.attribute] || entry.attribute}
+
+
+ {#if entry.value.t === 'Address'}
+
+ {:else}
+ {entry.value.c}
+ {/if}
+
diff --git a/webui/src/lib/components/display/UpObjectCard.svelte b/webui/src/lib/components/display/UpObjectCard.svelte
index 7070dea..d653a4c 100644
--- a/webui/src/lib/components/display/UpObjectCard.svelte
+++ b/webui/src/lib/components/display/UpObjectCard.svelte
@@ -1,59 +1,59 @@
-
-
- {#if thumbnail}
-
- {:else}
-
-
-
- {/if}
-
-
-
-
-
+
+
+ {#if thumbnail}
+
+ {:else}
+
+
+
+ {/if}
+
+
+
+
+
diff --git a/webui/src/lib/components/display/UpObjectLabel.svelte b/webui/src/lib/components/display/UpObjectLabel.svelte
index c44c86d..47bb547 100644
--- a/webui/src/lib/components/display/UpObjectLabel.svelte
+++ b/webui/src/lib/components/display/UpObjectLabel.svelte
@@ -1,48 +1,48 @@
-
- {#if backpath.length}
-
- {#each backpath as component}
-
- {component}
-
- {/each}
-
- {/if}
-
- {label}
-
-
+
+ {#if backpath.length}
+
+ {#each backpath as component}
+
+ {component}
+
+ {/each}
+
+ {/if}
+
+ {label}
+
+
diff --git a/webui/src/lib/components/layout/Footer.svelte b/webui/src/lib/components/layout/Footer.svelte
index 3013b4b..e6d2f2a 100644
--- a/webui/src/lib/components/layout/Footer.svelte
+++ b/webui/src/lib/components/layout/Footer.svelte
@@ -1,106 +1,106 @@
diff --git a/webui/src/lib/components/util.scss b/webui/src/lib/components/util.scss
index d538e4d..9a3af70 100644
--- a/webui/src/lib/components/util.scss
+++ b/webui/src/lib/components/util.scss
@@ -1,17 +1,17 @@
section.labelborder {
- margin-top: 0.66rem;
+ margin-top: 0.66rem;
- header {
- display: flex;
- align-items: end;
- justify-content: space-between;
+ header {
+ display: flex;
+ align-items: end;
+ justify-content: space-between;
- border-bottom: 1px solid var(--foreground);
- padding-bottom: 0.33rem;
- margin-bottom: 0.33rem;
+ border-bottom: 1px solid var(--foreground);
+ padding-bottom: 0.33rem;
+ margin-bottom: 0.33rem;
- h3 {
- margin: 0;
- }
- }
+ h3 {
+ margin: 0;
+ }
+ }
}
diff --git a/webui/src/lib/components/utils/Ellipsis.svelte b/webui/src/lib/components/utils/Ellipsis.svelte
index b59e8ad..a02f0f2 100644
--- a/webui/src/lib/components/utils/Ellipsis.svelte
+++ b/webui/src/lib/components/utils/Ellipsis.svelte
@@ -1,15 +1,15 @@
{value}
diff --git a/webui/src/lib/components/utils/IconButton.svelte b/webui/src/lib/components/utils/IconButton.svelte
index 944a31c..8b03f31 100644
--- a/webui/src/lib/components/utils/IconButton.svelte
+++ b/webui/src/lib/components/utils/IconButton.svelte
@@ -1,88 +1,88 @@
diff --git a/webui/src/lib/components/utils/LabelBorder.svelte b/webui/src/lib/components/utils/LabelBorder.svelte
index cb28df7..4273406 100644
--- a/webui/src/lib/components/utils/LabelBorder.svelte
+++ b/webui/src/lib/components/utils/LabelBorder.svelte
@@ -1,63 +1,63 @@
- {
- if (hide) {
- hidden = !hidden;
- }
- }}
- on:keydown={(ev) => {
- if (["Space", "Enter"].includes(ev.key) && hide) hidden = !hidden;
- }}
- >
-
-
-
-
-
-
-
+ {
+ if (hide) {
+ hidden = !hidden;
+ }
+ }}
+ on:keydown={(ev) => {
+ if (['Space', 'Enter'].includes(ev.key) && hide) hidden = !hidden;
+ }}
+ >
+
+
+
+
+
+
+
diff --git a/webui/src/lib/components/utils/ProgessBar.svelte b/webui/src/lib/components/utils/ProgessBar.svelte
index 938fa9b..9148e61 100644
--- a/webui/src/lib/components/utils/ProgessBar.svelte
+++ b/webui/src/lib/components/utils/ProgessBar.svelte
@@ -1,71 +1,67 @@
-
-
-
-
- {value ? Math.round(value) : "?"}%
-
-
+
+
+
+
+ {value ? Math.round(value) : '?'}%
+
+
diff --git a/webui/src/lib/components/utils/Spinner.svelte b/webui/src/lib/components/utils/Spinner.svelte
index 850eeb4..5a501d4 100644
--- a/webui/src/lib/components/utils/Spinner.svelte
+++ b/webui/src/lib/components/utils/Spinner.svelte
@@ -1,30 +1,30 @@
-
+
diff --git a/webui/src/lib/debug.ts b/webui/src/lib/debug.ts
index a3fdd96..dd9308f 100644
--- a/webui/src/lib/debug.ts
+++ b/webui/src/lib/debug.ts
@@ -1,36 +1,34 @@
export const DEBUG = {
- imageQueueHalt: Boolean(localStorage.getItem("DEBUG:IMAGEHALT")),
- mockJobs: parseInt(localStorage.getItem("DEBUG:MOCK:JOBS") || "0"),
- mockNotifications: parseInt(
- localStorage.getItem("DEBUG:MOCK:NOTIFICATIONS") || "0",
- ),
+ imageQueueHalt: Boolean(localStorage.getItem('DEBUG:IMAGEHALT')),
+ mockJobs: parseInt(localStorage.getItem('DEBUG:MOCK:JOBS') || '0'),
+ mockNotifications: parseInt(localStorage.getItem('DEBUG:MOCK:NOTIFICATIONS') || '0')
};
export function lipsum(length: number): string {
- const words = [
- "lorem",
- "ipsum",
- "dolor",
- "sit",
- "amet",
- "consectetur",
- "adipiscing",
- "elit",
- "sed",
- "do",
- "eiusmod",
- "tempor",
- "incididunt",
- "ut",
- "labore",
- "et",
- "dolore",
- "magna",
- "aliqua",
- ];
- const result = ["lorem", "ipsum"];
- for (let i = 0; i < length; i++) {
- result.push(words[Math.floor(Math.random() * words.length)]);
- }
- return result.join(" ");
+ const words = [
+ 'lorem',
+ 'ipsum',
+ 'dolor',
+ 'sit',
+ 'amet',
+ 'consectetur',
+ 'adipiscing',
+ 'elit',
+ 'sed',
+ 'do',
+ 'eiusmod',
+ 'tempor',
+ 'incididunt',
+ 'ut',
+ 'labore',
+ 'et',
+ 'dolore',
+ 'magna',
+ 'aliqua'
+ ];
+ const result = ['lorem', 'ipsum'];
+ for (let i = 0; i < length; i++) {
+ result.push(words[Math.floor(Math.random() * words.length)]);
+ }
+ return result.join(' ');
}
diff --git a/webui/src/lib/i18n/en.json b/webui/src/lib/i18n/en.json
index 0715079..f313ba5 100644
--- a/webui/src/lib/i18n/en.json
+++ b/webui/src/lib/i18n/en.json
@@ -1,13 +1,13 @@
{
- "attributes": {
- "FILE_MIME": "MIME type",
- "FILE_SIZE": "File size",
- "ADDED": "Added at",
- "LAST_VISITED": "Last visited at",
- "NUM_VISITED": "Times visited",
- "ATTR_LABEL": "Label",
- "IS": "Type",
- "TYPE": "Type ID",
- "MEDIA_DURATION": "Duration"
- }
+ "attributes": {
+ "FILE_MIME": "MIME type",
+ "FILE_SIZE": "File size",
+ "ADDED": "Added at",
+ "LAST_VISITED": "Last visited at",
+ "NUM_VISITED": "Times visited",
+ "ATTR_LABEL": "Label",
+ "IS": "Type",
+ "TYPE": "Type ID",
+ "MEDIA_DURATION": "Duration"
+ }
}
diff --git a/webui/src/lib/i18n/index.ts b/webui/src/lib/i18n/index.ts
index 650b200..3856cc0 100644
--- a/webui/src/lib/i18n/index.ts
+++ b/webui/src/lib/i18n/index.ts
@@ -1,12 +1,12 @@
-import i18next from "i18next";
-import { createI18nStore } from "svelte-i18next";
-import en from "./en.json";
+import i18next from 'i18next';
+import { createI18nStore } from 'svelte-i18next';
+import en from './en.json';
i18next.init({
- lng: "en",
- resources: {
- en,
- },
+ lng: 'en',
+ resources: {
+ en
+ }
});
export const i18n = createI18nStore(i18next);
diff --git a/webui/src/lib/notifications.ts b/webui/src/lib/notifications.ts
index b7bb370..464bee8 100644
--- a/webui/src/lib/notifications.ts
+++ b/webui/src/lib/notifications.ts
@@ -1,27 +1,27 @@
-import mitt from "mitt";
+import mitt from 'mitt';
type NotifyEvents = {
- notification: UpNotification;
+ notification: UpNotification;
};
-export type UpNotificationLevel = "info" | "warning" | "error";
+export type UpNotificationLevel = 'info' | 'warning' | 'error';
export interface INotification {
- id: string;
- content: string;
- level: UpNotificationLevel;
+ id: string;
+ content: string;
+ level: UpNotificationLevel;
}
export class UpNotification implements INotification {
- id: string;
- content: string;
- level: UpNotificationLevel;
+ id: string;
+ content: string;
+ level: UpNotificationLevel;
- constructor(content: string, level?: UpNotificationLevel) {
- this.id = String(Math.random());
- this.content = content;
- this.level = level || "info";
- }
+ constructor(content: string, level?: UpNotificationLevel) {
+ this.id = String(Math.random());
+ this.content = content;
+ this.level = level || 'info';
+ }
}
export const notify = mitt
();
diff --git a/webui/src/lib/styles/colors-app.scss b/webui/src/lib/styles/colors-app.scss
index 0a2812a..6c829cc 100644
--- a/webui/src/lib/styles/colors-app.scss
+++ b/webui/src/lib/styles/colors-app.scss
@@ -1,92 +1,83 @@
-@use "colors";
-@use "sass:color";
+@use 'colors';
+@use 'sass:color';
-@mixin rebase(
- $rebase03,
- $rebase02,
- $rebase01,
- $rebase00,
- $rebase0,
- $rebase1,
- $rebase2,
- $rebase3
-) {
- --foreground: #{$rebase0};
- --foreground-lighter: #{$rebase1};
- --foreground-lightest: #{$rebase2};
- --background: #{$rebase03};
- --background-lighter: #{$rebase02};
- --background-lightest: #{color.adjust($rebase02, $lightness: 1.5%)};
- --primary: #{colors.$blue};
- --primary-lighter: #{color.adjust(colors.$blue, $lightness: 25%)};
+@mixin rebase($rebase03, $rebase02, $rebase01, $rebase00, $rebase0, $rebase1, $rebase2, $rebase3) {
+ --foreground: #{$rebase0};
+ --foreground-lighter: #{$rebase1};
+ --foreground-lightest: #{$rebase2};
+ --background: #{$rebase03};
+ --background-lighter: #{$rebase02};
+ --background-lightest: #{color.adjust($rebase02, $lightness: 1.5%)};
+ --primary: #{colors.$blue};
+ --primary-lighter: #{color.adjust(colors.$blue, $lightness: 25%)};
- background-color: $rebase03;
- color: $rebase0;
+ background-color: $rebase03;
+ color: $rebase0;
}
@mixin accentize($accent) {
- a,
- a:active,
- a:visited,
- code.url {
- color: $accent;
- }
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- color: $accent;
- }
+ a,
+ a:active,
+ a:visited,
+ code.url {
+ color: $accent;
+ }
+ h1,
+ h2,
+ h3,
+ h4,
+ h5,
+ h6 {
+ color: $accent;
+ }
}
@media (prefers-color-scheme: light) {
- html {
- @include rebase(
- colors.$base3,
- colors.$base2,
- colors.$base1,
- colors.$base0,
- colors.$base00,
- colors.$base01,
- colors.$base02,
- colors.$base03
- );
- }
+ html {
+ @include rebase(
+ colors.$base3,
+ colors.$base2,
+ colors.$base1,
+ colors.$base0,
+ colors.$base00,
+ colors.$base01,
+ colors.$base02,
+ colors.$base03
+ );
+ }
}
html {
- @include rebase(
- colors.$base03,
- colors.$base02,
- colors.$base01,
- colors.$base00,
- colors.$base0,
- colors.$base1,
- colors.$base2,
- colors.$base3
- );
+ @include rebase(
+ colors.$base03,
+ colors.$base02,
+ colors.$base01,
+ colors.$base00,
+ colors.$base0,
+ colors.$base1,
+ colors.$base2,
+ colors.$base3
+ );
}
html,
body {
- color: var(--foreground);
- background: var(--background);
+ color: var(--foreground);
+ background: var(--background);
- h1,
- h2,
- h3,
- h4,
- h5,
- h6 {
- color: var(--foreground-lighter);
- border-color: var(--foreground);
- }
+ h1,
+ h2,
+ h3,
+ h4,
+ h5,
+ h6 {
+ color: var(--foreground-lighter);
+ border-color: var(--foreground);
+ }
- a,
- a:active,
- a:visited {
- color: var(--foreground-lighter);
- }
+ a,
+ a:active,
+ a:visited {
+ color: var(--foreground-lighter);
+ }
}
diff --git a/webui/src/lib/styles/common.scss b/webui/src/lib/styles/common.scss
index f889a8d..17b4ebe 100644
--- a/webui/src/lib/styles/common.scss
+++ b/webui/src/lib/styles/common.scss
@@ -1,68 +1,68 @@
-@use "sass:color";
-@use "colors";
+@use 'sass:color';
+@use 'colors';
html {
- box-sizing: border-box;
+ box-sizing: border-box;
}
* {
- box-sizing: inherit;
+ box-sizing: inherit;
}
select {
- background: var(--background-lighter);
- color: var(--foreground);
- font-family: var(--default-font);
+ background: var(--background-lighter);
+ color: var(--foreground);
+ font-family: var(--default-font);
- border: 1px solid var(--foreground-lighter);
- border-radius: 4px;
+ border: 1px solid var(--foreground-lighter);
+ border-radius: 4px;
}
.spinner {
- font-size: 2em;
+ font-size: 2em;
}
.button {
- border: 1px solid var(--foreground);
- border-radius: 4px;
+ border: 1px solid var(--foreground);
+ border-radius: 4px;
- background: var(--background-lighter);
- color: var(--foreground);
+ background: var(--background-lighter);
+ color: var(--foreground);
- padding: 0.25em 1em;
- line-height: 1;
+ padding: 0.25em 1em;
+ line-height: 1;
- display: block;
- text-align: center;
+ display: block;
+ text-align: center;
- cursor: pointer;
+ cursor: pointer;
- input {
- display: none;
- }
+ input {
+ display: none;
+ }
- &.disabled,
- &:disabled {
- pointer-events: none;
- opacity: 0.7;
- }
+ &.disabled,
+ &:disabled {
+ pointer-events: none;
+ opacity: 0.7;
+ }
- @media screen and (max-width: 600px) {
- padding: 0.5em;
- }
+ @media screen and (max-width: 600px) {
+ padding: 0.5em;
+ }
}
.mark-entity::first-letter,
.mark-entity *::first-letter {
- color: color.scale(color.mix(colors.$base1, colors.$red), $saturation: -33%);
+ color: color.scale(color.mix(colors.$base1, colors.$red), $saturation: -33%);
}
.mark-attribute::first-letter,
.mark-attribute *::first-letter {
- color: color.mix(colors.$base1, colors.$green);
+ color: color.mix(colors.$base1, colors.$green);
}
.mark-value::first-letter,
.mark-value *::first-letter {
- color: color.mix(colors.$base1, colors.$blue);
+ color: color.mix(colors.$base1, colors.$blue);
}
diff --git a/webui/src/lib/styles/fonts.scss b/webui/src/lib/styles/fonts.scss
index b42c10c..5868cd8 100644
--- a/webui/src/lib/styles/fonts.scss
+++ b/webui/src/lib/styles/fonts.scss
@@ -1,13 +1,13 @@
-@import "node_modules/@ibm/plex/scss/ibm-plex.scss";
+@import 'node_modules/@ibm/plex/scss/ibm-plex.scss';
html {
- --default-font: "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
- --monospace-font: "IBM Plex Mono", "Menlo", "DejaVu Sans Mono", "Consolas",
- "Inconsolata", "Hack", monospace;
- font-size: 16px;
+ --default-font: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
+ --monospace-font: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Consolas', 'Inconsolata', 'Hack',
+ monospace;
+ font-size: 16px;
}
html,
body {
- font-family: var(--default-font);
+ font-family: var(--default-font);
}
diff --git a/webui/src/lib/styles/main.scss b/webui/src/lib/styles/main.scss
index 6a0e253..66947e5 100644
--- a/webui/src/lib/styles/main.scss
+++ b/webui/src/lib/styles/main.scss
@@ -1,37 +1,37 @@
-@use "normalize.css/normalize.css";
-@use "colors-app";
-@use "fonts";
-@use "common";
+@use 'normalize.css/normalize.css';
+@use 'colors-app';
+@use 'fonts';
+@use 'common';
body {
- height: calc(100vh - 2rem);
- display: flex;
- flex-direction: column;
+ height: calc(100vh - 2rem);
+ display: flex;
+ flex-direction: column;
}
main {
- flex-grow: 1;
+ flex-grow: 1;
}
.image-queued,
.image-loading {
- animation: gradient 1.5s ease infinite;
+ animation: gradient 1.5s ease infinite;
- color: transparent; // Hide alt-text
+ color: transparent; // Hide alt-text
- @keyframes gradient {
- 0% {
- background-color: rgba(255, 255, 255, 0.2);
- }
- 50% {
- background-color: rgba(255, 255, 255, 0.4);
- }
- 100% {
- background-color: rgba(255, 255, 255, 0.2);
- }
- }
+ @keyframes gradient {
+ 0% {
+ background-color: rgba(255, 255, 255, 0.2);
+ }
+ 50% {
+ background-color: rgba(255, 255, 255, 0.4);
+ }
+ 100% {
+ background-color: rgba(255, 255, 255, 0.2);
+ }
+ }
}
.image-queued {
- opacity: 0.5;
+ opacity: 0.5;
}
diff --git a/webui/src/lib/types/base.ts b/webui/src/lib/types/base.ts
index 3fe291b..925fe0d 100644
--- a/webui/src/lib/types/base.ts
+++ b/webui/src/lib/types/base.ts
@@ -1,35 +1,35 @@
-import type { IValue } from "@upnd/upend/types";
+import type { IValue } from '@upnd/upend/types';
export type WidgetChange =
- | AttributeCreate
- | AttributeUpdate
- | AttributeDelete
- | EntryInAdd
- | EntryInDelete;
+ | AttributeCreate
+ | AttributeUpdate
+ | AttributeDelete
+ | EntryInAdd
+ | EntryInDelete;
export interface AttributeCreate {
- type: "create";
- attribute: string;
- value: IValue;
+ type: 'create';
+ attribute: string;
+ value: IValue;
}
export interface AttributeUpdate {
- type: "update";
- attribute: string;
- value: IValue;
+ type: 'update';
+ attribute: string;
+ value: IValue;
}
export interface AttributeDelete {
- type: "delete";
- address: string;
+ type: 'delete';
+ address: string;
}
export interface EntryInAdd {
- type: "entry-add";
- address: string;
+ type: 'entry-add';
+ address: string;
}
export interface EntryInDelete {
- type: "entry-delete";
- address: string;
+ type: 'entry-delete';
+ address: string;
}
diff --git a/webui/src/lib/util/browse.ts b/webui/src/lib/util/browse.ts
index b3b0cca..af2f46b 100644
--- a/webui/src/lib/util/browse.ts
+++ b/webui/src/lib/util/browse.ts
@@ -1,6 +1,6 @@
-import type { Readable } from "svelte/store";
+import type { Readable } from 'svelte/store';
export interface BrowseContext {
- index: Readable;
- addresses: Readable;
+ index: Readable;
+ addresses: Readable;
}
diff --git a/webui/src/lib/util/mediatypes.ts b/webui/src/lib/util/mediatypes.ts
index 5d012eb..0293b41 100644
--- a/webui/src/lib/util/mediatypes.ts
+++ b/webui/src/lib/util/mediatypes.ts
@@ -1,41 +1,37 @@
-import type { EntityInfo } from "@upnd/upend/types";
-import type { UpObject } from "@upnd/upend";
-import { ATTR_IN } from "@upnd/upend/constants";
+import type { EntityInfo } from '@upnd/upend/types';
+import type { UpObject } from '@upnd/upend';
+import { ATTR_IN } from '@upnd/upend/constants';
export function getTypes(entity: UpObject, entityInfo: EntityInfo) {
- const mimeType = String(entity?.get("FILE_MIME"));
+ const mimeType = String(entity?.get('FILE_MIME'));
- const video =
- ["video", "application/x-matroska"].some((p) => mimeType.startsWith(p)) ||
- entity?.identify().some((l) => l.endsWith(".avi"));
- const audio =
- (["audio", "application/x-riff"].some((p) => mimeType.startsWith(p)) &&
- !video) ||
- [".ogg", ".mp3", ".wav"].some(
- (suffix) =>
- entity?.identify().some((l) => l.toLowerCase().endsWith(suffix)),
- );
- const image = mimeType.startsWith("image");
- const text = mimeType.startsWith("text");
- const pdf = mimeType.startsWith("application/pdf");
- const model =
- mimeType?.startsWith("model") ||
- entity?.identify().some((l) => l.endsWith(".stl"));
- const web = entityInfo?.t == "Url";
- const fragment = Boolean(entity?.get("ANNOTATES"));
+ const video =
+ ['video', 'application/x-matroska'].some((p) => mimeType.startsWith(p)) ||
+ entity?.identify().some((l) => l.endsWith('.avi'));
+ const audio =
+ (['audio', 'application/x-riff'].some((p) => mimeType.startsWith(p)) && !video) ||
+ ['.ogg', '.mp3', '.wav'].some((suffix) =>
+ entity?.identify().some((l) => l.toLowerCase().endsWith(suffix))
+ );
+ const image = mimeType.startsWith('image');
+ const text = mimeType.startsWith('text');
+ const pdf = mimeType.startsWith('application/pdf');
+ const model = mimeType?.startsWith('model') || entity?.identify().some((l) => l.endsWith('.stl'));
+ const web = entityInfo?.t == 'Url';
+ const fragment = Boolean(entity?.get('ANNOTATES'));
- const group = entity?.backlinks.some((e) => e.attribute == ATTR_IN);
+ const group = entity?.backlinks.some((e) => e.attribute == ATTR_IN);
- return {
- mimeType,
- audio,
- video,
- image,
- text,
- pdf,
- model,
- web,
- fragment,
- group,
- };
+ return {
+ mimeType,
+ audio,
+ video,
+ image,
+ text,
+ pdf,
+ model,
+ web,
+ fragment,
+ group
+ };
}
diff --git a/webui/src/lib/util/title.ts b/webui/src/lib/util/title.ts
index dd37bb0..a61e60d 100644
--- a/webui/src/lib/util/title.ts
+++ b/webui/src/lib/util/title.ts
@@ -1,10 +1,10 @@
export function updateTitle(route?: string, title?: string) {
- let newTitle = "UpEnd";
- if (route?.length) {
- newTitle += ` | ${route}`;
- }
- if (title?.length) {
- newTitle += ` - ${title}`;
- }
- document.title = newTitle;
+ let newTitle = 'UpEnd';
+ if (route?.length) {
+ newTitle += ` | ${route}`;
+ }
+ if (title?.length) {
+ newTitle += ` - ${title}`;
+ }
+ document.title = newTitle;
}
diff --git a/webui/vite.config.ts b/webui/vite.config.ts
index 89e1e47..343d176 100644
--- a/webui/vite.config.ts
+++ b/webui/vite.config.ts
@@ -1,30 +1,30 @@
-import { sveltekit } from "@sveltejs/kit/vite";
-import { defineConfig } from "vite";
-import { viteStaticCopy } from "vite-plugin-static-copy";
-import * as path from "path";
+import { sveltekit } from '@sveltejs/kit/vite';
+import { defineConfig } from 'vite';
+import { viteStaticCopy } from 'vite-plugin-static-copy';
+import * as path from 'path';
// https://vitejs.dev/config/
export default defineConfig({
- plugins: [
- sveltekit(),
- viteStaticCopy({
- targets: [
- {
- src: path.join(__dirname, "node_modules/boxicons", "fonts"),
- dest: path.resolve(__dirname, "dist/vendor/boxicons"),
- },
- {
- src: path.join(__dirname, "node_modules/boxicons", "css"),
- dest: path.resolve(__dirname, "dist/vendor/boxicons"),
- },
- ],
- }),
- ],
- server: {
- proxy: {
- "/api": {
- target: "http://localhost:8093/",
- },
- },
- },
+ plugins: [
+ sveltekit(),
+ viteStaticCopy({
+ targets: [
+ {
+ src: path.join(__dirname, 'node_modules/boxicons', 'fonts'),
+ dest: path.resolve(__dirname, 'dist/vendor/boxicons')
+ },
+ {
+ src: path.join(__dirname, 'node_modules/boxicons', 'css'),
+ dest: path.resolve(__dirname, 'dist/vendor/boxicons')
+ }
+ ]
+ })
+ ],
+ server: {
+ proxy: {
+ '/api': {
+ target: 'http://localhost:8093/'
+ }
+ }
+ }
});