/**
* ContentGenerator Class
* This class will be responsible for generating/displaying all dynamic DOM content
*/

function ContentManager(windowManager, model){
	this.windowManager = windowManager;	
	this.model = model;
}


ContentManager.prototype.showLoginWindow = function(eleId, postURL){
	
	if(this.loginWindowHandle){
		this.windowManager.showWindow(this.loginWindowHandle);
		return;
	} 
	
	var cont = document.createElement('div');
	cont.style.textAlign = "left";
	
	var heading = document.createElement('div');
	heading.className = "title2_black";
	heading.style.margin = "10px 0px";
	
	var introText = "Login.";
	if (this.model.inIframe)
	{
		heading.className = "title2_blue";
		if (postURL.indexOf("ctli=") > 0)
		{
			introText = "Login to your " + this.model.clientName + " account to clip this coupon.";
		}
		else
		{
			introText = "Login to your " + this.model.clientName + " account to clip these coupons.";
		}	
	}	
	
	var heading_text = document.createTextNode(introText);
	
	var form = document.createElement('form');
	form.action = postURL;
	form.method = "POST";
	form.name = "pop_login";
	form.id = "pop_login";
	
	var phone_holder = document.createElement('div');
	phone_holder.style.cssFloat = "left";
	phone_holder.style.styleFloat = "left";
	phone_holder.style.width = "40%";
	phone_holder.style.fontWeight = "bold";
	phone_holder.id = "phone_holder";
	//phone_holder.style.border = "1px solid green";
	
	var phone_input = document.createElement('input');
	phone_input.type = "text";
	phone_input.name = "phone";
	phone_input.id = "pop_phone";
	phone_input.size = "10";
	
	
	var phone_label = document.createTextNode("Mobile Phone #");
	//phone_label.style.fontWeight = "bold";
	
	
	var yob_holder = document.createElement('div');
	yob_holder.style.cssFloat = "left";
	yob_holder.style.styleFloat = "left";
	yob_holder.style.width = "30%";
	yob_holder.style.fontWeight = "bold";
	yob_holder.id = "yob_holder";
	//yob_holder.style.border = "1px solid green";
	
	var yob_input = document.createElement('input');
	yob_input.type = "text";
	yob_input.name = "yob";
	yob_input.id = "pop_yob";
	yob_input.size = "5";
		
	
	var yob_label = document.createTextNode("Year of Birth");
	//yob_label.style.fontWeight = "bold";
	
	var clear = document.createElement('div');
	clear.className = "clear";
	
	var remember_checkbox = document.createElement('input');
	remember_checkbox.type = "checkbox";
	remember_checkbox.name = "remember_me";
	remember_checkbox.id = "remember_me";
	remember_checkbox.value = "1";
	remember_checkbox.checked = true;
	
	var remember_label = document.createElement('label');
	var remember_title = document.createElement('strong');
	remember_title.appendChild(document.createTextNode("Remember me on this computer"));
	
	remember_label.appendChild(remember_checkbox);
	remember_label.appendChild(remember_title);
	remember_label.appendChild(document.createElement('br'));
	remember_label.appendChild(document.createTextNode("For public computers please do not check this option"))
	
	var cssLoc = 'mmc';
	if (this.model.inIframe)
	{
		cssLoc = this.model.iframeCssId;
	}	
	var submit_button = document.createElement("div")
	submit_button.style.margin = "5px 0px 0px 0px";
	submit_button.style.height = "25px";

	submit_button_img = document.createElement("img");
	submit_button_img.onclick = function(){document.getElementById('pop_login').submit();};
	submit_button_img.src = "/includes/templates/affiliate/" + cssLoc + "/button_login.png";
	submit_button_img.alt = "Log In";
	submit_button_img.style.cursor = "pointer";
	submit_button.appendChild(submit_button_img);
	
	heading.appendChild(heading_text);
	cont.appendChild(heading);
	phone_holder.appendChild(phone_label);
	phone_holder.appendChild(document.createElement('br'));
	phone_holder.appendChild(phone_input);
	form.appendChild(phone_holder);

	var hidden_button_div = document.createElement("div");
	hidden_button_div.className = "hideSubmit";

	// have to put this hidden submit button in the form or hitting enter from the form will not work
	var hidden_button = document.createElement("input");
	hidden_button.style.visibility = "hidden";
	hidden_button.style.height = "0px";
	hidden_button.style.width = "0px";
	hidden_button.type="submit";

	yob_holder.appendChild(yob_label);
	yob_holder.appendChild(document.createElement('br'));
	yob_holder.appendChild(yob_input);
	form.appendChild(yob_holder);
	form.appendChild(clear);
	form.appendChild(document.createElement('br'));
	form.appendChild(remember_label);
	form.appendChild(document.createElement('br'));
	form.appendChild(document.createElement('br'));
	form.appendChild(submit_button);
	hidden_button_div.appendChild(hidden_button);
	form.appendChild(hidden_button_div);
	
	cont.appendChild(form);
	
	this.loginWindowHandle = this.windowManager.createNewBlackOutWindow(cont, 400, 0, 0, true);
	this.windowManager.showWindow(this.loginWindowHandle);
}

ContentManager.prototype.showClipWithCardWindow = function(eleId, index){
	var coupon = this.model.coupons[index];
	var merchant = this.model.merchants[coupon.merchantId];
	var loyaltyCard=this.model.loyaltyCards[coupon.merchantId];
	if(this.loginWindowHandle){
		this.windowManager.showWindow(this.loginWindowHandle);
		return;
	} 
	
	var cont = document.createElement('div');
	cont.style.textAlign = "left";
	
	var heading = document.createElement('div');
	heading.className = "title2_black";
	heading.style.marginBottom = "10px";
	
	var introText = "Please enter your "+merchant.name+" "+ loyaltyCard.cardName+"";
	if (this.model.inIframe)
	{
		heading.className = "title2_blue";
		if (postURL.indexOf("ctli=") > 0)
		{
			introText = "Login to your " + this.model.clientName + " account to clip this coupon.";
		}
		else
		{
			introText = "Login to your " + this.model.clientName + " account to clip these coupons.";
		}	
	}	
	
	var heading_text = document.createTextNode(introText);
	
	var form = document.createElement('form');
	form.action = "deals.php?xuserclip"+index;
	form.method = "POST";
	form.name = "pop_clip_with_card";
	form.id = "pop_clip_with_card";
	
	var phone_holder = document.createElement('div');
	phone_holder.style.cssFloat = "left";
	phone_holder.style.styleFloat = "left";
	phone_holder.style.width = "40%";
	phone_holder.style.fontWeight = "bold";
	phone_holder.id = "phone_holder";
	//phone_holder.style.border = "1px solid green";
	
	var phone_input = document.createElement('input');
	phone_input.type = "text";
	phone_input.name = "phone";
	phone_input.id = "pop_phone";
	phone_input.size = "10";
	
	
	var phone_label = document.createTextNode("Loyalty card #");
	//phone_label.style.fontWeight = "bold";
		
	var clear = document.createElement('div');
	clear.className = "clear";
	
	var remember_checkbox = document.createElement('input');
	remember_checkbox.type = "checkbox";
	remember_checkbox.name = "remember_me";
	remember_checkbox.id = "remember_me";
	remember_checkbox.value = "1";
	remember_checkbox.checked = true;
	
	var remember_label = document.createElement('label');
	var remember_title = document.createElement('strong');
	remember_title.appendChild(document.createTextNode("Remember me on this computer"));
	
	remember_label.appendChild(remember_checkbox);
	remember_label.appendChild(remember_title);
	remember_label.appendChild(document.createElement('br'));
	remember_label.appendChild(document.createTextNode("For public computers please do not check this option"))
	
	var submit_button = getButton("orange","Save to Card", 100, function(){document.getElementById('pop_clip_with_card').submit();});
	if (this.model.inIframe)
	{
		submit_button = document.createElement("div")
		submit_button.style.margin = "5px 0px 0px 0px";
		submit_button.style.height = "25px";

		submit_button_img = document.createElement("img");
		submit_button_img.onclick = function(){document.getElementById('pop_login').submit();};
		submit_button_img.src = "/includes/templates/affiliate/" + this.model.iframeCssId + "/button_login.png";
		submit_button_img.alt = "Log In";
		submit_button_img.style.cursor = "pointer";
		submit_button.appendChild(submit_button_img);
	}	
	
	heading.appendChild(heading_text);
	cont.appendChild(heading);
	phone_holder.appendChild(phone_label);
	phone_holder.appendChild(document.createElement('br'));
	phone_holder.appendChild(phone_input);
	form.appendChild(phone_holder);

	var hidden_button_div = document.createElement("div");
	hidden_button_div.className = "hideSubmit";

	// have to put this hidden submit button in the form or hitting enter from the form will not work
	var hidden_button = document.createElement("input");
	hidden_button.style.visibility = "hidden";
	hidden_button.style.height = "0px";
	hidden_button.style.width = "0px";
	hidden_button.type="submit";

	form.appendChild(clear);
	form.appendChild(document.createElement('br'));
	form.appendChild(remember_label);
	form.appendChild(document.createElement('br'));
	form.appendChild(document.createElement('br'));
	form.appendChild(submit_button);
	hidden_button_div.appendChild(hidden_button);
	form.appendChild(hidden_button_div);
	
	cont.appendChild(form);
	
	this.loginWindowHandle = this.windowManager.createNewBlackOutWindow(cont, 400, 0, 0, true);
	this.windowManager.showWindow(this.loginWindowHandle);
}

ContentManager.prototype.showSearchWindow = function(postURL){
	if(this.searchWindowHandle){
		var searchWindow = document.getElementById("wh_"+this.searchWindowHandle);
		document.body.removeChild(searchWindow);
	} 
	
	var cont = document.createElement("div");
	cont.id = "pop_cl_form";
	cont.style.textAlign = "left";
	
	var title = document.createElement("div");
	title.className = "title2_blue";
	cont.appendChild(title);
		
	var titleIcon = document.createElement("img");
	titleIcon.src = "/includes/templates/master/images/mag_glass_20x20.png";
	titleIcon.align = "left";
	titleIcon.height = 20;
	titleIcon.width = 20;
	titleIcon.style.margin = "0px 5px 0px 0px";
	title.appendChild(titleIcon);
	
	title.appendChild(document.createTextNode("Search for offers:"));
	cont.appendChild(document.createElement("br"));

	var form = document.createElement("form");
	cont.appendChild(form);
	form.id = "cl_form";
	form.action = postURL;
	form.method = "post";
	
	var inputLabel = document.createElement("span");
	inputLabel.appendChild(document.createTextNode("\"90210\" or \"Beverly Hills, CA\""));
	
	cont.appendChild(document.createElement("br"));
	
	var input = document.createElement("input");
	input.type = "text";
	input.name = "cl_search";
	input.style.fontSize = "16px";
	input.size = "25";
	
	form.appendChild(inputLabel);
	form.appendChild(input);
	form.appendChild(document.createElement("br"));
	form.appendChild(document.createElement("br"));
	
	var button = getButton("blue","Search",70, function(){document.getElementById("cl_form").submit();});
	form.appendChild(button);
	
	this.searchWindowHandle = this.windowManager.createNewBlackOutWindow(cont, 300, 0,0, true);
	this.windowManager.showWindow(this.searchWindowHandle);
	
}	

ContentManager.prototype.showSMSWindow = function(eleId){
	
	var message_cont = document.createElement('div');
	message_cont.style.fontWeight = "bold";
	//message_cont.id = bubble_id;
	
	var message_text = document.createTextNode("Click below to receive a text message, that will help you get started with " + this.model.clientName + "");
	var go_img = document.createElement('img');
	go_img.style.height = "24px";
	go_img.src = "/includes/templates/master/images/button_send.jpg";
	go_img.onclick = function(){ 
		var req = getXMLHttpObject();
	 	var openString = "/includes/form_handlers/sendSMS.php";
	 	req.open("GET",openString,true);
	 	req.send(null);
		wm.hideWindow(this.parentNode.lastChild.value); 
		this.src = "/includes/templates/master/images/button_messagesent.jpg"; 
	};
	go_img.style.cursor = "pointer";
	//go_img.align = "right";
	
	message_cont.appendChild(message_text);
	message_cont.appendChild(document.createElement("br"));
	message_cont.appendChild(document.createElement("br"));
	message_cont.appendChild(go_img);
	
	this.smsWindowHandle = this.windowManager.createNewCallOutWindow(message_cont, 250, eleId, true, 2);
	var hiddenEle = document.createElement("input");
	hiddenEle.id = "wh";
	hiddenEle.name = "wh";
	hiddenEle.type = "hidden";
	hiddenEle.value = this.smsWindowHandle;
	message_cont.appendChild(hiddenEle);
	this.windowManager.showWindow(this.smsWindowHandle);
	
}

ContentManager.prototype.showVerifySMSWindow = function(eleId){
		
	var message_cont = document.createElement('div');
	message_cont.style.fontWeight = "bold";
	message_cont.style.textAlign = "left"
	message_cont.style.height = "80px"; 
	//message_cont.id = bubble_id;
	
	var message_text = document.createTextNode("Click below to re-send the text message with your verification code");
	message_cont.appendChild(message_text);
	message_cont.appendChild(document.createElement("br"));
	message_cont.appendChild(document.createElement("br"));
	
	var go_img = document.createElement('img');
	go_img.src = "/includes/templates/master/images/button_send.jpg";
	go_img.onclick = function(){
		var req = getXMLHttpObject();
	 	var openString = "/includes/form_handlers/reg_full.php?vsms=1";
	 	req.open("GET",openString,true);
	 	req.send(null);
		wm.hideWindow(this.parentNode.lastChild.value);
	}
	go_img.style.cursor = "pointer";
	go_img.style.height = "24px";
	//go_img.align = "right";
	
	message_cont.appendChild(go_img);
	
	
	this.verifyWindowHandle = this.windowManager.createNewCallOutWindow(message_cont, 250, eleId, true, 2);
	var hiddenEle = document.createElement("input");
	hiddenEle.id = "wh";
	hiddenEle.name = "wh";
	hiddenEle.type = "hidden";
	hiddenEle.value = this.verifyWindowHandle;
	message_cont.appendChild(hiddenEle);
	this.windowManager.showWindow(this.verifyWindowHandle);
}

ContentManager.prototype.showRememberMeWindow = function(eleId, formId){

	var container = document.createElement('div');
	//container.style.height = "70px";
	
	
	var text = document.createElement('span');
	var boldText = document.createElement('strong');
	boldText.style.fontWeight = "bold";
	boldText.appendChild(document.createTextNode("Would you like us to remember you on this computer?"));
	text.appendChild(boldText);
		
	var buttonHolder = document.createElement('div');
	buttonHolder.style.textAlign = "center";
	buttonHolder.style.margin = "5px 0px 0px 0px";
	buttonHolder.style.padding = "0px 50px";

	var callback = function(){
		var form = document.getElementById(formId+"");
		var rm = form.remember_me;
		rm.value = "1";
		form.submit();
	};
	var yesLink = getButton("blue", "Yes", 50, callback);
	yesLink.style.cssFloat = "left";
	yesLink.style.styleFloat = "left";
	
	var callback  = function(){ 
		var form = document.getElementById(formId+"");
		form.submit();
	};
	var noButton = getButton("blue", "No", 50, callback);
	noButton.style.cssFloat = "right";
	noButton.style.styleFloat = "right";

	buttonHolder.appendChild(yesLink);
	buttonHolder.appendChild(noButton);
	
	var clear = document.createElement("div");
	clear.className = "clear";
	
	buttonHolder.appendChild(clear);
	
	container.appendChild(text);
	container.appendChild(buttonHolder);
	
	this.rememberWindowHandle = this.windowManager.createNewCallOutWindow(container, 250, eleId, true, 3);
	this.windowManager.showWindow(this.rememberWindowHandle);
	
}

ContentManager.prototype.showRSSLinkWindow = function(eleId, loc, cats){

	var container = document.createElement('div');
	container.style.textAlign = "left";
	
	var icon_holder = document.createElement('div');
	icon_holder.style.cssFloat = "left";
	icon_holder.style.styleFloat = "left";
	icon_holder.style.width = "28px";
	icon_holder.style.margin = "5px";
		
	var rss_icon = document.createElement('img');
	rss_icon.src = "/includes/templates/master/images/feed-icon-28x28.png";

	icon_holder.appendChild(rss_icon);
	
	var instruction = document.createElement('div');
	instruction.style.fontWeight = "bold";
	instruction.style.fontSize = "14px";
	instruction.style.cssFloat = "left";
	instruction.style.styleFloat = "left";
	instruction.marginBottom = "10px";
	instruction.style.width = "240px";
	instruction.style.clear = "none";
	instruction.appendChild(document.createTextNode("Copy the address below into your favorite RSS reader"));
	
	var link = document.createElement('div');
	link.style.fontFamily = "courier new";
	link.style.color = "black";
	link.style.fontSize = "12px";
	link.style.padding = "5px";
	link.style.border = "1px dashed #aaaaaa";
	link.style.overflow = "auto";
	link.style.clear = "both";
	link.style.width = "250px";
	link.appendChild(document.createTextNode("http://www.cellfire.com/rss/cellfire_rss.php?location="+loc+"&categories="+cats));
	
	var clear = document.createElement('div');
	clear.className = "clear";
	
	container.appendChild(icon_holder);
	container.appendChild(instruction);
	container.appendChild(link);
	container.appendChild(clear);
	
	this.rssWindowHandle = this.windowManager.createNewCallOutWindow(container, 320, eleId, true, 3);
	this.windowManager.showWindow(this.rssWindowHandle);
}

ContentManager.prototype.showConfirmCardRemoveWindow = function(eleId, mid){
	
	var cont = document.createElement('div');
	cont.id = "confirm_card_body_"+mid;
	
	var message_div1 = document.createElement('div');
	message_div1.style.fontWeight = "bold";
	message_div1.style.fontSize = "14px";
	message_div1.appendChild(document.createTextNode("Are you sure you want to remove your Kroger Plus Card?"));
	
	var message_div2 = document.createElement('div');
	message_div2.style.fontSize = "12px";
	message_div2.appendChild(document.createTextNode("You will lose all offers that have been saved to this card"));
	
	var button = document.createElement('input');
	button.type="image";
	button.src="/includes/templates/master/images/button_removecard.jpg";
	button.onclick = function(){
		removeCard(mid+"");
	}
	
	cont.appendChild(message_div1);
	cont.appendChild(document.createElement("br"));
	cont.appendChild(message_div2);
	cont.appendChild(document.createElement("br"));
	cont.appendChild(button);
	
	this.cardRemoveWindowHandle = this.windowManager.createNewCallOutWindow(cont, 230, eleId, true, 3);
	this.windowManager.showWindow(this.cardRemoveWindowHandle);
}


ContentManager.prototype.showAnimatedAlertWindow = function(eleId, title, content, linkText, linkUrl, id, timeLength){
	var cont = document.createElement("div");
	cont.style.display = "inline-block";
	var info_icon = document.createElement("img");
	info_icon.src = "/images/howitworks/help.png";
	info_icon.align = "left";
	info_icon.style.margin = "5px";
	
	var title_div = document.createElement("div");
	title_div.style.fontSize = "12px";
	title_div.style.fontWeight = "bold";
	title_div.style.marginBottom = "10px";
	title_div.appendChild(document.createTextNode(title));
	
	var content_div = document.createElement("div");
	content_div.appendChild(document.createTextNode(content));
	
	var link_div = document.createElement("div");
	var link = document.createElement("a");
	link.href = linkUrl;
	link.appendChild(document.createTextNode(linkText));
	link_div.appendChild(link);
	
	//cont.appendChild(info_icon);
	cont.appendChild(title_div);
	cont.appendChild(content_div);
	cont.appendChild(link_div);
	
	this.messageWindowHandle = this.windowManager.createNewCallOutWindow(cont, 230, eleId, true, 1);
	this.windowManager.flyWindow(this.messageWindowHandle, 4);
	//setTimeout("hideAnimatedAlert('"+id+"')",timeLength);
}

ContentManager.prototype.showInfoPopWindow = function(eleId,title,text){

	var cont = document.createElement("div");
	cont.style.textAlign = "left";
	
	var info_icon = document.createElement("img");
	info_icon.src = "/includes/templates/master/images/help.png";
	info_icon.align = "absmiddle";
	info_icon.style.cssFloat = "left";
	info_icon.style.styleFloat = "left";
	info_icon.style.margin = "5px";
	
	var title_strong = document.createElement("div");
	title_strong.style.fontSize = "14px";
	title_strong.style.fontWeight = "bold";
	title_strong.style.width = "200px";
	title_strong.style.cssFloat = "right";
	title_strong.style.styleFloat = "right";
	title_strong.style.marginBottom = "10px";
	title_strong.appendChild(document.createTextNode(title));
	
	var clear_div = document.createElement("div");
	clear_div.className = "clear";
	
	var txtDiv = document.createElement("div");
	var re = /\{/g;
	text = text.replace(re,"<");
	var re = /\}/g;
	text = text.replace(re,">");
	txtDiv.innerHTML = text;
	
	cont.appendChild(info_icon);
	cont.appendChild(title_strong);
	cont.appendChild(clear_div);
	cont.appendChild(document.createElement("br"));
	cont.appendChild(txtDiv);
	
	this.infoWindowHandle = this.windowManager.createNewCallOutWindow(cont, 300, eleId, true, 1);
	this.windowManager.showWindow(this.infoWindowHandle);
}

ContentManager.prototype.showMerchantLocationsWindow = function(eleId, mid, zip){
	
	if(this.mercLocWindowHandler && this.mercLocWindowHandle[mid] && this.mercLocWindowHandle[mid][zip]){
		 this.windowManager.showWindow(this.mercLocWindowHandle);
		 return;
	}
	
	var cont = document.createElement("div");
	cont.style.textAlign = "left";
	cont.style.overflow="auto";
	cont.style.height="130px";
	cont.id = "merc_loc_pop_body_"+mid+"_"+zip;
	var working_div = document.createElement("div");
	working_div.style.width="100%";
	working_div.style.textAlign = "center";
	working_div.style.color = "black";
	working_div.style.fontWeight = "bold";
	working_div.style.fontSize = "14px";
	var working_img = document.createElement("img");
	working_img.src = "/includes/templates/master/images/loader.gif";
	var text = document.createTextNode("Finding locations");
	
	working_div.appendChild(working_img);
	working_div.appendChild(document.createElement("br"));
	working_div.appendChild(document.createElement("br"));
	working_div.appendChild(text);
	cont.appendChild(working_div);
	
	if(!this.mercLocWindowHandle) this.mercLocWindowHandle = new Array(); 
	if(!this.mercLocWindowHandle[mid]) this.mercLocWindowHandle[mid]
	this.mercLocWindowHandle[mid][zip] = this.windowManager.createNewCallOutWindow(cont, 200, document.getElementById(eleId), true, 4);
	this.windowManager.showWindow(this.mercLocWindowHandle);
	
	getLocations(mid, zip);
}	

ContentManager.prototype.showMessages = function(){
	this.showMessage(0);
}

ContentManager.prototype.showMessage = function(index){
	var message = "";
	if (this.model.user.messages && this.model.user.messages.length > index)
	{
		message = this.model.user.messages[index];
	}		
	// If the message doesn't exist exit
	if(message.length == 0){
		return false;
	}
	// All message functions should accept one arg: the callback function
	var messageFunc = new Function("callback", message);
	messageFunc(new Function("cm.showMessage("+(index+1)+");"));
}

ContentManager.prototype.showOKMessage = function(text,callback){
	var container = document.createElement("div");
	container.style.padding = "10px";
	container.style.fontSize = "14px";
	container.style.textAlign = "left";
	container.innerHTML = text;
	
	var center = document.createElement("div");
	center.style.textAlign = "center";
	center.style.margin = "10px 0px";
	container.appendChild(center);
	
	var closeButton;
	if (this.model.inIframe)
	{
		closeButton = document.createElement("div");
		closeButton.style.height = "25px";
		var closeButtonImg = document.createElement("img");
		closeButtonImg.onclick = function(){wm.closeOpenWindow(); callback();};
		closeButtonImg.src = "/includes/templates/affiliate/" + this.model.iframeCssId + "/button_ok.png";
		closeButtonImg.style.cursor = "pointer";
		closeButtonImg.alt = "OK";
		closeButton.appendChild(closeButtonImg);
	}	
	else
	{
		var buttonOnClick = function(){wm.closeOpenWindow(); callback();};
		closeButton = getButton("blue","OK", 50, buttonOnClick);
		closeButton.style.margin = "auto";
	}	
	center.appendChild(closeButton);
	var cDiv = document.createElement("div");
	cDiv.className = "clear";
	center.appendChild(cDiv);
	
	var winId = this.windowManager.createNewBlackOutWindow(container, 300, 0, 0, false);
	this.windowManager.showWindow(winId);
}