diff --git a/README b/README deleted file mode 100644 index 1f8431a..0000000 --- a/README +++ /dev/null @@ -1,42 +0,0 @@ -# gui-dat -**gui-dat** is a lightweight controller library for JavaScript. It allows you to easily manipulate variables and fire functions on the fly. -## Basic Usage - - -+ ui-dat will infer the type of the property you're trying to add (based on its initial value) and create the corresponding control. -+ The properties must be public, i.e. defined by `**this**.prop = value`. -## Monitor variable changes outside of the GUI -Let's say you have a variable that changes by itself from time to time. If you'd like the GUI to reflect those changes, use the listen() method - GUI.add(obj, "propName").listen(); -## Fire a function when someone uses a control - GUI.add(obj, "propName").onChange(function(n) { - alert("You changed me to " + n); - }); -Initiated by [George Michael Brower]:http://georgemichaelbrower.com/ and [Jono Brandel]:http://jonobr1.com/ of the Data Arts Team, Google Creative Lab. diff --git a/controllers/controller.js b/controllers/controller.js index 80253dc..a336601 100644 --- a/controllers/controller.js +++ b/controllers/controller.js @@ -5,12 +5,12 @@ var Controller = function() { this.parent = null; this.value = null; - this.setName = function(n) { + this.name = function(n) { this.propertyNameElement.innerHTML = n; return this; }; - this.setWatched = function() { + this.listen = function() { this.parent.watchController(this); return this; }; @@ -58,7 +58,7 @@ var Controller = function() { this.propertyNameElement = document.createElement('span'); this.propertyNameElement.setAttribute('class', 'guidat-propertyname'); - this.setName(this.propertyName); + this.name(this.propertyName); this.domElement.appendChild(this.propertyNameElement); this.makeUnselectable(this.domElement); diff --git a/demo/demo.js b/demo/demo.js index 0a4298a..5bea7e1 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -101,7 +101,7 @@ function FizzyText(message) { // Called once per frame, updates the animation. var render = function () { - that.framesRendered ++; + that.framesRendered ++; g.clearRect(0, 0, width, height); diff --git a/index.html b/index.html index 259cc21..e4d62c6 100644 --- a/index.html +++ b/index.html @@ -46,10 +46,10 @@ gui.add(fizzyText, "displayOutline"); // Watches a property - gui.add(fizzyText, "framesRendered").setWatched(); + gui.add(fizzyText, "framesRendered").listen(); // Fires a function called "explode" - gui.add(fizzyText, "explode").setName("Explode!"); // Specify a custom name. + gui.add(fizzyText, "explode").name("Explode!"); // Specify a custom name. }; @@ -94,7 +94,7 @@ window.onload = function() { gui.add(fizzyText, "displayOutline"); // Fires a function called "explode" - gui.add(fizzyText, "explode").setName("Explode!"); // Specify a custom name. + gui.add(fizzyText, "explode").name("Explode!"); // Specify a custom name. }; @@ -105,7 +105,7 @@ window.onload = function() {
this.prop = value
.