/**
 * @author Gorsh
 */

$.fn.makePreview = function(options){

 var wndWidths = [];
 var wndHeights = [];
 var wndXs = [];
 var wndYs = [];

 $.fn.getWidths = function(){
 	return wndWidths;
 }

 $.fn.getHeights = function(){
 	return wndHeights;
 }
 
 $.fn.getXs = function(){
 	return wndXs;
 }

 $.fn.getYs = function(){
 	return wndYs;
 }

 return this.each(function() {
	var t = this;
	var h = '';
	var fullWidth = options.fullsize.split('x')[0] + 'px';
	var fullHeight = options.fullsize.split('x')[1] + 'px';

	h += '<div class="previews">';
	for(i=0; i<options.npreviews;i++){
		width = options.previewSizes[i].split('x')[0] + 'px';
		height = options.previewSizes[i].split('x')[1] + 'px';
		h += "<div id='preview" + i + "' class='" + options.previewSizes[i];
		if(i==0){
			h += " active";
		}
		h += "' style='";
		if(i>0)
			h += 'margin-top:11px;'
		h += "cursor:move;width:" + width + ";height:" + height + ";position:relative;overflow:hidden;'><br clear='All'/>";
		wndWidths[i] = width.substr(0, width.length-2);
		wndHeights[i] = height.substr(0, height.length-2);;
		wndXs[i] = 0;
		wndYs[i] = 0;
		h += "<img src='" + options.image + "' style='width:" + fullWidth + ";height:" + fullHeight + ";position:absolute;left:0;top:0;' />";
		h += "</div>";
	}
	h += '</div>';
	h += '<div class="fullImage" style="width:' + fullWidth + ';height:' + fullHeight + ';position:relative;">';
	h += '<img src="' + options.image + '" style="position:absolute;left:0;top:0;z-index:1;"/>';
	h += '<div class="overedDiv" style="z-index:2;width:' + fullWidth + ';height:' + fullHeight + ';position:absolute;left:0;top:0;"></div>';
	width = options.previewSizes[0].split('x')[0] + 'px';
	height = options.previewSizes[0].split('x')[1] + 'px';
	h += '<div class="previewField" style="background:url(' + options.image + ') no-repeat;position:absolute;left:0;top:0;cursor:move;width:' + width + ';height:' + height + ';z-index:3;">';
	h += '</div>';
	h += '</div>';
	$(t).html(h);
	
	$(t).find('.previewField').draggable({containment: 'parent'});
	$(t).find('.previews div img').draggable({});
	
	$(t).find('.previewField').resizable({
		containment: 'parent',
		aspectRatio: 1,
		minWidth: 55,
		minHeight:55
	});
	
	$(t).find('.previews div img').bind('drag', function(event, ui){

		if (ui.position.left > 0) {
			ui.position.left = 0;
		}
		
		if (ui.position.top > 0) {
			ui.position.top = 0;
		}
		var u = this;
		
		if (ui.position.top > 0) {
			$(u).draggable('disable');
			$(u).css("top", "0px");
			$(u).draggable('enable');
			return;
		}
		pr = $(t).find('.previewField')[0];
		fi = $(t).find('.fullImage img')[0];
		
		var num = $(this).parent()[0].id;
		num = num.substr(7, num.length);

		magnifierX = options.previewSizes[num].split('x')[0]/pr.offsetWidth;
		magnifierY = options.previewSizes[num].split('x')[1]/pr.offsetHeight;
		$(pr).css("top", Math.floor(-(ui.position.top + 5)/magnifierY) + "px");
		$(pr).css("left", Math.floor(-(ui.position.left + 5)/magnifierX) + "px");
		
		if(pr.offsetTop + pr.offsetHeight > fi.offsetHeight){
			ui.position.top = -u.offsetHeight + $(u).parent()[0].offsetHeight;
			$(pr).css("top", (fi.offsetHeight - pr.offsetHeight) + "px");
		}
		
		if(pr.offsetTop<0){
			$(pr).css("top", "0px");
		}
		
		if(pr.offsetLeft<0){
			$(pr).css("left", "0px");
		}
		
		if(pr.offsetLeft + pr.offsetWidth > fi.offsetWidth){
			ui.position.left = -u.offsetWidth + $(u).parent()[0].offsetWidth;
			$(pr).css("left", (fi.offsetWidth - pr.offsetWidth) + "px");
		}

		wndXs[num] = pr.offsetLeft;
		wndYs[num] = pr.offsetTop;
		$(pr).css('background-position', '-' + (pr.offsetLeft + 1) + 'px -' + (pr.offsetTop + 1) + 'px');
		
	});
	
	$(t).find('.previews div').bind('mousedown', function(){
		$(t).find('.previews div').removeClass('active');
		$(this).addClass('active');
		var num = this.id;
		num = num.substr(7, num.length);
	
		pr = $(t).find('.previewField')[0];
		fi = $(t).find('.fullImage img')[0];

		$(pr).css("width", wndWidths[num] + "px");
		$(pr).css("height", wndHeights[num] + "px");
		
		$(pr).css("top", (wndYs[num]) + "px");
		$(pr).css("left", (wndXs[num]) + "px");
		$(pr).css('background-position', '-' + (pr.offsetLeft + 1) + 'px -' + (pr.offsetTop + 1) + 'px');
	});
	
	$(t).find('.previewField').bind('drag', function(event, ui){
		var num = $(t).find('.previews .active')[0].id;
		num = num.substr(7, num.length);
		magnifierX = options.previewSizes[num].split('x')[0]/this.offsetWidth;
		magnifierY = options.previewSizes[num].split('x')[1]/this.offsetHeight;
		$(t).find('.previews .active img').css("top", "-" + Math.floor((ui.position.top + 5)*magnifierY) + "px");
		$(t).find('.previews .active img').css("left", "-" + Math.floor((ui.position.left + 5)*magnifierX) + "px");
		$(this).css('background-position', '-' + (ui.position.left + 1) + 'px -' + (ui.position.top + 1) + 'px');
		wndXs[num] =  ui.position.left;
		wndYs[num] = ui.position.top;
	});
	
	$(t).find('.previewField').bind('resize', function(event, ui){
		var num = $(t).find('.previews .active')[0].id;
		num = num.substr(7, num.length);
		if(ui.size.width>options.fullsize.split('x')[0] || ui.size.height>options.fullsize.split('x')[1])
			return;
		if(ui.position.left + ui.size.width > $(this).parent()[0].offsetWidth)
			return;
		if(ui.position.top + ui.size.height > $(this).parent()[0].offsetHeight)
			return;
		magnifierX = options.previewSizes[num].split('x')[0]/ui.size.width;
		magnifierY = options.previewSizes[num].split('x')[1]/ui.size.height;
		$(t).find('.previews .active img').css("width", options.fullsize.split('x')[0]*magnifierX + "px");
		$(t).find('.previews .active img').css("height", options.fullsize.split('x')[1]*magnifierY + "px");
		$(t).find('.previews .active img').css("top", "-" + ui.position.top*magnifierY + "px");
		$(t).find('.previews .active img').css("left", "-" + ui.position.left*magnifierX + "px");
		wndWidths[num] = ui.size.width;
		wndHeights[num] = ui.size.height;
	});
	
	if (options.init != "") {

		for(i=0;i<options.previewSizes.length;i++){
			wndHeights[i] = options.init.split("_")[i*4];
			wndWidths[i] = options.init.split("_")[i*4 + 1];
			wndXs[i] = options.init.split("_")[i*4 + 2];
			wndYs[i] = options.init.split("_")[i*4 + 3];
			
			magnifierX = options.previewSizes[i].split('x')[0]/wndWidths[i];
			magnifierY = options.previewSizes[i].split('x')[1]/wndHeights[i];
			$($(t).find('.previews div img')[i]).css("top", "-" + wndYs[i]*magnifierY + "px");
			$($(t).find('.previews div img')[i]).css("left", "-" + wndXs[i]*magnifierX + "px");
		
			$($(t).find('.previews div img')[i]).css("width", options.fullsize.split('x')[0]*magnifierX + "px");
			$($(t).find('.previews div img')[i]).css("height", options.fullsize.split('x')[1]*magnifierY + "px");

		}

		$(t).find('.previewField').css("width", wndWidths[0] + "px");
		$(t).find('.previewField').css("height", wndHeights[0] + "px");
		$(t).find('.previewField').css("left", wndXs[0] + "px");
		$(t).find('.previewField').css("top", wndYs[0] + "px");
		$(t).find('.previewField').css("background-position", -wndXs[0] + "px -" + wndYs[0] + "px");
	} else {
		for(i=0;i<options.previewSizes.length;i++){
			wndHeights[i] = options.previewSizes[i].split('x')[1]*1;
			wndWidths[i] = options.previewSizes[i].split('x')[0]*1;
			wndXs[i] = fullWidth.substr(0, fullWidth.length - 2)/2 - wndWidths[i]/2;
			wndYs[i] = fullHeight.substr(0, fullWidth.length - 2)/2 - wndHeights[i]/2;
			magnifierX = options.previewSizes[i].split('x')[0]/wndWidths[i];
			magnifierY = options.previewSizes[i].split('x')[1]/wndHeights[i];
			$($(t).find('.previews div img')[i]).css("top", "-" + wndYs[i]*magnifierY + "px");
			$($(t).find('.previews div img')[i]).css("left", "-" + wndXs[i]*magnifierX + "px");
		
			$($(t).find('.previews div img')[i]).css("width", options.fullsize.split('x')[0]*magnifierX + "px");
			$($(t).find('.previews div img')[i]).css("height", options.fullsize.split('x')[1]*magnifierY + "px");
		}
		
		$(t).find('.previewField').css("width", wndWidths[0] + "px");
		$(t).find('.previewField').css("height", wndHeights[0] + "px");
		$(t).find('.previewField').css("left", wndXs[0] + "px");
		$(t).find('.previewField').css("top", wndYs[0] + "px");
		$(t).find('.previewField').css("background-position", -wndXs[0] + "px -" + wndYs[0] + "px");
		
	}
	
 });
};