// $Revision: 124 $
// Maximale Bildbreite für die Thumbnail-Bilder in der Liste
maxWidthThumb = 40;
// Maximale Bildhöhe für die Thumbnail-Bilder in der Liste
maxHeightThumb = 40;
// Maximale Bildbreite für die Vorschau-Bilder bei Mouseover
maxWidthPreview = 200;
// Maximale Bildhöhe für die Vorschau-Bilder bei Mouseover
maxHeightPreview = 200;

// Benennung der Kategorien in der Liste
itemLabel = {
	'title':'Produktname',
	'cat':'Kategorie',
	'vendor':'Hersteller',
	'ordernumber':'Artikelnummer'
};

jQuery(function() {
	function format(item) {
		result = ''; 
		item.outputCat = itemLabel[item.cat];
		
		// Ausgabecode für die einzelnen Treffer
		if (item.image) {
			result += '<td class="ac_image" align="center" width="' + maxWidthThumb + 'px" height="' + maxHeightThumb + '"><img src="' + item.image + '" alt="Thumbnail" style="display:none;" /></td>';
		} else {
			result += '<td><span style="display:block;width:' + maxWidthThumb + 'px;height:' + maxHeightThumb + 'px;">&nbsp;</span></td>';
		}
		result += '<td class="ac_name" valign="top">' + item.name + '</td><td class="ac_cat" valign="top">' + item.outputCat + '</td>';
		return result;
	}
	autocompleteField.autocomplete('/plenty/api/autocomplete.php', {
		max: 10,
		minChars: 3,
		dataType: "json",
		cacheLength: 1,
		matchSubset: false,
		autoFill: false,
		selectFirst: false,
		scrollHeight: 500,
		scroll: false,
		width: false,
		parse: function(data) {
			suggestions = jQuery.map(data.suggestions, function(row) {
				row = row.split("|");
				lastCat = "";
				/* sometimes the suggestion text contains the | symbol, so re-join it manually, leaving out the last two parts */
				text = row.slice(0, row.length - 2).join("|");
				return {
					data: {name: text, cat: row[row.length - 2], count: row[row.length - 1]},
					value: text,
					result: text
				}
			})
			for (i in suggestions) {
				suggestions[i].data.image = data.images[i];
				suggestions[i].data.parameters = data.parameters[i];
				/* remove the .result if there are parameters present, so the submitted query is empty */
				if (!jQuery.isEmptyObject(data.parameters[i])) {
					suggestions[i].result = "";
				}
			}
			return suggestions;
		},
		formatItem: function(item) {
			return format(item);
		},
		extraParams: {
			query: function() { return autocompleteField.val(); },
			multishop_id : function() { return $("input#multishop_id").val(); }
		}
//		extraParams: jQuery(autocompleteField[0].form).serializeArray()
	})
});

// preloads images
function preloadImages (dom, maxW, maxH) {
	jQuery(dom).preload({
		onComplete:completePL,
		treshhold:5
	});
	function completePL (data) {
		if(data.found) {
			resizeImage(jQuery(data.original), maxW, maxH);
		}
	}
}

// resizes image to given dimensions
function resizeImage (original, maxW, maxH) {
	if (original.width() > maxW || original.height() > maxH) {
                if (original.width() * maxH > original.height() * maxW) {
                        newW = new String(maxW) + "px";
                        newH = new String(maxW * original.height() / original.width()) + "px";
                } else {
                        newH = new String(maxH) + "px";
                        newW = new String(maxH * original.width() / original.height()) + "px";
                }
        } else {
                newW = new String(original.width()) + "px";
                newH = new String(original.height()) + "px";
        }
	original.css({width:newW,height:newH});
	original.show(); 
}

// starts preview on mouseover
function showPreview() {
	xOffset = -5;
	yOffset = 5;
	
	jQuery('.ac_results table tr').live('hover', 
		function(e){
			src = jQuery(this).children('td').children('img').attr('src'); 
			if (src && jQuery(this).children('td').children('img').css('display') != 'none') {
				if (e.type == 'mouseover') {
					jQuery('body').append('<div id="preview"><img src="' + src + '" alt="Preview" style=display: none;" /></div>');
					preloadImages('#preview img', maxWidthPreview, maxHeightPreview);
					jQuery("#preview").css("top",(e.pageY - xOffset) + "px").css("left",(e.pageX + yOffset) + "px").fadeIn("fast");
				} else {
					jQuery('#preview').remove();
				}
			}
		}
	);
	jQuery('.ac_results table tr').live('mousemove', 
		function(e){
			var bodyW = jQuery('body').outerWidth();
			var bodyH = jQuery('body').outerHeight();
			var imgW = (e.pageX + yOffset + jQuery('#preview').width());
			var imgH = (e.pageY - xOffset + jQuery('#preview').height());
			var imgL = (e.pageX + yOffset);
			var imgT = (e.pageY - xOffset);
			if (imgH > bodyH) {
				imgT = (e.pageY-jQuery('#preview').height()+xOffset);
			}
			if (imgW > bodyW) {
				imgL = (e.pageX-jQuery('#preview').width()-yOffset);
			}
			jQuery("#preview").css("top",imgT + "px").css("left",imgL + "px");
		}
	);
	jQuery(document).keydown(function(e) {
		if (e.keyCode == 27) {
			jQuery("#preview").remove();
		}
	});
}

/* append filter parameters to the form before it is submitted */
function addParameters(form, data, name, depth) {
	for (i in data) {
		var encodedName = encodeURI(i);
		subname = (depth > 0 ? name + "[" + encodedName + "]" : encodedName);
		if (typeof data[i] != "object") {
			jQuery(form).append(jQuery("<input/>").attr("type", "hidden").attr("name", subname).val(data[i]));
		} else {
			addParameters(form, data[i], subname, depth + 1);
		}
	}
}
autocompleteField.result(function(event, data, formatted) {
	addParameters(event.target.form, data.parameters, "", 0);
});

showPreview();