| /file.html |
|---|
| @@ -64,7 +64,7 @@ |
|---|
| </button> |
| </div> |
| <div class="btn-group" role="group"> |
| <button type="reset" class="btn btn-default cancel"> |
| <button type="reset" class="btn btn-danger cancel"> |
| <i class="glyphicon glyphicon-ban-circle"></i> |
| <span>Cancel All</span> |
| </button> |
| @@ -113,7 +113,7 @@ |
|---|
| <i class="glyphicon glyphicon-upload"></i> |
| <span>Upload</span> |
| </button> |
| <button id="cancel" data-dz-cancel class="btn btn-default cancel"> |
| <button id="cancel" data-dz-remove class="btn btn-warning cancel"> |
| <i class="glyphicon glyphicon-ban-circle"></i> |
| <span>Cancel</span> |
| </button> |
| @@ -152,6 +152,7 @@ |
|---|
| <script src="bower_components/clipboard/dist/clipboard.min.js"></script> |
| <script> |
| $(document).ready(() => { |
| $.get('session.php').then((token) => { |
| // Get the template HTML and remove it from the doument |
| var previewNode = document |
| .querySelector("#template"); |
| @@ -164,30 +165,33 @@ |
|---|
| .removeChild(previewNode); |
| |
| var myDropzone = new Dropzone('.panel-body', { // Make the whole body a dropzone |
| url: "file.php", // Set the url |
| paramName: "file", |
| url: 'file.php', // Set the url |
| paramName: 'file', |
| thumbnailWidth: 80, |
| thumbnailHeight: 80, |
| //parallelUploads: 20, |
| previewTemplate: previewTemplate, |
| autoQueue: false, // Make sure the files aren't queued until manually added |
| previewsContainer: "#previews", // Container to display the previews |
| previewsContainer: '#previews', // Container to display the previews |
| clickable: [ |
| "#uploadbutton", |
| "#uploadpanel" |
| '#uploadbutton', |
| '#uploadpanel' |
| ], |
| //clickable: "#uploadbutton" // Element that should be used as click trigger to select files. |
| }).on("addedfile", (file) => { |
| }).on('sending', (file, xhr, formData) => { |
| // Append session token. |
| formData.append('token', token); |
| }).on('addedfile', (file) => { |
| // Hookup the start button |
| file.previewElement.querySelector(".start").onclick = () => { |
| myDropzone.enqueueFile(file); |
| }; |
| }).on("totaluploadprogress", (progress) => { |
| }).on('totaluploadprogress', (progress) => { |
| document |
| .querySelector("#total-progress .progress-bar") |
| .querySelector('#total-progress .progress-bar') |
| .style |
| .width = progress + "%"; |
| }).on("sending", (file) => { |
| }).on('sending', (file) => { |
| // Show the total progress bar when upload starts |
| document.querySelector("#total-progress") |
| .style |
| @@ -198,11 +202,11 @@ |
|---|
| .previewElement |
| .querySelector(".start") |
| .setAttribute("disabled", "disabled"); |
| }).on("queuecomplete", (progress) => { |
| }).on('queuecomplete', (progress) => { |
| document.querySelector("#total-progress") |
| .style |
| .opacity = "0"; |
| }).on("success", (file, data) => { |
| }).on('success', (file, data) => { |
| // Serialize JSON to object. |
| data = JSON.parse(data); |
| |
| @@ -356,6 +360,7 @@ |
|---|
| document.querySelector("#actions .cancel").onclick = () => { |
| myDropzone.removeAllFiles(true); |
| }; |
| }); |
| |
| // Scroll to the panel. |
| $('html, body').animate({ |
