I need to know how to convert an image link to a picture, and add that picture to a list. Is there some sort of way to convert image links to pictures already, or does it require javascript?
no
url block
1 Like
Are you saying that you have to do this while your program is running? Capturing a changing image or something like that? The URL block will give you the picture but you'd then have to learn how to parse the hideous string of bytes you get back. Try this:
and you'll get the idea.
We should someday implement a COSTUME FROM WEB block, I guess.
Is it possible to use JavaScript to do that?
Or use Add this to my costume block?
I'm sure it is, but it probably isn't a one-liner. I wouldn't know how to do it, although maybe someone like @snapenilk might.
Of course I can! (Sort of)
My solution sometimes works and sometimes doesn't. Using pixels of throws an error, and using result pic breaks Snap! (freezes and spams errors in the console).
1 Like
Using pixels of throws an error
I think that is because for other costumes, it uses the information in data:, but this source does not use data:.
This worked for me, thank you!
You must cope with asynchronicity of image loading.
There is a project to handle image from clippboard to costume: Snap! Build Your Own Blocks
"clip 2 costume" implements loading image with Promise and using outcome in Snap!
Waiting on promise is based on someone previous work i'm not able to credit for, right now.
Of course it can be implemented as asynchronous and data transfered to Snap! with broadcast or global variable.
var img = new Image();
img.onload = function () {
canvas = newCanvas(new Point(img.width, img.height), true);
canvas.getContext('2d').drawImage(img, 0, 0);
*** send 'new Costume( canvas, "Clipboard")' with broadcast or shared variable...
};
img.src = url;
1 Like
That explains it; why did I not think about that before?