/**
 * TERM OF USE "Paginated Featured Products" is licensed under Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License
 *
 *  @author    Orange35 <info@orange35.com>
 *  @copyright 2007-2015 Orange35
 *  @license   http://creativecommons.org/licenses/by-nc-sa/3.0/
 */

$(function(){
	var jElement = $('<div></div>').html('<div id="ajax_running_o35">' + ajax_loading_message + '</div>');
	jElement.insertBefore('#ajax_running');

	var jAjaxRunning = $('#ajax_running_o35');

	jAjaxRunning.ajaxStart(function (event) {
		jAjaxRunning.html(ajax_loading_message);
		jAjaxRunning.show('slow');
	});
});

var running_timer_035;

var admin_hot_spots = {
	spot_index: 0,
	spots: {},
	spotErrors: [],
	options: {spots: {}},
	spotsInfoBlockHeight: 160,
	spotsInfoBlockHeightWithErrors: 180,
	init: function(options){
		this.spotsInfoBlockHeight = parseInt(($('.slide-hotspot-inputs').css('height')).replace('px', ''));
		this.spotsInfoBlockHeightWithErrors = this. spotsInfoBlockHeight + 20;
		this.options = $.extend(this.options, options);
		this.initSpots();
		this.initButtons();
		this.initUrlInput();
		this.activeSpotInVisibleSlide();
	},

	initSpots: function(){
		if (!this.options.spots) {
			return false;
		}
		for (var i in this.options.spots) {
			if (!this.options.spots.hasOwnProperty(i)) {
				continue;
			}
			var spot = this.options.spots[i];
			this.addSpot(spot['top'], spot['left'], spot['width'], spot['height'], spot['border_radius'], spot['shade'], spot['url'], spot['target'], spot['button_title'], spot['description'], spot['id_lang']);
		}
		return false;
	},

	/* sets active spots to first from visible slide */
	activeSpotInVisibleSlide: function(){
		/* detect active spots set */
		if (!this.spots[id_language]) {
			return false;
		}
		for (var i in this.spots[id_language]) {
			if (this.spots[id_language].hasOwnProperty(i)) {
				$('#spot_item_' + i).click();
				return true;
			}
		}
		return false;
	},

	initUrlInput: function(){
		var obj = this;
		$('#spot_url, #spot_button_title, #spot_description, input[name="spot_target"], #spot_border_radius, #spot_border_radius_slider, input[name="spot_shade"]').bind('blur', function () {
			obj.setSpotUrl();
		});
	},

	setSpotUrl: function(){
		var spot = $('div[class*=spot_item_active]');
		if ($(spot).size()) {
			var index = $(spot).attr('index');
			var id_lang = $(spot).data('lang');
			this.spots[id_lang][index].url = $('#spot_url').val();
			var aTarget = $('#spot_target_blank').attr('checked');
			this.spots[id_lang][index].border_radius = $('#spot_border_radius').val();
			this.spots[id_lang][index].button_title = $('#spot_button_title').val();
			this.spots[id_lang][index].description = $('#spot_description').val();
			this.spots[id_lang][index].shade = 'checked' == $('#spot_shade_on').attr('checked') ? 1 : 0;
			this.spots[id_lang][index].target = 'checked' == $('#spot_target_blank').attr('checked') ? '_blank' : '_self';
		}
	},

	getSpotIndex: function () {
		return this.spot_index++;
	},

	initButtons: function() {
		var obj = this;
		$('#spot_add_rectangle').click(function(){
			obj.addSpot('rect');
		});

		$('#spot_add_circle').click(function () {
			obj.addSpot('circle');
		});

		$('#spot_delete').click(function () {
			obj.deleteSpot();
		});

		$('#spot_clear').click(function () {
			obj.clearSpots();
		});

		$('#btnSubmit').click(function(){
			obj.saveSpots(true);
			return false;
		});

		$('#btnSubmitStay').click(function(){
			obj.saveSpots(false);
			return false;
		});

		$('#languages_spot_container img').click(function(){
			obj.activeSpotInVisibleSlide();
		});

	},

	saveSpots: function(submitForm){
		$('#message_saved').hide();
		var obj = this;
		if (!obj.validateSpots()) {
			return false;
		}

		$.ajax({
			type: 'post',
			data: {action: 'saveSpots', spots: obj.spots},
			dataType: 'json',
			beforeSend: function(){
				clearTimeout(ajax_running_timeout);
			},
			success: function (data) {
				if ('ok' == data.status) {
					if (submitForm) {
						$('#spots_form').submit();
					} else {

						running_timer_035 = setInterval(function () {
							$("#ajax_running_o35").html(ajax_changes_ok_message);
							clearInterval(running_timer_035);

							running_timer_035 = setInterval(function(){
								$("#ajax_running_o35").slideUp('fast');
								clearInterval(running_timer_035);
							}, 1000);

						}, 1000);
					}
				} else {
					$("#ajax_running_o35").html(ajax_changes_ok_message);
				}
			}

		});
		return false;
	},

	validateSpots: function() {
		var obj = this;
		for (var id_lang in this.spots) {
			if (!this.spots.hasOwnProperty(id_lang) || !this.spots[id_lang]) {
				continue;
			}
			for (var j in this.spots[id_lang]) {
				if (!this.spots[id_lang].hasOwnProperty(j) || !this.spots[id_lang][j]) {
					continue;
				}
				if (!this.spotErrors[id_lang]) {
					this.spotErrors[id_lang] = [];
				}
				var url = this.spots[id_lang][j]['url'];
				if (url && !this.validateUrl(url)) {
					/* error_url_message is defined at sliderHotSpot.tpl */
					this.spotErrors[id_lang][j] = error_url_message;

					//activate spot
					$('[id^="spot_item"]').removeClass('spot_item_active');
					$('[id="spot_item_' + j + '"]').addClass('spot_item_active').click();
					$('.slide-hotspot-inputs').css('height', obj.spotsInfoBlockHeightWithErrors + 'px');
					return false;
				} else {
					this.spotErrors[id_lang][j] = '';
				}
			}
		}
		$('#spot_url_errors').html('').hide();
		$('.slide-hotspot-inputs').css('height', obj.spotsInfoBlockHeight + 'px');
		return true;
	},

	deleteSpot: function() {
		var spot = $('div[class*=spot_item_active]');
		if ($(spot).size()) {
			//delete_message is initialized at admin/sliderHotSpots.tpl
			if (confirm(delete_message)) {
				var index = $(spot).attr('index');
				this.spots[id_language][index] = null;
				$(spot).remove();
			}
		}
		this.initSpotUrl();
	},

	clearSpots: function () {
		if (!confirm(delete_all_message)) {
			return false;
		}
		var jContainers = $('#spot_container_' + id_language);
		$(jContainers).html('');

		this.spotIndex = 0;
		this.spots[id_language] = [];

		return false;
	},

	addSpot: function(top, left, width, height, border_radius, shade, url, aTarget, button_title, description, id_lang){

		var obj = this;
		var index = obj.getSpotIndex();

		var type = 'rect';
		top = top ? top : index * 5;
		left = left ? left : index * 5;
		width = width ? width : 50;
		height = height? height : 50;
		border_radius = border_radius ? border_radius : 0;
		shade = shade ? shade : 1;
		url = url ? url : '';
		aTarget = aTarget ? aTarget : '_self';
		button_title = button_title ? button_title : '';
		description = description ? description : '';
		id_lang = id_lang ? id_lang : id_language;

		var item = '<div data-lang="' + id_lang + '" id="spot_item_' + index + '" index="' + index + '" type="' + type + '" class="ui-state-active spot_item" style="width: ' + width + 'px; height: ' + height + 'px; border-radius: ' + border_radius + 'px; ">';
		item += '';
		item += '</div>';

		$("#spot_container_" + id_lang).append(item);

		var spot_item = $('#spot_item_' + index);

		spot_item.resizable({
			containment: '#spot_container_' + id_lang,
			stop: function (event, ui) {
				obj.spotResizingStop(this, event, ui);
			},
			handles: "n, e, s, w, ne, se, sw, nw",
			aspectRatio: false
		});
		spot_item.draggable({containment: '#spot_container_' + id_lang, stop: function (event, ui) {
			obj.spotDraggingStop(this, event, ui);
		}});
		spot_item.css('position', 'absolute');
		spot_item.css('top', top + 'px');
		spot_item.css('left', left + 'px');
		spot_item.css('width', width + 'px');
		spot_item.css('height', height + 'px');

		if (!obj.spots[id_lang]) {
			obj.spots[id_lang] = [];
		}
		obj.spots[id_lang][index] = {top: top, left: left, width: width, height: height, border_radius: border_radius, shade: shade, url: url, target: aTarget, button_title: button_title, description: description};

		spot_item.click(function () {
			obj.setSpotUrl();
			$('div[class*=spot_item_active]').removeClass('spot_item_active');
			$(this).addClass('spot_item_active');
			obj.initSpotUrl();
		}).click();

	},

	initSpotUrl: function() {
		var jSpotEl = $('div[class*=spot_item_active]');
		var jLinkContainer = $('.slide-hotspot-inputs');
		var obj = this;

		if (jSpotEl.size()) {
			var index = jSpotEl.attr('index');
			var id_lang = jSpotEl.data('lang');
			var target = obj.spots[id_lang][index].target;

			$('#spot_border_radius').val(obj.spots[id_lang][index].border_radius);
			if ($('#spot_border_radius_slider').slider()) {
				$('#spot_border_radius_slider').slider("value", obj.spots[id_lang][index].border_radius);
			}
			$('#spot_url').val(obj.spots[id_lang][index].url);
			$('#spot_button_title').val(obj.spots[id_lang][index].button_title);
			$('#spot_description').val(obj.spots[id_lang][index].description);
			if ('_self' == obj.spots[id_lang][index].target) {
				$('#spot_target_self').attr('checked', 'checked');
				$('#spot_target_blank').removeAttr('checked');
			} else {
				$('#spot_target_blank').attr('checked', 'checked');
				$('#spot_target_self').removeAttr('checked');
			}
			if ('1' == obj.spots[id_lang][index].shade) {
				$('#spot_shade_on').attr('checked', 'checked');
				$('#spot_shade_off').removeAttr('checked');
			} else {
				$('#spot_shade_off').attr('checked', 'checked');
				$('#spot_shade_on').removeAttr('checked');
			}

			if (this.spotErrors[id_lang] && typeof this.spotErrors[id_lang][index] == 'string' && this.spotErrors[id_lang][index] != '') {
				$('ul#spot_url_errors').html('<li>' + this.spotErrors[id_lang][index] + '</li>').show();
			} else {
				$('ul#spot_url_errors').html('').hide();
			}
			jLinkContainer.show();
		} else {
			jLinkContainer.hide();
		}
	},

	spotResizingStop: function (element, event, ui) {
		var index = $(element).attr('index');

		var top = ui.position.top;
		var left = ui.position.left;
		var width = ui.size.width;
		var height = ui.size.height;

		this.spots[id_language][index].top = top;
		this.spots[id_language][index].left = left;
		this.spots[id_language][index].width = width;
		this.spots[id_language][index].height = height;
	},

	spotDraggingStop: function (element, event, ui) {
		var index = $(element).attr('index');
		this.spots[id_language][index].top = ui.position.top;
		this.spots[id_language][index].left = ui.position.left;
	},

	validateUrl: function(url) {
		var urlregex = new RegExp(
			"^(http|https|ftp)\://([a-zA-Z0-9\.\-]+(\:[a-zA-Z0-9\.&amp;%\$\-]+)*@)*((25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9])\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9]|0)\.(25[0-5]|2[0-4][0-9]|[0-1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[0-9])|([a-zA-Z0-9\-]+\.)*[a-zA-Z0-9\-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(\:[0-9]+)*(/($|[a-zA-Z0-9\.\,\?\'\\\+&amp;%\$#\=~_\-]+))*$");
		return urlregex.test(url);
	}


};