﻿var cropURL = '';
var cropW = 500;
var cropH = 400;
var cropPreview = true;

function showCropProgress(title)
{
  $('#toCropBgImg').hide();
  $('#toCropBgProgress').show();
  $('#prevCrop').hide();
  title = title || 'Kép előnézet';
  $('#toCropBg h2').html(title);
  $.blockUI({ message: $('#imgCrop'), css: {top: Math.max($('#postArea').offset().top-$(window).scrollTop(), 20) + 'px'}, overlayCSS: {opacity: '0.3'} });
}

function showCropLayer(imgURL, interfaceW, interaceH, realW, realH, avatar, callback, startCrop, isMissZizz)
{
  cropURL = imgURL;
  cropW = realW;
  cropH = realH;
  cropPreview = avatar;
  var selSize = Math.min(cropW, cropH);
  
  $('#toCropBgProgress').hide();
  $('#btnCropCancel, #btnNoCropCancel, #btnCropOK, #btnNoCropOK').hide();
  
  if (avatar)
  {
    $('#prevCrop').show();
  }
  else
  {
    $('#prevCrop').hide();
  }
  $('#imgCropPreview').attr('src', imgURL);
  $('#imgToCropWrapper').css('width', interfaceW + 'px');
  if (startCrop)
  {
    $('#imgToCrop').replaceWith('<img id="imgToCrop" src="' + imgURL + '" width="' + interfaceW + '" height="' + interaceH + '" alt="" />');
  }
  else
  {
    $('#imgToCrop').replaceWith('<img id="imgToCrop" src="' + imgURL + '" alt="" />');
  }

	$('#imgToCrop').hide();
  $('#toCropBgImg').slideDown(10, function(){
    $('#imgToCrop').fadeIn(500, function(){
      if (avatar)
      {
        cropApi = $.Jcrop('#imgToCrop',
          {
            trueSize: [realW, realH],
			      onChange: showCropPreview,
			      onSelect: showCropPreview,
			      minSize: [30,30],
			      aspectRatio: 1
		      }
	      );
	      cropApi.setSelect([(cropW-selSize)/2, (cropH-selSize)/2, (cropW-selSize)/2+selSize, (cropH-selSize)/2+selSize]);
    	  
	      $('#btnCropCancel, #btnCropOK').show();
      }
      else
      {
        if (startCrop)
        {
            if(isMissZizz){
	            cropApi = $.Jcrop('#imgToCrop',
                {
                  trueSize: [realW, realH],
			            minSize: [320,320],
			            aspectRatio: 1
		            }
	            );
	        }
	        else
	        {
	            cropApi = $.Jcrop('#imgToCrop',
                {
                  trueSize: [realW, realH],
			            minSize: [80,45]
		            }
	            );
	        }
	        cropApi.setSelect([0, 0, cropW, cropH]);
    	    
	        $('#btnCropCancel, #btnCropOK').show();
	      }
	      else
	      {
	        $('#btnNoCropCancel, #btnNoCropOK').show();
	      }
	    }
    });
  });
  	
	$('#btnCropOK a').attr('href', callback);
}

function showCropPreview(coords)
{
  if (cropPreview)
  {
	  if (parseInt(coords.w) > 0)
	  {
		  var rx = 50 / coords.w;
		  var ry = 50 / coords.h;

		  jQuery('#imgCropPreview').css(
		    {
			    width: Math.round(rx * cropW) + 'px',
			    height: Math.round(ry * cropH) + 'px',
			    marginLeft: '-' + Math.round(rx * coords.x) + 'px',
			    marginTop: '-' + Math.round(ry * coords.y) + 'px'
		    }
		  );
	  }
	}
}

function cropCancel()
{
  try
  {
    ajaxup.enable();
    $('#posterAction').hide();
    $('#posterPicture').show();
    cropApi.destroy();
  }
  catch(e)
  {
  }
  
  hideZizzPopUp();
}

function avatarCropCallback(targetImgId, targetHiddenId)
{
  var cropSelection = cropApi.tellSelect();
  
  $.ajax(
    {
      url: "/ajax/DoImageCrop.ashx",
      type: "POST",
      data: {
              url: cropURL.replace('_crop', ''),
              targetDir: '/static/images/avatar/',
              x:  cropSelection.x,
              y:  cropSelection.y,
              w:  cropSelection.x2-cropSelection.x,
              h:  cropSelection.y2-cropSelection.y,
              outW:  "50",
              outH:  "50"
            },
      cache: false,
      dataType: 'json',
      timeout: 10000,
      success: function(jsonObj)
      {
        if (jsonObj.Status == 'OK')
        {
          $('#' + targetImgId).attr('src', jsonObj.url);
          $('#' + targetHiddenId).val(jsonObj.url);
          
          $.ajax(
            {
              url: "/ajax/DoImageCrop.ashx",
              type: "POST",
              data: {
                      url: cropURL.replace('_crop', ''),
                      targetDir: '/static/images/avatar/',
                      x:  cropSelection.x,
                      y:  cropSelection.y,
                      w:  cropSelection.x2-cropSelection.x,
                      h:  cropSelection.y2-cropSelection.y,
                      outW:  "30",
                      outH:  "30"
                    },
              cache: false,
              dataType: 'json',
              timeout: 10000,
              success: function(jsonObj)
              {
                ajaxup.enable();
                cropApi.destroy();

                if (jsonObj.Status == 'OK')
                {
                  hideZizzPopUp();
                }
                else
                {
                  displayError('A kép elmentése során hiba történt. Kérjük, próbáld meg később!');
                }
              },
              error: function()
              {
                ajaxup.enable();
              }
            }
          );
        }
        else
        {
          ajaxup.enable();
          cropApi.destroy();
          displayError('A kép elmentése során hiba történt. Kérjük, próbáld meg később!');
        }
      },
      error: function()
      {
        ajaxup.enable();
      }
    }
  );
}

function postCropCallback(targetImgId)
{
  $('#posterAction').hide();
  $('#posterPicture').show();
  
  var cropSelection = cropApi.tellSelect();
  
  $.ajax(
    {
      url: "/ajax/DoImageCrop.ashx",
      type: "POST",
      data: {
              url: cropURL.replace('_crop', ''),
              targetDir: '/static/images/post/',
              targetFile: cropURL.replace('_crop', '').substr(cropURL.lastIndexOf('/') + 1),
              x: cropSelection.x,
              y: cropSelection.y,
              w: cropSelection.x2-cropSelection.x,
              h: cropSelection.y2-cropSelection.y,
              OutW: cropSelection.x2-cropSelection.x,
              OutH: cropSelection.y2-cropSelection.y
            },
      cache: false,
      dataType: 'json',
      timeout: 10000,
      success: function(jsonObj)
      {
        if (jsonObj.Status == 'OK')
        {
           $.ajax(
            {
              url: "/ajax/DoImageCrop.ashx",
              type: "POST",
              data: {
                      url: cropURL.replace('_crop', ''),
                      targetDir: '/static/images/post/',
                      targetFile: cropURL.replace('_crop', '_post').substr(cropURL.lastIndexOf('/') + 1),
                      x: cropSelection.x,
                      y: cropSelection.y,
                      w: cropSelection.x2-cropSelection.x,
                      h: cropSelection.y2-cropSelection.y,
                      maxOutW: '180',
                      maxOutH: '100'
                    },
              cache: false,
              dataType: 'json',
              timeout: 10000,
              success: function(jsonObj)
              {
                ajaxup.enable();
                cropApi.destroy();
                if (jsonObj.Status == 'OK')
                {
                  $('#' + targetImgId).attr('src', jsonObj.url);
                  
                  hideZizzPopUp();
                }
                else
                {
                  displayError('A kép elmentése során hiba történt. Kérjük, próbáld meg később!');
                }
              },
              error: function()
              {
                ajaxup.enable();
              }
            }
          );
        }
        else
        {
          ajaxup.enable();
          cropApi.destroy();
          displayError('A kép elmentése során hiba történt. Kérjük, próbáld meg később!');
        }
      },
      error: function()
      {
        ajaxup.enable();
      }
    }
  );
}
