various minor fixes

greggman · Dec 15, 2024 · a0b537e · a0b537e
1 parent 931fc75
commit a0b537e
Show file tree

Hide file tree

Showing 8 changed files with 73 additions and 4 deletions.
diff --git a/examples/js/long-hide.js b/examples/js/long-hide.js
@@ -0,0 +1,40 @@
+import GUI from '../../dist/0.x/muigui.module.js';
+//import {GUI} from '../../src/muigui.js';
+
+const gui = new GUI();
+
+function addFolder(gui, name) {
+  const f = gui.addFolder(name);
+  for (let i = 0; i < 50; ++i) {
+    f.addButton(i.toString(), () => {});
+  }
+}
+
+const degToRad = deg => deg * Math.PI / 180;
+
+const settings = {
+  translation: new Float32Array([0, 0, 0]),
+  rotation: new Float32Array([0, 0, 0]),
+  scale: new Float32Array([1, 1, 1]),
+  baseRotation: degToRad(-45),
+};
+
+const radToDegOptions = { min: -180, max: 180, step: 1, converters: GUI.converters.radToDeg };
+const cameraRadToDegOptions = { min: -180, max: 180, step: 1, converters: GUI.converters.radToDeg };
+
+gui.add(settings, 'baseRotation', cameraRadToDegOptions);
+const nodeLabel = gui.addLabel('node:');
+const trsFolder = gui.addFolder('orientation');
+trsFolder.add(settings.translation, '0', -50, 50, 1).name('translation x');
+trsFolder.add(settings.translation, '1', -50, 50, 1).name('translation y');
+trsFolder.add(settings.translation, '2', -50, 50, 1).name('translation z');
+trsFolder.add(settings.rotation, '0', radToDegOptions).name('rotation x');
+trsFolder.add(settings.rotation, '1', radToDegOptions).name('rotation y');
+trsFolder.add(settings.rotation, '2', radToDegOptions).name('rotation z');
+trsFolder.add(settings.scale, '0', 0.001, 2).name('scale x');
+trsFolder.add(settings.scale, '1', 0.001, 2).name('scale y');
+trsFolder.add(settings.scale, '2', 0.001, 2).name('scale z');
+
+addFolder(gui, 'one');
+addFolder(gui, 'two');
+addFolder(gui, 'three');
diff --git a/examples/long-hide.html b/examples/long-hide.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="initial-scale=1,minimum-scale=1,maximum-scale=1">
+    <title>muigui</title>
+
+    <style>
+      :root {
+        color-scheme: light dark;
+      }
+    </style>
+<body>
+  <h1>muigui</h1>
+  <div id="log"></div>
+</body>
+<script type="module" src="js/long-hide.js"></script>
+</html>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "muigui",
-  "version": "0.0.17",
+  "version": "0.0.18",
   "description": "A Simple GUI",
   "main": "dist/0.x/muigui.js",
   "module": "dist/0.x/muigui.module.js",

diff --git a/src/controllers/Button.js b/src/controllers/Button.js
@@ -28,10 +28,12 @@ export default class Button extends Controller {
   }
   name(name) {
     this.#buttonElem.textContent = name;
+    return this;
   }
   setOptions(options) {
     copyExistingProperties(this.#options, options);
     const {name} = this.#options;
     this.#buttonElem.textContent = name;
+    return this;
   }
 }
diff --git a/src/controllers/Canvas.js b/src/controllers/Canvas.js
@@ -14,4 +14,7 @@ export default class Canvas extends LabelController {
   get canvas() {
     return this.#canvasElem;
   }
+  listen() {
+    return this;
+  }
 }
diff --git a/src/controllers/Container.js b/src/controllers/Container.js
@@ -61,4 +61,10 @@ export default class Container extends Controller {
     this.#childDestController = this.#childDestController.parent;
     return this;
   }
+  listen() {
+    this.#controllers.forEach(c => {
+      c.listen();
+    });
+    return this;
+  }
 }
diff --git a/src/styles/muigui.css.js b/src/styles/muigui.css.js
@@ -287,7 +287,7 @@ export default {
 }
 .muigui-closed>.muigui-open-container>* {
   transition: all 0.1s ease-out;
-  margin-top: -100%;
+  margin-top: -1000%;
 }
 
 /* ---- popdown ---- */