Processing Forum

Screen name:
cochraneowns

cochraneowns's Profile

2 Posts

2 Responses

0 Followers

Activity Trend

Last 30 days

Loading Chart...

Show:

Expanded view
List view

What websites work best when using processing.js?

[2 Replies]
- 18-Apr-2013 11:38 AM
- Forum: Processing with Other Languages
Hi so I am fairly new into using processing.js and have been having problems with getting it to show up on websites. I am a student doing an assignment for class to show the class how to put their sketches online using processing.js. Now I don't have money to buy my own domain so I was wondering if anybody knew of any free website builders that would allow processing.js to run. So far I have tried two free website builders, weebly and webs, and neither of them allow the sketch to run.

here is what shows up,

http://tecochrane.webs.com/

http://processingjava.weebly.com

if anyone could tell me to why maybe these won't run it would be a great help as well.

How to make something stay permanently in one spot while using pan

[5 Replies]
- 12-Apr-2013 09:05 PM
- Forum: Programming Questions
So I am creating an image where you can pan from left to right and am trying to put buttons in with it. The problem I am having is trying to get the buttons to stay in one location. Right now when you move your mouse left to right the buttons also move. So basically I don't want to buttons to pan but I'm not quite sure how to do it.

here is my code.

PImage imgBG;

PImage baronR;

PImage baronB;

PImage blueR;

PImage blueB;

PImage climbingR;

PImage climbingB;

PImage goldenR;

PImage goldenB;

int pointX = 0;

float xp;

float xb;

float tempXpos;

float tempYpos;

ImageButtons button1;

ImageButtons button2;

ImageButtons button3;

ImageButtons button4;

void setup() {

size(displayWidth, displayHeight);

colorMode(HSB);

background(30, 80, 32);



imgBG = loadImage("Background.png");

//baronR = loadImage("BaronMantellaSmall.png");

//baronB = loadImage("BaronMantella.png");

//blueR = loadImage("BlueLeggedMantellaSmall.png");

//blueB = loadImage("BlueLeggedMantella.png");

//climbingR = loadImage("ClimbingMantellaSmall.png");

//climbingB = loadImage("ClimbingMantella.png");

//goldenR = loadImage("GoldenMantellaSmall.png");

//goldenB = loadImage("GoldenMantella.png");





//creating image buttons

PImage b1 = loadImage("BaronMantellaSmall.png");

PImage r1 = loadImage("BaronMantella.png");

PImage d1 = loadImage("BaronMantellaSmall.png");



PImage b2 = loadImage("BlueLeggedMantella.png");

PImage r2 = loadImage("BlueLeggedMantellaSmall.png");



PImage b3 = loadImage("ClimbingMantellaSmall.png");

PImage r3 = loadImage("ClimbingMantella.png");



PImage b4 = loadImage("GoldenMantellaSmall.png");

PImage r4 = loadImage("GoldenMantella.png");





//floats for button sizes and locations



//float x = width/2 - b1.width/2;

// float y = height/2 - b1.height/2;

int x = width/2 - b1.width/2;

int y = height/2 - b1.height/2;

int w = b1.width;

int h = b1.height;







//new buttons, x location, y location, width, height, normal, over, pushed



button1 = new ImageButtons(x+100, height-b1.height, w, h, b1, r1, d1);

//button2 = new ImageButtons(2380, 970, w, h, b2, r2);

//button3 = new ImageButtons(620, 270, w3, h3, b3, r3);

//button4 = new ImageButtons(310, 270, w4, h4, b4, r4);

}

void draw(){



float x=xb;

int imageWidth = imgBG.width;



if (mouseX >1250 && pointX < 950){

pointX = pointX + ((mouseX-1270)/15);

xb = xb + ((mouseX - 1270)/15)*1.5;

}



if (mouseX <500 && pointX > 50) {

pointX = ((mouseX-425)/15) + pointX;

xb = xb + ((mouseX-425)/15)*1.5;

}



println(pointX);



for (int xp = 1; xp < 5; xp++) {

image(imgBG, -pointX, 0);

image(imgBG, -pointX - (xp*imageWidth), 0);

image(imgBG, -pointX + (xp*imageWidth), 0);

}





///////////////////////////button display and updates to change the images when clicked/rolled

button1.update();

button1.display();

//button2.update();

//button2.display();

//button3.update();

//button3.display();

//button4.update();

//button4.display();









}

class Button {

int x, y;

int w, h;





boolean over = false;

boolean pressed = false;



void pressed() {

if(over && mousePressed) {

pressed = true;

}else{

pressed = false;

}

}



boolean overRect(float x, float y, int width, int height) {

if (mouseX >= x && mouseX <= x+width && mouseY >= y &&mouseY <= y+height) {

return true;

}else{

return false;

}

}

}

class ImageButtons extends Button

{

PImage base;

PImage roll;

PImage down;

PImage currentImage;

//variables for all images

ImageButtons(int ix, int iy, int iw, int ih, PImage ibase, PImage iroll, PImage idown){



x = ix;

y = iy;

w = iw;

h = ih;

base = ibase;

roll = iroll;

down = idown;

currentImage = base;

}



void update()

{

over();

pressed();



if(pressed) {

currentImage = down;



}else if (over){

currentImage = roll;



}else {

currentImage = base;

}

}





void over() {

if( overRect(x-xb, y, w, h) ) {

over = true;

} else {

over = false;

}

}



void display() {

image(currentImage, x, y);

}



}

«Prev
Next »