diff --git a/examples/js/long-hide.js b/examples/js/long-hide.js
new file mode 100644
index 0000000..27c43c5
--- /dev/null
+++ 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
new file mode 100644
index 0000000..c103a03
--- /dev/null
+++ b/examples/long-hide.html
@@ -0,0 +1,18 @@
+
+
+
+
+
+ muigui
+
+
+
+ muigui
+
+
+
+
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index e129ff0..85a9fd6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
{
"name": "muigui",
- "version": "0.0.17",
+ "version": "0.0.18",
"lockfileVersion": 2,
"requires": true,
"packages": {
"": {
"name": "muigui",
- "version": "0.0.17",
+ "version": "0.0.18",
"license": "MIT",
"devDependencies": {
"@rollup/plugin-node-resolve": "^15.0.1",
diff --git a/package.json b/package.json
index 54f2dcb..607c642 100644
--- 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
index efa096c..56cd927 100644
--- 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;
}
}
\ No newline at end of file
diff --git a/src/controllers/Canvas.js b/src/controllers/Canvas.js
index c4c1114..f9bd279 100644
--- 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;
+ }
}
\ No newline at end of file
diff --git a/src/controllers/Container.js b/src/controllers/Container.js
index cfe15fe..5ad02f9 100644
--- 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
index 3f1ce69..5e7a4a2 100644
--- 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 ---- */