midnight stroll
// isis berymon section D
var buildings = [];
var stars = [];
var streetlights = [];
var ground = 160;
function setup() {
createCanvas(480, 200);
frameRate(10);
//initial scene
for(var i =0; i < 10; i++){
var rx = random(width);
buildings[i] = makeBuilding(rx);
}
for(var i=0; i< 30; i++){
var rx = random(width);
stars[i] = makeStar(rx);
}
for(var i = 0; i<3; i++){
var rx = random(width);
streetlights[i] = makeLight(rx);
}
}
function draw() {
background(81, 61, 128); //dark purple sky
showScene();
updateScene();
//dark grey road
fill(84);
noStroke();
rect(0, ground, width, height-ground);
}
function showScene(){ //draw and move all objects
//show stars
for(var i =0; i< stars.length; i++){
stars[i].move();
stars[i].draw();
}
//show buildings
for(var i = 0; i < buildings.length; i++){
buildings[i].move();
buildings[i].draw();
}
//show streetlights
for(var i= 0; i < streetlights.length; i++){
streetlights[i].move();
streetlights[i].draw();
}
}
function updateScene(){ //remove and add to arrays
//remove stars offscren
var keepstar = [];
for(var i = 0; i < stars.length; i++){
if(stars[i].x + 3 > 0){
keepstar.push(stars[i]);
}
}
stars = keepstar;
//add new stars randomly
var nstr = .1;
if(random(1) < nstr){
stars.push(makeStar(width+3));
}
//remove buildings offscreen
var keepbldg = [];
for(var i = 0; i < buildings.length; i++){
if(buildings[i].x + buildings[i].bw > 0){
keepbldg.push(buildings[i]);
}
}
buildings = keepbldg;
//add new buildings randomly
var nbldg = .03;
if(random(1) < nbldg){
buildings.push(makeBuilding(width));
}
//remove lights offscreen
var keeplight = [];
for(var i = 0; i < streetlights.length; i++){
if(streetlights[i].x + 15 > 0){
keeplight.push(streetlights[i]);
}
}
streetlights = keeplight;
//add new lights randomly
var nlight = .005;
if(random(1) < nlight){
streetlights.push(makeLight(width));
}
}
function makeStar(sx){ //star object constructor
var star = {x: sx,
y: random(ground),
speed: -.7,
move: moveLeft,
draw: drawS}
return star;
}
function drawS(){ //white star
stroke(255);
line(this.x, this.y-3, this.x, this.y+3);
line(this.x-3, this.y, this.x+3, this.y);
}
function makeBuilding(bx){ //building object constructor
var bldg = {x: bx,
bw: round(random(50, 100)),
bh: round(random(30, 120)),
speed: -2,
move: moveLeft,
draw: drawB}
return bldg;
}
function drawB(){
fill(32, 27, 43); //dark purple grey building
noStroke();
rect(this.x, ground-this.bh, this.bw, this.bh);
fill(95, 86, 115); //light purple grey shading
rect(this.x, ground-this.bh, 6, this.bh);
rect(this.x, ground-this.bh, this.bw, 3);
}
function makeLight(lx){
var light = {x: lx,
speed: -2,
move: moveLeft,
draw: drawL}
return light; //light object constructor
}
function drawL(){
fill(112); //mid grey
rect(this.x, 130, 5, 30);
//flickering lights
if(random(1) > .8){
fill(237, 196, 114); //yellow
} else {
fill(122);
}
rect(this.x+5, 130, 10, 5); //grey streetlight with flickering light
}
function moveLeft(){ //move left every frame
this.x += this.speed;
}