From af4c793f43da5a3bf9ac1fb208bb55d33cdef347 Mon Sep 17 00:00:00 2001 From: 0HyperCube <78500760+0HyperCube@users.noreply.github.com> Date: Mon, 11 Dec 2023 09:06:00 +0000 Subject: [PATCH] Serve the demo artwork in each build (#1494) * Serve local demo artwork * Disable restricted import lint * Revert * Switch approach to vite-multiple-assets plugin --------- Co-authored-by: Keavon Chambers --- .../simple_dialogs/demo_artwork_dialog.rs | 23 ++++--- .../src/messages/frontend/frontend_message.rs | 3 +- frontend/package-lock.json | 60 ++++++++++++++++++- frontend/package.json | 3 +- frontend/src/state-providers/portfolio.ts | 12 ++-- frontend/src/wasm-communication/messages.ts | 4 +- frontend/vite.config.ts | 2 + 7 files changed, 85 insertions(+), 22 deletions(-) diff --git a/editor/src/messages/dialog/simple_dialogs/demo_artwork_dialog.rs b/editor/src/messages/dialog/simple_dialogs/demo_artwork_dialog.rs index dcdc2a54..268e4670 100644 --- a/editor/src/messages/dialog/simple_dialogs/demo_artwork_dialog.rs +++ b/editor/src/messages/dialog/simple_dialogs/demo_artwork_dialog.rs @@ -4,17 +4,10 @@ use crate::messages::prelude::*; /// A dialog to let the user browse a gallery of demo artwork that can be opened. pub struct DemoArtworkDialog; +/// `(name, thumbnail, filename)` const ARTWORK: [(&str, &str, &str); 2] = [ - ( - "Valley of Spires", - "ThumbnailValleyOfSpires", - "https://raw.githubusercontent.com/GraphiteEditor/Graphite/master/demo-artwork/valley-of-spires-v2.graphite", - ), - ( - "Just a Potted Cactus", - "ThumbnailJustAPottedCactus", - "https://raw.githubusercontent.com/GraphiteEditor/Graphite/master/demo-artwork/just-a-potted-cactus-v2.graphite", - ), + ("Valley of Spires", "ThumbnailValleyOfSpires", "valley-of-spires-v2.graphite"), + ("Just a Potted Cactus", "ThumbnailJustAPottedCactus", "just-a-potted-cactus-v2.graphite"), ]; impl DialogLayoutHolder for DemoArtworkDialog { @@ -37,12 +30,16 @@ impl LayoutHolder for DemoArtworkDialog { let buttons = ARTWORK .into_iter() - .map(|(label, _, url)| { - TextButton::new(label) + .map(|(name, _, filename)| { + TextButton::new(name) .min_width(256) .on_update(|_| { DialogMessage::CloseDialogAndThen { - followups: vec![FrontendMessage::TriggerFetchAndOpenDocument { url: url.to_string() }.into()], + followups: vec![FrontendMessage::TriggerFetchAndOpenDocument { + name: name.to_string(), + filename: filename.to_string(), + } + .into()], } .into() }) diff --git a/editor/src/messages/frontend/frontend_message.rs b/editor/src/messages/frontend/frontend_message.rs index 0276cdf4..f8665780 100644 --- a/editor/src/messages/frontend/frontend_message.rs +++ b/editor/src/messages/frontend/frontend_message.rs @@ -67,7 +67,8 @@ pub enum FrontendMessage { name: String, }, TriggerFetchAndOpenDocument { - url: String, + name: String, + filename: String, }, TriggerFontLoad { font: Font, diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 7e457cf2..d64072df 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -34,7 +34,8 @@ "svelte-preprocess": "^5.0.3", "ts-node": "^10.9.1", "typescript": "^5.0.4", - "vite": "^4.4.5" + "vite": "^4.4.5", + "vite-multiple-assets": "^1.2.6" }, "optionalDependencies": { "wasm-pack": "0.12.1" @@ -3898,6 +3899,29 @@ "node": ">=8.6" } }, + "node_modules/mime-db": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz", + "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==", + "dev": true, + "peer": true, + "engines": { + "node": ">= 0.6" + } + }, + "node_modules/mime-types": { + "version": "2.1.35", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz", + "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==", + "dev": true, + "peer": true, + "dependencies": { + "mime-db": "1.52.0" + }, + "engines": { + "node": ">= 0.6" + } + }, "node_modules/mimic-fn": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-4.0.0.tgz", @@ -5754,6 +5778,16 @@ } } }, + "node_modules/vite-multiple-assets": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/vite-multiple-assets/-/vite-multiple-assets-1.2.6.tgz", + "integrity": "sha512-/ZQdpCqNWdqj/jO5wQHtvWaV1nYKbUH+e/1lDNy+OXiQot2YbWGoGDDFxAu8PI/k3nRpAXpPpmpv48CvhNlVWg==", + "dev": true, + "peerDependencies": { + "mime-types": "^2.1.35", + "vite": ">=2.9.6" + } + }, "node_modules/vitefu": { "version": "0.2.5", "resolved": "https://registry.npmjs.org/vitefu/-/vitefu-0.2.5.tgz", @@ -8448,6 +8482,23 @@ "picomatch": "^2.3.1" } }, + "mime-db": { + "version": "1.52.0", + "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz", + "integrity": "sha512-sPU4uV7dYlvtWJxwwxHD0PuihVNiE7TyAbQ5SWxDCB9mUYvOgroQOwYQQOKPJ8CIbE+1ETVlOoK1UC2nU3gYvg==", + "dev": true, + "peer": true + }, + "mime-types": { + "version": "2.1.35", + "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.35.tgz", + "integrity": "sha512-ZDY+bPm5zTTF+YpCrAU9nK0UgICYPT0QtT1NZWFv4s++TNkcgVaT0g6+4R2uI4MjQjzysHB1zxuWL50hzaeXiw==", + "dev": true, + "peer": true, + "requires": { + "mime-db": "1.52.0" + } + }, "mimic-fn": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-4.0.0.tgz", @@ -9657,6 +9708,13 @@ "rollup": "^3.27.1" } }, + "vite-multiple-assets": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/vite-multiple-assets/-/vite-multiple-assets-1.2.6.tgz", + "integrity": "sha512-/ZQdpCqNWdqj/jO5wQHtvWaV1nYKbUH+e/1lDNy+OXiQot2YbWGoGDDFxAu8PI/k3nRpAXpPpmpv48CvhNlVWg==", + "dev": true, + "requires": {} + }, "vitefu": { "version": "0.2.5", "resolved": "https://registry.npmjs.org/vitefu/-/vitefu-0.2.5.tgz", diff --git a/frontend/package.json b/frontend/package.json index 2e2d8ecb..be27e0fa 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -52,7 +52,8 @@ "svelte-preprocess": "^5.0.3", "ts-node": "^10.9.1", "typescript": "^5.0.4", - "vite": "^4.4.5" + "vite": "^4.4.5", + "vite-multiple-assets": "^1.2.6" }, "optionalDependencies": { "wasm-pack": "0.12.1" diff --git a/frontend/src/state-providers/portfolio.ts b/frontend/src/state-providers/portfolio.ts index 52d6c10f..900dec7c 100644 --- a/frontend/src/state-providers/portfolio.ts +++ b/frontend/src/state-providers/portfolio.ts @@ -47,15 +47,17 @@ export function createPortfolioState(editor: Editor) { }); editor.subscriptions.subscribeJsMessage(TriggerFetchAndOpenDocument, async (triggerFetchAndOpenDocument) => { try { - const url = new URL(triggerFetchAndOpenDocument.url); + const { name, filename } = triggerFetchAndOpenDocument; + const url = new URL(filename, document.location.href); const data = await fetch(url); - - const filename = url.pathname.split("/").pop() || "Untitled"; const content = await data.text(); - editor.instance.openDocumentFile(filename, content); + editor.instance.openDocumentFile(name, content); } catch { - editor.instance.errorDialog("Failed to open document", "The file could not be reached over the internet. You may be offline, or it may be missing."); + // Needs to be delayed until the end of the current call stack so the existing demo artwork dialog can be closed first, otherwise this dialog won't show + setTimeout(() => { + editor.instance.errorDialog("Failed to open document", "The file could not be reached over the internet. You may be offline, or it may be missing."); + }, 0); } }); editor.subscriptions.subscribeJsMessage(TriggerOpenDocument, async () => { diff --git a/frontend/src/wasm-communication/messages.ts b/frontend/src/wasm-communication/messages.ts index ac3d4fa8..eb697823 100644 --- a/frontend/src/wasm-communication/messages.ts +++ b/frontend/src/wasm-communication/messages.ts @@ -522,7 +522,9 @@ export class TriggerLoadAutoSaveDocuments extends JsMessage {} export class TriggerLoadPreferences extends JsMessage {} export class TriggerFetchAndOpenDocument extends JsMessage { - readonly url!: string; + readonly name!: string; + + readonly filename!: string; } export class TriggerOpenDocument extends JsMessage {} diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts index 52957796..de783afb 100644 --- a/frontend/vite.config.ts +++ b/frontend/vite.config.ts @@ -8,6 +8,7 @@ import { svelte } from "@sveltejs/vite-plugin-svelte"; import rollupPluginLicense, { type Dependency } from "rollup-plugin-license"; import { sveltePreprocess } from "svelte-preprocess/dist/autoProcess"; import { defineConfig } from "vite"; +import { default as viteMultipleAssets } from "vite-multiple-assets"; const projectRootDir = path.resolve(__dirname); @@ -40,6 +41,7 @@ export default defineConfig({ defaultHandler?.(warning); }, }), + viteMultipleAssets(["../demo-artwork"]), ], resolve: { alias: [