//MANUAL***************************************************************************************************************************************************************
// Controls manual slide show
// Parameters
var imagePath = "master/slide/";
var buttonPath = "master/graphics/";
// Image Max dimensions
var imgMaxWidthpx = 300; var imgMaxHeightpx = 225;

//**********************************************************************************************

// create array for anchors
var slide_ImageLink = new Array ("master/perl/getimage.pl?imageID=02034","master/perl/getimage.pl?imageID=02033","master/perl/getimage.pl?imageID=02009","master/perl/getimage.pl?imageID=02017","master/perl/getimage.pl?imageID=02026");
// create array for Titles
var MSlide_Title_arr = new Array ("Thrush's Nest","Bolton Abbey","Morning Stroll","Gosfield Wood","Wethersfield Snow");
// create array for alt text
var slide_alt_Text = new Array ("Thrush's Nest Watercolour 26x38cm ","Bolton Abbey Watercolour 46x34cm ","Morning Stroll Watercolour 38x28cm SOLD","Gosfield Wood  Watercolour 38x28cm","Wethersfield Snow Watercolour 43x28cm");
// create an array of image file names values in these arrays inserted by VB
var slide_images = new Array ("02034-thrush-nest.jpg","02033-bolton-abbey.jpg","02009-morning-stroll.jpg","02017-gosfield-wood.jpg","02026-wethersfield-snow.jpg");

// Only used to allocate cache memory for images
var slide_width = new Array ("160","300","297","300","300");
var slide_height = new Array ("225","198","225","225","207");

// preload all slide the images
var MANslide = new Array();
for( var i = 0; i < slide_images.length; i++ ){
        MANslide[i] = new Image(slide_width[i],slide_height[i]);
        MANslide[i].src = imagePath + slide_images[i];
        if (MANslide[i].naturalWidth > imgMaxWidthpx){
                
                alert("Image " + MSlide_Title_arr[i] + " is " + MANslide[i].naturalWidth + "px exceeds allowed " + imgMaxWidthpx + "px width");
        }
        if (MANslide[i].naturalHeight > imgMaxHeightpx){
                alert("Image " + MSlide_Title_arr[i] + " is " + MANslide[i].naturalHeight + "px exceeds allowed " + imgMaxHeightpx + "px height");
        }
}

var i2 = 0; // point to first image & initalise global vars
var slideNDX = i2 + 1; // Display image counter to User
var slideMAX = slide_images.length;
var captiontxtLen; // Remembers the original caption lenght so x of x can be removed at each image inc / dec;

// initalise first image
function initalise_manual_slide(){
        i2 = 0;
        slideNDX = i2 + 1;
        var oldtxt = document.getElementById("mslidetxt").firstChild.nodeValue;
        captiontxtLen = oldtxt.length;
        updateImage(i2);
        if(slideMAX > 1){
                create_fwd_buttons();
        }
}
//FIRST************************************************************************
function do_first(){
        if (i2 > 0 ){
                i2 = 0;
                slideNDX = i2 + 1;
                updateImage(i2);
                remove_back_buttons();
                create_fwd_buttons();
        }
}
//PREVIOUS************************************************************************
function do_previous(){
        if (i2 > 0 ){
                --i2;
                slideNDX = i2 + 1;
                updateImage(i2);
                if (i2 < slide_images.length){
                        create_fwd_buttons();
                }
                if (i2 == 0){
                        remove_back_buttons();
                }
       }
}
//LAST************************************************************************
function do_last(){
        if (i2 < (slide_images.length - 1)){
                i2 = slide_images.length  - 1;
                slideNDX = i2 + 1;
                updateImage(i2);
                remove_fwd_buttons();
                create_back_buttons();
        }
}
//NEXT****************************************************************************
function do_next(){
        if (i2 < (slide_images.length - 1)){
                ++i2;
                slideNDX = i2 + 1;
                updateImage(i2);
                if (i2 > 0){
                        create_back_buttons();
                }
                if (i2 == slide_images.length -1){
                        remove_fwd_buttons();
                }
        }
}

function updateImage(NDX){
        // Calculate vertical offset for image alignment.
        var ImageVoffest = ((imgMaxHeightpx / 2) - (MANslide[NDX].naturalHeight / 2));

        // Update Title
        document.getElementById("mstitle").firstChild.nodeValue = MSlide_Title_arr[NDX];
        // Initalise Image
        var oldimg = document.getElementById("mslidepic").firstChild;
        var newimg = document.createElement("img");
        newimg.src = MANslide[NDX].src;
        // Swap image
        document.getElementById("mslidepic").replaceChild(newimg,oldimg);   
        // Create active slide button text.
        var oldtxt = document.getElementById("mslidetxt").firstChild.nodeValue;
        // captiontxtLen value set globally onload
        var newtxt = oldtxt.substr(0,captiontxtLen) + " " + slideNDX + " of "  + slideMAX;
        document.getElementById("mslidetxt").firstChild.nodeValue = newtxt;
        // Create link to picture page.
        document.getElementById("msimagelink").setAttribute('href',slide_ImageLink[NDX]);
        // Create Title text & alt text
        document.getElementById("msimagelink").setAttribute('title',slide_alt_Text[NDX]);
        document.getElementById("msimagelink").setAttribute('alt',slide_alt_Text[NDX]);
}

function create_fwd_buttons(){
        createButton('msrightbuttons','btnNext','next.jpg','next-h.jpg','do_next()');
        createButton('msrightbuttons','btnLast','last.jpg','last-h.jpg','do_last()');
}
function create_back_buttons(){
        createButton('msleftbuttons','btnStart','first.jpg','first-h.jpg','do_first()');
        createButton('msleftbuttons','btnPrevious','previous.jpg','previous-h.jpg','do_previous()');        

}

function remove_fwd_buttons(){
        remove_element('btnNext');
        remove_element('btnLast');
}

function remove_back_buttons(){
        remove_element('btnPrevious');
        remove_element('btnStart');
}
function remove_element(ElementID){
        var elem = document.getElementById(ElementID)
        elem.parentNode.removeChild(elem);
}

function createButton(ParentID, ButtonID, ButtonIMG, ButtonClickIMG, MouseClick){
        // if button doesn't exists create it.
        if (document.getElementById(ButtonID) == null){    
                if (navigator.appName =="Microsoft Internet Explorer"){
                        // Is IE use innerHTML
                        EleContents = document.getElementById(ParentID).innerHTML;
                        var newButton = EleContents + '<img src="'+ buttonPath + ButtonIMG + '" id="' + ButtonID + '" onclick="' + MouseClick  + '" onmousedown=src="' + buttonPath + ButtonClickIMG  + '" onmouseup=src="' + buttonPath + ButtonIMG  + '" />';
                        document.getElementById(ParentID).innerHTML = newButton;
                }else{ // not IE use W3C
                        var nextBtn = document.createElement("img");
                        var ClickIMG = 'src="' + buttonPath + ButtonClickIMG + '"';
                        var UnClickIMG = 'src="' + buttonPath + ButtonIMG + '"';     
                        
                        nextBtn.src= buttonPath + ButtonIMG;
                        nextBtn.setAttribute("id",ButtonID);
                        nextBtn.setAttribute("onclick",MouseClick);
                        nextBtn.setAttribute("onmousedown",ClickIMG);
                        nextBtn.setAttribute("onmouseup",UnClickIMG);
                        // Create Button
                        document.getElementById(ParentID).appendChild(nextBtn);
                }
        }
}