ackvonhuelio There is a way to upload images and save them, but to get it to work, you have to get image data using the canvas element and then split it up to store it in a big key value or data table. I made this proof of concept- if you press the download button you can see it load in an image from the data tables.

The downside of this method is that the time it takes to upload increases exponentially with a bigger image. It also can't display the image using an image element, only the canvas element, so all uploads will be of slightly lower quality.

Awards

  • â’¸ 500 from Jibberjay
    Comment: Here ya go

      Letti42 Perhaps you could do what Binary_Coder was talking about with the image data and then send that to a custom backend for storage. That should at least allow for higher quality uploads, larger data storage, and quicker downloads. I'm not as familiar with app lab though, so it may still not be possible.

            DragonFireGames The upload quality has to do with the way images are rendered on the canvas, and you can only get the image data using the canvas, so lower quality images are kind of inevitable. But a custom backend could enable much faster upload speeds, as long as the data limit is big enough.

                Binary_Coder I could try and set up a demo. I'm already working on my backend right now anyway. Speaking of that, I should probably ask for help at this point.

                  i forget if this is a thing.... if there is a way to extract pixel values from applab or image data, you could simply write that to a table in base 64 and then load it in when necessary

                    I noticed that the uploaded image url is a blob URL, I wonder if you could do anything with that.

                    I tried that like a million times with a million different variations it doesn't work (then again, I am not an expert at code.org stuff)... But I think there is a way through the code.org api to view images from other projects that actually have a link that's not a blob url.

                      altZany those are for uploaded assets. You can't programmatically upload images to a project

                          well technically all you'd have to do is the correct b64 start method it'll work in any browser though i mainly forgot how it goes since it's been ages since I've used it idk if CDO allows data:image/png;base64,<encoded content>
                          or i wonder if there's an event that you can check for once the upload happens to possibly extract the data.... knowing CDO it's probably not implemented
                          or possibly if you want it to exist past one session you could try caching it in the /media?u= tab which handles images and audio

                            Varrience i thought of using the base64 url but there’s a bunch of formatting required thats too much for me to understand

                              ackvonhuelio I've currently have a method though it takes time to save and decode https://studio.code.org/projects/applab/j4nJKiJHa1zhLFMMSkXHJjCQm8XqtA89ZyTwSTjCQdQ/view this may be a good permanent solution you were looking for, like binary said you can do it this way i thought so as well so i dug a little and made a little interface which allows uploaded images to be saved in CDO permanently rather than it being lost in the cache

                              it could be faster if i manually encased it in b64 but i can't be bothered to implement it correctly.... though if you have file encoding knowledge it might be possible to make this method even quicker than mine

                                birthdayboy224 I'm not an expert so take what I say with a grain of salt, but I would assume that since it's still loading the same amount of data, it'll take the same amount of time.

                                  birthdayboy224 Yeah @[WUT] Adam is right, you can split up the image as much as you want but in the end, you still have to save every pixel. The demo I made does actually split up the image data into 40 smaller arrays, but only to make sure that the array isn't too big.

                                  Actually, splitting up the image might take longer to save, since it has to execute more requests.

                                    Chat