var horseMask;
var horseMaskLoaded = false;
var forSale;
var forSaleLoaded = false;
var isAnimating = false;
var hasCanvas = false;

$(function () {
	hasCanvas = !!document.createElement('canvas').getContext;

	horseMask = new Image();
   	horseMask.src = '/uploads/horse_mask.png';
	horseMask.onload = function () {horseMaskLoaded = true};

	forSale = new Image();
   	if (lang == "rus") forSale.src = '/img/for_sale.png';
   	if (lang == "eng") forSale.src = '/img/eng/for_sale.png';
	forSale.onload = function () {forSaleLoaded = true};

	$(".b-horse-filter input").click(function () {filterChanged(this)});
	$("#js-horses-prev").bind("click", function(){shiftHorse(-1);});
	$("#js-horses-next").bind("click", function(){shiftHorse(+1);});
	$("#js-events-prev").bind("click", function(){shiftEvent(-1);});
	$("#js-events-next").bind("click", function(){shiftEvent(+1);});
	$(window).resize(windowResize);
	recalcHorses();
	recalcEvents();
});

function shiftHorse(dir) {
	if (isAnimating) return;
	if (curHorse + dir < 0) return;
	if (curHorse + dir > visibleHorses - 1) return;
	isAnimating = true;
   	curHorse += dir;
	checkHorseArrows();
	var curMargin = $('.list-horses').css('margin-left');
	var bufferArray = curMargin.split("px");
	curMargin = bufferArray[0] - 0;
	curMargin -= 323 * dir;
	$('.list-horses').animate({'margin-left': curMargin + "px"}, 250, function() {isAnimating = false; setHorsesVisibility();});
}

function shiftEvent(dir) {
	if (isAnimating) return;
	if (curEvent + dir < 0) return;
	if (curEvent + dir > visibleEvents - 1) return;
	isAnimating = true;
   	curEvent += dir;
	checkEventArrows();
	$('.list-events').animate({'margin-left': getEventOffset(curEvent) + "px"}, 250, function() {isAnimating = false; moveSlider();setEventsVisibility();});
}

function moveSlider() {
   	var curYear = 1870;
   	var curInd = 0;
   	if (curEvent >= 0) curYear = events[curEvent]['by'];
   	for (var i = events_slider.length - 1; i >= 0; i--)
   		if (events_slider[i] <= curYear) {curYear = events_slider[i]; curInd = i; break;}
   	$( ".ui-slider" ).slider("option","value",[curInd]);
}

function shiftEventYear(year) {
	var fir = -1;
	for (var i = 0; i < events.length; i++)
		if (events[i]['by'] >= year) {fir = i; break;}
	if (fir == -1) return;
	if (curEvent == fir) return;
   	curEvent = fir;
	checkEventArrows();
	$('.list-events').css({'margin-left': getEventOffset(curEvent) + "px"});
	setEventsVisibility()
}

function filterChanged(obj) {
	if ($(obj).filter(":checked").length > 0)
		$("span", $(obj).parent()).css("color", "#ffd800");
	else
		$("span", $(obj).parent()).css("color", "#fff");

	for (var i = 0; i < horses.length; i++) {
		var globalres = true;

		var res = false;
		var cnt = 0;
		$('input:checkbox:checked[id^="by_"]', $('.b-horse-filter')).each(function () {
			var id = $(this).attr("id");
			var id1 = id.substr(3, 4) - 0;
			var id2 = id.substr(8, 4) - 0;
			res = res || (horses[i]['by'] >= id1 && horses[i]['by'] <= id2);
			cnt++;
		});
		if (cnt == 0) res = true;
		globalres = globalres && res;

		var res = false;
		var cnt = 0;
		$('input:checkbox:checked[id^="suit_"]', $('.b-horse-filter')).each(function () {
			var id = $(this).attr("id");
			var id1 = id.substr(5) - 0;
			res = res || (horses[i]['suit_id'] == id1);
			cnt++;
		});
		if (cnt == 0) res = true;
		globalres = globalres && res;

		var res = false;
		var cnt = 0;
		$('input:checkbox:checked[id^="breed_"]', $('.b-horse-filter')).each(function () {
			var id = $(this).attr("id");
			var id1 = id.substr(6) - 0;
			res = res || (horses[i]['breed_id'] == id1);
			cnt++;
		});
		if (cnt == 0) res = true;
		globalres = globalres && res;

		var res = false;
		var cnt = 0;
		$('input:checkbox:checked[id^="gender_"]', $('.b-horse-filter')).each(function () {
			var id = $(this).attr("id");
			var id1 = id.substr(7);
			if (id1 == 'J') id1 = "Ж";
			if (id1 == 'M') id1 = "М";
			res = res || (horses[i]['gender'] == id1);
			cnt++;
		});
		if (cnt == 0) res = true;
		globalres = globalres && res;

		var res = false;
		var cnt = 0;
		$('input:checkbox:checked[id^="for_sale_"]', $('.b-horse-filter')).each(function () {
			var id = $(this).attr("id");
			var id1 = id.substr(9)-0;
			res = res || (horses[i]['for_sale'] == id1);
			cnt++;
		});
		if (cnt == 0) res = true;
		globalres = globalres && res;

		if (globalres) {
			horses[i]['visible'] = 1;
			$("#horse_" + horses[i]['id']).show();
		} else {
			horses[i]['visible'] = 0;
			$("#horse_" + horses[i]['id']).hide();
		}
	}
	recalcHorses();
}

function clearFilter() {
	$(".b-horse-filter input:checkbox").removeAttr("checked");
	$(".b-horse-filter div > label > span").css("color", "#fff");
	filterChanged(null);
}

function getWordForm(cnt) {
	var webkit = "";
//	if ($.browser.webkit) webkit = "&nbsp;&nbsp;";
	if (lang == "rus") {
		var word = 'Лошадей';
		if (cnt % 10 == 1) word = webkit + "Лошадь";
		if (cnt % 10 >= 2 && cnt % 10 <= 4) word = webkit + "Лошади";
		if (cnt >= 11 && cnt <= 19) word = "Лошадей";
	}
	if (lang == "eng") {
		var word = 'Horse';
		if (cnt != 1) word = "Horses";
	}
	return word;
}

function recalcHorses() {
	$("#horses-not-found").remove();
	visibleHorses = 0;
	for (var i = 0; i < horses.length; i++)
	if (horses[i]['visible'] == 1) visibleHorses++;

	$('.horses-word-form').html(getWordForm(visibleHorses));

	$(".horses-count").html(visibleHorses);
	var no_found = "Лошадей не найдено";
	if (lang == "eng") no_found = "No horses found";
	if (visibleHorses == 0) $('.horses-nav').append('<div id="horses-not-found" style="text-align:center;color:#fff;font-size:30px;top:200px;position:relative;"><em>'+no_found+'</em></div>');
	curHorse = Math.floor((visibleHorses - 1) / 2);
	checkHorseArrows();
	windowResize();
}

function recalcEvents() {
	visibleEvents = events.length;
	checkEventArrows();
	windowResize();
}

function checkHorseArrows() {
	if (curHorse == 0) $('#js-horses-prev').hide(); else $('#js-horses-prev').show();
	if (curHorse == visibleHorses - 1) $('#js-horses-next').hide(); else $('#js-horses-next').show();
	if (visibleHorses == 0) {$('#js-horses-prev').hide();$('#js-horses-next').hide();}
}

function checkEventArrows() {
	if (curEvent == 0) $('#js-events-prev').hide(); else $('#js-events-prev').show();
	if (curEvent == visibleEvents - 1) $('#js-events-next').hide(); else $('#js-events-next').show();
	if (visibleEvents == 0) {$('#js-events-prev').hide();$('#js-events-next').hide();}
}

function getEventOffset(ind) {
	var w = $(window).width();
	if (w < 1007) w = 1007;

	var offset = w / 2;
	for (var i = 0; i < ind; i++) {
		if (events[i]['tp'] == 1) offset -= 248;
		if (events[i]['tp'] == 2) offset -= 296;
		if (events[i]['tp'] == 3) offset -= 213;
		if (events[i]['tp'] == 4) offset -= events[i]['tp4_th_w'] + 20;
		offset -= 70;
	}
	if (events.length == 0) return 0;
	if (events[ind]['tp'] == 1) offset -= 248 / 2 + 35;
	if (events[ind]['tp'] == 2) offset -= 296 / 2 + 35;
	if (events[ind]['tp'] == 3) offset -= 213 / 2 + 35;
	if (events[ind]['tp'] == 4) offset -= (events[i]['tp4_th_w'] + 20) / 2 + 35;
	return parseInt(offset);
}

function windowResize() {
	var w = $(window).width();
	if (w < 1007) w = 1007;
	var offset = parseInt((w / 2) - (322 / 2) - 323 * curHorse);
	$('.list-horses').css('margin-left', offset + 'px');

	if (curEvent >= 0) $('.list-events').css('margin-left', getEventOffset(curEvent) + 'px');

	setHorsesVisibility();
	setEventsVisibility();
};


function setHorsesVisibility() {
	var w = $(window).width();
	if (w < 1007) w = 1007;
	for (var i = 0; i < horses.length; i++)
		if (horses[i]['visible'] && !horses[i]['loaded']) {
			var obj = $('#horse_' + horses[i]['id']);
			var l = $(obj).offset().left - 46;
			if ((l + 323 > 0) && (l < w))  createHorseImage(horses[i]['id']);
	}
}

function setEventsVisibility() {
	var w = $(window).width();
	if (w < 1007) w = 1007;
	for (var i = 0; i < events.length; i++)
		if (!events[i]['loaded']) {
			var obj = $('#event_' + events[i]['id']);
			var l = $(obj).offset().left;
			if ((l + 296 > 0) && (l < w))  createEventImage(events[i]['id']);
	}
}


function createHorseImage(id) {
	if (hasCanvas) {
		if (!horseMaskLoaded) {setTimeout(function() {createHorseImage(id)}, 100); return};
		if (!forSaleLoaded) {setTimeout(function() {createHorseImage(id)}, 100); return};
	}
	for (var ind = 0; ind < horses.length; ind++)
		if (horses[ind]['id'] == id) break;
	if (ind == horses.length) return;
	if (horses[ind]['loaded']) return;

	horses[ind]['loaded'] = true;
	if (hasCanvas) {
   		horses[ind]['img'] = new Image();
	   	horses[ind]['img'].src = '/uploads/horses/'+horses[ind]['fname'];
		horses[ind]['img'].onload = function () {horseImageLoaded(id, ind)};
	} else horseImageLoaded(id, ind);
}

function createEventImage(id) {
	for (var ind = 0; ind < events.length; ind++)
		if (events[ind]['id'] == id) break;
	if (ind == events.length) return;
	if (events[ind]['loaded']) return;

	events[ind]['loaded'] = true;
	eventImageLoaded(id, ind);
//	events[ind]['img'] = new Image();
//	events[ind]['img'].src = '/uploads/events/'+events[ind]['fname'];
//	events[ind]['img'].onload = function () {eventImageLoaded(id, ind)};
}


function detectIE7(){
  var browser = navigator.appName;
  if (browser == "Microsoft Internet Explorer"){
    var b_version = navigator.appVersion;
    var re = /\MSIE\s+(\d\.\d\b)/;
    var res = b_version.match(re);
    if (res[1] <= 7){
      return true;
    }
  }
  return false;
}


function horseImageLoaded(id, ind) {
	var obj = $('#horse_' + id + ' .horse-link');
	if (hasCanvas) {
	  	$('<canvas id="horse_canvas_'+id+'" width="280" height="210" class="horse-img"></canvas>').appendTo(obj);
		var canvas_el = $("#horse_canvas_"+horses[ind]['id'])[0];
		var ctx = canvas_el.getContext("2d");

		ctx.clearRect(0, 0, 280, 210);
		ctx.globalCompositeOperation = 'source-over';
		ctx.drawImage(horseMask, 0, 0, 280, 210, 0, 0, 280, 210);

		ctx.globalCompositeOperation = 'source-atop';
		ctx.drawImage(horses[ind]['img'], 0, 0, 280, 210, 0, 0, 280, 210);

		if (horses[ind]['for_sale'] == 1) {
			ctx.globalCompositeOperation = 'source-atop';
			ctx.drawImage(forSale, 0, 0, 101, 24, 179, 186, 101, 24);
		}

	} else {
	  	$('<img src="/uploads/horses/'+horses[ind]['fname'] +'" width="280" height="210" class="horse-img" />').appendTo(obj);
	  	var for_eng = "";
	  	if (lang == "eng") for_eng = "eng/";
		if (horses[ind]['for_sale'] == 1) {
			if (detectIE7()) $('<img style="margin-top:-37px;margin-left:153px;margin-bottom:-24px;" src="/img/'+for_eng+'for_sale.png" width="101" height="24"/>').appendTo(obj);
			else $('<img style="position:relative;top:-37px;left:89px;margin-bottom:-24px;" src="/img/'+for_eng+'for_sale.png" width="101" height="24"/>').appendTo(obj);
		}
	}
}


function eventImageLoaded(id, ind) {
//	var obj = $('#event_' + id + ' .b-mask');
//	$('<img src="/uploads/events/'+events[ind]['fname'] +'"/>').appendTo(obj);
	$('<img src="/uploads/events/'+events[ind]['fname'] +'"/>').insertBefore('#event_' + id + ' .event-img .horse-link');

}