Sarah Kang-Project 11 – Landscape

landscape

//sarah kang
//section c
//sarahk1@andrew.cmu.edu
//project-11-landscape

var m1Speed = .001
var m1Detail = .005
var m2Speed = .002
var m2Detail = .01
var m3Detail = .005

var firework = [];
var firework2 = [];

function setup() {
  createCanvas(480, 480);
    //initial set of pink fireworks
    for (i = 0; i < 12; i++) {
        var fireworkX = random(width);
        var fireworkY = random(0, 240);
        firework[i] = makeFirework(fireworkX, fireworkY);
    }

        //initial set of orange fireworks
    for (i = 0; i < 8; i++) {
        var firework2X = random(width);
        var firework2Y = random(0, 240);
        firework2[i] = makeFirework2(firework2X, firework2Y);
    }

    frameRate(20);
}


function draw() {
 background(0);

 fireworks();
 fireworks2();

 m1();
 m2();

 noStroke();
 fill(94, 94, 115);
 rect(0, 400, 480, 80);

 m3();

}

function m1() {
  //back mountain range 
  stroke(20, 21, 54);
  beginShape();
  for(var x = 0; x < width; x++) {
    var t = (x * m1Detail) + (millis() * m1Speed);
    var y = map(noise(t), 0, 1, 200, 340);
    line(x, y, x, 400);
  }
  endShape();
}

function m2() {
  //front mountain range
  stroke(28, 29, 82);
  beginShape();
  for(var x = 0; x < width; x++) {
    var t = (x * m2Detail) + (millis() * m2Speed);
    var y = map(noise(t), 0, 1, 240, 380);
    line(x, y, x, 400);
  }
  endShape();
}

function m3() {
  //mountain range shadow
  stroke(34, 34, 43);
  beginShape();
  for(var x = 0; x < width; x++) {
    var t = (x * m3Detail) + (millis() * m2Speed);
    var y = map(noise(t), 0, 1, 400, 480);
    line(x, y, x, 400);
  }
  endShape();
}

function drawFirework() {
    noStroke();
    fill(255, 230, 238);
    push();
    translate(this.x2, this.y2);

    for (let i = 0; i < 12; i ++) {
    ellipse(0, 20, 3, 25);
    rotate(PI / 5);
    }

    pop();
}

function makeFirework(xlocation, ylocation) {
  var makeFire = {x2: xlocation, 
                y2: ylocation, 
                fireworkX: random(0, width), 
                fireworkY: random(0, 240),
                speed: -2.0,
                move: moveFirework,
                draw: drawFirework}
  return makeFire;
}

function moveFirework() {
    this.x2 += this.speed;
    if (this.x2 <= -20) {
        this.x2 += 500;
    }
}

function fireworks() {
    //pink fireworks
    for(i = 0; i < firework.length; i++) {
        firework[i].move();
        firework[i].draw();
    }
}

function drawFirework2() {
    noStroke();
    fill(255, 176, 97);
    push();
    translate(this.x2, this.y2);

    for (let i = 0; i < 12; i ++) {
    ellipse(0, 30, 3, 40);
    rotate(PI / 5);
    }

    pop();
}

function makeFirework2(xlocation, ylocation) {
    var makeFire2 = {x2: xlocation, 
                y2: ylocation, 
                firework2X: random(0, width), 
                firework2Y: random(0, 240),
                speed: -2.0, 
                move: moveFirework2,
                draw: drawFirework2}
    return makeFire2;
}

function moveFirework2() {
    this.x2 += this.speed;
    if (this.x2 <= -20) {
        this.x2 += 500;
    }
}

function fireworks2() {
    //orange fireworks
    for(i = 0; i < firework2.length; i++) {
        firework2[i].move();
        firework2[i].draw();
    }
}

For this project, I wanted to make a nighttime landscape and incorporate a colorful fireworks show.

Leave a Reply