﻿//create image slider
function createImageSlider(media) {
    //define structure in which image goes
    var currentWrapper;     //<div>     containing img and description
    var currentImage;       //<img>     slider image
    var currentDesc;        //<div>     containing the description
    var currentSpan;        //<span>    description
    
    //define structure for thumb nail
    var currentThumb;       //<img> thumbnail image  
    var currentThumbLi;     //<li>  list for the thumbnail
    var currentThumbA;      //<a>   link for the thumbnail
    
    //create the table housing the slideshow
    var slideTable = document.createElement('table');
        slideTable.setAttribute('cellpadding','0');
        slideTable.setAttribute('cellspacing','0');
        
        var slideRow = document.createElement('tr');
            slideTable.appendChild(slideRow);
            
            var slideCol = document.createElement('td');
                slideRow.appendChild(slideCol);
                
                var slideDiv = document.createElement('div');
                    slideDiv.setAttribute('id','slideDiv');
                    slideDiv.setAttribute('class','slideshow');
                    slideCol.appendChild(slideDiv);
            
        var thumbRow = document.createElement('tr');
            slideTable.appendChild(thumbRow);
            
            var thumbCol = document.createElement('td');
                thumbCol.setAttribute('align','left');
                thumbRow.appendChild(thumbCol);
                
                
                var thumbDiv = document.createElement('div');
                    thumbDiv.setAttribute('id','thumbDiv');
                    thumbDiv.setAttribute('class', 'navThumb');
                    thumbCol.appendChild(thumbDiv);
        
    
    //assign the images for this section
    for(i=0;i<media.length;i++){
        //define structure in which image goes
        currentWrapper = document.createElement('div');
        currentImage = document.createElement('img');
        currentDesc = document.createElement('div');
        currentSpan = document.createElement('span');
        currentThumb = document.createElement('img');
        currentThumbLi = document.createElement('li');
        currentThumbA = document.createElement('a');                
                            
        //thumbnail
        currentThumbA.appendChild(currentThumb);    //append image to anchor link
        currentThumbLi.appendChild(currentThumbA);  //append anchor link to list
        
        //assign the image to the slider
        if (media[i].getAttribute('TYPE') == 'VIDEO') { //xml request for a video
            currentWrapper.appendChild(createYoutubeVideo(media[i].getAttribute('WIDTH'), 
                                                        media[i].getAttribute('HEIGHT'),
                                                        media[i].getElementsByTagName('SOURCE')[0].childNodes[0].nodeValue));

            //assign the thumbnail
            currentThumb.setAttribute('src', media[i].getElementsByTagName('THUMBNAIL')[0].childNodes[0].nodeValue);
            currentThumb.setAttribute('alt', '');
            currentThumb.setAttribute('width', '60');
            currentThumb.setAttribute('height', '45');
            currentThumbA.setAttribute('href', '#');

            //append result to slide and thumb div
            slideDiv.appendChild(currentWrapper);
            thumbDiv.appendChild(currentThumbLi);
             
        } else if (media[i].getAttribute('TYPE') == 'MOV' && getQueryArg('sessionId') != undefined) {
            var movEmbed = document.createElement('embed');
            movEmbed.setAttribute('type', 'application/x-mplayer2');
            movEmbed.setAttribute('name', 'MediaPlayer');
            movEmbed.setAttribute('src', media[i].getElementsByTagName('SOURCE')[0].childNodes[0].nodeValue);
            movEmbed.setAttribute('width', media[i].getAttribute('WIDTH'));
            movEmbed.setAttribute('height', media[i].getAttribute('HEIGHT'));

            currentWrapper.appendChild(movEmbed);

            //assign the thumbnail
            currentThumb.setAttribute('src', media[i].getElementsByTagName('THUMBNAIL')[0].childNodes[0].nodeValue);
            currentThumb.setAttribute('alt', '');
            currentThumb.setAttribute('width', '60');
            currentThumb.setAttribute('height', '45');
            currentThumbA.setAttribute('href', '#');

            //append result to slide and thumb div
            slideDiv.appendChild(currentWrapper);
            thumbDiv.appendChild(currentThumbLi);

        } else if (media[i].getAttribute('TYPE') != 'MOV') { //an image was selected
            currentImage.setAttribute('src', media[i].getElementsByTagName('SOURCE')[0].childNodes[0].nodeValue);
            currentImage.setAttribute('alt', '');
            currentWrapper.appendChild(currentImage); //append image to wrapper

            //assign the description to the slider... if one is present
            if (media[i].getElementsByTagName('DESCRIPTION')[0].childNodes[0].nodeValue != 'null') {
                currentDesc.setAttribute('class', 'photo-meta-data');
                currentSpan.innerHTML = media[i].getElementsByTagName('DESCRIPTION')[0].childNodes[0].nodeValue;
                currentWrapper.appendChild(currentDesc);
                currentDesc.appendChild(currentSpan);
            } 

            //assign the thumbnail
            currentThumb.setAttribute('src', media[i].getElementsByTagName('THUMBNAIL')[0].childNodes[0].nodeValue);
            currentThumb.setAttribute('alt', '');
            currentThumb.setAttribute('width', '60');
            currentThumb.setAttribute('height', '45');
            currentThumbA.setAttribute('href', '#');

            //append result to slide and thumb div
            slideDiv.appendChild(currentWrapper);
            thumbDiv.appendChild(currentThumbLi); 
        }                                                                       
    }
    //return slideTable
    return slideTable;
}

//create image slider
function createAuthSlider(media) {
    //define structure in which image goes
    var currentWrapper;     //<div>     containing img and description
    var currentImage;       //<img>     slider image
    var currentDesc;        //<div>     containing the description
    var currentSpan;        //<span>    description

    //define structure for thumb nail
    var currentThumb;       //<img> thumbnail image  
    var currentThumbLi;     //<li>  list for the thumbnail
    var currentThumbA;      //<a>   link for the thumbnail

    //create the table housing the slideshow
    var slideTable = document.createElement('table');
    slideTable.setAttribute('cellpadding', '0');
    slideTable.setAttribute('cellspacing', '0');

    var slideRow = document.createElement('tr');
    slideTable.appendChild(slideRow);

    var slideCol = document.createElement('td');
    slideRow.appendChild(slideCol);

    var slideDiv = document.createElement('div');
    slideDiv.setAttribute('id', 'slideDiv');
    slideDiv.setAttribute('class', 'slideshow');
    slideCol.appendChild(slideDiv);

    var thumbRow = document.createElement('tr');
    slideTable.appendChild(thumbRow);

    var thumbCol = document.createElement('td');
    thumbCol.setAttribute('align', 'left');
    thumbRow.appendChild(thumbCol);


    var thumbDiv = document.createElement('div');
    thumbDiv.setAttribute('id', 'thumbDiv');
    thumbDiv.setAttribute('class', 'navThumb');
    thumbCol.appendChild(thumbDiv);

    var somethingHappened = false;

    //assign the images for this section
    for (i = 0; i < media.length; i++) {
        //define structure in which image goes
        currentWrapper = document.createElement('div');
        currentImage = document.createElement('img');
        currentDesc = document.createElement('div');
        currentSpan = document.createElement('span');
        currentThumb = document.createElement('img');
        currentThumbLi = document.createElement('li');
        currentThumbA = document.createElement('a');

        //thumbnail
        currentThumbA.appendChild(currentThumb);    //append image to anchor link
        currentThumbLi.appendChild(currentThumbA);  //append anchor link to list

        //assign the image to the slider
        if (media[i].getAttribute('TYPE') == 'MOV' && getQueryArg('sessionId') != undefined) {
            somethingHappened = true;
        
            var movEmbed = document.createElement('embed');
            movEmbed.setAttribute('type', 'application/x-mplayer2');
            movEmbed.setAttribute('name', 'MediaPlayer');
            movEmbed.setAttribute('src', media[i].getElementsByTagName('SOURCE')[0].childNodes[0].nodeValue);
            movEmbed.setAttribute('width', '380');
            movEmbed.setAttribute('height', '308');

            currentWrapper.appendChild(movEmbed);

            //assign the thumbnail
            currentThumb.setAttribute('src', media[i].getElementsByTagName('THUMBNAIL')[0].childNodes[0].nodeValue);
            currentThumb.setAttribute('alt', '');
            currentThumb.setAttribute('width', '60');
            currentThumb.setAttribute('height', '45');
            currentThumbA.setAttribute('href', '#');

            //append result to slide and thumb div
            slideDiv.appendChild(currentWrapper);
            thumbDiv.appendChild(currentThumbLi);
        }
    }

    if (!somethingHappened) {
        slideTable = createImageSlider(media);
    }

    //return slideTable
    return slideTable;
}

function createLinkSlider(media) {
    //define structure in which image goes
    var currentWrapper;     //<div>     containing img and description
    var currentImage;       //<img>     slider image
    var currentDesc;        //<div>     containing the description
    var currentSpan;        //<span>    description

    //define structure for thumb nail
    var currentThumb;       //<img> thumbnail image  
    var currentThumbLi;     //<li>  list for the thumbnail
    var currentThumbA;      //<a>   link for the thumbnail

    //create the table housing the slideshow
    var slideTable = document.createElement('table');
    slideTable.setAttribute('cellpadding', '0');
    slideTable.setAttribute('cellspacing', '0');

    var slideRow = document.createElement('tr');
    slideTable.appendChild(slideRow);

    var slideCol = document.createElement('td');
    slideRow.appendChild(slideCol);

    var slideDiv = document.createElement('div');
    slideDiv.setAttribute('id', 'slideDiv');
    slideDiv.setAttribute('class', 'slideshow');
    slideCol.appendChild(slideDiv);

    var thumbRow = document.createElement('tr');
    slideTable.appendChild(thumbRow);

    var thumbCol = document.createElement('td');
    thumbCol.setAttribute('align', 'left');
    thumbRow.appendChild(thumbCol);


    var thumbDiv = document.createElement('div');
    thumbDiv.setAttribute('id', 'thumbDiv');
    thumbDiv.setAttribute('class', 'navThumb');
    thumbCol.appendChild(thumbDiv);


    //assign the images for this section
    for (i = 0; i < media.length; i++) {
        //define structure in which image goes
        currentWrapper = document.createElement('a');
        currentImage = document.createElement('img');
        currentDesc = document.createElement('div');
        currentSpan = document.createElement('span');
        currentThumb = document.createElement('img');
        currentThumbLi = document.createElement('li');
        currentThumbA = document.createElement('a');

        //thumbnail
        currentThumbA.appendChild(currentThumb);    //append image to anchor link
        currentThumbLi.appendChild(currentThumbA);  //append anchor link to list

        //assign the image to the slider
        if (media[i].getAttribute('TYPE') == 'VIDEO') { //xml request for a video
            currentWrapper.appendChild(createYoutubeVideo(media[i].getAttribute('WIDTH'),
                                                        media[i].getAttribute('HEIGHT'),
                                                        media[i].getElementsByTagName('SOURCE')[0].childNodes[0].nodeValue));
        } else { //an image was selected
            currentImage.setAttribute('src', media[i].getElementsByTagName('SOURCE')[0].childNodes[0].nodeValue);
            currentImage.setAttribute('alt', '');
            currentWrapper.appendChild(currentImage); //append image to wrapper
        }

        //assign the description to the slider... if one is present
        if (media[i].getElementsByTagName('DESCRIPTION')[0].childNodes[0].nodeValue != 'null') {
            currentDesc.setAttribute('class', 'photo-meta-data');
            currentSpan.innerHTML = media[i].getElementsByTagName('DESCRIPTION')[0].childNodes[0].nodeValue;
            currentWrapper.appendChild(currentDesc);
            currentDesc.appendChild(currentSpan);
        }

        //assign link to image slider
        currentWrapper.setAttribute('href', media[i].getElementsByTagName('LINK')[0].childNodes[0].nodeValue + '?' + getQueryString(document.URL));

        //assign the thumbnail
        currentThumb.setAttribute('src', media[i].getElementsByTagName('THUMBNAIL')[0].childNodes[0].nodeValue);
        currentThumb.setAttribute('alt', '');
        currentThumb.setAttribute('width', '60');
        currentThumb.setAttribute('height', '45');
        currentThumbA.setAttribute('href', '#');

        //append result to slide and thumb div
        slideDiv.appendChild(currentWrapper);
        thumbDiv.appendChild(currentThumbLi);
    }

    //return slideTable
    return slideTable;
}

function createSliderOnly(image){
    //create slider div
    var slideDiv = document.createElement('div');
    
    //define structure in which image goes
    var currentWrapper;     //<div>     containing img and description
    var currentImage;       //<img>     slider image
    var currentDesc;        //<div>     containing the description
    var currentSpan;        //<span>    description
       
    //assign the images for this section
    for(y=0;y<image.length;y++){
        //define structure in which image goes
        currentWrapper = document.createElement("div");
        currentImage = document.createElement("img");
        currentDesc = document.createElement("div");
        currentSpan = document.createElement("span");

        //slider                    
        currentWrapper.appendChild(currentImage); //append image to wrapper
                            
        //assign the image to the slider
        currentImage.setAttribute("src", image[y].getElementsByTagName("IMAGE_SOURCE")[0].childNodes[0].nodeValue);
        currentImage.setAttribute("alt", "");
                                              
        //assign the description to the slider... if one is present
        if(image[y].getElementsByTagName("IMAGE_DESCRIPTION")[0].childNodes[0].nodeValue != 'null'){
            currentDesc.setAttribute("class","photo-meta-data");
            currentSpan.innerHTML = image[y].getElementsByTagName("IMAGE_DESCRIPTION")[0].childNodes[0].nodeValue;
            currentWrapper.appendChild(currentDesc);
            currentDesc.appendChild(currentSpan);
        }
        
        //append the imageSlider and thumbnail to document
        slideDiv.appendChild(currentWrapper);                                                                      
    }
    
    return slideDiv;
}

function createThumbOnly(image){
    //create thumbDiv
    var thumbDiv = document.createElement('div');
    
    //define structure for thumb nail
    var currentThumb;       //<img> thumbnail image  
    var currentThumbLi;     //<li>  list for the thumbnail
    var currentThumbA;      //<a>   link for the thumbnail

    //assign the images for this section
    for(y=0;y<image.length;y++){
        //define structure in which thumb goes
        currentThumb = document.createElement("img");
        currentThumbLi = document.createElement("li");
        currentThumbA = document.createElement("a");
                          
        //thumbnail
        currentThumbA.appendChild(currentThumb);    //append image to anchor link
        currentThumbLi.appendChild(currentThumbA);  //append anchor link to list
                                              
        //assign the thumbnail
        currentThumb.setAttribute("src",image[y].getElementsByTagName("IMAGE_THUMB")[0].childNodes[0].nodeValue);
        currentThumb.setAttribute("alt","");
        currentThumb.setAttribute("width","60");
        currentThumb.setAttribute("height", "45");
        currentThumbA.setAttribute("href","#");
        
        //append the imageSlider and thumbnail to document
        thumbDiv.appendChild(currentThumbLi);                                                                         
    }
 
    return thumbDiv;
}
