GUI's element placement for you
* @type Boolean
@@ -1780,7 +1784,10 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
// Lets just check our height against the window height right off
// the bat.
this.onResize();
-// resetWidth();
+
+ if (_this.__closeButton) {
+ _this.__closeButton.innerHTML = v ? GUI.TEXT_OPEN : GUI.TEXT_CLOSED;
+ }
}
},
@@ -1824,6 +1831,7 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
if (common.isUndefined(params.parent)) {
params.closed = false;
+
dom.addClass(this.domElement, GUI.CLASS_MAIN);
dom.makeSelectable(this.domElement, false);
@@ -1844,6 +1852,19 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
}
+ this.__closeButton = document.createElement('div');
+ this.__closeButton.innerHTML = GUI.TEXT_CLOSED;
+ dom.addClass(this.__closeButton, GUI.CLASS_CLOSE_BUTTON);
+ this.domElement.appendChild(this.__closeButton);
+
+ dom.bind(this.__closeButton, 'click', function() {
+
+ _this.closed = !_this.closed;
+
+
+ });
+
+
// Oh, you're a nested GUI!
} else {
@@ -1858,7 +1879,6 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
var on_click_title = function(e) {
e.preventDefault();
- e.stopPropagation()
_this.closed = !_this.closed;
return false;
};
@@ -1915,18 +1935,18 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
localStorage.setItem(getLocalStorageHash(_this, 'gui'), JSON.stringify(_this.getSaveObject()));
}
- // Small hack to fix CSS positioning bug in Chrome
+ var root = _this.getRoot();
function resetWidth() {
- var root = _this.getRoot();
- root.width += 1;
- common.defer(function() {
- root.width -= 1;
- });
- }
+ var root = _this.getRoot();
+ root.width += 1;
+ common.defer(function() {
+ root.width -= 1;
+ });
+ }
- if (!params.parent) {
- resetWidth();
- }
+ if (!params.parent) {
+ resetWidth();
+ }
};
@@ -1945,8 +1965,12 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
GUI.CLASS_CONTROLLER_ROW = 'cr';
GUI.CLASS_TOO_TALL = 'taller-than-window';
GUI.CLASS_CLOSED = 'closed';
+ GUI.CLASS_CLOSE_BUTTON = 'close-button';
+ GUI.CLASS_DRAG = 'drag';
GUI.DEFAULT_WIDTH = 245;
+ GUI.TEXT_CLOSED = 'Close Controls';
+ GUI.TEXT_OPEN = 'Open Controls';
dom.bind(window, 'keydown', function(e) {
@@ -2068,44 +2092,40 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
var li = addRow(this, gui.domElement);
dom.addClass(li, 'folder');
-
- gui.open = function() {
- this.closed = false;
- };
-
- gui.close = function() {
- this.closed = true;
- };
-
return gui;
},
- onResize: function() {
+ open: function() {
+ this.closed = false;
+ },
+ close: function() {
+ this.closed = true;
+ },
+
+ onResize: function() {
var root = this.getRoot();
-
if (root.scrollable) {
- var top = dom.getOffset(root.domElement).top;
-
+ var top = dom.getOffset(root.__ul).top;
var h = 0;
+
common.each(root.__ul.childNodes, function(node) {
- h += dom.getHeight(node);
+ if (! (root.autoPlace && node === root.__save_row))
+ h += dom.getHeight(node);
});
-
- if (window.innerHeight < h) {
+ if (window.innerHeight - top - CLOSE_BUTTON_HEIGHT < h) {
dom.addClass(root.domElement, GUI.CLASS_TOO_TALL);
- root.__ul.style.height = window.innerHeight - top + 'px';
+ root.__ul.style.height = window.innerHeight - top - CLOSE_BUTTON_HEIGHT + 'px';
} else {
dom.removeClass(root.domElement, GUI.CLASS_TOO_TALL);
root.__ul.style.height = 'auto';
}
-
}
if (root.__resize_handle) {
@@ -2114,6 +2134,10 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
});
}
+ if (root.__closeButton) {
+ root.__closeButton.style.width = root.width + 'px';
+ }
+
},
/**
@@ -2126,7 +2150,7 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
* @instance
*/
remember: function() {
-
+
if (common.isUndefined(SAVE_DIALOGUE)) {
SAVE_DIALOGUE = new CenteredDiv();
SAVE_DIALOGUE.domElement.innerHTML = saveDialogueContents;
@@ -2232,7 +2256,7 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
// Make revert work on Default.
if (!this.getRoot().load.remembered) {
controller.setValue(controller.initialValue);
- } else {
+ } else {
recallSavedValue(gui || this.getRoot(), controller);
}
}, this);
@@ -2696,6 +2720,7 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
var pmouseX;
dom.bind(gui.__resize_handle, 'mousedown', dragStart);
+ dom.bind(gui.__closeButton, 'mousedown', dragStart);
gui.domElement.insertBefore(gui.__resize_handle, gui.domElement.firstElementChild);
@@ -2705,6 +2730,7 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
pmouseX = e.clientX;
+ dom.addClass(gui.__closeButton, GUI.CLASS_DRAG);
dom.bind(window, 'mousemove', drag);
dom.bind(window, 'mouseup', dragStop);
@@ -2717,6 +2743,7 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
e.preventDefault();
gui.width += pmouseX - e.clientX;
+ gui.onResize();
pmouseX = e.clientX;
return false;
@@ -2725,6 +2752,7 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
function dragStop() {
+ dom.removeClass(gui.__closeButton, GUI.CLASS_DRAG);
dom.unbind(window, 'mousemove', drag);
dom.unbind(window, 'mouseup', dragStop);
@@ -2738,6 +2766,8 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
// set the width manually if we want it to bleed to the edge
if (gui.__save_row && gui.autoPlace) {
gui.__save_row.style.width = w + 'px';
+ }if (gui.__closeButton) {
+ gui.__closeButton.style.width = w + 'px';
}
}
@@ -2817,7 +2847,7 @@ dat.GUI = dat.gui.GUI = (function (css, saveDialogueContents, styleSheet, contro
})(dat.utils.css,
"GUI's constructor:\n\n \n\n localStorage on exit.\n\n localStorage will\n override those passed to dat.GUI's constructor. This makes it\n easier to work incrementally, but localStorage is fragile,\n and your friends may not see the same values you do.\n \n GUI\'s constructor:\n\n \n\n localStorage on exit.\n\n localStorage will\n override those passed to dat.GUI\'s constructor. This makes it\n easier to work incrementally, but localStorage is fragile,\n and your friends may not see the same values you do.\n \n GUI\'s constructor:\n\n \n\n localStorage on exit.\n\n localStorage will\n override those passed to dat.GUI\'s constructor. This makes it\n easier to work incrementally, but localStorage is fragile,\n and your friends may not see the same values you do.\n \n