Add parallax scrolloing to the hills

This commit is contained in:
Starbeamrainbowlabs 2016-06-13 13:48:41 +01:00
parent 6b6efb1c6c
commit cf63528e0e
2 changed files with 10 additions and 9 deletions

View file

@ -2,17 +2,18 @@
class HillSet class HillSet
{ {
constructor(inSize, inHeightRange, inColour) constructor(inSize, inHeightRange, inColour, inSpeed)
{ {
if(typeof inSize != "object") inSize = new Vector(2048, 1024); if(typeof inSize != "object") inSize = new Vector(2048, 1024);
if(typeof inHeightRange != "number") inHeightRange = 0.4; if(typeof inHeightRange != "number") inHeightRange = 0.4;
if(typeof inColour != "string") inColour = "green"; if(typeof inColour != "string") inColour = "green";
if(typeof inSpeed != "number") inSpeed = 30;
this.pos = new Vector(0, 0); this.pos = new Vector(0, 0);
this.startPos = this.pos.clone(); this.startPos = this.pos.clone();
this.size = inSize; this.size = inSize;
this.colour = inColour; this.colour = inColour;
this.speed = 300; // in pixels per second this.speed = inSpeed; // in pixels per second
this.heightRangeMultiplier = inHeightRange; this.heightRangeMultiplier = inHeightRange;
this.heightRange = this.heightRangeMultiplier * this.size.y; this.heightRange = this.heightRangeMultiplier * this.size.y;

View file

@ -18,23 +18,23 @@ class Renderer
{ {
this.visibleObjects = []; this.visibleObjects = [];
this.hillSets = []; this.hillSets = [];
this.hillSets.push(new HillSet(new Vector(2048, this.canvas.height * 0.9), 0.4, "rgb(102, 164, 90)")); this.hillSets.push(new HillSet(new Vector(2048, this.canvas.height * 0.9), 0.4, "rgb(102, 164, 90)", this.speed * 0.3));
this.hillSets.push(new HillSet(new Vector(2048, this.canvas.height * 0.6), 0.4, "rgb(43, 131, 35)")); this.hillSets.push(new HillSet(new Vector(2048, this.canvas.height * 0.6), 0.4, "rgb(43, 131, 35)", this.speed * 0.6));
this.hillSets.push(new HillSet(new Vector(2048, this.canvas.height * 0.2), 0.4, "rgb(50, 111, 8)")); this.hillSets.push(new HillSet(new Vector(2048, this.canvas.height * 0.2), 0.4, "rgb(50, 111, 8)", this.speed * 0.8));
this.visibleObjects.push(...this.hillSets);
var hillOffset = this.canvas.height * 0.1; var hillOffset = this.canvas.height * 0.1;
this.hillSets[0].pos = new Vector(0, this.canvas.height - this.hillSets[0].size.y - hillOffset); this.hillSets[0].pos = new Vector(0, this.canvas.height - this.hillSets[0].size.y - hillOffset);
this.hillSets[1].pos = new Vector(0, this.canvas.height - this.hillSets[1].size.y - hillOffset); this.hillSets[1].pos = new Vector(0, this.canvas.height - this.hillSets[1].size.y - hillOffset);
this.hillSets[2].pos = new Vector(0, this.canvas.height - this.hillSets[2].size.y - hillOffset); this.hillSets[2].pos = new Vector(0, this.canvas.height - this.hillSets[2].size.y - hillOffset);
this.visibleObjects.push(...this.hillSets);
this.road = new Road(this.canvas, new Vector(0, this.canvas.height * 0.9)); this.road = new Road(this.canvas, new Vector(0, this.canvas.height * 0.9));
this.road.speed = this.speed;
this.visibleObjects.push(this.road); this.visibleObjects.push(this.road);
this.bicycle = new Bicycle(new Vector(this.canvas.width / 2, this.canvas.height * 0.9)); this.bicycle = new Bicycle(new Vector(this.canvas.width / 2, this.canvas.height * 0.9));
this.bicycle.speed = this.speed;
this.visibleObjects.push(this.bicycle); this.visibleObjects.push(this.bicycle);
for (let vobj of this.visibleObjects)
vobj.speed = this.speed;
} }
start() start()