P5.js to Processing conversion

p5.js Coding Questions
1

Hi everyone, i´m new to java and i´m trying to convert this js code to processing, because I want it to interact with the OpenKinect Library:

var img, car;

function preload() {
	img = loadImage('faustocartel.png');
}

function setup() {
	noCursor();
	createCanvas(img.width, img.height);
	image(img, 0, 0, width, height);
	loadPixels();
	car = createImage(img.width, img.height);
	car.copy(img, 0, 0, img.width, img.height, 0, 0, img.width, img.height);
	car.loadPixels();
}

function draw() {
	var x, y, sx, sy, dx, dy, strength;
	for (y=0; y<height; ++y) {
		for (x=0; x<width; ++x) {
			sx = x;
			sy = y;
			dx = x - mouseX;
			dy = y - mouseY;
			
			strength = 3.0 - ((dx*dx + dy*dy) * 0.000016);
			
			if (strength >= 0) {
	
				sx = int(mouseX - dx * strength);valor de la linea 32 efecto de puntos
				sy = int(mouseY - dy * strength); 
			}
			
			pixels[Pun(x,y)+0]   = car.pixels[Pun(sx,sy)+0]; 
			pixels[Pun(x,y)+1] = car.pixels[Pun(sx,sy)+1]; 
			pixels[Pun(x,y)+2] = car.pixels[Pun(sx,sy)+2]; 
		}
	}
	updatePixels();
}

function Pun(x, y) {return (x + y * width) * 4}

So far i’ve done this, but I know it has several errors, it keeps sending the “ArrayIndexOutOfBounds -8 error”:

PImage img, car;
float strength;
int x, y, sx, sy, dx, dy;

void setup() {
  img = loadImage("faustocartel.png");
  noCursor();
  size(922, 1200,P2D);
  image(img, 0, 0, width, height);
  loadPixels();
  car = createImage(img.width, img.height, RGB);
  car.copy(img, 0, 0, img.width, img.height, 0, 0, img.width, img.height);
  car.loadPixels();
}


    int Pun(int x, int y){
    return (int(x + y * 922) * 4);
}
  


void draw() {
  
  

  for (y=0; y<height; ++y) {
    for (x=0; x<width; ++x) {
      
  sx=x;
  sy = y;
  dx = x - mouseX;
  dy = y - mouseY;
      
      
      strength = 3.0 - ((dx*dx + dy*dy) * 0.000016);
      
      if (strength >= 0) {
  
        sx = int(mouseX - dx * strength);
        sy = int(mouseY - dy * strength); 
      }
      
      pixels [Pun(x,y)]   = car.pixels[Pun(sx,sy)]; 
      pixels [Pun(x,y)+1] = car.pixels[Pun(sx,sy)+1]; 
      pixels [Pun(x,y)+2] = car.pixels[Pun(sx,sy)+2]; /
    }
  }
  updatePixels();
}

Can someone help me? Your help will be very much appreciated

1 Like
2

Processing.org/reference/pixels.html
Processing.org/reference/color_datatype.html
Processing.org/reference/rightshift.html

3

Were you able to resolve your issue?

1 Like