Cylindrical World Generator

by Luke Nickerson

HTML

<header>Cylindrical World Generator v0.3 by Luke</header>
<canvas id="cnvs" width="1000" height="500"></canvas>
<div class="sidebar">
    Age: <span class="ageEon"></span> eons
    <br />Seed: <input type="number" id="seed" value="0" />
    <button type="button" id="restart">Rebuild</button>
</div>
<ul>
    <li>Press Enter to star/stop aging the world.</li>
    <li>Arrows or WASD to move world.</li>
    <li>] to raise water, [ to lower water.</li>
    <li>Press space to toggle view.</li>
    <li>+/- to zoom in/out</li>
    <li>r = raindrop erosion</li>
    <li>z = smooth</li>
    <li>x = toggle grid</li>
    <li>c = coastal erosion</li>
    <li>v = water volume adjustment</li>
    <li>m = toggle micro-organisms</li>
    <li>g = toggle grass</li>
    <li>p = move plates</li>
</ul>

CSS

body { background: #558866; font-family: Verdana, sans-serif; padding: 0; margin: 0; }
header { padding: 0.5em 1em; }
#cnvs {
    border: solid 1px #666;
    margin: 0 1em;
}
.sidebar {
    float: right;
    padding: 1em;
}

JavaScript

console.clear();
// From stardust.js
function Coords(x,y){
    this.x = (typeof x == 'number') ? x : 0;
    this.y = (typeof y == 'number') ? y : 0;
}
Coords.prototype.check = function(){
    if (typeof this.x != "number") {
        console.error("Bad coord.x", this.x);
        this.x = 0;
    }
    if (typeof this.y != "number") {
        console.error("Bad coord.y", this.y);
        this.y = 0;
    }
}
Coords.prototype.set = function(coord){
    coord.check();
    this.x = coord.x;
    this.y = coord.y;
}
Coords.prototype.add = function(coord){
    coord.check();
    this.x += coord.x;
    this.y += coord.y;
    return this;
}
Coords.prototype.multiply = function(n){
    this.x *= n;
    this.y *= n;
    return this;
}
Coords.prototype.getMultiply = function(n){
    var x = this.x * n;
    var y = this.y * n;
    return new Coords(x, y);
}
Coords.prototype.getDot = function(coord){
    coord.check();
    // A dot B = ||A|| ||B|| cos theta ?
    // this.getMagnitude() * coord.getMagnitude()    ???
    return ((this.x * coord.x) + (this.y * coord.y));
}
Coords.prototype.clear = function(){
    this.x = 0;
    this.y = 0;
    return this;
}
Coords.prototype.setTangent = function(){
    var x = this.x;
    this.x = this.y;
    this.y = x;
    return this;
}
Coords.prototype.getDistance = function(coord){
    coord.check();
    return Math.sqrt(
        Math.pow( (this.x - coord.x), 2)
        + Math.pow( (this.y - coord.y), 2)
    );
}
Coords.prototype.getUnitVector = function(coord){
    coord.check();
    var x = 0, y = 0;
    var d = Math.abs(this.getDistance(coord));
    if (this.x != coord.x) {
        var dx = coord.x - this.x;
        x =  dx / d;
    }
    if (this.y != coord.y) { 
        var dy = coord.y - this.y;
        y = dy / d;
    }
    return new Coords(x, y);
}
Coords.prototype.getMagnitude = function(){
    return Math.sqrt(
        Math.pow(this.x, 2)
        + Math.pow(this.y, 2)
    );
}
Coords.prototype.isEqual = function(coord){
    return...