//==========================================
// create the request
//==========================================
function createRequest()
{
    var request = null; 
    try
    {
        request = new XMLHttpRequest();
    }
    catch(trymicrosoft)
    {
	try
	{
	    request = new ActiveXObject("Msxml2.XMLHTTP");
	}
	catch(othermicrosoft)
	{
	    try
	    {
	        request = new ActiveXObject("Microsoft.XMLHTTP");
	    }
	    catch(failed)
	    {
	        request = null;
	    }
	}
    }

    if (request == null)
    {
        alert ("Error creating request object!");
    }
    else
    {
	return request;
    }
}

var request = createRequest();



//==========================================
// update campaign list
//==========================================
function getCreative(campaignId) {
//alert("campaignId: " + campaignId);
    var url = "includes/getCreative.php?campaignId=" + campaignId;
    url = url + "&dummy=" + new Date().getTime();
//alert ("url: " + url);
    request.open("GET", url, true);
    request.onreadystatechange = showCreativePicture;
    request.send(null);
}

function showCreativePicture() {
	//alert (request.readyState);
  if (request.readyState == 4) {
	//alert (request.status);
    if (request.status == 200) {
	var xmlDoc = request.responseXML;

	var xmlArray = xmlDoc.getElementsByTagName("creative");
	firstPicture = xmlArray[0].childNodes[2].firstChild.nodeValue;
	var nRows = xmlArray.length;

	swapPicture(firstPicture);

	//===================
	// remove 
	//===================
	clearDiv("portfolioNums");

	//===========================
	// add
	//===========================
    	parentEl = document.getElementById("portfolioNums");
    	pNode = document.createElement("p");
	var j = 1;
	for (var i = 0; i < xmlArray.length; i++) {
	    creativeId = xmlArray[i].childNodes[0].firstChild.nodeValue;
	    campaignId = xmlArray[i].childNodes[1].firstChild.nodeValue;
	    picture = xmlArray[i].childNodes[2].firstChild.nodeValue;

    	    aNode = document.createElement("a");
	    aNode.setAttribute("href", "#");
	    aNode.setAttribute("name", picture);
	    //aNode.setAttribute("onClick", "javascript:swapPicture('" + picture + "'); return false");
	    aNode.onclick= function() { swapPicture(this.name); };
	    text4node = document.createTextNode(j);
	    barText = document.createTextNode(" | ");

    	    aNode.appendChild(text4node);
    	    pNode.appendChild(aNode);
	    if (i < nRows) {
    	    	pNode.appendChild(barText);
	    }

	    j++;
	}
    	parentEl.appendChild(pNode);
    }
  }
}


function swapPicture(picture) {
    //===================
    // remove
    //===================
    clearDiv("portfolioPic");

    //===================
    // add
    //===================
    parentEl = document.getElementById("portfolioPic");
    imgNode = document.createElement("img");
    imgNode.setAttribute("src", picture);
    imgNode.setAttribute("alt", "");
    parentEl.appendChild(imgNode);

}
//==========================================
// clears DIVs from their sub nodes
//==========================================
function clearDiv(divToClear) {
    var firstChild = "";
    var clearDiv = document.getElementById(divToClear);
    while (clearDiv.hasChildNodes()) {
        firstChild = clearDiv.firstChild;
        clearDiv.removeChild(firstChild);
    }
}