mirror of
https://github.com/dataarts/dat.gui.git
synced 2024-12-12 04:08:27 +00:00
99 lines
5.0 KiB
HTML
99 lines
5.0 KiB
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
|
|
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
|
|
|
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<title>gui-dat</title>
|
|
<link rel="icon" type="image/png" href="demo/assets/favicon.png" />
|
|
<link href="demo/demo.css" media="screen" rel="stylesheet" type="text/css" />
|
|
<link href="gui.css" media="screen" rel="stylesheet" type="text/css" />
|
|
<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.boolean.js"></script>
|
|
<script type="text/javascript" src="controllers/controller.function.js"></script>
|
|
<script type="text/javascript" src="controllers/controller.number.js"></script>
|
|
<script type="text/javascript" src="controllers/controller.string.js"></script>
|
|
<script type="text/javascript" src="time/scrubber.js"></script>
|
|
<script type="text/javascript" src="time/timer.js"></script>
|
|
<script type="text/javascript" src="demo/improvedNoise.js"></script>
|
|
<script type="text/javascript" src="demo/prettify.js"></script>
|
|
<script type="text/javascript" src="demo/demo.js"></script>
|
|
<script type="text/javascript">
|
|
//<![CDATA[
|
|
var timer;
|
|
window.onload = function() {
|
|
GUI.loadJSON({"guis":[{"open":true,"width":280,"openHeight":319,"scroll":1,"values":["time",1.35,8.5602,0.2792,0.0871,46.3269,false,null,0,null],"timer":{"windowMin":8617.568021757952,"windowWidth":11596,"playhead":10000,"snapIncrement":250,"useSnap":true,"scrubbers":[{"points":[{"value":"gui-dat","time":-3250},{"value":"over","time":5500},{"value":"time","time":9750}]},{"points":[{"value":1.3499999999999999,"time":644.1387},{"value":1.3499999999999999,"time":9750,"tween":"CircularEaseIn"}]},{"points":[{"value":0,"time":-2750,"tween":"SinusoidalEaseInOut"},{"value":7,"time":659.1556},{"value":7,"time":2211.2348},{"value":5.525,"time":5500},{"value":8.955,"time":6413.8663},{"value":8.339963195382083,"time":12000,"tween":"SinusoidalEaseInOut"},{"value":0,"time":16500}]},{"points":[{"value":0.5049,"time":-532.8902,"tween":"Hold"},{"value":0.5544,"time":1666.4321},{"value":0.01,"time":3382.0743,"tween":"Hold"},{"value":0.9900000000000001,"time":5500},{"value":0.18810000000000002,"time":9500,"tween":"Hold"},{"value":0.3069,"time":9750},{"value":0.1683,"time":11000},{"value":0.0495,"time":11750}]},{"points":[{"value":0.39899999999999997,"time":1652.5592,"tween":"SinusoidalEaseInOut"},{"value":7.6000000000000005,"time":3471.5432,"tween":"Hold"},{"value":0.8,"time":5500},{"value":1.3,"time":6000},{"value":0.1,"time":9750},{"value":0.01,"time":11500,"tween":"SinusoidalEaseInOut"},{"value":1.9000000000000001,"time":15250}]},{"points":[{"value":10,"time":795.5192,"tween":"Hold"},{"value":10,"time":5500},{"value":75,"time":5500,"tween":"CircularEaseOut"},{"value":45,"time":9750}]},{"points":[]},{"points":[{"time":9750}]},{"points":[{"value":0,"time":250,"tween":"Hold"}]},{"points":[{"time":18250}]}]}},{"open":true,"width":280,"openHeight":127,"scroll":0,"values":[null,true,250,null]}]});
|
|
|
|
var fizzyText = new FizzyText("gui-dat");
|
|
|
|
var gui = new GUI();
|
|
|
|
var timerControls = new GUI();
|
|
|
|
timer = new GUI.Timer(gui);
|
|
|
|
// Text field
|
|
gui.add(fizzyText, "message");
|
|
|
|
gui.add(fizzyText, "scale", 0.25, 4);
|
|
|
|
// Sliders with min and max
|
|
gui.add(fizzyText, "maxSize", 0, 20);
|
|
gui.add(fizzyText, "growthSpeed", 0.01, 1);
|
|
|
|
gui.add(fizzyText, "speed", 0, 10);
|
|
|
|
// Sliders with min, max and increment.
|
|
gui.add(fizzyText, "noiseStrength", 10, 100, 5);
|
|
|
|
// Boolean checkbox
|
|
gui.add(fizzyText, "displayOutline");
|
|
|
|
// Fires a function called "explode"
|
|
gui.add(fizzyText, "explode");
|
|
|
|
|
|
timerControls.add(timer, "playPause");
|
|
timerControls.add(timer, "useSnap");
|
|
timerControls.add(timer, "snapIncrement");
|
|
|
|
timerControls.add(GUI, "save");
|
|
|
|
var thing = {
|
|
loop: function() {
|
|
timer.playhead = -3500;
|
|
timer.play();
|
|
}
|
|
};
|
|
|
|
|
|
|
|
|
|
gui.add(fizzyText, 'y', -500, 500);
|
|
|
|
|
|
gui.add(thing, 'loop');
|
|
|
|
GUI.hide();
|
|
timer.playhead = 0;
|
|
timer.play();
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
//]]>
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<!-- GUIDAT logo -->
|
|
<div id="helvetica-demo"></div>
|
|
|
|
|
|
</body>
|
|
</html>
|