//Default constructor and class declaration
var ImageRotatorClient = function()
{
    this.submitUrl = '/custom/channels/PageHeader/getImageFromChannel.asp';
    this.submitMethod = 'POST';
    this.useXhtmlMarkup = true;
    this.channelId = '';
    this.pageId = '';
    this.updateFieldId = '';
    this.updateType = 'html';
    this.channelImgField = 'Content';
    this.omitBrowserUpdate = false;
    this.imageData = '';
}

//get method for the imageData property
ImageRotatorClient.prototype.getImageData = function()
{
    return this.imageData;
}


//set method for the imageData property (established due to scope resolution issue with the AJAX event handler)
ImageRotatorClient.prototype.setImageData = function(newImageData)
{
    this.imageData = newImageData;
}

//the rotate image method - this should be used (in a timer using setInterval, most likely) once the object has been instantiated properly.
ImageRotatorClient.prototype.rotateImage = function()
{
    this.getImageFromChannel();
}

//this is actually the AJAX routine that sends the request for new images to show, called by rotateImage
ImageRotatorClient.prototype.getImageFromChannel = function(){
    var req = this.newXMLHttpRequest();
    var callbackHandler = this.getReadyStateHandler(req, this.updateImageOnBrowser, this, this.updateFieldId, this.updateType);
    var sendMsg = '';
    
    sendMsg = 'channelId=' + escape(this.channelId);
    sendMsg += '&useXhtmlMarkup=' + escape(this.useXhtmlMarkup);
    sendMsg += '&pageId=' + escape(this.pageId);
    sendMsg += '&imgType=' + escape(this.updateType);
    sendMsg += '&channelField=' + escape(this.channelImgField);
    sendMsg += '&imgData=' + escape(this.imageData);
    
    
    req.onreadystatechange = callbackHandler;
    //alert('submit url: ' + this.submitUrl + '\n' + 'method: ' + this.submitMethod + '\n' + 'message: ' + sendMsg);
    req.open( this.submitMethod, this.submitUrl, true );
    req.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );
    req.send( sendMsg );
}

// This is the callback function that gets called for the response from the server with the XML data
ImageRotatorClient.prototype.updateImageOnBrowser = function(e, classInstance, imgFieldId, imgType, imgData)
{
    classInstance.setImageData(imgData);
    
    if (!this.omitBrowserUpdate)
    {
        var imgField = document.getElementById(imgFieldId);
        
        if (imgField != null)
        {
            switch (imgType)
            {
                case 'html':
                    imgField.innerHTML = imgData;
                    break;
                case 'imgsrc':
                    imgField.src = imgData;
                    break;
                case 'cssbackground':
                default:
                    imgField.style.backgroundImage = 'url(\'' + imgData + '\')';
                    break;
            }
        }
    }
}

//returns an XMLHttpRequest object for AJAX requests
ImageRotatorClient.prototype.newXMLHttpRequest = function() {
    var xmlreq = false;
    if (window.XMLHttpRequest) {
        xmlreq = new XMLHttpRequest();
    } else if (window.ActiveXObject) {
            // Try ActiveX
        try {
            xmlreq = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e1) {
            // first method failed
            try {
                xmlreq = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e2) {
                 // both methods failed
            }
        }
    }
    return xmlreq;
}

//sets up and calls the event handler for when a response has been received
ImageRotatorClient.prototype.getReadyStateHandler = function(req, responseXmlHandler, classInstance, imgFieldId, imgType) {
    return function () {
        if (req.readyState == 4) {
            if (req.status == 200) {
                    responseXmlHandler(req, classInstance, imgFieldId, imgType, req.responseText);
            }
        }
    }
}