JSFiddle - React, Tailwind, and code Playground

by Shirly Manor

HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Title</title>
  </head>
  <body>
    <button id="open-btn"></button>

    <script src="https://media-library.cloudinary.com/global/all.js"></script>
    <script type="text/javascript">

       window.ml = cloudinary.createMediaLibrary({
         cloud_name: 'shirly',
         api_key: '186357422989241',
         username: '[email protected]',
         button_class: 'myBtn',
         button_caption: 'Select Image or Video',
         insert_transformation: true,
       }, {
         function insertHandler(data) {
      console.log(data);
    }
    $('.btn-upload').on('click', function(e) {
      if( mediaLibrary === null ) {
        mediaLibrary = cloudinary.openMediaLibrary(mlOptions, {insertHandler: insertHandler});
      } 
    })
     $('.btn-close').on('click', function(e) {
    mediaLibrary.hide();}
      )
    </script>

  </body>
</html>