JSFiddle - React, Tailwind, and code Playground

by Nick Craver

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/dot-luv/jquery-ui.css">
<script src="http://valums.com/files/2010/file-uploader/fileuploader.js"></script>
<link rel="stylesheet" href="http://valums.com/files/2010/file-uploader/fileuploader.css">
<div id="photo_upload">
    <div id="file-uploader_photo">       
        <noscript>          
            <p>Please enable JavaScript to use file uploader.</p>
            <!-- or put a simple form for upload here -->
        </noscript>         
    </div>
</div>
<script language='javascript'>
new qq.FileUploader({
   element: document.getElementById('file-uploader_photo'),
   action: 'upload.php',
   onSubmit: function(id, fileName){
    ContentWindow.params['title'] = fileName;
    CDNAPI.validate(ContentWindow.params);
    ContentWindow.uploader.setParams(ContentWindow.params);
   },
   onComplete: function(id, fileName, content_data){
    // create content object in Gib
    App.addNewContent(content_data);
   },
   template:'<div class="qq-uploader">' + 
    '<div class="qq-upload-drop-area"><span>Drop files here to upload</span></div>' +
    '<div class="qq-upload-button ui-widget-content ui-button ui-corner-all ui-state-default">Upload files</div>' +
    '<ul class="qq-upload-list"></ul>' + 
        '</div>'
  });
</script>