chore: fix links

kaplayjs · Oct 31, 2024 · 26379e0 · 26379e0
1 parent bfa8e27
commit 26379e0
Show file tree

Hide file tree

Showing 5 changed files with 83 additions and 81 deletions.
diff --git a/kaplay b/kaplay
diff --git a/src/components/ExamplesBrowser/ExampleEntry.tsx b/src/components/ExamplesBrowser/ExampleEntry.tsx
@@ -2,6 +2,7 @@ import { assets } from "@kaplayjs/crew";
 import type { FC } from "react";
 import type { Example } from "../../data/examples";
 import { useEditor } from "../../hooks/useEditor";
+import { useProject } from "../../hooks/useProject";
 import { cn } from "../../util/cn";
 
 type Props = {
@@ -17,7 +18,8 @@ const imagesPerDifficulty: Record<string, string> = {
 };
 
 export const ExampleEntry: FC<Props> = ({ example, isProject }) => {
-    const { loadProject, loadDefaultExample } = useEditor();
+    const { loadDefaultExample } = useEditor();
+    const { loadProject } = useProject();
 
     const handleClick = () => {
         const dialog = document.querySelector<HTMLDialogElement>(

diff --git a/src/components/Playground/Playground.tsx b/src/components/Playground/Playground.tsx
@@ -36,8 +36,8 @@ const Playground = () => {
         getProject,
         createNewProject,
         loadProject,
+        loadDefaultExample,
         importProject,
-        projectIsSaved,
     } = useProject();
     const [loadingProject, setLoadingProject] = useState<boolean>(true);
     const [loadingEditor, setLoadingEditor] = useState<boolean>(true);
@@ -47,6 +47,56 @@ const Playground = () => {
         setLoadingEditor(false);
     };
 
+    const loadShare = (shareCode: string) => {
+        if (!shareCode) return;
+
+        debug(
+            0,
+            "Importing shared code...",
+            shareCode,
+            decompressCode(shareCode),
+        );
+
+        importProject({
+            assets: new Map(),
+            files: new Map([
+                [
+                    "main.js",
+                    {
+                        kind: "main",
+                        language: "javascript",
+                        name: "main.js",
+                        path: "main.js",
+                        value: decompressCode(shareCode),
+                    },
+                ],
+            ]),
+            mode: "ex",
+            id: "ex-shared",
+            kaplayConfig: {},
+            kaplayVersion: "3001.0.1",
+            name: "Shared Example",
+            version: "2.0.0",
+            isDefault: true,
+        });
+
+        loadProject("shared");
+        setLoadingProject(false);
+
+        return;
+    };
+
+    const loadExample = (exampleName: string) => {
+        loadDefaultExample(exampleName);
+        setLoadingProject(false);
+    };
+
+    const loadNew = () => {
+        debug(0, "No project found, creating a new one...");
+        createNewProject("pj");
+        setLoadingProject(false);
+    };
+
     // First useEffect
     useEffect(() => {
         const defaultTheme = localStorage.getItem("theme") as string;
@@ -61,86 +111,20 @@ const Playground = () => {
     }, []);
 
     useEffect(() => {
-        const lastOpenedProject =
-            useConfig.getState().getConfig().lastOpenedProject;
         const urlParams = new URLSearchParams(window.location.search);
+        const lastOpenedPj = useConfig.getState().getConfig().lastOpenedProject;
         const sharedCode = urlParams.get("code");
-
-        const loadShare = () => {
-            if (!sharedCode) return;
-            debug(
-                0,
-                "Importing shared code...",
-                sharedCode,
-                decompressCode(sharedCode),
-            );
-
-            importProject({
-                assets: new Map(),
-                files: new Map([
-                    [
-                        "main.js",
-                        {
-                            kind: "main",
-                            language: "javascript",
-                            name: "main.js",
-                            path: "main.js",
-                            value: decompressCode(sharedCode),
-                        },
-                    ],
-                ]),
-                mode: "ex",
-                id: "ex-shared",
-                kaplayConfig: {},
-                kaplayVersion: "3001.0.1",
-                name: "Shared Example",
-                version: "2.0.0",
-                isDefault: true,
-            });
-
-            loadProject("shared");
+        const exampleName = urlParams.get("example");
+
+        if (sharedCode) {
+            loadShare(sharedCode);
+        } else if (exampleName) {
+            loadExample(exampleName);
+        } else if (lastOpenedPj) {
+            loadProject(lastOpenedPj);
             setLoadingProject(false);
-
-            return;
-        };
-
-        const loadSide = () => {
-            if (projectIsSaved("shared", "ex")) {
-                if (!sharedCode) return;
-
-                const response = window.confirm(
-                    "Do you want to load the shared example? This will overwrite the current shared project.",
-                );
-
-                if (response) {
-                    loadShare();
-                    return;
-                }
-            }
-
-            if (sharedCode) {
-                loadShare();
-                return;
-            }
-
-            if (lastOpenedProject) {
-                debug(0, "Loading last opened project...");
-                loadProject(lastOpenedProject);
-                setLoadingProject(false);
-                return;
-            }
-        };
-
-        if (project.files.size > 0) {
-            loadSide();
         } else {
-            if (lastOpenedProject || sharedCode) {
-                loadSide();
-            } else {
-                debug(0, "No project found, creating a new one...");
-                createNewProject("pj");
-                setLoadingProject(false);
-            }
+            loadNew();
         }
     }, []);
 

diff --git a/src/components/Toolbar/ToolbarToolsMenu.tsx b/src/components/Toolbar/ToolbarToolsMenu.tsx
@@ -23,6 +23,19 @@ const ToolbarToolsMenu: FC = () => {
     const { run } = useEditor();
 
     const handleShare = () => {
+        const isDefault = getProject().isDefault;
+
+        if (isDefault) {
+            const exampleParam = encodeURIComponent(getProject().id);
+            const url = `${window.location.origin}/?example=${exampleParam}`;
+
+            navigator.clipboard.writeText(url).then(() => {
+                toast("Example shared, URL copied to clipboard!");
+            });
+
+            return;
+        }
+
         const mainFile = getMainFile();
         const compressedCode = compressCode(mainFile?.value!);
         const codeParam = encodeURIComponent(compressedCode);

diff --git a/src/stores/project.ts b/src/stores/project.ts
@@ -89,14 +89,15 @@ export const createProjectSlice: StateCreator<
 
         const files = new Map<string, File>();
         const assets = new Map();
+        let id = `u${filter}-Untitled`;
 
         // Load default setup
         if (filter === "pj") {
             get().loadDefaultSetup("pj", files, assets);
             debug(1, "New files for the new project", files, assets);
         } else if (exampleIndex) {
             const example = examplesList.filter(example =>
-                example.index === exampleIndex
+                example.index === exampleIndex || example.name === exampleIndex
             )[0];
 
             files.set("main.js", {
@@ -106,6 +107,8 @@ export const createProjectSlice: StateCreator<
                 path: "main.js",
                 value: example.code,
             });
+
+            id = example.name;
         } else {
             get().loadDefaultSetup("ex", files, assets);
             debug(1, "New files for the new example project", files, assets);
@@ -134,7 +137,7 @@ export const createProjectSlice: StateCreator<
                 mode: filter,
                 kaplayVersion: "3001.0.1",
                 isDefault: exampleIndex ? true : false,
-                id: `u${filter}-Untitled`,
+                id: id,
             },
         }));
     },