Project 11 – Generative Landscape

var houses = [];
var sky;

function preload() {
    sky = loadImage("https://i.imgur.com/FaHkkqz.jpg");
}

function setup() {
    createCanvas(480, 435);
    background(220);
    for (var i = 0; i < 10; i ++) {
        houses[i] = makeHouse(i * 0.5);
    }
    frameRate(10);
}

function draw() {
    background(0, 30, 140);
    image(sky, 0, -100, 480, 600);
    moon();
    updateAndDisplayHouses();
    removeHouses();
    addNewHouses();
    man();
    gondola();
}

function updateAndDisplayHouses() {
    for (var i = 0; i < houses.length; i++) {
        houses[i].move();
        houses[i].display();
    }
}

function removeHouses() {
    var housesToKeep = [];
    for (var i = 0; i < houses.length; i++) {
        if (houses[i].x + houses[i].breadth > 0) {
            housesToKeep.push(houses[i]);
        }
    }
    houses = housesToKeep;
}

function addNewHouses() {
    //probability
    var newHouseLikelihood = 5;
    if (random(0, 200) < newHouseLikelihood) {
        houses.push(makeHouse(width));
    }
}

function houseMove() {
    this.x += this.speed;
}

function houseDisplay() {
    //draws the houses
    var floorHeight = 10;
    var bHeight = this.nFloors * floorHeight;
    fill(100);
    stroke(0);
    strokeWeight(1);
    push();
    translate(this.x, height);
    rect(0, -bHeight, this.breadth, bHeight);
    //windows
    for (var i = 0; i < this.nFloors; i++) {
        for (var j = 0; j < this.breadth / 20; j++) {
            fill(255);
            rect(j * 15 + 10, -(i * floorHeight), 5, 5);
        }
    }
    pop();
}

function makeHouse(birthLocationX) {
    var hse = {x: birthLocationX,
                breadth: 50,
                speed: -1.0,
                nFloors: round(random(3,8)),
                move: houseMove,
                display: houseDisplay}
    return hse;
}

function moon() {
    fill(255, 255, 181);
    noStroke();
    circle(240, 400, 300);
}

function gondola() {
    noStroke();
    fill(0);
    rect(150, 420, 200, 20);
    ellipse(145, 425, 40, 15);
    ellipse(355, 425, 40, 15);
    noFill();
    stroke(0);
    strokeWeight(10);
    arc(250, 410, 250, 30, radians(0), radians(180));
    arc(150, 415, 50, 40, radians(90), radians(180));
    arc(350, 415, 50, 40, radians(0), radians(90));
    //oar
    stroke(0);
    strokeWeight(4);
    line(180, 340, 155, 438);
}

function man() {
    fill(0);
    noStroke();
    circle(150, 348, 20);
    quad(145, 340, 145, 390, 160, 390, 150, 340);
    rect(145, 390, 10, 30);
    stroke(0);
    strokeWeight(4);
    line(155, 370, 170, 370);
    line(153, 373, 167, 377);
}