var m3RecentName = "recentItems"; //cookieName
var m3RecentDays = 7; // days before expiration
var m3RecentNewString = "";
var m3RecentNum = 3; // number of items to display

// create cookie assigning name, value and expiration days
function createCookie(name,value,days) {
	if (days) {
		var date = new Date();
		date.setTime(date.getTime()+(days*24*60*60*1000));
		var expires = "; expires="+date.toGMTString();
	}
	else var expires = "";
	document.cookie = name+"="+value+expires+"; path=/";
}

// read cookie by name and list value
function readCookie(name) {
	var nameEQ = name + "=";
	var ca = document.cookie.split(';');
	for(var i=0;i < ca.length;i++) {
		var c = ca[i];
		while (c.charAt(0)==' ') c = c.substring(1,c.length);
		if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
	}
	return null;
}

// delete cookie by name
function eraseCookie(name) {
	createCookie(name,"",-1);
}

var m3RecentPreCookie = readCookie(m3RecentName);

// append new data to cookie.
function setCookie(){
  var unique ="yes"; 
	var s = curString.replace("^",""); // strips ^ from curent string
	if (!m3RecentPreCookie || m3RecentPreCookie == ""){
	// if cookie does not exist, create it with the current item's data
		newString = curString;
	} else { 
	// If cookie exists, split and compare its content to current item 
		var eachItem = m3RecentPreCookie.split("^");
		for (i = 0; i < m3RecentNum; i++){
			if (eachItem[i] == s ) { 
			unique = "no";
			} 	
		} if (unique == "yes"){
		// if current data is unique, add it to cookie
		  newString = curString + m3RecentPreCookie;
		  } else {
		// if current data is not unique, do not add it to cookie
		  newString = m3RecentPreCookie;

		  }
	}
  if(newString.charAt(newString.length - 1) == '^'){newString = newString.substr(0, newString.length - 1);}
	createCookie(m3RecentName,newString,m3RecentDays)
}

//splitting and writing cookie data
/*
function writeRecent(){
	if (preCookie && preCookie != ""){
		var eachItem = preCookie.split("^");
		var i2 = 0
    document.write("<br /><div id=\"recentItemHeader\">Recently Viewed Items</div>");
		for (i = 0; i < recentNum || i2 < recentNum; i++){
			//only write item if it exists, is not empty and is unique
			if (eachItem[i] && eachItem[i] != ""){
				var eachElement = eachItem[i].split("|");	
				if (eachElement[0] != prodID){
					document.write("<div id=\"recentItem" + i2 + "\"" + "  class=\"recentItem\"> ");
					document.write("<div class=\"recentImg\"><a href=\"" + eachElement[0] + ".html\"><img src=\"" + eachElement[1] + "\" border=\"0\" /></a></div>");
					document.write("<div class=\"recentName\"><a href=\"" + eachElement[0] + ".html\">" + eachElement[2] + "</a></div>");
					if (eachElement[3] && eachElement[3] != ""){
						document.write("<div class=\"recentPrice\">Retail Price: " + eachElement[3] + "</div>");
						}
					if (eachElement[4] && eachElement[4] != ""){
						document.write("<div class=\"recentSprice\">Your Price: " + eachElement[4] + "</div>");
						}
					document.write("</div>");
					i2 = i2 + 1; 
				}
			} else { i2 = i; } // don't increment counter is the current page is already displayed
		}
	}	 
}
*/
// New MSS Recent items for site redesign 5/18/10
function writeRecent() {
  var recentTitle = "Recently Viewed Items";
  if (!m3RecentPreCookie || m3RecentPreCookie=="") return;

  var eachItem = m3RecentPreCookie.split("^");
  var j = 0;
  
  // If there is only 1 element and the element is the product we are on, just exit
  if(eachItem.length == 1 && eachItem[0].split('|')[0]==prodID){return;}
  
  
  function makeDiv(newClass, newId, newWidth) {
    var elem = document.createElement('div');
    if (newClass && newClass!="") elem.className = newClass;
    if (newId && newId!="") elem.id = newId;
    if (newWidth && newWidth!="") elem.style.width = newWidth;
    return elem;
  }
  
  // Create elements of a rounded gray box
  var boxHolder = makeDiv('m3-box-holder', 'gray-tr', '700px');
  var titleR = makeDiv('m3-title-r ui-state-default');
  var titleL = makeDiv('m3-title-l');
  var boxTitle = makeDiv('m3-box-title');
    boxTitle.innerHTML = recentTitle;
  var boxMid = makeDiv('m3-box-mid');
  var boxContent = makeDiv('m3-box-content', "", '670px');
  var botR = makeDiv('m3-bot-r');
  var botL = makeDiv('m3-bot-l');
  var bot = makeDiv('m3-bot');
  
  // Create the table of recent items
  var recentTable = document.createElement('table');
  recentTable.setAttribute('cellspacing', '0');
  recentTable.className = 'recentTable';
  
  var recentTBody = document.createElement('tbody');
  var recentTR = document.createElement('tr');
  
  var recentTD;
  var el, prExists, salePrExists, recentCellHTML;
  // Cookie Format:
  // el[0]: product ID
  // el[1]: image URL
  // el[2]: product name
  // el[3]: Retail Price (formatted as $X.XX)
  // el[4]: Sale Price (formatted as $X.XX)   
  for (var i=0; i<m3RecentNum && i<eachItem.length; i++) {
    if (!eachItem[i] || eachItem[i]=="") {m3RecentNum++; continue;}
    el = eachItem[i].split('|');
    if (typeof(prodID)=='string' && el[0]==prodID) {m3RecentNum++; continue;}
    prExists = (el[3] && el[3] != "");  // check for existence of price
    salePrExists = (el[4] && el[4] != ""); // check for existence of sale price 

    recentCellHTML = '<a href="'+el[0]+'.html">'+
      '<img src="'+el[1]+'" class="recentImg" /></a>'+           
      '<a href="'+el[0]+'.html" class="recentTitle">'+el[2]+'</a>';
    if (prExists) {
      recentCellHTML += '<div class="recentPr">Price: ';
      recentCellHTML += salePrExists ? ('<b>'+el[3]+'</b>') : ('<b><em>'+el[3]+'</em></b>');
      recentCellHTML += '</div>';
    }
    if (salePrExists) {
      recentCellHTML += '<div class="recentSaPr">Your Price: ';
      recentCellHTML += '<b><em>'+el[4]+'</em></b>';
      recentCellHTML += '</div>';
    }
      
    recentTD = document.createElement('td');
    recentTD.innerHTML = recentCellHTML;
    recentTR.appendChild(recentTD);
  }
  recentTBody.appendChild(recentTR);
  recentTable.appendChild(recentTBody);
  

  // Build DOM structure out of these components
  titleL.appendChild(boxTitle);
  titleR.appendChild(titleL);
  boxMid.appendChild(boxContent);
  botL.appendChild(bot);
  botR.appendChild(botL);
  
  boxHolder.appendChild(titleR);
  boxHolder.appendChild(boxMid);
  boxHolder.appendChild(botR);
  
  boxContent.appendChild(recentTable);
   
  // HOW TO CHANGE ELEMENT TO STRING!?!?! THIS CANT BE THE BEST WAY...
  //var tempHolder = document.createElement('div');
  //tempHolder.appendChild(boxHolder);
  //document.write(tempHolder.innerHTML);
  
  // More efficient method. Just place the Div directly into dom.
  document.getElementById('m3-recent-div-container').appendChild(boxHolder);
}