JSFiddle - React, Tailwind, and code Playground

by Shirly Manor

HTML

<button id="upload_widget" class="cloudinary-button">Upload files</button>

<script src="https://widget.cloudinary.com/v2.0/global/all.js" type="text/javascript"></script>  

<script type="text/javascript">  
var myChooseTags=["11","test","33"]
const tags = ["extract", "amazing", "apple", "dog", "grass", "planes", "rocket", "rock", "movies", 
  "music", "sad", "light", "open", "mosaic", "entertainment", "test", "testament", "beach", 
  "vacation", "weather", "letter", "orchard"];
  const getMyTags = (cb, prefix) => cb(prefix ? tags.filter((t) => !t.indexOf(prefix)) : tags);


var spacePhotoPresets = cloudinary.createUploadWidget({
  cloudName: 'shirly', 
  uploadPreset: 'test-preset',
  client_allowed_formats: ["jpg", "jpeg", "png"],
  show_powered_by: false, 
  multiple: 'true', 
  sources:['local','facebook'], 
  theme: 'minimal', 
  max_file_size:8000000, 
  max_image_width:4000, 
  max_image_height:4000, 
  showAdvancedOptions: true,        
  //getTags: getMyTags,
  tags: myChooseTags,
  max_files: 40
  }, (error, result) => { console.log(error, result) })

document.getElementById("upload_widget").addEventListener("click", function(){
    spacePhotoPresets.open();
  }, false);
</script>