$(function() {
	var cropit_avatar_notify = null;
	var cropit_cover_notify = null;
	var cropit_notify_type = 'info';
	
	// Avatar
	$('.pm-profile-avatar-pic').cropit({
		smallImage: 'allow',
		// width: 180, 
		// height: 180,
		width: 120,
		height: 120,
		preview: '.pm-profile-avatar-preview',
		onImageLoading: function(){
			cropit_avatar_notify = $.notify({message: pm_lang.please_wait}, {type: cropit_notify_type});
		},
		onImageLoaded: function() {
			cropit_avatar_notify.close();
		},
		onImageError: function(){
			cropit_avatar_notify.close();
		}
	});

	$('#btn-edit-avatar').click(function() {
		$('#cropit-avatar-input').click();
		$('#cropit-avatar-form').css('visibility', 'visible');
		$('.cropit-image-preview').removeClass('animated fadeIn');
	});

	$('.btn-cancel-avatar').click(function() {
		$('.pm-profile-avatar-pic .cropit-image-preview').removeClass('cropit-image-loaded').addClass('animated fadeIn');
		$('#cropit-avatar-form').css('visibility', 'hidden');
		return false;
	});

	$('form#cropit-avatar-form').submit(function() {
		
		var image_data = $('.pm-profile-avatar-pic').cropit('export', {
			type: 'image/jpeg',
			quality: .9,
			fillBg: '#333'
		});
		
		// Move cropped image data to hidden input
		$('.hidden-avatar-data-img').val(image_data);
		
		$.ajax({
			url: MELODYURL2 + "/ajax.php",
			type: "POST",
			dataType: "json",
			data: $('#cropit-avatar-form').serialize(),
			beforeSend: function(jqXHR, settings) {
				// clean error message container
				//cropit_avatar_notify.close();
				$.notifyClose();
				cropit_avatar_notify = $.notify({message: pm_lang.swfupload_status_uploading}, {type: cropit_notify_type});
			},
		})
		.done(function(data){
			cropit_avatar_notify.close();
			if (data.success) { 
				// hide form action buttons 
				$('#cropit-avatar-form').css('visibility', 'hidden');
				
				// reset background with uploaded image 
				$('.pm-profile-avatar-pic .cropit-image-preview img').attr('src', data.file_url);
				
				// stop image movement ability
				$('.pm-profile-avatar-pic .cropit-image-preview').addClass('animated fadeIn');
				// timeout required to allow time for the uploaded image to load before removing the current image obj (and avoid a image-swapping 'glitch')
				setTimeout(function(){
					$('.pm-profile-avatar-pic .cropit-image-preview').removeClass('cropit-image-loaded')
				}, 700);
				
				// unload selected image to let the user re-select the same image
				$('.pm-profile-avatar-pic input.cropit-image-input')[0].value = null;
			}
			cropit_avatar_notify = $.notify({message: data.msg}, {type: data.alert_type});
		});

		return false;
	});
	
	var cropit_cover_height = parseInt($('.pm-profile-cover-preview').attr('data-cropit-height'));
	if ( ! cropit_cover_height) {
		cropit_cover_height = 200;
	}
		
	// Cover
	$('.pm-profile-cover-preview').cropit({
		smallImage: 'allow',
		height: cropit_cover_height,
		onImageLoading: function(){
			cropit_cover_notify = $.notify({message: pm_lang.please_wait}, {type: cropit_notify_type});
		},
		onImageLoaded: function() {
			cropit_cover_notify.close();
		},
		onImageError: function(){
			cropit_cover_notify.close();
		}
	});

	$('#btn-edit-cover').click(function() {
		$('#cropit-cover-input').click();
		$('#cropit-cover-form').css('visibility', 'visible');
		$('.cropit-image-preview').removeClass('animated fadeIn');
	});

	$('.btn-cancel').click(function() {
		$('.pm-profile-cover-preview .cropit-image-preview').removeClass('cropit-image-loaded').addClass('animated fadeIn');
		$('#cropit-cover-form').css('visibility', 'hidden');
		return false;
	});

	$('form#cropit-cover-form').submit(function() {
		
		var image_data = $('.pm-profile-cover-preview').cropit('export', {
			type: 'image/jpeg',
			quality: .9,
			fillBg: '#333'
		});
		
		// Move cropped image data to hidden input
		$('.hidden-cover-data-img').val(image_data);
		
		$.ajax({
			url: MELODYURL2 + "/ajax.php",
			type: "POST",
			dataType: "json",
			data: $('#cropit-cover-form').serialize(),
			beforeSend: function(jqXHR, settings) {
				// clean error message container
				//cropit_cover_notify.close();
				$.notifyClose();
				cropit_cover_notify = $.notify({message: pm_lang.swfupload_status_uploading}, {type: cropit_notify_type});
			},
		})
		.done(function(data){
			cropit_cover_notify.close();
			if (data.success) { 
				// hide form action buttons 
				$('#cropit-cover-form').css('visibility', 'hidden');
				
				// reset background with uploaded image 
				$('.pm-profile-cover-preview .cropit-image-preview img').attr('src', data.file_url);
				
				// stop image movement ability
				$('.pm-profile-cover-preview .cropit-image-preview').addClass('animated fadeIn');
				// timeout required to allow time for the uploaded image to load before removing the current image obj (and avoid a image-swapping 'glitch')
				setTimeout(function(){
					$('.pm-profile-cover-preview .cropit-image-preview').removeClass('cropit-image-loaded')
				}, 700);
				
				// unload selected image to let the user re-select the same image
				$('.pm-profile-cover-preview input.cropit-image-input')[0].value = null;
			}
			cropit_cover_notify = $.notify({message: data.msg}, {type: data.alert_type});
		});

		return false;
	});
});