// JavaScript Document
// This Javascript involves the implemenating of a page with multiple popups
// without creating multiple overlay windows

// Each link to the popup should have a different id and should be added to the popup function

function popup(){
	
	document.getElementById('popup1').onclick = firstPopup;
	document.getElementById('popup2').onclick = secondPopup;
	document.getElementById('close-button').onclick = regularHide;
	
}

// Each pop up link will have its only function
function firstPopup(){
	// provide h2 and middle content as the parameter
	
	populateContent('<h2>Add an Authorized User: Requesting Additional Cards</h2><p><img src="/customer-service/account/images/pop_additionalcards_FPO.gif" title="Requesting Additional Cards" alt="Requesting Additional Cards" width="554" height="394" /></p>');
}
function secondPopup(){
	
	//document.getElementById('regular-popup2').style.display="block";
	// provide h2 and middle content as the parameter
	populateContent( '<h2>Add an Authorized User: Transactions Since Your Last Statement</h2><p><img src="/customer-service/account/images/pop_transactions_FPO.gif" title="Transactions Since Your Last Statement" alt="Transactions Since Your Last Statement" width="554" height="394" /></p>');
	
}
function regularHide(){
	document.getElementById('regular-popup').style.display="none";
	
}


function populateContent(content) {

	document.getElementById('regular-popup').style.display="block";
	document.getElementById('middle-content').innerHTML = content;
	
}

addLoadEvent(popup);