/**
 ** Included in this file:
 **
 **   + Tile Recommendation Builder
 **   + Tiles Renderer
 **
 ** Together these functions form the default presentation mechanism for recommendations.These 
 ** functions are always available once the JavaScript include has been loaded. They are a good
 ** reference point because they are very simple and because they utitilize many of the available
 ** renderer facilities. The facilities in use here are from two namespaces:
 **
 **   + ATGSvcs.dom -- a programatic DOM construction toolkit.
 **   + ATGSvcs.util -- a collection of common utility functions.
 **
 ** Complete documentation of all renderer related facilities is available in the RDK or online at
 ** http://recmanager.atg.com/api/renderer/
 **/

/** Tile Recommendation Builder
 **
 ** @param slot_name is the ID value for the element on the page that we render recommendations into.
 ** @param rec_data is an array of objects representing the recommendation data to display.
 **
 ** Three functions from the ATGSvcs namespace are used:
 **
 **   + price() returns a formatted price string or null.
 **   + util.trunc() returns a truncated string that doesn't split mid word.
 **   + rec_id() returns an page id for a recommendation.
 **
 ** IMPORTANT: A container element having the class "cs-rec" MUST wrap each recommendation. This
 ** container element also MUST have an id generated by the rec_id function. This function takes
 ** two parameters:
 **
 **   + slot_name (the same value that is passed in to the rec_builder)
 **   + recommendation.id (the server side id value that is part of the passed in rec_data array)
 **/
ATGSvcs.rec_builder("ePriceRecBuilderHorizontal", function (slot_name, rec_data) {
	// short handle for the DOM Builder
	var dom = ATGSvcs.dom,

	// returns a formatted price or null depending on the page configuration
	price_string = ATGSvcs.price(slot_name, rec_data.price),
	
	// create a <span> tag or leave price null
	price = price_string ? dom.SPAN({Class: "cs-price"}, price_string) : null,

	// check to see if there is a limit set on the product name
	name_length = ATGSvcs.cfg('-name-length', slot_name, 0),

	// if so, truncate the name using the trunc() function
	name = name_length ? ATGSvcs.util.trunc(rec_data.name, name_length) : rec_data.name,

	// if retailer specified text to append, do so
	append_string = ATGSvcs.cfg("-append-title", slot_name, null),

	append_title = append_string ? dom.SPAN({Class: "cs-append-title"}, append_string) : null;

//	var photo = dom.DIV({Class: "fotoBigATG"},
//		dom.A({href: rec_data.url, title: rec_data.name},
//			dom.IMG({height: "100", width: "100", border: "0", alt: rec_data.name, src: rec_data.image.replace(/\/75\//g,"\/100\/") })
//		)
//	);
	var photo = dom.DIV({ Class: "fotoBigATG" },
		dom.A({ href: rec_data.url, title: rec_data.name },
		    rec_data.image.include('bol.it') ?
		    dom.IMG({ height: "100", width: "100", border: "0", alt: "non disponibile", src: "http://static.eprice.it/img/img_nodispo75.gif" }) :
		    dom.IMG({ height: "100", width: "100", border: "0", alt: rec_data.name, src: rec_data.image.replace(/\/75\//g, "\/100\/") })

		)
	);
	
	var brand = dom.P({Class: "produttore_atg", title: rec_data.brand}, 
		dom.A({href: rec_data.GetPathCat3Manufacturer, Class: "nero", title: rec_data.brand}, rec_data.brand)
	);
	
	var name = dom.P( 
		dom.A({href: rec_data.url, Class: "nero", title: rec_data.name}, name)
	);

	if ( rec_data.pricelist != null )
	{
		pricelist_string = ATGSvcs.price(slot_name, rec_data.pricelist);
		var pricelist = dom.P({Class: "prezzoBarrato_atg"}, pricelist_string);
	}

	var price = dom.P({Class: "prezzo_atg"}, price_string);

	if (rec_data.yousave != null)
	{
		if  (rec_data.yousave.indexOf("%")<0)
		    yousave_string = rec_data.yousave.toUpperCase() + "€";
		else
		    yousave_string=rec_data.yousave.toUpperCase();
		    
		var yousave = dom.P({Class: "risparmi_atg"}, yousave_string);
	}
	
	var catPath='';  
//	
//var catPath = dom.P({Class: "altro_atg"}, 
//		dom.A({href: rec_data.pathcat3, Class: "nero", title: "Vedi solo " + rec_data.cat3desc}, "Vedi solo " + rec_data.cat3desc)
//	);
//	
	if (rec_data.qualifier != null || rec_data.qualifier == "") 
	{
		overlayHeight = "0";
		overlayWidth = "0";
		overlayMarginLeft = "0px";
		overlayMarginTop = "0px";
		
		if (rec_data.qualifier.toUpperCase() == "HTTP://WWW.EPRICE.IT/IMG/_B/QUALIFICATORE_NEW.PNG")
		{
			overlayHeight = "50";
			overlayWidth = "50";
			overlayMarginLeft = "0px";
			overlayMarginTop = "0px";
		}
		else if (rec_data.qualifier.toUpperCase() == "HTTP://WWW.EPRICE.IT/IMG/ICOPREZZORISPARMIO.GIF")
		{
		if (navigator.appName == 'Microsoft Internet Explorer')
			{
				overlayHeight = "32";
				overlayWidth = "60";
				overlayMarginLeft = "0px";
				//overlayMarginTop = "55px";
				overlayMarginTop = "0px";
			}
			else
			{
				overlayHeight = "32";
			    overlayWidth = "60";
			    //overlayMarginLeft = "55px";
			    //overlayMarginTop = "55px";
			    overlayMarginLeft = "0px";
			    overlayMarginTop = "0px";
			}
			
		}                  
		else if (rec_data.qualifier.toUpperCase() == "HTTP://WWW.EPRICE.IT/IMG/ICOPREZZOSPECIALE.GIF")
		{
			overlayHeight = "37";
			overlayWidth = "50";
			overlayMarginLeft = "0px";
			overlayMarginTop = "0px";
		}
		else if (rec_data.qualifier.toUpperCase() == "HTTP://WWW.EPRICE.IT/IMG/TASSO_INTERESSI0.GIF")
		{
			overlayHeight = "20";
			overlayWidth = "100";
			overlayMarginLeft = "0px";
			overlayMarginTop = "70px";
		}
		else if (rec_data.qualifier.toUpperCase() == "HTTP://WWW.EPRICE.IT/IMG/TOPSELLER.GIF")
		{
		    //margin-left: 0px; margin-top: 0px; width: 60px; height: 32px; z-index: 10
			overlayHeight = "32";
			overlayWidth = "60";
			overlayMarginLeft = "0px";
			overlayMarginTop = "0px";
			rec_data.qualifier="http://www.eprice.it/img/_b/atg_topseller.png";
		} 
		
		overlayStyle = "position: absolute;  float: left; margin-left: " + overlayMarginLeft + "; margin-top: " + overlayMarginTop + "; width: " + overlayWidth + "px ; height: " + overlayHeight + "px ; z-index: 10; background-repeat:no-repeat";
		
		var overlay = dom.DIV({style: overlayStyle}, 
					dom.IMG({height: overlayHeight, width: overlayWidth, border: "0", src: "http://static.eprice.it/img/spacer.gif"})
				);
				
		overlay.style.backgroundImage = "url(" + rec_data.qualifier + ")";


		
		//recbuilder with overlay
		// return the recommendation DOM element
		return dom.DIV({Class: "cs-rec", id: ATGSvcs.rec_id(slot_name, rec_data.productId)},
			dom.DIV({Class: "boxAffariInCorsoATGhorizontal"},
				overlay,
				photo,
				brand,
				name,
				pricelist,
				price,
				yousave,
				catPath
			)	
		);
	}
	else
	{
		//recbuilder without overlay
		// return the recommendation DOM element
		return dom.DIV({Class: "cs-rec", id: ATGSvcs.rec_id(slot_name, rec_data.productId)},
			dom.DIV({Class: "boxAffariInCorsoATGhorizontal"},
				photo,
				brand,
				name,
				pricelist,
				price,
				yousave,
				catPath
			)	
		);
	}
});

ATGSvcs.l10n.register("EU", function () {
	this.CUR_SYM = "\u20ac";
	this.currency_string = function(triplet_array, decimal_string) {
		return this.CUR_SYM + " " + triplet_array.join(".") + "," + decimal_string;
	};
});
	

/** Tiles Renderer: uses a rec_builder to render the recommendation data into a DOM representation.
 **
 ** @param slot_element a dom node whose element which is the slot where recommendations are to be 
 ** rendered.
 **
 ** When the function is called the this keyword is set to the recommendation data object returned
 ** by the server. Its properties contain the data used for rendering the recommendation slot.
 **
 ** The call to ATGSvcs.build_rec() will use the recommendation builder function (above) to render
 ** the DOM elements for each recommendation. It takes two parameters:
 **
 **   + slot name -- here we derive this value from the slot_element
 **   + rec data (this.recs[i]) -- an object whose properties are the data values for the recommendation.
 **/
ATGSvcs.renderer("ePriceRendererHorizontal", function (slot_element){
	// the slot name is the id attribute of the slot element
	var slot_name = slot_element.id;

	// if headerText is set, create an element for it
	if (this.headerText) {
	// Add a <div> if the headerText is set
	slot_element.appendChild(ATGSvcs.dom.DIV({Class: "cs-header-text-h"}, this.headerText));
	}

	// loop through each of the recommendations and add the recommendation element for each one
	for (var i=0; i < this.recs.length; i++) {
	slot_element.appendChild(
		ATGSvcs.build_rec(slot_name, this.recs[i])
	);
	}

	// ATGSvcs.dom.ezc() or "E-Z clearing div" is equivalent to <div style="clear:both"></div>
	slot_element.appendChild(ATGSvcs.dom.ezc());
});