dat.gui/examples/index.html
Doug Fritz bb66f53062 merge
2014-09-09 13:19:48 -07:00

94 lines
2.4 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>dat-gui kitchen sink</title>
<<<<<<< HEAD
<script src="../build/gui.js"></script>
<!-- <link rel="import" href="../gui.html"> -->
||||||| merged common ancestors
<script src="../build/gui.js"></script>
<!-- <link rel="import" href="../gui.html"> -->
=======
<!-- // <script src="../build/gui.js"></script> -->
<link rel="import" href="../gui.html">
>>>>>>> 8d86460ebde6d3dda4dec6e7783f0223fca59d00
<meta name="viewport" content="width=device-width, user-scalable=no">
<style type="text/css">
body {
background: #aaa;
}
</style>
</head>
<body>
body content.
<script>
var object = {
"boolean": false,
"listen4Free": 332,
"zeroTo1": 0,
"step": 10,
"straddleZero": 0,
"maxIsNegative": -2,
"hasComment": 0,
"optionController": 'a'
};
// How do we kill polymer-ready ...
Gui.ready( function() {
gui = new Gui();
gui.panel.docked = true;
gui.add( gui, 'panel.docked' );
var r = gui.add( gui, 'panel.open' );
gui.add( r.row, 'name' );
gui.add( object, 'boolean' );
gui.add( object, 'listen4Free' );
gui.add( object, 'listen4Free' );
gui.add( object, 'listen4Free', 0, 1000 );
gui.add( object, 'zeroTo1', 0, 1 );
gui.add( object, 'hasComment' ).comment( 'Hi there.' );
gui.add( object, 'listen4Free' ).name( 'customName' )
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.' );
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 );
gui.var( 'anonymousSlider', 0, -1, 1 ).comment( 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam semper dui metus');
gui.add( object, 'optionController', { A: 'a', B: 'b', C: 'c'} );
gui.add( object, 'optionController', [ 'a', 'b', 'c' ] )
.onChange( function( val ) {
// console.log( val );
});
} );
</script>
</body>
</html>