KaueDrey

Example Drop

Apr 1st, 2017
91
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. $(document).ready(function(){
  2.  
  3.   Dropzone.autoDiscover = false;
  4.  
  5.   $("#new_upload").dropzone({
  6.     maxFilesize: 1,
  7.     paramName: "upload[image]",
  8.     addRemoveLinks: true,
  9.     dictRemoveFile: "Delete",
  10.  
  11.     //to show existing images from db
  12.     init: function() {
  13.       var thisDropZone = this;
  14.       $.getJSON('upload_list', function(data) {
  15.         $.each(data, function(index, val) {
  16.           var mockFile = { name: val.name, size: val.size };
  17.           thisDropZone.emit("addedfile", mockFile);
  18.           thisDropZone.emit("thumbnail", mockFile, val.path);
  19.           $(mockFile.previewTemplate).find('.dz-remove').attr('id', val.id);
  20.  
  21.           // adding id attribute for serialize
  22.           $(".dz-preview:last-child").attr('id', "image_" + val.id);
  23.         });
  24.       });
  25.     },
  26.  
  27.     success: function(file, response){
  28.       $(file.previewTemplate).find('.dz-remove').attr('id', response.fileID);
  29.       $(file.previewElement).addClass("dz-success");
  30.  
  31.       var order = $('.dropzone').sortable('serialize');
  32.       $.ajax({
  33.         type: 'POST',
  34.         url: '/uploads/sort',
  35.         data: order,
  36.         success: function(data){
  37.           console.log(data);
  38.         }        
  39.       });
  40.     },
  41.  
  42.     removedfile: function(file){
  43.       var id = $(file.previewTemplate).find('.dz-remove').attr('id');
  44.       file.previewElement.remove();
  45.  
  46.       $.ajax({
  47.         type: 'DELETE',
  48.         url: '/uploads/' + id,
  49.         success: function(data){
  50.           console.log(data.message);
  51.         }
  52.       });
  53.  
  54.       var order = $('.dropzone').sortable('serialize');
  55.       $.ajax({
  56.         type: 'POST',
  57.         url: '/uploads/sort',
  58.         data: order,
  59.         success: function(data){
  60.           console.log(data);
  61.         }        
  62.       });
  63.     }
  64.   });
  65.  
  66.  //this function is for sorting + updating positions of old images loaded by the init function.
  67.   $(function() {
  68.     $(".dropzone").sortable({
  69.       items:'.dz-preview',
  70.       cursor: 'move',
  71.       opacity: 0.5,
  72.       containment: '.dropzone',
  73.       distance: 20,
  74.       update: function(event, ui) {
  75.         var order = $('.dropzone').sortable('serialize');
  76.         $.ajax({
  77.           type: 'POST',
  78.           url: '/uploads/sort',
  79.           data: order,
  80.           success: function(data){
  81.             console.log(data);
  82.           }        
  83.         });
  84.       }
  85.     });
  86.     $(".dropzone").disableSelection();
  87.   });
  88. });
RAW Paste Data

Adblocker detected! Please consider disabling it...

We've detected AdBlock Plus or some other adblocking software preventing Pastebin.com from fully loading.

We don't have any obnoxious sound, or popup ads, we actively block these annoying types of ads!

Please add Pastebin.com to your ad blocker whitelist or disable your adblocking software.

×