diff --git a/build/dat-gui.html b/build/dat-gui.html index 1f111e6..46cf03f 100755 --- a/build/dat-gui.html +++ b/build/dat-gui.html @@ -6,7 +6,7 @@ var e,f,g,h=b.type;if("load"===h&&!b.bubbles){var i=c;i instanceof Q.Document&&( +},_register:function(){c(this.extends)&&!b(this.extends)&&console.warn("%s is attempting to extend %s, an unregistered element or one that was not registered with Polymer.",this.name,this.extends),this.register(this.name,this.extends),this.registered=!0},waitingForPrototype:function(a){return h(a)?void 0:(i(a,this),this.handleNoScript(a),!0)},handleNoScript:function(a){this.hasAttribute("noscript")&&!this.noscript&&(this.noscript=!0,Polymer(a))},waitingForResources:function(){return this._needsResources},waitingForQueue:function(){return f.enqueue(this,this.registerWhenReady,this._register)},loadResources:function(){this._needsResources=!0,this.loadStyles(function(){this._needsResources=!1,this.registerWhenReady()}.bind(this))}});e.publish(e.declaration,j),g(function(){document.body.removeAttribute("unresolved"),document.dispatchEvent(new CustomEvent("polymer-ready",{bubbles:!0}))}),document.registerElement("polymer-element",{prototype:j})}(Polymer),function(){var a=document.createElement("polymer-element");a.setAttribute("name","auto-binding"),a.setAttribute("extends","template"),a.init(),Polymer("auto-binding",{createdCallback:function(){this.syntax=this.bindingDelegate=this.makeSyntax(),Polymer.whenPolymerReady(function(){this.model=this,this.setAttribute("bind",""),this.async(function(){this.marshalNodeReferences(this.parentNode),this.fire("template-bound")})}.bind(this))},makeSyntax:function(){var a=Object.create(Polymer.api.declaration.events),b=this;a.findController=function(){return b.model};var c=new PolymerExpressions,d=c.prepareBinding;return c.prepareBinding=function(b,e,f){return a.prepareEventBinding(b,e,f)||d.call(c,b,e,f)},c}})}(); diff --git a/build/dat-gui.js b/build/dat-gui.js index 34ae393..604bb88 100755 --- a/build/dat-gui.js +++ b/build/dat-gui.js @@ -6,7 +6,7 @@ document.write(['', +'},_register:function(){c(this.extends)&&!b(this.extends)&&console.warn("%s is attempting to extend %s, an unregistered element or one that was not registered with Polymer.",this.name,this.extends),this.register(this.name,this.extends),this.registered=!0},waitingForPrototype:function(a){return h(a)?void 0:(i(a,this),this.handleNoScript(a),!0)},handleNoScript:function(a){this.hasAttribute("noscript")&&!this.noscript&&(this.noscript=!0,Polymer(a))},waitingForResources:function(){return this._needsResources},waitingForQueue:function(){return f.enqueue(this,this.registerWhenReady,this._register)},loadResources:function(){this._needsResources=!0,this.loadStyles(function(){this._needsResources=!1,this.registerWhenReady()}.bind(this))}});e.publish(e.declaration,j),g(function(){document.body.removeAttribute("unresolved"),document.dispatchEvent(new CustomEvent("polymer-ready",{bubbles:!0}))}),document.registerElement("polymer-element",{prototype:j})}(Polymer),function(){var a=document.createElement("polymer-element");a.setAttribute("name","auto-binding"),a.setAttribute("extends","template"),a.init(),Polymer("auto-binding",{createdCallback:function(){this.syntax=this.bindingDelegate=this.makeSyntax(),Polymer.whenPolymerReady(function(){this.model=this,this.setAttribute("bind",""),this.async(function(){this.marshalNodeReferences(this.parentNode),this.fire("template-bound")})}.bind(this))},makeSyntax:function(){var a=Object.create(Polymer.api.declaration.events),b=this;a.findController=function(){return b.model};var c=new PolymerExpressions,d=c.prepareBinding;return c.prepareBinding=function(b,e,f){return a.prepareEventBinding(b,e,f)||d.call(c,b,e,f)},c}})}();', '', '', '', diff --git a/build/dat-gui.shim.js b/build/dat-gui.shim.js index 123c7d6..c2fff12 100644 --- a/build/dat-gui.shim.js +++ b/build/dat-gui.shim.js @@ -1 +1 @@ -!function(t){"use strict";var n=function(){this.vars={}};n.ready=function(t){t()},n.prototype.var=function(t,n){return this.vars[t]=n,i},n.prototype.add=function(){return i};var r=function(){return this},i={on:r};t.Gui=n}(this); \ No newline at end of file +!function(t){var n=function(){this.vars={},this.$={dockedContent:document.body},Object.defineProperties(this.$.dockedContent,{offsetWidth:{get:function(){return window.innerWidth}},offsetHeight:{get:function(){return window.innerHeight}}})};n.ready=function(t){return window.Promise&&0===arguments.length?new Promise(function(t){t()}):void t()},n.prototype.addEventListener=function(t,n){"resize"==t&&window.addEventListener(t,n)},n.prototype.var=function(t,n){return this.vars[t]=n,i},n.prototype.add=function(){return i};var e=function(){return this},i={on:e};t.Gui=n}(this); \ No newline at end of file diff --git a/elements/dat-gui/dat-gui.js b/elements/dat-gui/dat-gui.js index e9209ef..e6c3e95 100644 --- a/elements/dat-gui/dat-gui.js +++ b/elements/dat-gui/dat-gui.js @@ -18,6 +18,14 @@ Polymer( 'dat-gui', { this.domElement = this; // legacy + + // this winds up triggering like all the time? + + // var _this = this; + // window.addEventListener( 'resize', function() { + // _this.asyncFire( 'resize' ); + // }, false ); + }, // @@ -122,12 +130,25 @@ Polymer( 'dat-gui', { } else { // todo: success - Gui.postJSON( this.savePath, this.serialize(), function() {}, Gui.error ); + Gui.postJSON( this.savePath, this.serialize(), this.saveSuccess, this.saveError, this ); } }, + saveSuccess: function() { + + Gui.log( 'Saved data to ' + this.savePath ); + + }, + + saveError: function( error ) { + + Gui.warn( 'Failed to save data to ' + this.savePath + '. Disabling automatic save.' ); + this.removeEventListener( 'change', this._debouncedSave, false ); + + }, + unserialize: function( data ) { for ( var objectKey in this._controllersByObject ) { diff --git a/elements/dat-gui/static.js b/elements/dat-gui/static.js index a4eed19..f675d65 100644 --- a/elements/dat-gui/static.js +++ b/elements/dat-gui/static.js @@ -1,13 +1,5 @@ ( function( scope ) { -// { -// autoPlace: true, -// localStorage: false, -// autoSave: false, -// savePath: Gui.DEFAULT_SAVE_PATH, -// load: {}, -// } - var Gui = function( params ) { if ( !ready ) { @@ -22,29 +14,44 @@ var Gui = function( params ) { Gui.constructor = function( params ) { + var _this = this; + params = params || {}; // Saving this.localStorage = scope.localStorage && ( params.localStorage || false ); + this.loadPath = params.loadPath || params.savePath || Gui.DEFAULT_LOAD_PATH; this.savePath = params.savePath || Gui.DEFAULT_SAVE_PATH; + params.load = params.save || false; + + // Bind save listener + if ( params.save ) { - this.addEventListener( 'change', Gui.debounce( this.save, this, 50 ) ); + this._debouncedSave = Gui.debounce( this.save, this, 50 ); + this.addEventListener( 'change', this._debouncedSave, false ); } - if ( params.save && !this.localStorage ) { + // Load initial data - Gui.getJSON( this.savePath, this.unserialize, this ); + if ( params.load && !this.localStorage ) { + + Gui.getJSON( this.loadPath, this.unserialize, function( error ) { + + Gui.warn( 'Failed to load save data from ' + this.loadPath + ': "' + error + '"' ); + + }, this ); } - if ( this.localStorage && scope.localStorage ) { + // Get local storage, if that's your thing. + + if ( this.localStorage ) { - var _this = this; setTimeout( function() { var data = localStorage.getItem( Gui.LOCAL_STORAGE_KEY ); @@ -54,7 +61,6 @@ Gui.constructor = function( params ) { } - // Autoplace this.autoPlace = params.autoPlace !== false; @@ -65,14 +71,6 @@ Gui.constructor = function( params ) { } - // Load - - if ( params.load ) { - - this.load( params.load ); - - } - }; @@ -81,6 +79,7 @@ Gui.constructor = function( params ) { // ------------------------------- Gui.DEFAULT_SAVE_PATH = 'http://localhost:7999/'; +Gui.DEFAULT_LOAD_PATH = 'dat-gui.json'; Gui.serialize = function( object ) { @@ -108,15 +107,27 @@ Gui.serialize = function( object ) { }; -Gui.getJSON = function( path, callback, scope ) { +Gui.getJSON = function( path, success, error, scope ) { var xhr = new XMLHttpRequest(); xhr.open( 'GET', path, true ); xhr.onreadystatechange = function() { - if ( xhr.readyState == 4 && xhr.status == 200 ) { - callback.call( scope, JSON.parse( xhr.responseText ) ); + if ( xhr.readyState == 4 ) { + + if ( xhr.status == 200 ) { + + try { + success.call( scope, JSON.parse( xhr.responseText ) ); + } catch (e) { + error.call( scope, e ); + } + + } else { + error.call( scope, xhr.statusText ); + } + } }; @@ -125,20 +136,27 @@ Gui.getJSON = function( path, callback, scope ) { }; -Gui.postJSON = function( path, data, callback, scope ) { +Gui.postJSON = function( path, data, success, error, scope ) { var xhr = new XMLHttpRequest(); xhr.open( 'POST', path, true ); xhr.onreadystatechange = function() { - if ( xhr.readyState == 4 && xhr.status == 200 ) { - callback.call( scope, xhr.responseText ); + if ( xhr.readyState == 4 ) { + + if ( xhr.status == 200 ) { + success.call( scope, xhr.responseText ); + } else { + error.call( scope, xhr.statusText ); + } + } }; xhr.send( JSON.stringify( data ) ); + }; Gui.debounce = function( func, scope, wait ) { @@ -252,6 +270,12 @@ Gui.warn = function() { console.warn.apply( console, args ); }; +Gui.log = function() { + var args = Array.prototype.slice.apply( arguments ); + args.unshift( 'dat-gui ::' ); + console.log.apply( console, args ); +}; + // Old namespaces // ------------------------------- diff --git a/elements/shim.js b/elements/shim.js index 928d3e0..87a8259 100644 --- a/elements/shim.js +++ b/elements/shim.js @@ -1,19 +1,57 @@ // Use gui.shim.js in production when you want to use dat.gui to recall values without any of the interface. ( function( scope ) { -'use strict'; var Gui = function() { this.vars = {}; + this.$ = { + dockedContent: document.body + }; + + Object.defineProperties( this.$.dockedContent, { + + offsetWidth: { + + get: function() { + return window.innerWidth; + } + + }, + + offsetHeight: { + + get: function() { + return window.innerHeight; + } + + } + + } ); + + }; Gui.ready = function( fnc ) { + if ( window.Promise && arguments.length === 0 ) { + return new Promise( function( resolve ) { + resolve(); + } ); + } + fnc(); }; +Gui.prototype.addEventListener = function( evt, fnc ) { + + if ( evt == 'resize' ) { + window.addEventListener( evt, fnc ); + } + +}; + Gui.prototype.var = function( name, value ) { this.vars[ name ] = value;