Upload image and edit using js canvas and croppie

(8 posts) (3 voices)


No tags yet.

  1. duane, Member

    Hi again,

    I'm trying to integrate Croppie image editor to:

    1. select an image (profile photo of mydbr user) pre-upload to html/js canvas
    2. load it into Croppie for editing (crop/rotate/aspect ratio, etc)
    3. only after edited, upload it to the server

    Before I dive in and waste hours of time on the wrong approach, would the best approach be to:

    1. Build a php plugin for this OR
    2. Load the JS libraries for this into a normal mydbr page OR
    3. something else?

    Any guidance is appreciated!

  2. duane, Member

  3. myDBR Team, Key Master

    the Croppie itself can be loaded inside the report (plain JS), but as you need to upload the image to the server, you will need the server side code. So, the best approach would be to make a myDBR extension for it.

    myDBR Team

  4. duane, Member

    Thanks! I'll give that a go. Would you like the extension to include with myDBR when it is ready?

  5. myDBR Team, Key Master

    If not directly, then mabye as an add-on if other users find it useful.

    The code that is included in myDBR needs be maintened years to come. That includes also the external libraries.
    myDBR Team

  6. maron, Member

    Hi Duane.

    We would be highly interested in something like this and potentially willing to add and share features in the future.

    Best regards,


  7. duane, Member

    Hi Maron.

    OK. Will let you know when I have a first version. I may use Toast UI instead of Croppie mainly because it has more features, but each has features I want to use in different projects. I'll also be trying the same with jsPDF to generate PDF files in the browser before uploading.

    I'll announce more on this thread.


  8. maron, Member

    Hi Duane.

    Did you have any luck with creating an extension for Toast UI Image editing?

    Best regards,



You must log in to post.