$(function () {
    $('#custom-plan-form').validator();
    $('#custom-plan-form').on('submit', function (e) {
        var fd = new FormData(this);    
        if (!e.isDefaultPrevented()) {
          $('#btn-submit').attr('disabled',true).html('Please wait...');
            var url = $('#btn-submit').attr('data-url');
            var img_src = $('#btn-submit').attr('data-img-src');
            e.preventDefault();          
            $.ajax({
                type: "POST",
                url: url,
                data: fd,
                processData: false,
                contentType: false,
                success: function (data)
                { 
                    var messageAlert = 'alert-' + data.type;
                    var messageText = data.message;
                    var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + messageText + '</div>';

                    if (messageAlert && messageText) {                      
                        $('#custom-plan-form').find('.messages').html(alertBox);                     
                        $('#custom-plan-form')[0].reset();
                        $('.img-thumbnail').attr('src',img_src);
                        $('.brws-img-file').val('');
                        $('#btn-submit').attr('disabled',false).html('Submit');
                    }
                }
            });
            return false;
        }
    })  
    function readURL(input,img,ext) {
    if (input.files && input.files[0]) {
      var reader = new FileReader();
      reader.onload = function (e) {
        if(ext == "jpg" || ext == "jpeg" || ext == "png" || ext == "gif"){
          img.attr('src', e.target.result);
        }
        else{
          $src = img.attr('data-doc-img-src');
          img.attr('src',$src);        
        }
    } 
    reader.readAsDataURL(input.files[0]);
} 
}

$(document).on("change",'.brws-img-file',function(e)
{
    var file_inf = $(this).val().split(".");
    var ext = file_inf[file_inf.length-1].toLowerCase();

    // if(ext == "jpg" || ext == "jpeg" || ext == "png" || ext == "gif"){

    if(ext != ""){
      var fileUpload = $(this).parent().find('input[type="file"]')[0];
      var imgtype = $(this).parent().find('input[type="file"]').attr('imgtype');
      if (1){
        if (1){
          readURL(this,$(this).parent().parent().find("img"),ext);
          return;
      }
      var reader = new FileReader();
      reader.readAsDataURL(fileUpload.files[0]);
      reader.onload = function (e) {
          var image = new Image();
          image.src = e.target.result;
          image.onload = function () {
            var height = this.height;
            var width = this.width;
            if (imgtype == 'sub_img'){
              if (height != 500 || width != 600) {
                toast("error", '<p class="text-center">Please Select an image of 500 x 600</p>');
                fileUpload.val = '';
                fileUpload.type = '';
                fileUpload.type = 'file';
            }
            else{
                readURL(fileUpload,$(fileUpload).parent().find("img"));
            }                    
        }
        else{
            readURL(fileUpload,$(fileUpload).parent().find("img"));           
        }
    };
}
}
else{
    readURL(this,$(this).parent().find("img"));
}
}
else{
  $(this).val("");
  $(this).parent().find("img").attr('src','<?php echo img_placeholder(); ?>');
  alert('Please Select an image !');
}
});

$(document).on("click",".brws-img-btn",function() {
    $(this).parent().find('input[type="file"]').trigger("click");
});
});