Skip to content

Unclear console message if image in loadImage is not found #868

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
eharkins100 opened this issue Mar 5, 2019 · 8 comments
Closed

Unclear console message if image in loadImage is not found #868

eharkins100 opened this issue Mar 5, 2019 · 8 comments

Comments

@eharkins100
Copy link

Nature of issue?

  • Found a bug (more likely a user error by me)

  • Web browser and version: <Google Chrome | 72.0.3626.119 (Official Build) (64-bit)>

  • Operating System: <MacOSX Sierra 10.12>

  • Steps to reproduce this bug:

In openprocessing.org code editor, this code works the way I want it, but in the p5 editor, I get his console message:

Event {isTrusted: true, constructor: Object}

`var imgAA;
var imgBB;
var x = 100;
var y = 100;
var Xspeed = 4;
var Yspeed = 3.5;

function preload(){
imgAA = loadImage('aa.png');
imgBB = loadImage('bb.png');
}

function setup() {
createCanvas(600, 600);
background(100);
}

function draw() {
background(127);
image(imgAA, x, y, 100, 100);
image(imgBB, y, x, 100, 100);
x = x + Xspeed;
y = y + Yspeed;
if (x > width){
Xspeed = -4;
}
if (x < 0){
Xspeed = 4;
}
if (y > height){
Yspeed = -3.5;
}
if (y < 0){
Yspeed = 3.5;
}
}`

@LakshSingla
Copy link
Contributor

@eharkins100 It seems as if you have not actually imported aa.png and bb.png in your sketch.
Solution:

  • Under Sketch menu on top bar, click on Add File.
  • Drag the PNGs from your desktop on the blank area provided (below text box).

Alternatively, you can host the images on another site and provide its URL instead of aa.png or bb.png

@catarak
Copy link
Member

catarak commented Mar 5, 2019

i'm finding the same thing, that i'm able to get that console message to appear if i just copy your code into a new sketch and don't upload any images. however, the console message is not clear, and that's an issue!

@catarak catarak changed the title Can not load two images at once in P5.js Unclear console message if image in loadImage is not found Mar 5, 2019
@LakshSingla
Copy link
Contributor

@catarak I can help investigating this

@eharkins100
Copy link
Author

eharkins100 commented Mar 6, 2019 via email

@eharkins100
Copy link
Author

eharkins100 commented Mar 6, 2019 via email

@GaurangTandon
Copy link
Contributor

GaurangTandon commented Mar 18, 2019

Hello @catarak, I'd like to work on this issue. I did basic research about it and it seems that the issue is not with the Console component. That componenet is displaying all the information it receives as consoleEvent. Now, it receives consoleEvent from IDEView, so I believe the problem might be there. However, I have not yet been able to pinpoint the source of lacking event information yet.

What I plan to be able to do is trap 404 server response errors, and be able to display a helpful message for that. So, I put a console.log(messageEvent); in the handleConsoleEvent method in PreviewFrame component. Even then, it yields an error, by looking at which it is very difficult to identify that it was because of missing assets (log link). The only useful thing I found was the id property on each of the errors:

MessageEvent
data: Array(2)
 0:
  log: Array(1)
   0:
    data: [{…}]
     id: "389dba67-ce82-dcf8-a321-9b4b-1552902855952"
     method: "error"

Do you have any suggestions on how I could make use of this id to determine what type of an error it was? Or is there some other way that you can think of? Thanks!

@catarak
Copy link
Member

catarak commented Mar 20, 2019

there's a file called client/utils/previewEntry.js that's loaded into the preview that catches console messages. i think there's an issue with this, or another event handler needs to be added.

@catarak
Copy link
Member

catarak commented Mar 20, 2019

closing as duplicate of #468

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants