From 97166139c43a0805277d651f47fdb504f467e1ad Mon Sep 17 00:00:00 2001
From: Raphael Forment <raphael.forment@gmail.com>
Date: Sat, 18 Nov 2023 01:28:05 +0100
Subject: [PATCH] Allow universe renaming

---
 index.html            |  3 ++-
 src/FileManagement.ts |  4 ++--
 src/InterfaceLogic.ts | 14 ++++++++++++++
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index e420bb2..f704c7d 100644
--- a/index.html
+++ b/index.html
@@ -76,7 +76,8 @@
           <svg id="topos-logo" xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" class="w-10 h-10 text-black p-2 bg-white rounded-full" viewBox="0 0 24 24">
               <path stroke-linecap="round" stroke-linejoin="round" d="M12 6.042A8.967 8.967 0 006 3.75c-1.052 0-2.062.18-3 .512v14.25A8.987 8.987 0 016 18c2.305 0 4.408.867 6 2.292m0-14.25a8.966 8.966 0 016-2.292c1.052 0 2.062.18 3 .512v14.25A8.987 8.987 0 0018 18a8.967 8.967 0 00-6 2.292m0-14.25v14.25" />
           </svg>
-          <span id="universe-viewer" class="hidden xl:block ml-4 text-2xl text-white">Topos</span>
+         <input id="universe-viewer" class="hidden bg-transparent xl:block ml-4 text-2xl text-white placeholder-white" id="renamer" type="text" placeholder="Topos">
+
         </a>
         <nav class="py-2 flex flex-wrap items-center text-base absolute right-0">
          <a title="Play button (Ctrl+P)" id="play-button-1" class="flex flex-row mr-2 hover:bg-gray-800 px-2 py-2 rounded-lg">
diff --git a/src/FileManagement.ts b/src/FileManagement.ts
index fc97d00..ec58d8b 100644
--- a/src/FileManagement.ts
+++ b/src/FileManagement.ts
@@ -263,7 +263,7 @@ export const initializeSelectedUniverse = (app: Editor): void => {
       app.universes[app.selected_universe] = structuredClone(template_universe);
     }
   }
-  app.interface.universe_viewer.innerHTML = `Topos: ${app.selected_universe}`;
+  app.interface.universe_viewer.placeholder! = `${app.selected_universe}`;
 };
 
 export const emptyUrl = () => {
@@ -334,7 +334,7 @@ export const loadUniverse = (
   // Updating references to the currently selected universe
   app.settings.selected_universe = selectedUniverse;
   app.selected_universe = selectedUniverse;
-  app.interface.universe_viewer.innerHTML = `Topos: ${selectedUniverse}`;
+  app.interface.universe_viewer.placeholder! = `${selectedUniverse}`;
   // Updating the editor View to reflect the selected universe
   app.updateEditorView();
   // Evaluating the initialisation script for the selected universe
diff --git a/src/InterfaceLogic.ts b/src/InterfaceLogic.ts
index 4f38458..d988dfb 100644
--- a/src/InterfaceLogic.ts
+++ b/src/InterfaceLogic.ts
@@ -116,6 +116,20 @@ export const installInterfaceLogic = (app: Editor) => {
     }
   });
 
+  app.interface.universe_viewer.addEventListener("input", () => {
+    let content = app.interface.universe_viewer.value as string;
+    content = content.trim();
+    if (content.length > 2 && content.length < 40) {
+      if (content !== app.selected_universe) {
+        Object.defineProperty(app.universes, content,
+          Object.getOwnPropertyDescriptor(app.universes, app.selected_universe));
+        delete app.universes[app.selected_universe];
+      }
+      app.selected_universe = content.trim();
+      loadUniverse(app, app.selected_universe)
+    }
+  })
+
   app.interface.audio_nudge_range.addEventListener("input", () => {
     app.clock.nudge = parseInt(
       (app.interface.audio_nudge_range as HTMLInputElement).value