Hello, I’m interested in your better uploader plugin. But I put it on the page, followed your tutorial, but it isn’t working properly. I put the uploader on the page, and a button with the “send to cloud” workflow. But when I try to select and upload an image, I get the following error: “The Uploader is empty, please select or drag & drop some files before uploading.”
I have on issue listed on the page that says I need to fill out the “max amount of files.” But I can’t type a number is that field. It forces me to select something. I don’t get it. Help!
I might as well ask my ultimate question:
I need the user to be able to take or select images from their phone, then upload them to my app.
I need the user to be able to crop and rotate images, before or after upload…
I need images to be compressed somewhere during that process.
Finally, I need the user to be able to upload images from their iPhones, which means they need to be able to upload .heic files. And I need those .heic files converted to .jpg, so they can be displayed on the app.
I don’t know why it is so difficult to get all that, but I’ve been having a hard time. Any advice would be appreciated.
I’ll answer some of your questions regarding the plug-in.
First of all, the maximum amount of files field is like any other dynamic field that is of type number. Simply type the number 2 and then click outside of the field, it will work. This is not a plug-in usability thing it’s just a weird thing about bubble’s ui.
Next, you can limit file types and set the suggested file types to whatever you want. See the discussion I had above for more clarity.
Finally, you can compress images using Cloud Companion.
The other questions are specific to your app (like converting a video files to an image or cropping). That’s not something this plug-in does unfortunately.
I actually just came back here to delete my question. I should have done more due diligence before bothering you. I do understand about the dynamic input boxes on Bubble. For some reason it just wasn’t working normally yesterday. I worked fine today. Just some temporary weirdness.
I’ve gotten most of it to work as on your demo. Except… the Send Files to Cloud workflow isn’t doing anything. Here is a screenshot of what I have:
Okay, so what I see from your screenshot is that you have the start of a new dynamic expression after your completed dynamic expression. You’re going to want to give it only one data source, not a completed one + an empty one.
Also, if you’re unsure of what’s going on I would suggest enabling debug mode on the better Uploader (it’s a checkbox) and check the browser console to see what’s going on.
I deleted that empty expression, and the debug box was already checked. It’s still not doing anything. I’m guessing it’s something stupid easy, but… I am out of time right now. Need to bolt. I’ll play with it later and let you know if I have more questions. Really appreciate your help.
I’m back home and seeing if I can’t figure this out. I still can not get the “send files to cloud” workflow to work. But… I have a bit of a weird clue.
So, one of my goals here is for users to be able to upload images directly from their phones. With iPhones, the file type is .heic. I need these converted to .jpg at some point in the workflow of adding images.
I’ve so far been testing this with .jpgs, just so I could figure out how to make it work before tackling the harder stuff.
So I clicked the uploader and selected an image with the file name:
So, first question, did this already convert my .heic image to .jpg? Please say yes. That would be awesome! But if now, where did that image name come from?
Now, when I click on the button with the “send files to cloud” workflow, nothing happens. I have looked at your demo page and copied everything verbatim – or think I did. But something is wrong.
You have an ID Attribute on your uploader. Could it have something to do with that? I have put an id on my uploader, but it isn’t referred anywhere else. Do I need to do something with that ID attribute?
Hey, and amendment. I thought to look at my database, and it does appear that files are being uploaded. But not correctly. Here is a screenshot of what’s being uploaded:
If you’re going to rename the file, you have to make sure you’re not breaking it by altering the extension.
Once the file is uploaded you should only see one extension, otherwise your file will break.
Furthermore, you should really avoid odd characters like “;” in your file names
Finally, your video file is not being converted to an image file. Not sure what you’re up to but my plug-in doesn’t do that. By the way, you can’t convert a video to an image - that doesn’t make any sense. If you mean taking a still from a video, then saving that as an image - that’s a whole other thing. If you try to display a video in an image tag it will show you the default thumbnail for it
Yeah, I know that the files are breaking and that there are 2 .jpgs in the file name. I’m just not sure why that’s happening.
I don’t know where the idea of videos came in. I am not doing anything with videos. Just single images shot with an iPhone, which have a file extension of .heic, not .jpg.
But, I think I have a solution. I’m just using your uploader to get the raw file. Then I’m using a different plugin to compress the images and convert them to .jpg. I am also planning to use a third plugin to allow the user to also crop and rotate that image. Can’t get that to work for some reason – I’m using the same extension elsewhere with no issues – but I’ll see if I can’t figure that out. And that’s not really your problem.
But I’ll use Better Uploader in step one, which seems to work, and, for that, it’s brilliant. So… thanks for the plugin.
Hi Jonah,
Well done for producing an excellent alternative to Bubble’s standard File Uploader.
Unfortunately, I cannot use your method for my current project, because I can see no easy way of extracting the URL of where the file is actually stored in the cloud. This is easily accomplished using the standard File Uploader. I need the URL to enable a server-side API to parse the uploaded data which will be returned to create a Thing. Unless you can suggest a workaround, I will have to stick with the inferior Bubble Uploader. Perhaps you may be able to include the File’s URL as an exposed state in future a update.
Lord protect us from Newbies! I had tried both of those solutions, but the URL was not being passed to the relevant field in User. It dawned on me that I might not have been logged in while testing the process, therefore the “Make changes to Current User” had no effect.
Thank you for responding to my idiocy so promptly, and I am pleased to be able to use your excellent plugin.
Another basic mistake was to place the “Make changes to Current User” action immediately after the “Send files to the cloud” action. Consequently, null data was being to be stored in the field before the file had finished uploading. Obviously, I needed to create a workflow that tested for the save to cloud to be completed before the update of the User table.
Hi @jonah.deleseleuc
When I select a file and the file is ready, the exposed state Raw Progress is 100. I click Better Uploader and select another file, does the Raw Progress reset to 0 and then to 100?
I am trying to use Do when BetterUploader’s Raw Progress is 100 to close a popup where the plugin resides. It only works the 1st time, even though I set it to run every time. So it seems that Raw Progress doesn’t reset to 0 and then 100 when a new file is selected. I put a text field to show the Raw progress. It is 0 then 100 for the 1st file. Then it never resets to 0 when I select a 2nd file. I think this is a bug.
Hey there, I have some good news and bad news. The good news is that the reset function is not broken - the raw progress is being reset just fine. The bad news is that it means there’s something you’re not doing right.
Perhaps you may be able to include the File’s URL as an exposed state in future a update.
