2014-08-27 00:01:15 +00:00
<!doctype html>
< html lang = "en" >
< head >
< meta charset = "utf-8" >
< title > dat-gui kitchen sink< / title >
2014-09-10 22:51:48 +00:00
2014-09-10 23:03:24 +00:00
< script src = "../build/dat-gui.js" > < / script >
<!--
2014-09-15 02:48:00 +00:00
< script src = "../../platform/platform.js" > < / script >
2014-09-10 22:51:48 +00:00
< link rel = "import" href = "../dat-gui.html" >
2014-09-10 23:03:24 +00:00
-->
2014-08-27 00:01:15 +00:00
2014-09-03 16:16:11 +00:00
< meta name = "viewport" content = "width=device-width, user-scalable=no" >
2014-09-09 20:18:15 +00:00
2014-08-27 00:01:15 +00:00
< style type = "text/css" >
body {
background: #aaa;
}
< / style >
< / head >
< body >
body content.
< script >
2014-09-15 02:48:00 +00:00
/* globals Gui */
2014-08-27 00:01:15 +00:00
2014-09-09 20:18:15 +00:00
var object = {
2014-09-02 17:13:35 +00:00
"boolean": false,
2014-08-27 00:01:15 +00:00
"listen4Free": 332,
"zeroTo1": 0,
"step": 10,
"straddleZero": 0,
"maxIsNegative": -2,
2014-09-07 20:18:36 +00:00
"hasComment": 0,
"optionController": 'a'
2014-08-27 00:01:15 +00:00
};
2014-09-09 20:18:15 +00:00
// How do we kill polymer-ready ...
2014-09-03 00:00:52 +00:00
Gui.ready( function() {
2014-09-09 20:18:15 +00:00
2014-09-15 02:48:00 +00:00
var gui = new Gui();
2014-08-27 00:01:15 +00:00
2014-09-15 20:15:34 +00:00
gui.docked = true;
2014-08-27 00:01:15 +00:00
2014-09-15 20:15:34 +00:00
gui.add( gui, 'docked' );
2014-08-27 00:01:15 +00:00
2014-09-15 20:15:34 +00:00
var r = gui.add( gui, 'open' );
2014-08-27 00:01:15 +00:00
gui.add( r.row, 'name' );
2014-09-02 17:13:35 +00:00
gui.add( object, 'boolean' );
2014-09-09 20:18:15 +00:00
2014-08-27 00:01:15 +00:00
gui.add( object, 'listen4Free' );
gui.add( object, 'listen4Free' );
gui.add( object, 'listen4Free', 0, 1000 );
gui.add( object, 'zeroTo1', 0, 1 );
2014-09-09 20:18:15 +00:00
2014-08-27 00:01:15 +00:00
gui.add( object, 'hasComment' ).comment( 'Hi there.' );
gui.add( object, 'listen4Free' ).name( 'customName' )
2014-09-07 20:18:36 +00:00
gui.add( object, 'step', 0, 50, 5 ).comment( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper dui metus, sed aliquet nulla fermentum nec. Sed massa felis, congue nec libero ut.' );
2014-08-27 00:01:15 +00:00
gui.add( object, 'straddleZero', -1, 1, 0.01 ).comment( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper dui metus, sed aliquet nulla fermentum nec.' );
gui.add( object, 'maxIsNegative', -5, -2 );
2014-09-09 20:18:15 +00:00
gui.var( 'anonymousSlider', 0, -1, 1 ).comment( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper dui metus');
2014-08-27 00:01:15 +00:00
2014-09-07 20:18:36 +00:00
gui.add( object, 'optionController', { A: 'a', B: 'b', C: 'c'} );
gui.add( object, 'optionController', [ 'a', 'b', 'c' ] )
.onChange( function( val ) {
2014-09-07 23:55:40 +00:00
// console.log( val );
2014-09-07 20:18:36 +00:00
});
2014-08-27 00:01:15 +00:00
2014-09-02 16:00:08 +00:00
} );
2014-08-27 00:01:15 +00:00
< / script >
< / body >
2014-09-09 20:18:15 +00:00
< / html >