function rotator(psdDivName, psdIntRepeatTime) {
    ///<summary>constructor</summary>
    ///<param name="psdIntRepeatTime" type="number">optional Millisecond to wait before showing next image</param>
    //Adjustable Settings
    this.intOffsetBottom = 40;
    this.intOffsetRight = -5;
    this.intButtonWidth = 18;
    this.OffSetButtonWidth = 3;
    this.intButtonHeight = 18;
    this.intRepeatTime = (psdIntRepeatTime? psdIntRepeatTime : 10000);
    this.ButtonColor = "White";
    this.ButtonColorSelected = "#48a942";
    this.ButtonBackGroundColor = "#333333";
    this.ButtonBackGroundColorSelected = "#00539b";
    this.ButtonBorder = "solid 1px black";
    this.opacity = .65;
    this.fontSize = "12px" ;

    //system settings, change at your own risk :)
    this.strTagName = psdDivName;
    this.arrImages = new Array();
    this.intCurrentImage = 0;
    this.intIntervalValue = 0;
    this.FadingImageInt = 0;
    this.FaddingDirectionStr = '';
    this.FaddingCompletedFunction;
    this.FaddingFilterDbl = 0.0;
    this.FaddingWait = 20;
    this.intOffsetButtons = this.intButtonWidth + this.OffSetButtonWidth;
    this.ErrorTimout = 500;
}; //end function

rotator.prototype.StartRotator = function() {
    ///<summary>Start of the rotator</summary>
    var self = this;
    try {
        var MainDiv = document.getElementById(this.strTagName);
        var MainLink = MainDiv.getElementsByTagName("a").item(0);
        var MainImage = MainLink.getElementsByTagName("img").item(0);
        var Imggrp = MainDiv.getElementsByTagName("div").item(0).getElementsByTagName("img");

        //set the div's height, so it doesn't rezise if the image is missing
        //MainDiv.style.height = MainImage.height + "px";
        //MainDiv.style.width = MainImage.width + "px";
        MainDiv.style.overflow = "hidden";
        
        var link = this.createButton();
        link.style.left = "" +
        (parseInt(MainDiv.style.width) + this.intOffsetRight - (this.intOffsetButtons * (Imggrp.length + 2))) + "px";
        link.onclick = function() {
            clearInterval(self.intIntervalValue);
            self.rotation(this.attributes.getNamedItem('ButtonValue').value);
            self.intIntervalValue = setInterval(function() {
                self.rotation();
            }, self.intRepeatTime);
        };
        link.style.top = "" + (parseInt(MainDiv.style.height) - this.intOffsetBottom) + "px";
        link.attributes.setNamedItem(this.createAttribute("ButtonValue", 1));
        link.appendChild(document.createTextNode(1));
        MainDiv.appendChild(link);
        this.arrImages[0] = {
                    'src': MainImage.attributes.getNamedItem("src").value
                , 'alt': (MainImage.attributes.getNamedItem("alt") != null ? MainImage.attributes.getNamedItem("alt").value : "")
                , 'title': (MainImage.attributes.getNamedItem("title") != null ? MainImage.attributes.getNamedItem("title").value : "")
                , 'href': MainLink.attributes.getNamedItem("href").value
                , 'onclick': (MainLink.onclick != null ? MainLink.onclick : {})
                , 'button': link
        }//end json Images

        for (var i = 0; i < Imggrp.length; i++) {
            var link = this.createButton();
            link.style.left = "" +
                (parseInt(MainDiv.style.width) + this.intOffsetRight - (this.intOffsetButtons * (Imggrp.length - i + 1))) + "px";
            link.onclick = function() {
                clearInterval(self.intIntervalValue);
                self.rotation(this.attributes.getNamedItem('ButtonValue').value);
                self.intIntervalValue = setInterval(function() {
                    self.rotation();
                }, self.intRepeatTime);
            };
                link.style.top = "" + (parseInt(MainDiv.style.height) - this.intOffsetBottom) + "px";
            link.attributes.setNamedItem(this.createAttribute("ButtonValue", (i + 2)));
            link.appendChild(document.createTextNode((i + 2)));
            MainDiv.appendChild(link);
            this.arrImages[(i + 1)] = {
                'src': Imggrp[i].attributes.getNamedItem("src").value
                , 'alt': (Imggrp[i].attributes.getNamedItem("alt") != null ? Imggrp[i].attributes.getNamedItem("alt").value : "")
                , 'title': (Imggrp[i].attributes.getNamedItem("title") != null ? Imggrp[i].attributes.getNamedItem("title").value : "")
                , 'href': Imggrp[i].attributes.getNamedItem("href").value
                , 'onclick': (Imggrp[i].onclick != null ? Imggrp[i].onclick : {}) 
                , 'button': link
            }//end json Images
        } //next i

        this.ToggleSelection(this.arrImages[0].button, true);
        this.intIntervalValue = setInterval(function() { self.rotation(); }, this.intRepeatTime);
    } catch (Error) {
        setTimeout(function() { self.StartRotator(); }, this.ErrorTimout)
    }
}            //end function


rotator.prototype.createAttribute = function(strAttrName, AttrValue) {
    ///<summary>Creates an Attribute</summary>
    ///<param name="strAttrName" type="string">Attribute name</param>
    ///<param name="AttrValue" type="object">the value to assisign to the new attribute</param>    
    var newAttr = document.createAttribute(strAttrName);
    newAttr.nodeValue = AttrValue;
    return newAttr
} //end function create Attribute

rotator.prototype.createButton = function() {
    ///<summary>Will create a switch to button</summary>
    var self = this;
    var ButtonItem = document.createElement('div');
    ButtonItem.onmouseover = function() {
        this.style.opacity = "1";
        this.style.filter = "alpha(opacity=" + 100 + ")";
    }
    ButtonItem.onmouseout = function() {
        if (!(this.selected)) {
            this.style.opacity = self.opacity;
            this.style.filter = "alpha(opacity=" + (self.opacity * 100) + ")";
        }//end if not selected
    }
    ButtonItem.style.overflow = "hidden";
    ButtonItem.style.opacity = this.opacity;
    ButtonItem.style.filter = "alpha(opacity=" + (this.opacity * 100) + ")";
    ButtonItem.style.border = this.ButtonBorder;
    ButtonItem.style.color = this.ButtonColor;
    ButtonItem.style.paddingTop = "1px";
    ButtonItem.style.width = "" + this.intButtonWidth + "px";
    ButtonItem.style.height = "" + this.intButtonHeight + "px";
    ButtonItem.style.cursor = "pointer";
    ButtonItem.style.verticalAlign = "bottom";
    ButtonItem.style.textAlign = "center";
    ButtonItem.style.backgroundColor = this.ButtonBackGroundColor;
    ButtonItem.style.position = "absolute";
    ButtonItem.style.fontSize = this.fontSize;
    ButtonItem.attributes.setNamedItem(this.createAttribute("selected", false));

    return ButtonItem
}      //end function

rotator.prototype.ToggleSelection = function(objButton, boolOn) {
    ///<summary>Will toggle a button, selected or not.</summary>
    ///<param name="objButton" type="object">passed button to workon</param>
    ///<param name="boolOn" type="boolean">bool, indicating if the button should be selected or not</param>
    if (boolOn) {
        objButton.style.color = this.ButtonColorSelected;
        objButton.style.filter = "alpha(opacity=" + 100 + ")";
        objButton.style.opacity = "1";
        objButton.style.backgroundColor = this.ButtonBackGroundColorSelected;
        objButton.selected = true;
    } else {
        objButton.style.color = this.ButtonColor;
        objButton.style.filter = "alpha(opacity=" + (this.opacity * 100) + ")";
        objButton.style.opacity = this.opacity;
        objButton.style.backgroundColor = this.ButtonBackGroundColor;
        objButton.selected = false;
    } //end if On
}  //end function

rotator.prototype.rotation = function(psdInt) {
    ///<summary>Will rotate the image to the next in line</summary>
    ///<param name="psdInt" type="number">optional the number that was pressed</param>
    var self = this;
    var intNext = (psdInt ? psdInt - 1 : this.intCurrentImage + 1);
    if (intNext >= this.arrImages.length) { intNext = 0; }
    this.ToggleSelection(this.arrImages[this.intCurrentImage].button, false);
    this.ToggleSelection(this.arrImages[intNext].button, true);
    this.FadingImageInt = intNext + 1;
    this.fade('out', function() {
        self.completeChange(self.FadingImageInt); self.FadingImageInt = null;
    });
    //this.completeChange();
    this.intCurrentImage = intNext;
}   //end function

rotator.prototype.fade = function(strDirection, CompletedFunction, dblFilter) {
    ///<summary>This will fade an object in and out, and perhaps run a script at the end of it.</summary>
    ///<param name="strDirection" type="string">'in' or 'out'</param>
    ///<param name="CompletedFunction" type="function">the function to call once we have completed the fade</param>
    ///<param name="intFilter" type="double">If provided, the posistion to start at in the fade</param>
    var self = this;
    var MainDiv = document.getElementById(this.strTagName);
    var MainLink = MainDiv.getElementsByTagName("a").item(0);
    var MainImage = MainLink.getElementsByTagName("img").item(0);
    var newFilter = 1.1;
    var newFilter = ((!(dblFilter == undefined)) ? dblFilter : (strDirection == 'in' ? 0.0 : 1.0));

    MainImage.style.opacity = newFilter;
    MainImage.style.filter = "alpha(opacity=" + (newFilter * 100) + ")";
    if (!((strDirection == 'in' && newFilter > .9) ||
        (!(strDirection == 'in') && newFilter < .1))) {

        this.FaddingDirectionStr = strDirection;
        this.FaddingCompletedFunction = CompletedFunction;
        this.FaddingFilterDbl = (strDirection == 'in' ? newFilter + .1 : newFilter - .1)
        setTimeout(function() {
            self.fade(self.FaddingDirectionStr,
            self.FaddingCompletedFunction, self.FaddingFilterDbl);
            }, this.FaddingWait);
    } else {
        this.FaddingDirectionStr = '';
        this.FaddingFilterDbl = 0.0;
        if ((!(CompletedFunction == NaN)) && (!(CompletedFunction == undefined)) && (!(CompletedFunction == ''))) {
            setTimeout(function() {
                if (!(self.FaddingCompletedFunction == undefined)) {
                    self.FaddingCompletedFunction();
                    self.FaddingCompletedFunction = undefined;
                }
            }, this.FaddingWait);
        } //End if completed function
    } //end if Fadding...
}  //end function

rotator.prototype.completeChange = function(psdVal) {
    ///<summary>Will rotate the image to the next in line</summary>
    ///<param name="psdInt" type="number">optional the number that was pressed</param>
    var MainDiv = document.getElementById(this.strTagName);
    var MainLink = MainDiv.getElementsByTagName("a").item(0);
    var MainImage = MainLink.getElementsByTagName("img").item(0);
    var intIt = psdVal - 1;
    MainLink.attributes.getNamedItem("href").value = this.arrImages[intIt].href;
    MainLink.onclick = this.arrImages[intIt].onclick;
    MainImage.attributes.getNamedItem("src").value = this.arrImages[intIt].src;
    MainImage.attributes.getNamedItem("alt").value = this.arrImages[intIt].alt;
    if (MainImage.attributes.getNamedItem("title") == null &&
        this.arrImages[intIt].title != "") {
        MainImage.attributes.setNamedItem(this.createAttribute("title", this.arrImages[intIt].title));
    } else if(this.arrImages[intIt].title != "") {
        MainImage.attributes.getNamedItem("title").value = this.arrImages[intIt].title;
    }
    //fad image in
    this.fade('in', '');
}    //end function