/*
        process of events:
            1: html call to renderSlideShow
            2: SlideShow.render via window load listener paused 500ms

            This is needed such that we only verify if the slideshow_image list is valid once, not per render call.

*/

/*                                                                          */
/*                               Globals                                    */
/*                                                                          */

/* assumes the list is invalid until otherwise determined upon window load */
var _slideshow_isValid = true;

var _panel_cache = [];
/*                                                                          */
/*                          Window Load Events                              */
/*                                                                          */
listen(window, "load", function() {
    // verify the content exists
    if ( slideshow_images.length == 0 ) return;
    for ( var i = 0; i < slideshow_images.length; i++ ) {
        if (slideshow_images[i].length <= 1 || (slideshow_images[i][0].id == undefined || slideshow_images[i][0].id == "") ) return;
    }

    _slideshow_isValid = true;

    _panel_cache[0] = new Image;
    _panel_cache[0].src = "images/slideshow/next.gif";
    _panel_cache[1] = new Image;
    _panel_cache[1].src = "images/slideshow/next_over.gif";
    _panel_cache[2] = new Image;
    _panel_cache[2].src = "images/slideshow/prev.gif";
    _panel_cache[3] = new Image;
    _panel_cache[3].src = "images/slideshow/prev_over.gif";


});
/*                                                                          */
/*                                Main                                      */
/*                                                                          */
Object.prototype.update = function(n){
    for(k in n){
        if(this[k])
            this["_" + k] = this[k];
        this[k] = n[k];
    }
}

var _slideshow_stack = new Array();
var SlideShow = Class.create();
SlideShow.prototype.update({
    /*
     * options is passed as { id: "someID" }
     *      id: coresponds to the id within the slideshow_image list
     */
    initialize: function(options) {

        if ( options[0].basepath.charAt(options[0].basepath.length - 1) != "/" ) options[0].basepath += "/";

        //__________________________________code here for looping to ensure all img entried do not have a / infront-------------------------------

        this.options = options;

        var defaultsize = this.options[0].defaultsize.toLowerCase();
        var x = defaultsize.indexOf("x");
        this._width = defaultsize.substring(0, x);
        this._height = defaultsize.substring(x + 1, defaultsize.length);

        var container = document.getElementById(options[0].id);
		container.className = options[0].css;
        this._container = container;

        this._imgcache = [];
        this._imgindex = 0;
    },

    render: function(){
        if ( _slideshow_isValid ) {
            var id = this.options[0].id;
            var rand = this.options[0].random; var dindex = this.options[0].defaultindex;
            var path = null; var subtext = null;

            // cache the images
            for ( var i = 0; i < this.options.length - 1; i++ ) {
                this._imgcache[i] = new Image;
                this._imgcache[i].src = this.options[0].basepath + this.options[i + 1].path;
                this._imgcache[i].subtext = this.options[i + 1].subtext;
            }
			
			// if a random image is specified...
            if ( this.options[0].random ) {
                this._imgindex = 0;
                path = this._imgcache[this._imgindex].src;
				subtext = this._imgcache[this._imgindex].subtext;

            // if a default image is specified...
            } else if ( dindex != "" && dindex != undefined ) {
				path = this._imgcache[dindex].src;
				subtext = this._imgcache[dindex].subtext;
                this._imgindex = dindex;
            }

			// create the image div
            var div_img = document.createElement("div");
            div_img.className = "image-border-padded";
			div_img.style.width = this._width + "px";
			div_img.style.height = this._height + "px";

            // create the image
            var img = document.createElement("img");
            img.setAttribute("style", "cursor: pointer;");
            img.width = this._width;
            img.height = this._height;
            img.src = path;
            img.rootElement = this;
			
			div_img.appendChild(img);
            listen(img, "click", this.next);
            this._img = img;

            this._container.appendChild(div_img);


			var div_clear = document.createElement("div");
			div_clear.className = "clear";
			this._container.appendChild(div_clear);



            var div_c = document.createElement("div");
			div_c.className = this.options[0].css;

			var p_count = document.createElement("p");
			p_count.innerHTML = "Image " + (parseInt(this._imgindex) + 1) + " of " + this._imgcache.length;
			div_c.appendChild(p_count);
			this._pcount = p_count;

			
			var ul = document.createElement("ul");
			ul.style.display = "inline";
			
			var li_prev = document.createElement("li");
			li_prev.className = "slideshow-btn-prev";
			li_prev.rootElement = this;
			ul.appendChild(li_prev);
			listen(li_prev, "click", this.previous);
			
			var li_next = document.createElement("li");
			li_next.className = "slideshow-btn-next";
			li_next.rootElement = this;
			ul.appendChild(li_next);
			listen(li_next, "click", this.next);
			
			div_c.appendChild(ul);
            
			this._container.appendChild(div_c);
			
			this._container.appendChild(div_clear);
			
			var p_subtext = document.createElement("p");
			p_subtext.style.letterSpacing = "0em";
			p_subtext.style.padding = "18px 20px 0px 15px";
			p_subtext.innerHTML = subtext;
			this._psubtext = p_subtext;
			
			this._container.appendChild(p_subtext);


/*





            // establish the prev button
            var element = document.createElement("div");
            element.setAttribute("style", "width: 100px;");
            element.setAttribute("class", this.options[0].btn_prev_css);
            element.rootElement = this;
            elementcontainer.appendChild(element);
            listen(element, "click", this.previous);

            // establish the next button
            var element = document.createElement("div");
            element.setAttribute("class", this.options[0].btn_next_css);
            element.rootElement = this;
            elementcontainer.appendChild(element);
            listen(element, "click", this.next);

            // establish the subtext if provided
            var element = document.createElement("p");
//            element.setAttribute("style", "display: inline;");
            element.innerHTML = subtext;
            elementcontainer.appendChild(element);
            this._p = element;

            this._container.appendChild(elementcontainer);

            */
        }
    },

    previous: function (e) {
        var source = e.target ? e.target : e.srcElement; //determine the target
        var root = source.rootElement;

        var length = root._imgcache.length;
        // condition beginning => goto: end
        if ( root._imgindex == 0 ) {
            root._imgindex = length - 1; 
        } else {
            root._imgindex-- ;
        }

        root._img.src = root._imgcache[root._imgindex].src;
		root._pcount.innerHTML = "Image " + (parseInt(root._imgindex) + 1) + " of " + root._imgcache.length;
        root._psubtext.innerHTML = root._imgcache[root._imgindex].subtext;
    },

    next: function (e) {
        var source = e.target ? e.target : e.srcElement; //determine the target
        var root = source.rootElement;

        var length = root._imgcache.length;
        // condition end -> beginning
        if ( root._imgindex >= ( length - 1 ) ) {
            root._imgindex = 0;
        } else {
            root._imgindex++ ;
        }

        root._img.src = root._imgcache[root._imgindex].src;
		root._pcount.innerHTML = "Image " + (parseInt(root._imgindex) + 1) +  " of " + root._imgcache.length;
        root._psubtext.innerHTML = root._imgcache[root._imgindex].subtext;
    }
});

function renderSlideShow(options){
    // verify there is an id
    var imageList = getImageList(options.id);
    if ( options.id != undefined && options.id != "" && imageList != null) {
        document.write( "<div id=" + options.id + "></div>" );
        
        var ss = new SlideShow( imageList );
        var id = _slideshow_stack.length;
        _slideshow_stack.push( ss );

        listen(window, "load", function () {
            setTimeout("_slideshow_stack[" + id + "].render()", 500);
            
        });
    }    
}

// this function will obtain an image list with id: someID
function getImageList(id) {
    for ( var i = 0; i < slideshow_images.length; i++ ) {
        if ( slideshow_images[i][0].id == id ) return( slideshow_images[i] );
    }

    return( null );
}

function renderHTML(html) {

/*
    Regexp regex = new Regexp();
//    Regexp(@"</?\w+((\s+\w+(\s*=\s*(?:"(.|\n)*?"|'(.|\n)*?'|[^'">\s]+))?)+\s*|\s*)/?>);
    Regex(@"</?\w+(((\s|\n|,)+\w+((\s|\n|,)*=(\s|\n|,)*(?:"".*?""|'.*?'|[^'"">\s]+))?)+(\s|\n|,)*|(\s|\n|,)*)/?>", RegexOptions.Singleline); 

    nt lastIndex = 0;
    StringBuilder result = new StringBuilder();
    MatchCollection matches = regex.Matches(html);
    foreach(Match match in matches)
    {
    result.Append(html.Substring(lastIndex, match.Index - lastIndex));
    result.Append(match.Value.Replace(",", ""));
    lastIndex = match.Index + match.Value.Length;
    }
    result.Append(html.Substring(lastIndex));
    alert( result.ToString() );
    }
*/

/*
    var test = [];
    var ret = "";
    for ( var i = 0; i < test.lenght; i++ ) {
        ret += test[i] + "\n";
    }
*/
}

function removeChildren(element) {
    while (element.firstChild) {
      element.removeChild(element.firstChild);
    }
}