dat.gui/index.html

89 lines
2.4 KiB
HTML
Raw Normal View History

2011-01-23 21:23:53 +00:00
<html>
<head>
<link href="gui.css" media="screen" rel="stylesheet" type="text/css" />
2011-01-24 02:59:29 +00:00
<link href="demo.css" media="screen" rel="stylesheet" type="text/css" />
2011-01-25 07:43:32 +00:00
<script type="text/javascript" src="http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js"></script>
<script type="text/javascript" src="gui.js"></script>
<script type="text/javascript" src="controllers/slider.js"></script>
<script type="text/javascript" src="controllers/controller.js"></script>
<script type="text/javascript" src="controllers/controller.string.js"></script>
<script type="text/javascript" src="controllers/controller.number.js"></script>
<script type="text/javascript" src="controllers/controller.boolean.js"></script>
<script type="text/javascript" src="controllers/controller.function.js"></script>
<script id="demo" type="text/javascript">
var controllableObject =
2011-01-24 02:59:29 +00:00
{
numberProperty: 20,
constrainedNum: 0,
textProperty: "a string",
anotherTextProperty: "another string",
2011-01-24 02:59:29 +00:00
booleanProperty: false,
2011-01-24 21:21:21 +00:00
anotherBooleanProperty: false,
2011-01-24 02:59:29 +00:00
functionProperty: function() {
alert("I am a function!");
}
};
2011-01-23 21:39:07 +00:00
2011-01-23 22:35:19 +00:00
window.onload = function() {
2011-01-25 07:43:32 +00:00
prettyPrint();
2011-01-24 02:59:29 +00:00
GUI.start();
// Creates a number box
GUI.add(controllableObject, "numberProperty");
// Creates a slider (min, max)
GUI.add(controllableObject, "constrainedNum", -100, 100)
2011-01-24 02:59:29 +00:00
// Creates a text field
GUI.add(controllableObject, "textProperty");
// Creates a checkbox
GUI.add(controllableObject, "booleanProperty");
// Creates a button
2011-01-25 05:31:20 +00:00
GUI.add(controllableObject, "functionProperty")
.setName("Fire a Function");
2011-01-23 22:35:19 +00:00
};
2011-01-23 21:23:53 +00:00
</script>
</head>
<body>
<pre id="demo-pre" class="prettyprint">
var controllableObject =
{
numberProperty: 20,
constrainedNum: 0,
textProperty: "a string",
booleanProperty: false,
functionProperty: function() {
alert("I am a function!");
}
};
window.onload = function() {
GUI.start();
// Creates a number box
GUI.add(controllableObject, "numberProperty");
// Creates a slider (min, max)
2011-01-25 05:31:20 +00:00
GUI.add(controllableObject, "constrainedNum", -100, 100, 0);
// Creates a text field
GUI.add(controllableObject, "textProperty");
// Creates a checkbox
GUI.add(controllableObject, "booleanProperty");
// Creates a button
2011-01-25 05:31:20 +00:00
GUI.add(controllableObject, "functionProperty")
.setName("Fire a Function");
};
2011-01-24 02:59:29 +00:00
</pre>
2011-01-23 21:23:53 +00:00
</body>
</html>