-
diff --git a/website/source/javascripts/app/Engine.Polygon.Puller.js b/website/source/javascripts/app/Engine.Polygon.Puller.js
index a6957b029..3ad4227b7 100644
--- a/website/source/javascripts/app/Engine.Polygon.Puller.js
+++ b/website/source/javascripts/app/Engine.Polygon.Puller.js
@@ -22,28 +22,6 @@ Engine.Polygon.Puller.prototype = {
return true;
}
return false;
- },
-
- // Determine color fill?
- update: function(engine){},
-
- draw: function(ctx, scale){
- ctx.moveTo(
- this.a.pos.x * scale >> 0,
- this.a.pos.y * scale >> 0
- );
- ctx.lineTo(
- this.b.pos.x * scale >> 0,
- this.b.pos.y * scale >> 0
- );
- ctx.lineTo(
- this.c.pos.x * scale >> 0,
- this.c.pos.y * scale >> 0
- );
- ctx.lineTo(
- this.a.pos.x * scale >> 0,
- this.a.pos.y * scale >> 0
- );
}
};
diff --git a/website/source/javascripts/app/Engine.Polygon.js b/website/source/javascripts/app/Engine.Polygon.js
index 0b470dec2..31618a622 100644
--- a/website/source/javascripts/app/Engine.Polygon.js
+++ b/website/source/javascripts/app/Engine.Polygon.js
@@ -67,32 +67,6 @@ Engine.Polygon.prototype = {
this.strokeStyle = this.hslaTemplate.substitute(this.strokeColor);
this.fillStyle = this.hslaTemplate.substitute(this.color);
}
- },
-
- draw: function(ctx, scale){
- ctx.beginPath();
- ctx.moveTo(
- this.a.pos.x * scale >> 0,
- this.a.pos.y * scale >> 0
- );
- ctx.lineTo(
- this.b.pos.x * scale >> 0,
- this.b.pos.y * scale >> 0
- );
- ctx.lineTo(
- this.c.pos.x * scale >> 0,
- this.c.pos.y * scale >> 0
- );
- ctx.closePath();
- if (!this.noFill) {
- ctx.fillStyle = this.fillStyle;
- ctx.fill();
- }
- if (!this.simple) {
- ctx.lineWidth = 0.25 * scale;
- ctx.strokeStyle = this.strokeStyle;
- ctx.stroke();
- }
}
};
diff --git a/website/source/javascripts/app/Engine.Shape.Puller.js b/website/source/javascripts/app/Engine.Shape.Puller.js
index 361a9ae72..0e1c57189 100644
--- a/website/source/javascripts/app/Engine.Shape.Puller.js
+++ b/website/source/javascripts/app/Engine.Shape.Puller.js
@@ -83,10 +83,6 @@ Engine.Shape.Puller.prototype = {
this.points[p].update(engine);
}
- for (p = 0; p < this.polygons.length; p++) {
- this.polygons[p].update(engine, this);
- }
-
if (this.alpha < 1) {
this.alpha = Math.min(this.alpha + 2 * engine.tick, 1);
}
@@ -95,7 +91,7 @@ Engine.Shape.Puller.prototype = {
},
draw: function(ctx, scale, engine){
- var p;
+ var p, poly;
ctx.translate(
this.pos.x * scale >> 0,
@@ -108,10 +104,26 @@ Engine.Shape.Puller.prototype = {
ctx.beginPath();
for (p = 0; p < this.polygons.length; p++) {
- this.polygons[p].draw(ctx, scale);
+ poly = this.polygons[p];
+ ctx.moveTo(
+ poly.a.pos.x * scale >> 0,
+ poly.a.pos.y * scale >> 0
+ );
+ ctx.lineTo(
+ poly.b.pos.x * scale >> 0,
+ poly.b.pos.y * scale >> 0
+ );
+ ctx.lineTo(
+ poly.c.pos.x * scale >> 0,
+ poly.c.pos.y * scale >> 0
+ );
+ ctx.lineTo(
+ poly.a.pos.x * scale >> 0,
+ poly.a.pos.y * scale >> 0
+ );
}
ctx.closePath();
- ctx.lineWidth = 1 * scale;
+ ctx.lineWidth = 0.4 * scale;
ctx.strokeStyle = 'rgba(108,0,243,0.3)';
ctx.stroke();
@@ -126,7 +138,23 @@ Engine.Shape.Puller.prototype = {
ctx.beginPath();
for (p = 0; p < this.polygons.length; p++) {
if (this.polygons[p].checkChasing()) {
- this.polygons[p].draw(ctx, scale);
+ poly = this.polygons[p];
+ ctx.moveTo(
+ poly.a.pos.x * scale >> 0,
+ poly.a.pos.y * scale >> 0
+ );
+ ctx.lineTo(
+ poly.b.pos.x * scale >> 0,
+ poly.b.pos.y * scale >> 0
+ );
+ ctx.lineTo(
+ poly.c.pos.x * scale >> 0,
+ poly.c.pos.y * scale >> 0
+ );
+ ctx.lineTo(
+ poly.a.pos.x * scale >> 0,
+ poly.a.pos.y * scale >> 0
+ );
}
}
ctx.closePath();
diff --git a/website/source/javascripts/app/Engine.Shape.js b/website/source/javascripts/app/Engine.Shape.js
index a814931d7..a0383f89e 100644
--- a/website/source/javascripts/app/Engine.Shape.js
+++ b/website/source/javascripts/app/Engine.Shape.js
@@ -56,14 +56,33 @@ Engine.Shape.prototype = {
},
draw: function(ctx, scale, engine){
- var p;
+ var p, poly;
ctx.translate(
this.pos.x * scale >> 0,
this.pos.y * scale >> 0
);
for (p = 0; p < this.polygons.length; p++) {
- this.polygons[p].draw(ctx, scale, this.noStroke);
+ poly = this.polygons[p];
+ ctx.beginPath();
+ ctx.moveTo(
+ poly.a.pos.x * scale >> 0,
+ poly.a.pos.y * scale >> 0
+ );
+ ctx.lineTo(
+ poly.b.pos.x * scale >> 0,
+ poly.b.pos.y * scale >> 0
+ );
+ ctx.lineTo(
+ poly.c.pos.x * scale >> 0,
+ poly.c.pos.y * scale >> 0
+ );
+ ctx.closePath();
+ ctx.fillStyle = poly.fillStyle;
+ ctx.fill();
+ ctx.lineWidth = 0.25 * scale;
+ ctx.strokeStyle = poly.strokeStyle;
+ ctx.stroke();
}
ctx.setTransform(1, 0, 0, 1, 0, 0);
ctx.translate(
diff --git a/website/source/javascripts/app/Engine.js b/website/source/javascripts/app/Engine.js
index eebac2eed..17169e28a 100644
--- a/website/source/javascripts/app/Engine.js
+++ b/website/source/javascripts/app/Engine.js
@@ -1,5 +1,3 @@
-/* jshint unused:false */
-/* global console */
(function(
Base,
Vector,
@@ -63,6 +61,10 @@ Engine = Base.extend({
this.resize();
window.addEventListener('resize', this.resize, false);
+ this._handleScroll = this._handleScroll.bind(this);
+ this._handleScroll();
+ window.addEventListener('scroll', this._handleScroll, false);
+
this.setupStarfield();
this.setupTessellation();
@@ -151,7 +153,7 @@ Engine = Base.extend({
sum += this.ticks[s];
}
- console.log('Average Tick Time:', sum / this.ticks.length);
+ window.console.log('Average Tick Time:', sum / this.ticks.length);
},
getLongestTick: function(){
@@ -164,19 +166,17 @@ Engine = Base.extend({
}
}
- console.log('Max tick was:', max, 'at index:', index);
+ window.console.log('Max tick was:', max, 'at index:', index);
},
render: function(){
- var scale = this.scale, tickStart;
+ var scale = this.scale;
- if (window.scrollY > 700) {
+ if (this.scrollY > 700) {
window.requestAnimationFrame(this.render);
return;
}
- tickStart = window.performance.now();
-
this.context.clearRect(
-(this.width / 2) * scale,
-(this.height / 2) * scale,
@@ -205,8 +205,6 @@ Engine = Base.extend({
this.last = this.now;
- this.ticks.push(window.performance.now() - tickStart);
-
window.requestAnimationFrame(this.render);
},
@@ -238,7 +236,7 @@ Engine = Base.extend({
},
generateRandomShape: function(){
- var p, index, rando, halfWidth, halfHeight, iter,
+ var halfWidth, halfHeight, iter,
shape, shapeTemplate, columns, rows, modWidth, row, column,
xOffset, yOffset;
@@ -359,6 +357,10 @@ Engine = Base.extend({
_handleMouseCoords: function(event){
this.mouse.x = event.pageX;
this.mouse.y = event.pageY;
+ },
+
+ _handleScroll: function(){
+ this.scrollY = window.scrollY;
}
});
diff --git a/website/source/stylesheets/_jumbotron.less b/website/source/stylesheets/_jumbotron.less
index afd13266a..113b30adb 100755
--- a/website/source/stylesheets/_jumbotron.less
+++ b/website/source/stylesheets/_jumbotron.less
@@ -16,11 +16,6 @@
padding-bottom: 0;
color: @jumbotron-color;
- .container {
- position:relative;
- height:700px;
- }
-
.terraform-canvas {
position:absolute;
top:0;
diff --git a/website/source/stylesheets/main.css b/website/source/stylesheets/main.css
index 7a8da3900..f833fc3f3 100644
--- a/website/source/stylesheets/main.css
+++ b/website/source/stylesheets/main.css
@@ -592,10 +592,6 @@ body.page-home #footer {
padding-bottom: 0;
color: #ffffff;
}
-#jumbotron .container {
- position: relative;
- height: 700px;
-}
#jumbotron .terraform-canvas {
position: absolute;
top: 0;