almost all processing removed, weirdness in drawing not solved yet

This commit is contained in:
sandbender 2009-11-28 22:22:39 +01:00
parent 3316efb152
commit a27346ce9a

View File

@ -160,9 +160,9 @@ function Node(name) {
this.name = name; this.name = name;
var size = Math.min(width, height); var size = Math.min(width, height);
this.position = new Vector( this.position = new Vector(
p.random(size) - (size / 2), (Math.random() * size) - (size / 2),
p.random(size) - (size / 2), (Math.random() * size) - (size / 2),
p.random(size) - (size / 2)); (Math.random() * size) - (size / 2));
this.position.scale(0.5); this.position.scale(0.5);
} }
@ -177,12 +177,15 @@ Node.prototype.project = function(m) {
}; };
Node.prototype.draw = function() { Node.prototype.draw = function() {
var s = 5000 / -this.projection.z; var scale = 5000 / -this.projection.z;
p.fill(p.color(164 + this.alpha * 0.25)); var color = (164 + this.alpha * 0.25);
p.ellipse(this.projection.x, this.projection.y, s, s); context.fillStyle = 'rgb(' + color + ',' + color + ',' + color + ')';
context.font = s / 2 + "pt sans-serif"; context.arc(this.projection.x, this.projection.y, scale, 0, Math.PI * 2, false);
p.fill(p.color(164, 192 + this.alpha * 0.25, 164)); context.fill();
context.fillText(this.name, this.projection.x + s, this.projection.y + s / 2); context.font = scale / 2 + "pt sans-serif";
var textColor = (192 + this.alpha * 0.25);
context.fillStyle = 'rgb(164,' + textColor + ',164)';
context.fillText(this.name, this.projection.x + scale, this.projection.y + scale / 2);
}; };
Node.prototype.update = function() { Node.prototype.update = function() {
@ -192,31 +195,38 @@ Node.prototype.update = function() {
// Class NorbertNode // Class NorbertNode
jQuery.extend(NorbertNode.prototype, Node.prototype); jQuery.extend(NorbertNode.prototype, Node.prototype);
function NorbertNode() { function NorbertNode() {
this.norbert = p.loadImage("norbert.png"); this.norbert = new Image();
this.norbert.src = "norbert.png";
this.position = new Vector(0, 0, 0); this.position = new Vector(0, 0, 0);
} }
NorbertNode.prototype.draw = function() { NorbertNode.prototype.draw = function() {
var s = this.projection.z / (width / 2); var s = Math.abs(this.projection.z / (width / 2));
s *= 3; s *= 2;
var x = this.projection.x - (186 / s); var x = Math.floor(this.projection.x - (186 / s));
var y = this.projection.y - (150 / s); var y = Math.floor(this.projection.y - (50 / s));
p.image(this.norbert, x, y, 372 / s, 300 / s); context.drawImage(this.norbert, x, y);
}; };
// Class Pamela
var p; Pamela.prototype.millis = function() {
return (new Date).getTime();
};
var ooo = 2;
$(document).ready(function() { $(document).ready(function() {
goPamela(); new Pamela();
}); });
function goPamela() {
p = Processing("pamela"); function Pamela() {
var p = Processing("pamela");
context = p.context; context = p.context;
width = p.width; width = context.canvas.clientWidth;
height = p.height; height = context.canvas.clientHeight;
var entities = ["sandb", "fs111", "tazo", "wouter", "unknown", "unknown", "unknown", "unknown"]; var entities = ["sandb", "fs111", "tazo", "wouter", "unknown", "unknown", "unknown", "unknown"];
var m = new Matrix(); var m = new Matrix();
@ -226,7 +236,7 @@ function goPamela() {
p.startTime = p.millis(); p.startTime = p.millis();
p.setup = function() { p.setup = function() {
p.noStroke(); //p.noStroke();
var count = 0; var count = 0;
this.nodes = []; this.nodes = [];
this.nodes[count++] = new NorbertNode(); this.nodes[count++] = new NorbertNode();
@ -236,7 +246,7 @@ function goPamela() {
}; };
p.animate = function(secs) { p.animate = function(secs) {
return -0.5 + (p.millis() % secs) / secs; return -0.5 + (this.millis() % secs) / secs;
}; };
p.mousePressed = function() { p.mousePressed = function() {
@ -249,7 +259,6 @@ function goPamela() {
return; return;
m.resetMatrix(); m.resetMatrix();
//m.rotateZ(this.animate(8000) * 2 * Math.PI);
var startAnimation = 1 - ((p.millis() - p.startTime) / 3000); var startAnimation = 1 - ((p.millis() - p.startTime) / 3000);
if (startAnimation > 0) { if (startAnimation > 0) {
startAnimation *= startAnimation; startAnimation *= startAnimation;
@ -257,10 +266,7 @@ function goPamela() {
m.translate(0, 0, Math.PI * startAnimation); m.translate(0, 0, Math.PI * startAnimation);
} }
//m.translate(0, 0, -width / 4 + Math.abs(this.animate(21000) * (-width / 4)));
m.translate(0, 0, -width / 6); m.translate(0, 0, -width / 6);
//if (startAnimation > 0)
//m.rotateX(2 * Math.PI * startAnimation);
m.rotateY(this.animate(7000) * 2 * Math.PI); m.rotateY(this.animate(7000) * 2 * Math.PI);
for (var i = 0; i < this.nodes.length; i++) { for (var i = 0; i < this.nodes.length; i++) {
@ -271,14 +277,20 @@ function goPamela() {
return a.projection.z - b.projection.z; return a.projection.z - b.projection.z;
}); });
p.background(255); context.clearRect(0,0,width,height);
p.pushMatrix(); context.save();
p.translate(width / 2, height / 2); context.translate(width / 2, height / 2);
for (var i = 0; i < this.nodes.length; i++) { for (var i = 0; i < this.nodes.length; i++) {
this.nodes[i].draw(); this.nodes[i].draw();
} }
p.popMatrix(); context.restore();
}; };
p.init(); p.init();
} }
function loadImage(name) {
var img = new Image();
img.src = name;
return img;
}