šŸŽØ New plugin! Cosmic Canvas: Drawing & Painting

Quick question. I want to show the image users created in the canva in a Kanban board repeating group. Is there any lighter way element that I can put into the repeating group to view the serialized canva? Or do I have to put the canva into the repeating group to view the serialized canva? I am trying to make the repeating group lighter.

Also, can you add a ā€œDisableā€ option in the editor if the canva is the only option to view the serialized canva?

For writing fast on the canva, I do see some ā€œsmoothingā€ of the lines. I know this takes time to improve. Will you have a specific plan to improve that? I switched from FrabricJs to your plugin for the good value. It works for my purpose but would be even better if this can be improved.

Great value!

1 Like

Hello @gradylam ,
thank you for the kind words.

If you donā€™t need to edit the user-generated images you could use the ā€œExport image from Canvasā€ workflow action, when the user finishes editing it. Flag the ā€œJust create linkā€ option - so the user will not actually download the image - and a file will be created in your database. You can access it from the canvas state ā€œExported image URLā€. After, just show the image in the repeating group.

Otherwise, maybe setting an empty text in the ā€œModeā€ field should make the canvas a simple viewer.

Regarding the line smoothing, you could try to modify the canvas field ā€œDraw smoothnessā€, to achieve the desired result.

Please let me know if that helps.

1 Like

@Cosmic.Steve
How can I export the canvas at 1024*1024 on a mobile device, the exported image look good on PC but when tried in mobile it is too pixelated.

1 Like

Hello @nandhakt ,
the exported image size will be exactly the canvas size in pixel.

Hope that helps!

1 Like

Is that not currently possible?

So on mobile devices it canā€™t be more than 300-350px in width

It would be awesome if it has this feature because other canvas plugins has this feature where you can setup custom width & height.

You are right!
Iā€™m going to implement that feature soon.

1 Like

Great, thank you

Hi @Cosmic.Steve ! I just subscribed to your plugin, and I really like it so far. However I canā€™t find something I would need. Is there a way to set the Zoom amount dynamically without using the mouse?

@Cosmic.Steve Hiā€¦
1)
is there any way to get the eraser to only erase the selected layerā€¦ right now it erases all the layersā€¦

also is there a way to get access to the erasers hardness function? to do soft erases?

@Cosmic.Steve Hi what would it take to fix that eraser tool erasing all layers at once? Itā€™s a pretty big deal and wondering would you would need to fix it?

Hello @zoltan1, thank you for using my plugin!
Iā€™m sorry but somehow I wasnā€™t getting any email notification from the Bubble Forum and I lost all the messages since last week. Right now itā€™s not possible to set a zoom value programmatically, but it will in a future release.

Hello @ryan8 , sorry again for not checking the forum messages but I got no email notifications from the forumā€¦

Only the visible layers will be erased right now. So one possibility is to set the visibility of the layers you want to preserve as false, so they donā€™t get erased. Iā€™ll work on a simpler solution as soon as possible, including eraser softness.

Thank you for your feedback!

Hello everyone,
due to the big amount of requests I implemented some new features overnight. Here is the list:

  • Canvas and export size: it is now possible to set the canvas size in pixel, which will be exactly the exported image size @nandhakt @gnelson
  • Zoom via workflow: there is a new action in the workflow section that allows you to zoom in a point, selecting the point coordinates and the zoom amount @zoltan1
  • Non erasable levels: using the action ā€œSet properties of an objectā€ you can now set the ā€œerasableā€ property. When set to false, the object will not be erased in the erase mode. The object property will be returned in the canvas state ā€œSelected is erasableā€. @ryan8
  • Erase only selected: setting a flag in the canvas fields, the eraser will act only on the selected objects. This will modify the erasable properties of each object. @ryan8

I am still working on the eraser hardness, which is not as straightforward as it might seem.

Thanks to everyone for submitting their feedback and for making this product better for everyone. :pray:

3 Likes

Hi all,
the plugin is now updated with the following new features:

  • Area selection on/off: it is now possible to enable or disable the area selection in the ā€œmoveā€ mode
  • Click will select: you can choose if the click action will select a layer or not. This is particularly useful when you want to move an object which is hidden behind other elements. You can select it via workflow and then the user can move it without selecting something else
  • Move to: it is now possible to send an object to a specific position in the stack via this workflow

Thanks everyone for the precious feedback. :grinning_face_with_smiling_eyes:

Hi @Cosmic.Steve,

Just following up with this inquiry. Is there a way to add images from an external database rather than uploading them individually? I would like to use images from S3 bucket as well as unsplash.com. stock images.

For the S3 images, they work when I upload them from the editor and continue to work for an ā€˜xā€™ amount of time after. But eventually stop working indicating a potential cache issue. When they fail I get a CORS issue in the browser console, ā€˜missing headerā€™.

For the Unsplash images I donā€™t get any errors they just donā€™t load into the canvas. However, if I edit the serialized json, then load the canvas it works.

Thank you for your help!

Hello @hookbook ,
CORS mechanism regulates the usage of resources that donā€™t belong to your server, by users browsers. Sometimes some origins (like unsplash, I suppose) donā€™t allow the http preflight request for using their resources.

Have you tried to export the image from the plugin flagging the ā€œJust create linkā€ field? Sometimes it can solve those issues.

Steve

Is there a way to download multiple images in a zip file, like how Canva does

Hello @nandhakt , right now it is not possible. Would you like to download an image for each layer, or different size images?