Simple sketch works in Java, but not JavaScript mode - won't even load background image

km13oj

Hi! I'm trying to do a very simple test of an image that follows the mouse, but I can't seem to get it to work in JavaScript mode. I've built in some easing, but even when I take that out and replace x and y with mouseX and mouseY, the sketch still doesn't work. Any help at all would be much appreciated.

CODE:

float x;
float y;
float easing = 0.05;

PImage img;
PImage img2;

void setup(){
    size(1280,1107);
    img = loadImage("http://" + "upload.wikimedia.org/wikipedia/commons/1/14/Political_map_of_Canada.png");
    background(img);
    img2 = loadImage("http://" + "mchs.org.au/wp-content/uploads/2013/07/1-service-icon-indigenous.png");
}

void draw(){
///EASING
  float targetX = mouseX;
  float dx = targetX - x;
  if (abs(dx) > 1) {
    x += dx * easing;
  }
  float targetY = mouseY;
  float dy = targetY - y;
  if (abs(dy) > 1) {
    y += dy * easing;
  }

///ICONS
 image(img2, x, y);
 image(img2, x/2, y/2);
 image(img2, x*2, y*2);
 image(img2, x*2.5, y/1.5);
}

If anyone has any suggestions, please let me know!

km13oj

Any help at all is very much appreciated!

clankill3r

I'm not sure but any help is appreciated :) Look here: http://processingjs.org/articles/p5QuickStart.html

Scroll down to: **Processing.js has to cheat to simulate Processing's synchronous I/O **

It talks about pre loading: /* @pjs preload="picture.jpg"; */

hope that helps