library-mirrors/terra
1
0
Fork 0
mirror of https://github.com/rileyjshaw/terra.git synced 2024-11-21 04:54:23 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity
3df637635b
terra/index.html

163 lines
6.0 KiB
HTML
Raw Normal View History

Initialize with files from goal-009
2014-03-10 03:57:59 +00:00
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
<title>terra.js</title>
<link rel="stylesheet" href="main.css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
Initialize with files from goal-009
2014-03-10 03:57:59 +00:00
</head>
<body>
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
<div class="fullPage splash">
<div class="vcent"></div>
<header id="header">
<h1>terra.js <span>alpha</span></h1>
<p>A JavaScript framework for simple biological simulations and cellular automata.</p>
<a data-scroll href="#main" class="downArrow">⬇</a>
</header>
</div>
<nav>
<ul>
<li><a data-scroll href="#usage">Usage</a></li>
<li><a data-scroll href="#examples">Examples</a></li>
<li><a data-scroll href="#options">Options</a></li>
<li><a data-scroll href="#methods">Methods</a></li>
<li><a data-scroll href="#events">Events</a></li>
<li><a href="https://github.com/rileyjshaw/terra">GitHub</a></li>
</ul>
</nav>
<div id="main" class="main">
<p>terra is a <strong>super customizable</strong> framework for creating and analyzing biological simulations. It's open-source and licenced under MIT.</p>
Update 2014-08-17T06:23:48.030Z
2014-08-17 06:23:48 +00:00
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
<h2 id="usage">Usage</h2>
Update 2014-08-17T06:23:48.030Z
2014-08-17 06:23:48 +00:00
<h3>Including terra</h3>
<p>Getting started is as easy as including the script!</p>
<pre><code class="language-markup">&lt;script src="path/to/terra.min.js"&gt;&lt;/script&gt;</code></pre>
<p>terra can also be used as a module with most popular module systems. <a class="question" target="_blank" href="https://github.com/umdjs/umd">?</a></p>
<h3>Creating creatures</h3>
<p>Now that we've included the script, let's create a simple creature using the creatureFactory. Each creature requires a type.</p>
<pre><code class="language-javascript">terra.creatureFactory.register({
type: 'firstCreature'
});</code></pre>
<p>This creature is valid, but it's pretty boring. To make a more interesting creature, let's override some of the default <a data-scroll href="#options">options</a> and <a data-scroll href="#methods">methods</a>.</p>
<pre><code class="language-javascript">terra.creatureFactory.register({
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
type: 'secondCreature',
color: [41, 128, 185],
metabolism: 1,
sustainability: 3,
reproduceLv: 0.60,
etc...
Update 2014-08-17T06:23:48.030Z
2014-08-17 06:23:48 +00:00
});</code></pre>
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
<p>We've just created a creature that will ____.</p>
Update 2014-08-17T06:23:48.030Z
2014-08-17 06:23:48 +00:00
<h3>Creating the environment</h3>
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
<p>To run a simulation, we'll need to create an environment. Let's make a 25x25 grid and populate 40% of the space with our first creature and 20% with our second.</p>
Update 2014-08-17T06:23:48.030Z
2014-08-17 06:23:48 +00:00
<pre><code class="language-javascript">var ex1 = new terra.Terrarium(25, 25, 'ex1');
ex1.populate([['firstCreature', 40], ['secondCreature', 20]]);</code></pre>
<h3>Running a simulation</h3>
<p>Terrariums have a few methods that allow you to interact with the simulation. The most important are <code class="language-javascript">step</code> and <code class="language-javascript">draw</code>.</p>
<pre><code class="language-javascript">function stepAndDraw () {
// run the next step of the simulation
ex1.step();
// update its display
ex1.draw();
}
// start an interval to update the simulation twice per second
var updater = setInterval(stepAndDraw, 500);</code></pre>
<p><code class="language-javascript">step</code> can take an argument for the number of steps to run through. If we want to see how our environment is doing in 1000 steps, we can simply run:</p>
<pre><code class="language-javascript">ex1.step(1000);
ex1.draw();</code></pre>
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
<h2 id="examples">Examples</h2>
Update 2014-08-17T06:23:48.030Z
2014-08-17 06:23:48 +00:00
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
<h3 id="gol">Conway's Game of Life <a class="question" target="_blank" href="http://en.wikipedia.org/wiki/Conway's_Game_of_Life">?</a></h3>
<p>terra can also run cellular automata. </p>
Update 2014-08-17T06:23:48.030Z
2014-08-17 06:23:48 +00:00
<pre><code class="language-javascript">terra.creatureFactory.register({
type: 'GoL',
colorFn: function () { return this.alive ? this.color + ',1' : '0,0,0,0'; },
wait: function () {},
isDead: function () { return false; },
queue: function (neighbors) {
var surrounding = _.filter(neighbors, function (spot) {
return spot.creature.alive;
}).length;
this.alive = surrounding === 3 || surrounding === 2 && this.alive;
return false;
}
}, function () {
this.alive = Math.random() < 0.5;
});</code></pre>
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
Update 2014-08-17T06:23:48.030Z
2014-08-17 06:23:48 +00:00
<h3 id="cyclic">Cyclic Cellular Automata</h3>
<pre><code class="language-javascript">terra.creatureFactory.register({
type: 'cyclic',
colors: ['255,0,0,1', '255,217,0,1', '72,255,0,1', '0,255,145,1', '0,145,255,1', '72,0,255,1', '255,0,217,1'],
colorFn: function () { return this.colors[this.state];},
wait: function () {},
isDead: function () { return false; },
queue: function (neighbors) {
var next = (this.state + 1) % 7;
var changing = _.some(neighbors, function (spot) {
return spot.creature.state === next;
});
if (changing) this.state = next;
}
}, function () {
this.state = Math.floor(Math.random() * 7);
});</code></pre>
v0.0.2-alpha
2014-08-17 03:23:48 +00:00
<h2 id="options">Options</h2>
<p>The following options can be passed in an object to creatureFactory.register( ) as the first argument.</p>
<h3>Required</h3>
<ul>
<li>(string) type: </li>
</ul>
<h3>Optional</h3>
<ul>
<li>(array) color: </li>
<li>(int) initialEnergy: </li>
<li>(int) maxEnergy: </li>
<li>(int) metabolism: </li>
<li>(int) size: </li>
<li>(int) speed: </li>
<li>(int) vision: </li>
<li>(int) sustainability: 2</li>
<li>(float) reproduceLv: 0.70</li>
<li>(float) moveLv: 0.20</li>
<li>(char) character: </li>
</ul>
<h2 id="methods">Methods</h2>
<ul>
<li>queue</li>
<li>reproduce</li>
<li>move</li>
<li>wait</li>
<li>isDead</li>
<li>boundEnergy</li>
</ul>
<h2 id="events">Events</h2>
<ul>
<li>finished</li>
</ul>
</div>
<footer>Created with ❤ by <a href="http://rileyjshaw.com">rileyjshaw</a>. Inspired by <a href="http://eloquentjavascript.net/">Marijn Haverbeke</a> and <a href="https://www.wolframscience.com/">Stephen Wolfram</a>.</footer>
<script src="terra.demo.min.js"></script>
Initialize with files from goal-009
2014-03-10 03:57:59 +00:00
</body>
</html>
Reference in New Issue Copy Permalink