Hello, I am trying to implement cropper.js plugin to my website and send cordinates via ajax to Laravel backend. However, when I am trying to launch ajax request i get Uncaught RangeError: Maximum call stack size exceeded error. Maybe someone could take a look at my code and help me solve this ?

TextDropzone.options.myDropzone = {

  // Prevents Dropzone from uploading dropped files immediately
  autoProcessQueue: true,
  uploadMultiple: true,
  parallelUploads: 100,
  maxFiles: 10,
  acceptedFiles: "image/*",
  clickable: '#dropzonePreview',
  addRemoveLinks: true,
  previewsContainer: '#dropzonePreview',


  init: function() {
    //var submitButton = document.querySelector("#submit-all")
        myDropzone = this; // closure

    // submitButton.addEventListener("click", function() {
    //   if (myDropzone.getQueuedFiles().length > 0) {                        
            myDropzone.processQueue();  
        // } else {                           
        //     $("#my-dropzone").submit(); //send empty 
        // }  
      //myDropzone.processQueue(); // Tell Dropzone to process all queued files.
   // });

    // You might want to show the submit button only when 
    // files are dropped here:
    this.on("successmultiple", function(response, file) {
        console.log(response);
        console.log(file);
      //$('.image').prepend('<img id="" src=" '+file.path+' '+' '+file.name+' " />');

      $('<img />')
      .attr('src', "" + file.path + file.name + "")         // ADD IMAGE PROPERTIES.
        .attr('title', 'Some title')
        .attr('id', 'image')
            .appendTo($('.image'));


            getCropper();

    });

  }
};

function getCropper(){

    $(function () {
      var $image = $('#image');
      var minAspectRatio = 0.5;
      var maxAspectRatio = 1.5;

      $image.cropper({
        built: function () {
          var containerData = $image.cropper('getContainerData');
          var cropBoxData = $image.cropper('getCropBoxData');
          var aspectRatio = cropBoxData.width / cropBoxData.height;
          var newCropBoxWidth;

          if (aspectRatio < minAspectRatio || aspectRatio > maxAspectRatio) {
            newCropBoxWidth = cropBoxData.height * ((minAspectRatio + maxAspectRatio) / 2);

            $image.cropper('setCropBoxData', {
              left: (containerData.width - newCropBoxWidth) / 2,
              width: newCropBoxWidth
            });
          }
        },
        cropmove: function () {
          var cropBoxData = $image.cropper('getCropBoxData');
          var aspectRatio = cropBoxData.width / cropBoxData.height;

          if (aspectRatio < minAspectRatio) {
            $image.cropper('setCropBoxData', {
              width: cropBoxData.height * minAspectRatio
            });
          } else if (aspectRatio > maxAspectRatio) {
            $image.cropper('setCropBoxData', {
              width: cropBoxData.height * maxAspectRatio
            });
          }
        }
      });

      $(".button2").click(function() {
        var cropped = $image.cropper('getCroppedData');
        var data = $image.cropper('getCanvasData');
        console.log(cropped);
        console.log(data);
        var $_token = $('#token').val();
        $.ajax({
            type: "POST",
            url: '/images/cropped',
            //headers: { 'X-XSRF-TOKEN' : $_token }, 
            data: {'_token':$_token, 'cropped':cropped },
            success: function (result) {
                console.log(result);
            }
        });  
      });
    });
}