trying to make a graceful failure for autoSave 404

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);
+!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);

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 ) {

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 ) {
+        if ( xhr.readyState == 4 ) {
-            callback.call( scope, JSON.parse( xhr.responseText ) );
+
+            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 ) {
+        if ( xhr.readyState == 4 ) {
-            callback.call( scope, xhr.responseText );
+
+            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
 // -------------------------------

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;