refactor! renam ui components

js/AvatarPreview.js

@@ -2,7 +2,7 @@ import { van } from "./van.js";
 import { showEditor } from "./state.js";
 const { button, iframe, div, img } = van.tags;
 
-export function AvatarViewer() {
+export function AvatarPreview() {
   return div(
     {
       class: () =>

js/Container.js

@@ -1,7 +1,7 @@
-import { ImageEditor } from './ImageEditor.js';
-import { AvatarEditor } from './AvatarEditor.js';
+import { LayerEditor } from './LayerEditor.js';
+import { ShapeFlowEditor } from './ShapeFlowEditor.js';
 import { van } from './van.js';
-import { AvatarViewer } from './AvatarViewer.js';
+import { AvatarPreview } from './AvatarPreview.js';
 import { Loading } from './Loading.js';
 import { Alert } from './Alert.js';
 const { button, iframe, div, img } = van.tags;
@@ -12,9 +12,9 @@ export function Container() {
       class: 'fixed left-0 top-0 w-full h-full z-[200] pointer-events-none',
       id: 'avatech-editor',
     },
-    AvatarEditor(),
-    ImageEditor(),
-    AvatarViewer(),
+    ShapeFlowEditor(),
+    LayerEditor(),
+    AvatarPreview(),
     Loading(),
     Alert(),
   );

js/LayerEditor.js

@@ -101,7 +101,7 @@ export function drawSegment(clicks) {
 
 initModel();
 
-export function ImageEditor() {
+export function LayerEditor() {
   let realTimeSegment = true;
   document.addEventListener("keydown", (e) => {
     if (showImageEditor.val && e.code === "Tab") {

js/ShapeFlowEditor.js

@@ -2,7 +2,7 @@ import { iframeSrc, showEditor } from "./state.js";
 import { van } from "./van.js";
 const { button, iframe, div, img, span } = van.tags;
 
-export function AvatarEditor() {
+export function ShapeFlowEditor() {
   return div(
     {
       class: "w-full h-full relative",

js/SideBar.js

@@ -1,4 +1,4 @@
-import { drawSegment, getClicks, updateImagePrompts } from "./ImageEditor.js";
+import { drawSegment, getClicks, updateImagePrompts } from "./LayerEditor.js";
 import {
   imagePrompts,
   selectedLayer,

js/index.js

@@ -19,7 +19,7 @@ import { api } from "./api.js";
 import { Container } from "./Container.js";
 import { loadNpyTensor } from "./onnx.js";
 import "https://code.iconify.design/3/3.1.0/iconify.min.js";
-import { drawSegment, getClicks } from "./ImageEditor.js";
+import { drawSegment, getClicks } from "./LayerEditor.js";
 
 /** @type {import( '../../../web/types/litegraph.js').LGraphGroup} */
 const recomputeInsideNodesOps = LGraphGroup.prototype.recomputeInsideNodes;
@@ -336,11 +336,11 @@ const ext = {
       BLENDSHAPES_CONFIG(node, inputName, inputData, app) {
         const btn = node.addWidget("button", "Edit Shape Flow", "", () => {
           targetNode.val = node;
-          openInAvatechEditor(
-            "https://editor.avatech.ai?comfyui=true",
-            fileName.val
-          );
-          // openInAvatechEditor("http://localhost:3006?comfyui=true", fileName.val);
+          // openInAvatechEditor(
+          //   "https://editor.avatech.ai?comfyui=true",
+          //   fileName.val
+          // );
+          openInAvatechEditor("http://localhost:3006?comfyui=true", fileName.val);
         });
         btn.serialize = false;