﻿		var RecCaption4T = 'Customers also bought...'; //global variable to set default display caption
		var CaptionStyle4T = 'titles';
		var customerId4T = '';
		var cartList4T = new Array();
		var cartCount4T = 0;
		 
		function add4TellCartItem(itemId) {
			cartList4T[cartCount4T] = itemId;
			cartCount4T++;
		}
		
		function set4TellCustomerId(userId) {
			customerId4T = userId;
		}
		
		/*
		 * get4TellResults:
		 * This function sets the parameters and calls the 4-Tell Boost web service to retrieve
		 * recommended product data. This function can be called directly or you can use GetRecommendations
		 * listed below to call by page type instead
		 * 
		 * You must adjust the clientAlias to match the ID assigned by 4-Tell
		 * when you activate your account.
		 * 
				forTell.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + jsonUrl;
		 */
		function get4TellResults(resultType, numResults, startPos, productIDs, cartIDs) {
			var webService		= 'www.4-Tell.net/Boost2.0/rest/';
			var operation		= 'GetRecDisplayList';
			var clientAlias		= 'Catholic';
						
			// Assemble the url to call
			var jsonUrl			=	webService + operation 
									+ '?clientAlias=' + clientAlias
									+ '&productIDs=' + productIDs
									+ '&cartIDs=' + cartIDs
									+ '&customerId4T=' + customerId4T
									+ '&numResults=' + numResults
									+ '&startPosition=' + startPos
									+ '&resultType=' + resultType 
									+ '&format=json'
									+ '&callback=display4TellRecs';	

			//document.writeln(jsonUrl);
			
			// Call the service, passing the results to the callback function
			(function() {
				var forTell = document.createElement('script'); forTell.type = 'text/javascript'; forTell.async = true;
				forTell.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + jsonUrl;
				var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(forTell, s);
			})();
		}
  		
		/* 
		 * getRecommendations:
		 * This function sets the number and type of recommendations based on the type of page
		 * where they will be displayed. You can use this function to set global policies or else
		 * you can call get4TellResults directly from each page.
		 *
		 */ 
		function get4TellRecommendations(pageType, productIDs) {
			var resultType = 0;
			var numResults = 4;
			var startPos = 1;
			
			// Compile the list of cart items
			var cartIDs = '';
			if (cartCount4T > 0) {
				var firstItem = true;
				for (var i = 0; i < cartCount4T; i++) {
					if (firstItem) firstItem = false;						
					else cartIDs += ',';
					cartIDs += cartList4T[i];
				}
			}
			
			//These are example settings for different pages of your site. 
			//Feel free to add or remove page types here to match your site architecture.
			//you can also set numResults differently for each page if needed
			var inCart = false;
			switch (pageType) {
				case 'ProductDetail': //product detail page (PDP)
					resultType = 0; //Cross-sell
					startPos = 1;
					RecCaption4T = 'Customers also bought...';
					CaptionStyle4T = 'titles';
					break;		
				case 'AddToCart': //intermediate add to cart page
					resultType = 0; //Cross-sell
					startPos = 1;
					RecCaption4T = 'You may also like...';
					CaptionStyle4T = 'checkout-headers';
					inCart = true;
					break;
				case 'OrderShipping': //delivery options page
					resultType = 0; //Cross-sell
					startPos = 1 + numResults; //second block
					RecCaption4T = 'You may also like...';
					CaptionStyle4T = 'checkout-headers';
					inCart = true;
					break;
				case 'OrderPayment': //payment options page
					resultType = 2; //Blended
					startPos = 1;
					RecCaption4T = 'You may also like...';
					CaptionStyle4T = 'checkout-headers';
					inCart = true;
					break;
				case 'OrderConfirm': //order confirmation page
					resultType = 2; //Blended
					startPos = 1 + numResults; //second block
					RecCaption4T = 'You may also like...';
					CaptionStyle4T = 'checkout-headers';
					inCart = true;
					break;
				case 'OrderComplete': //checkout complete page
					resultType = 2; //Blended
					startPos = 1 + (2 * numResults); //third block
					RecCaption4T = 'Suggestions for you...';
					CaptionStyle4T = 'checkout-headers';
					break;
				default: //any page not listed
					resultType = 2; //Blended
					startPos = 1;
					RecCaption4T = 'Suggestions for you...';
					CaptionStyle4T = 'checkout-headers';
					break;
			}
			if (inCart && (cartIDs != '')) //on cart pages, use cart IDs directly instead of as influencers
			{
				if (productIDs != '')
					productIDs += ',';
				productIDs += cartIDs;
				cartIDs = '';
			}
			
			get4TellResults(resultType, numResults, startPos, productIDs, cartIDs);
		}
		
  	function display4TellRecs(data) {
  			// If the data is passed in then proceed
			if (data) {
				if (navigator.appName != "Microsoft Internet Explorer")
				{			  
					var items = data['GetRecDisplayListResult'];
					var prods = document.getElementById('product_recommendations_4T');
					
					//set the caption
					var caption = document.createElement('div');
						caption.setAttribute('class', CaptionStyle4T);
						caption.innerHTML = RecCaption4T;
					prods.appendChild(caption);
	
					//setup each recommendation in the list
					for (var p=0; p<items.length; p++) {
						// This is the main container for one product
						var prod = document.createElement('div');
						prod.setAttribute('class', 'product4T');
	
	
						// image wrapper (to keep fixed size)										
						var prodImage = document.createElement('div');
						prodImage.setAttribute('class', 'productImage');
						
						// link to the product page
						var link = document.createElement('a');
						link.setAttribute('href', items[p].pageLink);
						
						var img = document.createElement('img');
						img.setAttribute('src', items[p].imageLink + "&maxx=130&maxy=120");
						//note: use the following lines if displayed on a tinted background
						//also, change css to:
						//	.product4T .productImage {
						//		background-color: #F3F2F2;
						//		height: 120px;
						//		width: 135px;
						//	}
						//img.setAttribute('src', items[p].imageLink + "&maxx=0&maxy=120");
						//if (img.width > 130) img.setAttribute('width', '130px');
						
						img.setAttribute('class', 'productImageImg');
						link.appendChild(img);
						prodImage.appendChild(link)
	
						// product title
						var prodTitle = document.createElement('div');
						prodTitle.setAttribute('class', 'productTitle');
						
						var prodTitleText = document.createElement('a');
						prodTitleText.setAttribute('class', 'productTitleText');;
						prodTitleText.setAttribute('href', items[p].pageLink);
						prodTitleText.innerHTML = items[p].title;
						prodTitle.appendChild(prodTitleText)
						
						// product price
						var prodPrice = document.createElement('div');
						prodPrice.setAttribute('class', 'productPrice');
						prodPrice.innerHTML = items[p].price;
						
						// Buy Now
						var prodBuy = document.createElement('div');
						prodBuy.setAttribute('class', 'productBuy');
						
						var prodBuyBtn = document.createElement('input');
						prodBuyBtn.setAttribute('type', 'button');
						prodBuyBtn.setAttribute('class', 'btn');
						prodBuyBtn.setAttribute('onmouseout', "this.className='btn'");
						prodBuyBtn.setAttribute('onmouseover', "this.className='btn_over'");
						prodBuyBtn.setAttribute('onclick', "window.location='add_cart.asp?quick=1&item_id=" + items[p].productID + "'");
						prodBuyBtn.setAttribute('value', 'Add to Cart');
						prodBuy.appendChild(prodBuyBtn);
						
						// Put the elements into the main product container 
						prod.appendChild(prodImage);
						prod.appendChild(prodTitle);
						prod.appendChild(prodPrice);
						prod.appendChild(prodBuy);
						
						// Put the main product container into the products container 
						prods.appendChild(prod);
					}
				}
				else //special handling for IE
				{
					//set the caption
					var caption = $("<div class='"+CaptionStyle4T+"'>"+RecCaption4T+"</div>");
					caption.appendTo("#product_recommendations_4T");
	
					//get the items array
					var items = data['GetRecDisplayListResult'];
					
					// Loop through each product
					$.each(items, function(i, itemdata) {
						// This is the main product container
						var prod = $("<div class='product4T' />");
						
						// A wrapper for the image allows better size and position control
						var prodImage = $("<div class='productImage' />");					
						// This is a image and gets wrapped by the link
						var img = $("<img class='productImageImg' />");
						img.attr("src", itemdata.imageLink + "&maxx=135&maxy=120");
						img.appendTo(prodImage);
						img.wrap("<a href='" + itemdata.pageLink + "'></a>");
						prodImage.appendTo(prod);
						
						// This is the title of the product and gets wrapped by the link
						var prodTitle = $("<div class='productTitle'>"+itemdata.title+"</div>");
						prodTitle.appendTo(prod);
						prodTitle.wrap("<a href='" + itemdata.pageLink + "'></a>");
						
						// This is the price of the product
						$("<div class='productPrice'>"+itemdata.price+"</div>").appendTo(prod);
						
						// This is the buy now buton
						var buyWrapper = $("<div class='productBuy' />");
						var buyBtn = $("<input type='button' value='Add to Cart' class='btn' onmouseout=this.className='btn' onmouseover=this.className='btn_over' onclick=window.location='/add_cart.asp?quick=1&item_id="+itemdata.productID+"' />");

						buyBtn.appendTo(buyWrapper);
						buyWrapper.appendTo(prod);
						
						// Insert the product into the main product container
						prod.appendTo("#product_recommendations_4T");
					});
				}
			}
  	}


