github.com/jincm/wesharechain@v0.0.0-20210122032815-1537409ce26a/app/lib/plupload-2.1.2/examples/jquery/jquery_ui_widget.html (about) 1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr"> 3 <head> 4 <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 5 6 <title>Plupload - jQuery UI Widget</title> 7 8 <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" type="text/css" /> 9 <link rel="stylesheet" href="../../js/jquery.ui.plupload/css/jquery.ui.plupload.css" type="text/css" /> 10 11 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 12 <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script> 13 14 <!-- production --> 15 <script type="text/javascript" src="../../js/plupload.full.min.js"></script> 16 <script type="text/javascript" src="../../js/jquery.ui.plupload/jquery.ui.plupload.js"></script> 17 18 <!-- debug 19 <script type="text/javascript" src="../../js/moxie.js"></script> 20 <script type="text/javascript" src="../../js/plupload.dev.js"></script> 21 <script type="text/javascript" src="../../js/jquery.ui.plupload/jquery.ui.plupload.js"></script> 22 --> 23 24 </head> 25 <body style="font: 13px Verdana; background: #eee; color: #333"> 26 27 <h1>jQuery UI Widget</h1> 28 29 <p>You can see this example with different themes on the <a href="http://plupload.com/example_jquery_ui.php">www.plupload.com</a> website.</p> 30 31 <form id="form" method="post" action="../dump.php"> 32 <div id="uploader"> 33 <p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p> 34 </div> 35 <br /> 36 <input type="submit" value="Submit" /> 37 </form> 38 39 <script type="text/javascript"> 40 // Initialize the widget when the DOM is ready 41 $(function() { 42 $("#uploader").plupload({ 43 // General settings 44 runtimes : 'html5,flash,silverlight,html4', 45 url : '../upload.php', 46 47 // User can upload no more then 20 files in one go (sets multiple_queues to false) 48 max_file_count: 20, 49 50 chunk_size: '1mb', 51 52 // Resize images on clientside if we can 53 resize : { 54 width : 200, 55 height : 200, 56 quality : 90, 57 crop: true // crop to exact dimensions 58 }, 59 60 filters : { 61 // Maximum file size 62 max_file_size : '1000mb', 63 // Specify what files to browse for 64 mime_types: [ 65 {title : "Image files", extensions : "jpg,gif,png"}, 66 {title : "Zip files", extensions : "zip"} 67 ] 68 }, 69 70 // Rename files by clicking on their titles 71 rename: true, 72 73 // Sort files 74 sortable: true, 75 76 // Enable ability to drag'n'drop files onto the widget (currently only HTML5 supports that) 77 dragdrop: true, 78 79 // Views to activate 80 views: { 81 list: true, 82 thumbs: true, // Show thumbs 83 active: 'thumbs' 84 }, 85 86 // Flash settings 87 flash_swf_url : '../../js/Moxie.swf', 88 89 // Silverlight settings 90 silverlight_xap_url : '../../js/Moxie.xap' 91 }); 92 93 94 // Handle the case when form was submitted before uploading has finished 95 $('#form').submit(function(e) { 96 // Files in queue upload them first 97 if ($('#uploader').plupload('getFiles').length > 0) { 98 99 // When all files are uploaded submit form 100 $('#uploader').on('complete', function() { 101 $('#form')[0].submit(); 102 }); 103 104 $('#uploader').plupload('start'); 105 } else { 106 alert("You must have at least one file in the queue."); 107 } 108 return false; // Keep the form from submitting 109 }); 110 }); 111 </script> 112 </body> 113 </html>