terrain-generator

digital terrain generation and animation
git clone https://tongong.net/git/terrain-generator.git
Log | Files | Refs | README

main.js (2801B)

      1 var HEIGHT = window.innerHeight;
      2 var WIDTH = window.innerWidth;
      3 var CENTER_HORIZON;
      4 var LEFT_HORIZON;
      5 var CENTER;
      6 var ANGLE;
      7 var SIZE;
      8 
      9 var RANDOM_FACTOR = 0.5; // 0 - 1
     10 var MAX_STATE = 4; // 1 - 8
     11 var ANGLE_FACTOR = 1.5; // 0.5 - 2.5
     12 
     13 var state;
     14 var statePercentage = 0;
     15 var stateNumber;
     16 
     17 var currentField;
     18 var endField;
     19 
     20 var addHeight;
     21 
     22 var startMillis;
     23 const time = () => (typeof(startMillis) == "undefined") ? 0 : millis() - startMillis;
     24 
     25 function setup() {
     26     var canvas = createCanvas(WIDTH, HEIGHT);
     27     canvas.mousePressed(mousePress);
     28     canvas.mouseReleased(mouseRelease);
     29     canvas.touchStarted(mousePress);
     30     canvas.touchEnded(mouseRelease);
     31 
     32     initIconAnimation();
     33     initVars();
     34 
     35     stroke(255);
     36     strokeJoin(ROUND);
     37     fill(0);
     38 }
     39 
     40 function initVars() {
     41     HEIGHT = window.innerHeight;
     42     WIDTH = window.innerWidth;
     43     SIZE = min([HEIGHT / 3, WIDTH / 2 - 70, 500]);
     44     ANGLE = SIZE * ANGLE_FACTOR;
     45 
     46     CENTER = createVector(WIDTH / 2, HEIGHT / 2);
     47     CENTER_HORIZON = createVector(0, 0);
     48     LEFT_HORIZON = createVector(-2 * SIZE, 0);
     49 
     50     endField = new Terrain(2, true);
     51     currentField = new Terrain(2, false);
     52 
     53     state = 0;
     54     addHeight = 0;
     55     stateNumber = 0;
     56     refreshTime = 0;
     57     startMillis = millis();
     58 }
     59 
     60 function draw() {
     61     background(0);
     62 
     63     if (refreshTime != 0) {
     64         addHeight = (millis() - refreshTime) / 1000 * HEIGHT;
     65         if ((millis() - refreshTime) >= 1000) {
     66             statePercentage = 0;
     67             initVars();
     68             resizeCanvas(WIDTH, HEIGHT);
     69         }
     70     }
     71 
     72     switch (state) {
     73         case 0:
     74             statePercentage = time() / 20;
     75             line(CENTER.x, HEIGHT + addHeight, CENTER.x, CENTER.y * (2 - statePercentage / 100) + addHeight);
     76             if (statePercentage >= 100) {
     77                 state = 1;
     78                 statePercentage = 0;
     79             }
     80             break;
     81         case 1:
     82             statePercentage = time() / 10 - 200;
     83             currentField.render(statePercentage / 100 * SIZE, SIZE, getRotation());
     84             if (statePercentage >= 100) {
     85                 state = 2;
     86                 statePercentage = 0;
     87             }
     88             break;
     89         case 2:
     90             statePercentage = time() / 10 - 100 * (3 + stateNumber);
     91             currentField.transform(endField, 0.1);
     92             currentField.render(SIZE / pow(2, stateNumber), SIZE, getRotation());
     93             if (statePercentage >= 100 && stateNumber < MAX_STATE - 1) {
     94                 statePercentage = 0;
     95                 stateNumber++;
     96                 currentField = currentField.scaleUp();
     97                 endField = currentField.addRandom(pow(RANDOM_FACTOR, stateNumber));
     98             }
     99             break;
    100     }
    101 }