home.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. var upload = {};
  2. upload.isPrivate = true;
  3. upload.token = localStorage.token;
  4. upload.maxFileSize;
  5. upload.checkIfPublic = function(){
  6. axios.get('/api/check')
  7. .then(function (response) {
  8. upload.isPrivate= response.data.private;
  9. upload.maxFileSize = response.data.maxFileSize;
  10. upload.preparePage();
  11. })
  12. .catch(function (error) {
  13. return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
  14. console.log(error);
  15. });
  16. }
  17. upload.preparePage = function(){
  18. if(!upload.isPrivate) return upload.prepareUpload();
  19. if(!upload.token) return document.getElementById('loginToUpload').style.display = 'inline-flex';
  20. upload.verifyToken(upload.token, true);
  21. }
  22. upload.verifyToken = function(token, reloadOnError){
  23. if(reloadOnError === undefined)
  24. reloadOnError = false;
  25. axios.post('/api/tokens/verify', {
  26. token: token
  27. })
  28. .then(function (response) {
  29. if(response.data.success === false){
  30. swal({
  31. title: "An error ocurred",
  32. text: response.data.description,
  33. type: "error"
  34. }, function(){
  35. if(reloadOnError){
  36. localStorage.removeItem("token");
  37. location.reload();
  38. }
  39. })
  40. return;
  41. }
  42. localStorage.token = token;
  43. upload.token = token;
  44. return upload.prepareUpload();
  45. })
  46. .catch(function (error) {
  47. return swal("An error ocurred", 'There was an error with the request, please check the console for more information.', "error");
  48. console.log(error);
  49. });
  50. }
  51. upload.prepareUpload = function(){
  52. if (upload.token) {
  53. document.getElementById('albumDiv').style.display = 'block';
  54. }
  55. div = document.createElement('div');
  56. div.id = 'dropzone';
  57. div.innerHTML = 'Click here or drag and drop files';
  58. div.style.display = 'flex';
  59. document.getElementById('maxFileSize').innerHTML = 'Maximum upload size per file is ' + upload.maxFileSize;
  60. document.getElementById('loginToUpload').style.display = 'none';
  61. if(upload.token === undefined)
  62. document.getElementById('loginLinkText').innerHTML = 'Create an account and keep track of your uploads';
  63. document.getElementById('uploadContainer').appendChild(div);
  64. upload.prepareDropzone();
  65. }
  66. upload.prepareDropzone = function(){
  67. var previewNode = document.querySelector('#template');
  68. previewNode.id = '';
  69. var previewTemplate = previewNode.parentNode.innerHTML;
  70. previewNode.parentNode.removeChild(previewNode);
  71. var dropzone = new Dropzone('div#dropzone', {
  72. url: '/api/upload',
  73. paramName: 'files[]',
  74. maxFilesize: upload.maxFileSize.slice(0, -2),
  75. parallelUploads: 2,
  76. uploadMultiple: false,
  77. previewsContainer: 'div#uploads',
  78. previewTemplate: previewTemplate,
  79. createImageThumbnails: false,
  80. maxFiles: 1000,
  81. autoProcessQueue: true,
  82. headers: {
  83. 'token': upload.token
  84. },
  85. init: function() {
  86. this.on('addedfile', function(file) {
  87. myDropzone = this;
  88. document.getElementById('uploads').style.display = 'block';
  89. });
  90. }
  91. });
  92. // Update the total progress bar
  93. dropzone.on('uploadprogress', function(file, progress) {
  94. file.previewElement.querySelector('.progress').setAttribute('value', progress);
  95. file.previewElement.querySelector('.progress').innerHTML = progress + '%';
  96. });
  97. dropzone.on('success', function(file, response) {
  98. // Handle the responseText here. For example, add the text to the preview element:
  99. if(response.success === false){
  100. var span = document.createElement('span');
  101. span.innerHTML = response.description;
  102. file.previewTemplate.querySelector('.link').appendChild(span);
  103. return;
  104. }
  105. a = document.createElement('a');
  106. a.href = response.files[0].url;
  107. a.target = '_blank';
  108. a.innerHTML = response.files[0].url;
  109. file.previewTemplate.querySelector('.link').appendChild(a);
  110. file.previewTemplate.querySelector('.progress').style.display = 'none';
  111. });
  112. }
  113. //Handle image paste event
  114. window.addEventListener('paste', function(event) {
  115. var items = (event.clipboardData || event.originalEvent.clipboardData).items;
  116. for (index in items) {
  117. var item = items[index];
  118. if (item.kind === 'file') {
  119. var blob = item.getAsFile();
  120. console.log(blob.type);
  121. var file = new File([blob], "pasted-image."+blob.type.match(/(?:[^\/]*\/)([^;]*)/)[1]);
  122. file.type = blob.type;
  123. console.log(file);
  124. myDropzone.addFile(file);
  125. }
  126. }
  127. });
  128. window.onload = function () {
  129. upload.checkIfPublic();
  130. };