2014-09-08 01:31:51 +00:00
|
|
|
( function( scope ) {
|
2014-09-08 03:36:20 +00:00
|
|
|
|
2014-09-08 22:01:44 +00:00
|
|
|
/* globals Path */
|
2014-09-08 01:31:51 +00:00
|
|
|
'use strict';
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
var Gui = function( params ) {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
if ( !ready ) {
|
|
|
|
Gui.error( 'Gui not ready. Put your code inside Gui.ready()' );
|
|
|
|
}
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
params = params || {};
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 03:36:20 +00:00
|
|
|
// Properties
|
|
|
|
|
|
|
|
this.defined = {};
|
|
|
|
this.localStorage = params.localStorage || false;
|
|
|
|
|
|
|
|
// Make domElement
|
|
|
|
|
2014-09-09 19:53:30 +00:00
|
|
|
this.panel = document.createElement( 'dat-gui' );
|
2014-09-08 03:36:20 +00:00
|
|
|
this.panel.autoPlace = params.autoPlace !== false;
|
|
|
|
|
|
|
|
if ( this.panel.autoPlace ) {
|
|
|
|
document.body.appendChild( this.panel );
|
|
|
|
}
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
// Instance methods
|
2014-09-08 22:01:44 +00:00
|
|
|
// -------------------------------
|
2014-09-08 03:36:20 +00:00
|
|
|
|
|
|
|
Gui.prototype.add = function( object, path ) {
|
|
|
|
|
|
|
|
// Make controller
|
|
|
|
|
|
|
|
var value = Path.get( path ).getValueFrom( object );
|
|
|
|
|
|
|
|
if ( value === null || value === undefined ) {
|
|
|
|
return Gui.error( object + ' doesn\'t have a value for path "' + path + '".' );
|
|
|
|
}
|
|
|
|
|
|
|
|
var args = Array.prototype.slice.call( arguments, 2 );
|
|
|
|
var controller;
|
|
|
|
|
|
|
|
if ( args[ 0 ] instanceof Array || typeof args[ 0 ] == 'object' ) {
|
2014-09-09 19:53:30 +00:00
|
|
|
controller = document.createElement( 'dat-gui-option' );
|
2014-09-08 22:01:44 +00:00
|
|
|
} else {
|
2014-09-08 03:36:20 +00:00
|
|
|
controller = Gui.getController( value );
|
|
|
|
}
|
|
|
|
|
|
|
|
if ( !controller ) {
|
|
|
|
return Gui.error( 'Unrecognized type:', value );
|
|
|
|
}
|
|
|
|
|
|
|
|
controller.watch( object, path );
|
|
|
|
controller.init.apply( controller, args );
|
|
|
|
|
|
|
|
// Make row
|
|
|
|
|
|
|
|
var row = document.createElement( 'gui-row' );
|
|
|
|
row.name = path;
|
|
|
|
|
|
|
|
controller.row = row;
|
|
|
|
|
|
|
|
controller.name = function( name ) {
|
|
|
|
row.name = name;
|
|
|
|
};
|
|
|
|
|
|
|
|
controller.comment = function( comment ) {
|
|
|
|
row.comment = comment;
|
|
|
|
};
|
|
|
|
|
|
|
|
row.appendChild( controller );
|
|
|
|
this.panel.appendChild( row );
|
|
|
|
|
|
|
|
return controller;
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
Gui.prototype.remember = function( object ) {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
|
|
|
|
2014-09-08 03:36:20 +00:00
|
|
|
};
|
2014-09-08 22:01:44 +00:00
|
|
|
|
2014-09-08 03:36:20 +00:00
|
|
|
Gui.prototype.define = function() {
|
|
|
|
|
|
|
|
var name, initialValue, args;
|
|
|
|
|
|
|
|
if ( arguments.length == 1 ) {
|
|
|
|
name = arguments[ 0 ];
|
|
|
|
return this.defined[ name ];
|
2014-09-08 01:31:51 +00:00
|
|
|
}
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 03:36:20 +00:00
|
|
|
initialValue = arguments[ 1 ];
|
|
|
|
name = arguments[ 0 ];
|
|
|
|
|
|
|
|
args = [ this.defined, name ];
|
|
|
|
args = args.concat( Array.prototype.slice.call( arguments, 2 ) );
|
|
|
|
|
|
|
|
this.defined[ name ] = initialValue;
|
|
|
|
|
|
|
|
return this.add.apply( this, args );
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
Gui.prototype.listenAll = function() {
|
|
|
|
|
|
|
|
Gui.warn( 'controller.listenAll() is deprecated. All controllers are listened for free.' );
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
};
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-01 03:54:59 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
// Register custom controllers
|
|
|
|
// -------------------------------
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
var controllers = {};
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
Gui.register = function( elementName, test ) {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
controllers[ elementName ] = test;
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
};
|
2014-08-27 00:01:15 +00:00
|
|
|
|
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
// Returns a controller based on a value
|
|
|
|
// -------------------------------
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
Gui.getController = function( value ) {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
for ( var type in controllers ) {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
var test = controllers[ type ];
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
if ( test( value ) ) {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
return document.createElement( type );
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
}
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
}
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
};
|
2014-08-27 00:01:15 +00:00
|
|
|
|
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
// Gui ready handler ... * shakes fist at polymer *
|
|
|
|
// -------------------------------
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
var ready = false;
|
|
|
|
var readyHandlers = [];
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
document.addEventListener( 'polymer-ready', function() {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
ready = true;
|
|
|
|
readyHandlers.forEach( function( fnc ) {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
fnc();
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
} );
|
|
|
|
|
|
|
|
} );
|
|
|
|
|
|
|
|
Gui.ready = function( fnc ) {
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 02:43:10 +00:00
|
|
|
if ( ready ) {
|
|
|
|
fnc();
|
2014-09-08 22:01:44 +00:00
|
|
|
} else {
|
2014-09-08 02:43:10 +00:00
|
|
|
readyHandlers.push( fnc );
|
|
|
|
}
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
};
|
2014-09-03 23:33:28 +00:00
|
|
|
|
|
|
|
|
2014-09-08 03:36:20 +00:00
|
|
|
// Console
|
2014-09-08 01:31:51 +00:00
|
|
|
// -------------------------------
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
Gui.error = function() {
|
|
|
|
var args = Array.prototype.slice.apply( arguments );
|
|
|
|
args.unshift( 'dat-gui ::' );
|
|
|
|
console.error.apply( console, args );
|
|
|
|
};
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
Gui.warn = function() {
|
|
|
|
var args = Array.prototype.slice.apply( arguments );
|
|
|
|
args.unshift( 'dat-gui ::' );
|
|
|
|
console.warn.apply( console, args );
|
|
|
|
};
|
2014-09-03 23:33:28 +00:00
|
|
|
|
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
// Old namespaces
|
|
|
|
// -------------------------------
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
var dat = {};
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
dat.gui = {};
|
|
|
|
dat.gui.GUI = Gui;
|
|
|
|
dat.GUI = dat.gui.GUI;
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
dat.color = {};
|
|
|
|
dat.color.Color = function() {};
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
dat.dom = {};
|
|
|
|
dat.dom.dom = function() {};
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
dat.controllers = {};
|
2014-09-09 19:53:30 +00:00
|
|
|
dat.controllers.Controller = constructor( 'dat-gui-base' );
|
|
|
|
dat.controllers.NumberController = constructor( 'dat-gui-number' );
|
|
|
|
dat.controllers.FunctionController = constructor( 'dat-gui-function' );
|
|
|
|
dat.controllers.ColorController = constructor( 'dat-gui-color' );
|
|
|
|
dat.controllers.BooleanController = constructor( 'dat-gui-boolean' );
|
|
|
|
dat.controllers.OptionController = constructor( 'dat-gui-option' );
|
2014-09-08 01:31:51 +00:00
|
|
|
|
|
|
|
dat.controllers.NumberControllerBox = dat.controllers.NumberController;
|
|
|
|
dat.controllers.NumberControllerSlider = dat.controllers.NumberController;
|
|
|
|
|
|
|
|
function constructor( elementName ) {
|
|
|
|
|
|
|
|
return function( object, path ) {
|
|
|
|
var el = document.createElement( elementName );
|
|
|
|
el.watch( object, path );
|
|
|
|
return el;
|
|
|
|
};
|
|
|
|
|
|
|
|
}
|
2014-09-03 23:33:28 +00:00
|
|
|
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
// Export
|
|
|
|
// -------------------------------
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:31:51 +00:00
|
|
|
scope.dat = dat;
|
|
|
|
scope.Gui = Gui;
|
2014-09-08 22:01:44 +00:00
|
|
|
|
2014-08-27 00:01:15 +00:00
|
|
|
|
2014-09-08 01:38:29 +00:00
|
|
|
} )( this );
|