Why Doesn't Sketch Display in Browser (using Tween.lib)?
in
Processing with Other Languages
•
2 years ago
I am attempting to do an initial port of my first Processing sketch over to Processing,js and for some reason after I built in the Tween.lib Library the sketch does not load in the browser. Does anyone know why?
The image used in the sketch is available in another post:
I am using the Tween Library available here
http://quasipartikel.at/2009/11/30/motion-tweening-for-processingjs/
For some reason the sketch fails to load in the browser. Tween.lib is in the same folder as the pde, init.js, processing,js, and html. I used the Export as Processing.js Plug-in and the code below:
/**
* Chasing the Almighty Dollar
*
* Dollar Bills are Displayed on the Canvas and the User Can try to Grab Them, But When They do The Bills Just Fly Away
* by Steve Belovarich
* To view Steve's Electronic Artwork, visit
http://installationspace.com
*/
// @pjs preload must be used to preload the image
/* @pjs preload="100-dollar-bill.jpg"; */
import("Tween.lib");
PFont fontA;
PImage a; // Declare variable "a" of type PImage
int dolSize = 4;
int billNumber = 24;
Bill[] billArray = new Bill[billNumber]; //where the number is the same number as the one in the for-loops
int displayCount = 0;
void setup() {
size(1000, 800);
a = loadImage("100-dollar-bill.jpg"); // Load the image into the program
//fontA = createFont("Georgia.vlw");
// Set the font and its size (in units of pixels)
//textFont(fontA, 22);
for ( int i = 0; i < billNumber; i++ ) {
float rotin = PI/random(-12,12);
float xstart = random(50,900);
float ystart = random(100,700);
float xend = width+300;
float yend = random(-400,300);
billArray[i] = new Bill(this, rotin,xstart,ystart,xend,yend);
}
smooth();
//noLoop(); // Makes draw() only run once
} //end of setup
void draw() {
background(255);
for ( int i = 0; i < billNumber; i++ ) {
billArray[i].move();
// Move each object
billArray[i].update(); // Update Position
billArray[i].display(); // Display each object
}
//text("Chasing the Almighty Dollar", 16, 740);
}
class Bill { // The Bill Class, Constructs Each Bill
float angle = 0;
float imgPosX = 0;
float imgPosY = 0;
float endPosX = 0;
float endPosY = 0;
float imgWidth = a.width/dolSize;
float imgHeight = a.height/dolSize;
Tween tx;
Tween ty;
// PApplet parent;
Bill(float ang, float x, float y, float xend, float yend) {
//this.parent = parent;
angle = ang;
imgPosX = x;
imgPosY = y;
endPosX = xend;
endPosY = yend;
// insert tween instalization here
tx = new Tween(this, "x", Tween.strongEaseInOut, imgPosX, endPosX, 2);
ty = new Tween(this, "y", Tween.bounceEaseInOut, imgPosY, endPosY, 2);
}
public void move() {
int ellipseRadius = 220;
if (displayCount == 0) {
if (dist(mouseX, mouseY, imgPosX, imgPosY) < ellipseRadius) {
// start tween here
tx.start();
ty.start();
displayCount++;
}
}
}
public void display() {
pushMatrix();
rotate(angle);
image(a, imgPosX, imgPosY, imgWidth, imgHeight);
popMatrix();
}
public void update() {
tx.tick();
ty.tick();
}
} //end Bill Class
1
