dat.gui/index.html

<!doctype html>
    <head>
        <title>gui-dat</title>
        
        <link rel="icon" type="image/gif" href="demo/assets/favicon.gif">
        <link href="demo/demo.css" media="screen" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="gui.min.js"></script>
        <script type="text/javascript" src="demo/improvedNoise.js"></script>
        <script type="text/javascript" src="demo/demo.js"></script>
        <script type="text/javascript">
            window.onload = function() {


               var fizzyText = new FizzyText("gui-dat");

               GUI.start();
               
               // Text field
               GUI.add(fizzyText, "message");

               // Sliders with min and max
               GUI.add(fizzyText, "maxSize", 0.5, 7);
               GUI.add(fizzyText, "growthSpeed", 0.01, 1);
               GUI.add(fizzyText, "speed", 0.1, 2);
               
               // 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")
               
            };
            
            var _gaq = _gaq || [];
            _gaq.push(['_setAccount', 'UA-20996084-1']);
            _gaq.push(['_trackPageview']);
            
            (function() {
                var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
                ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
                var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
            })();
        </script>
    </head>
    <body>
	    <div id = "helvetica-demo"></div>
        <h1><a href = "http://twitter.com/guidat"><img src = "demo/assets/favicon.gif" border = "0" alt = "GUI-DAT flag" /></a></h1>
        <p>
            <strong>gui-dat</strong> is a lightweight controller library for JavaScript. It allows you to easily manipulate variables and fire functions on the fly.
        </p>
    
		<ul>
			<li><a href=""><strong>Download the minified source</strong></a> <small>[9.8kb]</small></li>
        	<li><a href="http://github.com/jonobr1/GUI-DAT">Contribute on GitHub!</a></p></li>
        </ul>
    
        <h2>Basic Usage</h2>
        <pre id="demo-pre" class="prettyprint"><span class="tag">&lt;script</span><span class="pln"> </span><span class="atn">type</span><span class="pun">=</span><span class="atv">"text/javascript"</span><span class="pln"> </span><span class="atn">src</span><span class="pun">=</span><span class="atv">"gui.min.js"</span><span class="tag">&gt;&lt;/script&gt;</span><span class="pln"><br></span><span class="tag">&lt;script</span><span class="pln"> </span><span class="atn">type</span><span class="pun">=</span><span class="atv">"text/javascript"</span><span class="tag">&gt;</span><span class="pln"><br><br>window</span><span class="pun">.</span><span class="pln">onload </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">function</span><span class="pun">()</span><span class="pln"> </span><span class="pun">{</span><span class="pln"><br><br>&nbsp; &nbsp;</span><span class="kwd">var</span><span class="pln"> fizzyText </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">new</span><span class="pln"> </span><span class="typ"><a href="demo/demo.js">FizzyText</a></span><span class="pun">(</span><span class="str">"gui-dat"</span><span class="pun">);</span><span class="pln"><br><br>&nbsp; &nbsp;GUI</span><span class="pun">.</span><span class="pln">start</span><span class="pun">();</span><span class="pln"><br>&nbsp; &nbsp;<br>&nbsp; &nbsp;</span><span class="com">// Adds a text field</span><span class="pln"><br>&nbsp; &nbsp;GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"message"</span><span class="pun">);</span><span class="pln"><br>&nbsp; &nbsp;<br>&nbsp; &nbsp;</span><span class="com">// Adds sliders with min and max</span><span class="pln"><br>&nbsp; &nbsp;GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"maxSize"</span><span class="pun">,</span><span class="pln"> </span><span class="lit">0.5</span><span class="pun">,</span><span class="pln"> </span><span class="lit">7</span><span class="pun">);</span><span class="pln"><br>&nbsp; &nbsp;GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"growthSpeed"</span><span class="pun">,</span><span class="pln"> </span><span class="lit">0.01</span><span class="pun">,</span><span class="pln"> </span><span class="lit">1</span><span class="pun">);</span><span class="pln"><br>&nbsp; &nbsp;GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"speed"</span><span class="pun">,</span><span class="pln"> </span><span class="lit">0.1</span><span class="pun">,</span><span class="pln"> </span><span class="lit">2</span><span class="pun">);</span><span class="pln"><br>&nbsp; &nbsp;<br>&nbsp; &nbsp;</span><span class="com">// Adds sliders with min, max and increment.</span><span class="pln"><br>&nbsp; &nbsp;GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"noiseStrength"</span><span class="pun">,</span><span class="pln"> </span><span class="lit">10</span><span class="pun">,</span><span class="pln"> </span><span class="lit">100</span><span class="pun">,</span><span class="pln"> </span><span class="lit">5</span><span class="pun">);</span><span class="pln"><br>&nbsp; &nbsp;<br>&nbsp; &nbsp;</span><span class="com">// Adds a boolean checkbox</span><span class="pln"><br>&nbsp; &nbsp;GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span 
        
    	<ul id="desc">
    		<li><strong>gui-dat</strong> will infer the type of the property you're trying to add<br/>(based on its initial value) and create the corresponding control.</li>
    		<li>The properties must be public, i.e. defined by <code><strong>this</strong>.prop = value</code>.</li>
    	</ul>
		<footer> 
            By <a href="http://georgemichaelbrower.com/">George Michael Brower</a>, <a href="http://jonobr1.com/">Jono Brandel</a>, and <a href="http://github.com/jonobr1/GUI-DAT">you</a>.
        </footer> 
    </body>
</html>
added authors to index 2011-01-25 07:42:20 +00:00			`<!doctype html>`
			`<head>`
Version 0.1 2011-01-27 02:45:34 +00:00			`<title>gui-dat</title>`
added favicon 2011-01-25 08:14:24 +00:00
changed around folder structure and updated the styling 2011-01-25 22:16:30 +00:00			`<link rel="icon" type="image/gif" href="demo/assets/favicon.gif">`
			`<link href="demo/demo.css" media="screen" rel="stylesheet" type="text/css" />`
Version 0.1 2011-01-27 02:45:34 +00:00			`<script type="text/javascript" src="gui.min.js"></script>`
example is now officially awesome 2011-01-26 23:25:40 +00:00			`<script type="text/javascript" src="demo/improvedNoise.js"></script>`
began particle type 2011-01-26 02:30:05 +00:00			`<script type="text/javascript" src="demo/demo.js"></script>`
decided not to use svgs and am using the native font method for the canvas object 2011-01-26 00:07:51 +00:00			`<script type="text/javascript">`
added authors to index 2011-01-25 07:42:20 +00:00			`window.onload = function() {`
decided not to use svgs and am using the native font method for the canvas object 2011-01-26 00:07:51 +00:00
began particle type 2011-01-26 02:30:05 +00:00
Version 0.1 2011-01-27 02:45:34 +00:00			`var fizzyText = new FizzyText("gui-dat");`
Added dummy classes for TODO controllers and updated demo/gui css 2011-01-24 10:36:57 +00:00
added authors to index 2011-01-25 07:42:20 +00:00			`GUI.start();`
removed canvas element to be just html 2011-01-26 00:58:52 +00:00
Version 0.1 2011-01-27 02:45:34 +00:00			`// Text field`
			`GUI.add(fizzyText, "message");`
decided not to use svgs and am using the native font method for the canvas object 2011-01-26 00:07:51 +00:00
Version 0.1 2011-01-27 02:45:34 +00:00			`// Sliders with min and max`
			`GUI.add(fizzyText, "maxSize", 0.5, 7);`
			`GUI.add(fizzyText, "growthSpeed", 0.01, 1);`
			`GUI.add(fizzyText, "speed", 0.1, 2);`
example is now officially awesome 2011-01-26 23:25:40 +00:00
Version 0.1 2011-01-27 02:45:34 +00:00			`// Sliders with min, max and increment.`
			`GUI.add(fizzyText, "noiseStrength", 10, 100, 5);`

			`// Boolean checkbox`
			`GUI.add(fizzyText, "displayOutline");`
Merged 2011-01-27 02:48:27 +00:00
			`// Fires a function called "explode"`
Version 0.1 2011-01-27 02:45:34 +00:00			`GUI.add(fizzyText, "explode")`
decided not to use svgs and am using the native font method for the canvas object 2011-01-26 00:07:51 +00:00
added authors to index 2011-01-25 07:42:20 +00:00			`};`
added google analytics 2011-01-26 18:00:39 +00:00
			`var _gaq = _gaq \|\| [];`
			`_gaq.push(['_setAccount', 'UA-20996084-1']);`
			`_gaq.push(['_trackPageview']);`

			`(function() {`
			`var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;`
			`ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';`
			`var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);`
			`})();`
added authors to index 2011-01-25 07:42:20 +00:00			`</script>`
			`</head>`
			`<body>`
Version 0.1 2011-01-27 02:45:34 +00:00			`<div id = "helvetica-demo"></div>`
			`<h1><a href = "http://twitter.com/guidat"><img src = "demo/assets/favicon.gif" border = "0" alt = "GUI-DAT flag" /></a></h1>`
styling and adding content to index.html 2011-01-25 09:05:49 +00:00			`<p>`
Changes to index.html 2011-01-26 01:55:59 +00:00			`<strong>gui-dat</strong> is a lightweight controller library for JavaScript. It allows you to easily manipulate variables and fire functions on the fly.`
styling and adding content to index.html 2011-01-25 09:05:49 +00:00			`</p>`
example is now officially awesome 2011-01-26 23:25:40 +00:00
Version 0.1 2011-01-27 02:45:34 +00:00			`<ul>`
			`<li><a href=""><strong>Download the minified source</strong></a> <small>[9.8kb]</small></li>`
			`<li><a href="http://github.com/jonobr1/GUI-DAT">Contribute on GitHub!</a></p></li>`
			`</ul>`
example is now officially awesome 2011-01-26 23:25:40 +00:00
Changes to index.html 2011-01-26 01:55:59 +00:00			`<h2>Basic Usage</h2>`
Version 0.1 2011-01-27 02:45:34 +00:00			<pre id="demo-pre" class="prettyprint"><span class="tag"><script</span><span class="pln"> </span><span class="atn">type</span><span class="pun">=</span><span class="atv">"text/javascript"</span><span class="pln"> </span><span class="atn">src</span><span class="pun">=</span><span class="atv">"gui.min.js"</span><span class="tag">></script></span><span class="pln"><br></span><span class="tag"><script</span><span class="pln"> </span><span class="atn">type</span><span class="pun">=</span><span class="atv">"text/javascript"</span><span class="tag">></span><span class="pln"><br><br>window</span><span class="pun">.</span><span class="pln">onload </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">function</span><span class="pun">()</span><span class="pln"> </span><span class="pun">{</span><span class="pln"><br><br>   </span><span class="kwd">var</span><span class="pln"> fizzyText </span><span class="pun">=</span><span class="pln"> </span><span class="kwd">new</span><span class="pln"> </span><span class="typ"><a href="demo/demo.js">FizzyText</a></span><span class="pun">(</span><span class="str">"gui-dat"</span><span class="pun">);</span><span class="pln"><br><br>   GUI</span><span class="pun">.</span><span class="pln">start</span><span class="pun">();</span><span class="pln"><br>   <br>   </span><span class="com">// Adds a text field</span><span class="pln"><br>   GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"message"</span><span class="pun">);</span><span class="pln"><br>   <br>   </span><span class="com">// Adds sliders with min and max</span><span class="pln"><br>   GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"maxSize"</span><span class="pun">,</span><span class="pln"> </span><span class="lit">0.5</span><span class="pun">,</span><span class="pln"> </span><span class="lit">7</span><span class="pun">);</span><span class="pln"><br>   GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"growthSpeed"</span><span class="pun">,</span><span class="pln"> </span><span class="lit">0.01</span><span class="pun">,</span><span class="pln"> </span><span class="lit">1</span><span class="pun">);</span><span class="pln"><br>   GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"speed"</span><span class="pun">,</span><span class="pln"> </span><span class="lit">0.1</span><span class="pun">,</span><span class="pln"> </span><span class="lit">2</span><span class="pun">);</span><span class="pln"><br>   <br>   </span><span class="com">// Adds sliders with min, max and increment.</span><span class="pln"><br>   GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span class="str">"noiseStrength"</span><span class="pun">,</span><span class="pln"> </span><span class="lit">10</span><span class="pun">,</span><span class="pln"> </span><span class="lit">100</span><span class="pun">,</span><span class="pln"> </span><span class="lit">5</span><span class="pun">);</span><span class="pln"><br>   <br>   </span><span class="com">// Adds a boolean checkbox</span><span class="pln"><br>   GUI</span><span class="pun">.</span><span class="pln">add</span><span class="pun">(</span><span class="pln">fizzyText</span><span class="pun">,</span><span class="pln"> </span><span
Changes to index.html 2011-01-26 01:55:59 +00:00
Version 0.1 2011-01-27 02:45:34 +00:00			`<ul id="desc">`
			`<li><strong>gui-dat</strong> will infer the type of the property you're trying to add<br/>(based on its initial value) and create the corresponding control.</li>`
			`<li>The properties must be public, i.e. defined by <code><strong>this</strong>.prop = value</code>.</li>`
			`</ul>`
Changes to index 2011-01-26 02:15:20 +00:00			`<footer>`
styling and adding content to index.html 2011-01-25 09:05:49 +00:00			`By <a href="http://georgemichaelbrower.com/">George Michael Brower</a>, <a href="http://jonobr1.com/">Jono Brandel</a>, and <a href="http://github.com/jonobr1/GUI-DAT">you</a>.`
Changes to index 2011-01-26 02:15:20 +00:00			`</footer>`
added authors to index 2011-01-25 07:42:20 +00:00			`</body>`
Initial files 2011-01-23 21:23:53 +00:00			`</html>`