// Mark Brettin
//
// Using AJAX : image_slider_small.js 
//
//


var thumbList = Array();
var imageList = Array();
var myImages = Array();
var imagesPerSlider = 5;
var first = 0;
var last = imagesPerSlider -1;
var baseURL = "http://www.seaxp.com";


function getXmlHttpObject()
{
    var xmlHttp = null;

    // Firefox, Opera 8.0+, Safari
    try { xmlHttp = new XMLHttpRequest(); }
    catch(e)
    {
        // Internet Explorer
        try { xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); }
        catch(e)
        {
            try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }
            catch(e)
            {
                alert("Your browser does not support AJAX!");
                displaySlider();
                return(null);
            }
        }
    }

    return(xmlHttp);
}


function getImages_small()
{
    document.getElementById('slider').innerHTML = "<b>Image Slider Loading...</b>";

    var xmlHttp = getXmlHttpObject();

    if(xmlHttp)
    {
        xmlHttp.onreadystatechange = function()
	{
            var msg = "xmlHttp.readyState = ";

            switch(xmlHttp.readyState)
            {
                case 0: 
    	            msg = msg + xmlHttp.readyState + " : request is not initialized";
                    //alert(msg);
                    break;
                case 1:
	            msg = msg + xmlHttp.readyState + " : request has been set up";
                    //alert(msg);
                    break;
                case 2:
	            msg = msg + xmlHttp.readyState + " : request has been sent";
                    //alert(msg);
                    break;
                case 3:
	            msg = msg + xmlHttp.readyState + " : request is in process";
                    //alert(msg);
                    break;
                case 4:
	            msg = msg + xmlHttp.readyState + " : request is complete";
		    //alert(msg);
                    //alert("response: " + xmlHttp.responseText);
	            res = xmlHttp.responseText;
                    if(res != null)
                    {
                        var resArray = res.split("|");
                        for(var i = 0; i < resArray.length; i++)
                        {
                            if(((i % 2) == 0) || (i == 0)) 
                            {
                                if(resArray[i] != null && resArray[i].length > 0)
                                {
                                    imageList.push(resArray[i]); 
                                    //alert("imageList.push(\"" + resArray[i] + "\")"); 
				}
                            }
                            else
                            {
                                if(resArray[i] != null && resArray[i].length > 0)
                                {
                                    thumbList.push(resArray[i]); 
                                    //alert("thumbList.push(\"" + resArray[i] + "\")");
				}
			    }
			}
		    }

                    myImages = loadImages(thumbList);
	   	    displaySlider_small();
                    break;
                default:
                    msg = msg + xmlHttp.readyState + " : Unknown state";
                    //alert(msg);
                    break;
            }
	}

        // Open up the request.
        try
        {
            // When doing a cross doing cross-domain requests we need to set the below and also
            // in Firefox about:config set 'signed.applets.codebase_principal_support' to true.
            // 
            //netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserRead");
            //netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect"); 
            xmlHttp.open("GET", "/cgi-bin/getImages.php", true);
        }
        catch(e)
        {
            alert("Call to method XMLHttpRequest.open() failed.");
            return(null);
        }

        // Send the request off to the server.
        xmlHttp.send(null);
    }
}


function loadImages(the_imageList)
{
    var images = new Array;

    for(var i = 0; i < the_imageList.length; i++)
    { 
        images[i] = new Image();
        images[i].src = the_imageList[i];
    }

    return(images);
}


function displayNoSlider_small()
{
    var str  = "<table border=\"2\" cellpadding=\"4\" cellspacing=\"0\" ";
        str += "class=\"border\" bordercolor=\"#0000ff\" width=\"320\">";
        str += "<tr>";
        str += "<td align=\"center\">";
        str += "<br/>";
        str += "<a class=\"mylink\" href=\"departures.html\"><font class=\"myfont2\"><b>";
        str += "SCUBA Diving Daily Departures at 8:30am</b></font></a>";
        str += "<br/><br/>";
        str += "</td>";
        str += "</tr>";
        str += "</table>";

    return(str);
}


function displaySlider_small()
{
    var str;

    if(myImages != null && myImages.length > 0)
    {
        var imageURL;
        var j = 0;

        str  = "<table border=\"0\" width=\"320\" style=\"border-collapse: collapse;\" ";
        str += "cellpadding=\"0\" cellspacing=\"0\">";
        str += "<tr>";
        str += "<td valign=\"middle\" align=\"right\"><input type=\"image\" ";
        str += "src=\"images/arrow_left.jpg\" onMouseUp=\"slideBackward();\"></td>";
        str += "<td align=\"center\" width=\"320\">";

        for(var i = first; i <= last; i++)
        {
	    imageURL = baseURL + imageList[i];
            str += "<a id=\"anchor" + j + "\" href=\"" + imageURL + "\" target=\"_blank\">";
            str += "<img id=\"image" + j + "\" src=\"" + myImages[i].src + "\" border=\"3\" ";
            str += "width=\"45\" height=\"41\" ";
            str += "style=\"border-color: #000000;\" ";
            str += "onMouseOver=\"this.style.borderColor='#ffff00';\" ";
            str += "onMouseOut=\"this.style.borderColor='#000000';\"/></a>";
            j++;
        }

        str += "</td>";
        str += "<td valign=\"middle\" align=\"left\"><input type=\"image\" ";
        str += "src=\"images/arrow_right.jpg\" onMouseUp=\"slideForeward();\"></td>";
        str += "</tr>";
        str += "</table>";

        //alert("str = " + str);
        //str += "<br><br>first = " + first + "<br>last = " + last + "<br>total images = " + myImages.length;
    }
    else { str = displayNoSlider_small(); }

    document.getElementById("slider").innerHTML = str;
}


function updateSlider()
{
    if(myImages != null && myImages.length > 0)
    {
        var id;
        var j = 0;
        for(var i = first; i <= last; i++)
        {
            id = "anchor" + j;
            document.getElementById(id).href = baseURL + imageList[i];

            id = "image" + j;
            document.getElementById(id).src = myImages[i].src;
            j++;
        }
    }
}


function jumpForeward()
{
    if((first + imagesPerSlider) < myImages.length) first += imagesPerSlider;

    last = first + imagesPerSlider -1;

    if(last >= myImages.length)
    {
        last = myImages.length -1;
        first = last - imagesPerSlider +1;
    }

    updateSlider();
}


function jumpBackward()
{
    first -= imagesPerSlider;

    if(first < 0) first = 0;

    last = first + imagesPerSlider -1;

    updateSlider();
}

function slideForeward()
{
    if((first + 1) < myImages.length) first += 1;

    last = first + imagesPerSlider -1;

    if(last >= myImages.length)
    {
        last = myImages.length -1;
        first = last - imagesPerSlider +1;
    }

    updateSlider();
}


function slideBackward()
{
    first -= 1;

    if(first < 0) first = 0;

    last = first + imagesPerSlider -1;

    updateSlider();
}