var customDDLs = new Array();
// CustomDDLActive set from Control
// If True, control rendered as a Custom DDL
// If False, control rendered as Select
var mdDir, mdValue, mdInc, mdListSelector, mdMax, mdSlideSelector, mdMaxSlide, mdIndicatorMove;
var currentOpenDDLID = null;
var childRegionDDLID = null;
var timedMove = null;
var invalidateBlur = false;
function setupDDL(flyoutID) {
    if ($("#" + flyoutID).data("ddlInit") == true) { return; }
    if ((typeof (flyoutID) != "undefined") && flyoutID != null && flyoutID != "") {
        $("#" + flyoutID).find("div[controltype='customdropdownlist'], select[controltype='customdropdownlist']").each(function(i, domelement) {
            var ddlID = $(domelement).attr("id");
            customDDLs[ddlID].Initialize();
        });
        $("#" + flyoutID).data("ddlInit", true);
    } else {
        for (d in customDDLs) {
            customDDLs[d].Initialize();
        }
    }
}
function blurDDL() {
    if (currentOpenDDLID != null && !invalidateBlur) {
        $("#" + customDDLs[currentOpenDDLID].ID + "_dropdown_dropclick").click();
    }
}
function resetDDL(flyoutID){
    if ((typeof (flyoutID) != "undefined") && flyoutID != null && flyoutID != "") {
        $("#" + flyoutID).find("div[controltype='customdropdownlist'], select[controltype='customdropdownlist']").each(function(i, domelement) {
            var ddlID = $(domelement).attr("id");
            var activateTag = $(domelement).attr("activatebutton");
            var oncloseresetTag = $(domelement).attr("onclosereset");
            if(typeof (globalRegionGuid) != "undefined" && typeof (parentRegionGuid) != "undefined" && typeof (childRegionGuid) != "undefined" && globalRegionGuid != parentRegionGuid){
                //reset for localized regionDDLs.
                if(ddlID.indexOf("Regions") > -1){
                    for (var i = 0; i < customDDLs[ddlID].Items.length; i++) {
                        if (customDDLs[ddlID].Items[i].Value == parentRegionGuid) {
                            customDDLs[ddlID].Select(i);
                        }
                    }
                }
                else if(ddlID.indexOf("Countries") > -1){
                    if(childRegionGuid != parentRegionGuid){
                        childRegionDDLID = ddlID;
                        //set timeout to delay reset for countryDDL because countryDDL needs to be repopulated after reset for regionDDL.
                        setTimeout("resetCountryDDL()", 50);
                    }
                    else{
                        customDDLs[ddlID].Select(-1);
                    }
                }
                else{
                    customDDLs[ddlID].Select(-1);
                }
                //reset serviceDDLs.
                if(parentRegionGuid == childRegionGuid && oncloseresetTag != null && oncloseresetTag == "true"){
                    customDDLs[ddlID].ClearItems();
                    customDDLs[ddlID].RenderItems();
                }
            }
            else{
                customDDLs[ddlID].Select(-1);
            }
            if(activateTag != null && activateTag != ""){
                var activateElement = $("#" + activateTag);
                if(activateElement != null)
                    activateElement.attr("disabled", "disabled");
            }
        });
    }
}
function resetCountryDDL(){
    if(typeof (childRegionGuid) != "undefined"){
        for (var i = 0; i < customDDLs[childRegionDDLID].Items.length; i++) {
            if (customDDLs[childRegionDDLID].Items[i].Value == childRegionGuid) {
                customDDLs[childRegionDDLID].Select(i);
            }
        }
    }
}
function scrollclick(item) {
    mdDir = $(item).attr("scroll");
    mdValue = $(item).parent("div").data("scrollValue");
    mdInc = $(item).parent("div").data("scrollIncrement");
    mdListSelector = $(item).parent("div").data("itemListSelector");
    mdMax = $(item).parent("div").data("maxScroll");
    mdSlideSelector = $(item).parent("div").data("scrollSlideSelector");
    mdMaxSlide = $(item).parent("div").data("scrollSlideHeight");
    mdIndicatorMove = false;
    if (isNaN(mdValue)) { mdValue = 0; }
    if (isNaN(mdInc)) { mdInc = 1; }
    if (mdDir == "up") {
        mdValue -= mdInc;
        if (mdValue < 0) { mdValue = 0; }
    }
    if (mdDir == "down") {
        mdValue += mdInc;
        if (mdValue > mdMax) { mdValue = mdMax; }
    }
    var success = scrollto(mdListSelector, mdValue);
    if (success) { $(item).parent("div").data("scrollValue", mdValue); }
    return false;
}
function scrollmousedown(item) {
    invalidateBlur = true;
    mdDir = $(item).attr("scroll");
    mdValue = $(item).parent("div").data("scrollValue");
    mdInc = $(item).parent("div").data("scrollIncrement");
    mdListSelector = $(item).parent("div").data("itemListSelector");
    mdMax = $(item).parent("div").data("maxScroll");
    mdSlideSelector = $(item).parent("div").data("scrollSlideSelector");
    mdMaxSlide = $(item).parent("div").data("scrollSlideHeight");
    mdIndicatorMove = true;
    timedMouseDown();
    return false;
}
function scrollmouseup(item) {
    if (timedMove != null) {
        clearTimeout(timedMove);
    }
    if (typeof (mdValue) != "undefined" && mdValue != null) { $(item).parent("div").data("scrollValue", mdValue); }
    mdIndicatorMove = false;
    //invalidateBlur = false;
    setTimeout("cleanupScrollMouseUp()", 50);
    return false;
}
function cleanupScrollMouseUp() {
    invalidateBlur = false;
}

function timedMouseDown() {
    if (isNaN(mdValue)) { mdValue = 0; }
    if (isNaN(mdInc)) { mdInc = 1; }
    if (mdDir == "up") {
        mdValue -= mdInc;
        if (mdValue < 0) { mdValue = 0; }
    }
    if (mdDir == "down") {
        mdValue += mdInc;
        if (mdValue > mdMax) { mdValue = mdMax; }
    }
    scrollto(mdListSelector, mdValue);
    if (timedMove != null) {
        clearTimeout(timedMove);
    }
    timedMove = setTimeout("timedMouseDown()", 140);
    return false;
}
function scrollto(itemListSelector, scrollpixel) {
    $(itemListSelector).scrollTop(scrollpixel);
    setIndicator();
    return true;
}
function setIndicator() {
    var ratio = (mdValue / mdMax);
    var slidePosition = Math.round(ratio * mdMaxSlide);
    $(mdSlideSelector).children("div.dropdown_scrollbar_indicator").css("top", slidePosition);
}
var IndicatorMoveYOffset = 0;
function scrollindicatordown(e, indicator) {
    var scrollBar = $(indicator).parents("div.dropdown_scrollbar");
    mdMaxSlide = $(scrollBar).data("scrollSlideHeight")
    mdValue = $(scrollBar).data("scrollValue");
    mdMax = $(scrollBar).data("maxScroll");
    mdListSelector = $(scrollBar).data("itemListSelector");
    IndicatorMoveYOffset = $(scrollBar).data("scrollSlideSelector").offset().top - $(indicator).offset().top + e.pageY;
    mdIndicatorMove = true;
}
function scrollpull(e, indicator) {
    var indicatorMoveTop = e.pageY - IndicatorMoveYOffset;
    var maxIndicatorMove = mdMaxSlide - indicatorMoveTop;
    if (mdIndicatorMove && (maxIndicatorMove > 0) && (indicatorMoveTop > 0)) {
        $(indicator).css("top", indicatorMoveTop);
        mdValue = ((indicatorMoveTop / mdMaxSlide) * mdMax);
        $(mdListSelector).scrollTop(mdValue);
    }
}
function IndicatorJump(e, clickitem) {
    var pageY = e.pageY;
    var scrollBar = $(clickitem).parents("div.dropdown_scrollbar");
    var scrollSlideTop = $(clickitem).offset().top;
    var scrollIndicator = $(clickitem).children("div.dropdown_scrollbar_indicator");
    var scrollIndicatorHeight = $(scrollIndicator).height();
    scrollIndicatorHeight = Math.round(scrollIndicatorHeight / 2);
    mdMaxSlide = $(scrollBar).data("scrollSlideHeight")
    mdValue = $(scrollBar).data("scrollValue");
    mdMax = $(scrollBar).data("maxScroll");
    var itemList = $(scrollBar).data("itemListSelector");
    var indicatorMoveTop = pageY - scrollSlideTop - scrollIndicatorHeight;
    if (pageY < (scrollSlideTop + scrollIndicatorHeight)) {
        indicatorMoveTop = pageY - scrollSlideTop;
    }
    var maxIndicatorMove = mdMaxSlide - indicatorMoveTop;
    if (indicatorMoveTop > mdMaxSlide) { indicatorMoveTop = mdMaxSlide; }
    mdValue = ((indicatorMoveTop / mdMaxSlide) * mdMax);
    $(scrollIndicator).css("top", indicatorMoveTop);
    $(itemList).scrollTop(mdValue);
    $(scrollBar).data("scrollValue", $(itemList).scrollTop());
    return false;
}
function IndicatorDrag(e, ui) {
    var scrollBar = $(ui.helper).parents("div.dropdown_scrollbar");
    mdMaxSlide = $(scrollBar).data("scrollSlideHeight")
    mdValue = $(scrollBar).data("scrollValue");
    mdMax = $(scrollBar).data("maxScroll");
    var itemList = $(scrollBar).data("itemListSelector");
    var indicatorMoveTop = ui.position.top;
    var maxIndicatorMove = mdMaxSlide - indicatorMoveTop;
    mdValue = ((indicatorMoveTop / mdMaxSlide) * mdMax);
    $(itemList).scrollTop(mdValue);
}
function scrollindicatorup(e, indicator) {
    if (mdIndicatorMove) {
        var scrollBar = $(indicator).parents("div.dropdown_scrollbar");
        var indicatorMoveTop = e.pageY - IndicatorMoveYOffset;
        var maxIndicatorMove = mdMaxSlide - indicatorMoveTop;
        mdValue = ((indicatorMoveTop / mdMaxSlide) * mdMax);
        $(scrollBar).data("scrollValue", mdValue);
        mdIndicatorMove = false;
    }
}
function toggleDDL(clickitem, e) {
    if (e != null) {
        var dropclickItem = clickitem;
        if ($(clickitem).is("div")) {
            dropclickItem = $(clickitem).parent("div.dropdown_wrapper").find("a.dropdown_dropclick");
        }
        var currentState = $(dropclickItem).data("toggleState");
        var ddl = $($(dropclickItem).data("ddlSelector"));
        var ddlID = $(ddl).attr("id");
        if (currentOpenDDLID != null && currentOpenDDLID != ddlID) {
            $("#" + currentOpenDDLID + "_dropdown_dropclick").click();
        }
        customDDLs[ddlID].ReDraw();
        if (currentState == "hidden") {
            currentState = "visible"; currentOpenDDLID = ddlID;
            var offsetParentID = $(customDDLs[ddlID].Selector).offsetParent().attr("id");
            if (offsetParentID == null || offsetParentID == "") {
                $("#bodymiddle").bind("click", function() { blurDDL(); });
            }
        }
        else {
            currentState = "hidden"; currentOpenDDLID = null;
            $("#bodymiddle").unbind("click", function() { blurDDL(); });
        }
        $(ddl).find("div.dropdown_itemlist, div.dropdown_scrollbar").css("visibility", currentState);
        $(dropclickItem).data("toggleState", currentState);
        e.stopImmediatePropagation();
    }
    return false;
}
function select(id, idx) {
    customDDLs[id].Select(idx);
    $(customDDLs[id].Selector).find("a.dropdown_dropclick").click();
    return false;
}
function CustomDropDown(id, items) {
    this.ID = id;
    this.ValueID = "#" + id.replace("_CDDL", "");
    this.Selector = "#" + id;
    if (typeof (items) != "undefined" && items != null) {
        this.Items = items;
    } else {
        this.Items = new Array();
    }
    this.IsInitialized = false;
    this.IsDrawn = false;
    this.CalculatedHeight = 150;
    this.DefaultText = null;
    
    this.Add = Add;
    this.RemoveAt = RemoveAt;
    this.Select = Select;
    this.UpdateSelected = UpdateSelected;
    this.SelectedIndex = SelectedIndex;
    this.SelectedValue = SelectedValue;
    this.SelectedText = SelectedText;
    this.ExecuteSelectedChange = ExecuteSelectedChange;
    this.ClearItems = ClearItems;
    this.ReDraw = ReDraw;
    this.ConvertNVToItems = ConvertNVToItems;
    this.ConvertNVToItemsWLabel = ConvertNVToItemsWLabel;
    this.RenderItems = RenderItems;
    this.Initialize = Initialize;
}
function ListItem(text, value, selected) {
    this.Text = text;
    this.Value = value;
    if (typeof (selected) != "undefined" && selected != null) {
        this.Selected = selected;
    } else {
        this.Selected = false;
    }
}
function ConvertNVToItems(nvArray) {
    this.ClearItems();
    for (var i = 0; i < nvArray.length; i++) {
        this.Add(nvArray[i].Name, nvArray[i].Value, false);
    }
}
function ConvertNVToItemsWLabel(nvArray) {
    var selectedValue = this.SelectedValue();
    var firstItem = null;
    if(this.Items.length > 0) {
        firstItem = this.Items[0];
    }
        
    this.ClearItems();
    if(firstItem != null) {
        this.Items[0] = firstItem;
    }
    for (var i = 0; i < nvArray.length; i++) {
        var selected = false;
        if(nvArray[i].Value == selectedValue){
            selected = true;
        }
        this.Add(nvArray[i].Name, nvArray[i].Value, selected);
    }
    
    if(this.SelectedIndex() == -1){
        this.Select(0);
    }
}
function ClearItems() {
    this.Items = new Array();
}
function Add(text, value, selected) {
    var length = this.Items.length;
    var isSelected = false;
    if (typeof (selected) != "undefined" && selected != null) {
        isSelected = selected;
    }
    this.Items[length] = new ListItem(text, value, isSelected);
}
function RemoveAt(index) {
    if (index < this.Items.length && index >= 0) {
        var tempArray = this.Items;
        var i = 0;
        var itemIndex = 0;
        this.Items = new Array();
        while (i < tempArray.length) {
            if (i != index) {
                this.Items[itemIndex] = tempArray[i];
                itemIndex++;
            }
            i++;
        }
    }
}
function UpdateSelected() {
    if (CustomDDLActive) {
        $(this.Selector).children("div.dropdown_selection").html(this.SelectedText());
        $(this.ValueID).val(this.SelectedValue());
        this.ExecuteSelectedChange();
    } else {
        // If CustomDDL is rendered in a Select instead, the OnChange event added in the Initialize Method
        // No UpdateSelected method required.
    }
}
function ExecuteSelectedChange() {
    if ($(this.Selector).attr("onselectedchange") != null && $(this.Selector).attr("onselectedchange") != "") {
        var runSelectedChange = false;
        if (this.SelectedValue() != "") { runSelectedChange = true; }
        else {
            if ($(this.Selector).attr("runselectedchangeonempty") != null && $(this.Selector).attr("runselectedchangeonempty") != "") {
                if ($(this.Selector).attr("runselectedchangeonempty").toLowerCase() == "true") {
                    runSelectedChange = true;
                }
            }
        }
        if (runSelectedChange) {
            var functionName = $(this.Selector).attr("onselectedchange") + "('" + this.ID + "')";
            eval(functionName);
        }
    }
}
function Select(itemindex) {
    if (CustomDDLActive) {
        var selIdx = this.SelectedIndex();
        if (selIdx >= 0) {
            this.Items[selIdx].Selected = false;
        }
        if (itemindex >= 0) {
            this.Items[itemindex].Selected = true;
        }
        this.UpdateSelected();
    } else {
        if (itemindex >= 0) {
            $(this.Selector + " option:eq(" + itemindex + ")").attr("selected", "true");
        } else {
            $(this.Selector + " option:eq(0)").attr("selected", "true");
        }
    }
}
function SelectedIndex() {
    if (CustomDDLActive) {
        for (var i = 0; i < this.Items.length; i++) {
            if (this.Items[i].Selected) {
                return i;
            }
        }
    } else {
        return $(this.Selector).SelectedIndex;
    }
    return -1;
}
function SelectedValue() {
    if (CustomDDLActive) {
        var selectedIndex = this.SelectedIndex();
        if (selectedIndex >= 0) {
            return this.Items[selectedIndex].Value;
        }
    } else {
        return $(this.Selector + " option:selected").attr("value");
    }
    return null;
}
function SelectedText() {
    if (CustomDDLActive) {
        var selectedIndex = this.SelectedIndex();
        if (selectedIndex >= 0) {
            return this.Items[selectedIndex].Text;
        } else {
            return this.DefaultText;
        }
    } else {
        return $(this.Selector + " option:selected").text();
    }
    return "";
}
function RenderItems() {
    if (CustomDDLActive) {
        this.IsInitialized = false;
        $(this.Selector).children("div.dropdown_itemlist, div.dropdown_scrollbar").css("visibility", "hidden");
        var ddItemList = $(this.Selector).find("div[dropdownitemlist='true']");
        $(ddItemList).empty();
        for (var i = 0; i < this.Items.length; i++) {
            var ddlItemString = "<div class=\"dropdown_item\" ";
            ddlItemString += "value=\"" + this.Items[i].Value + "\" ";
            ddlItemString += "selected=\"" + this.Items[i].Selected + "\" ";
            ddlItemString += "onclick=\"return select('" + this.ID + "', " + i + ");\"><a href=\"#\" ";
            var textString = this.Items[i].Text;
            if (textString == "") { textString = "&nbsp;"; }
            ddlItemString += "onclick=\"return select('" + this.ID + "', " + i + ");\">" + textString + "</a></div>";
            $(ddItemList).append(ddlItemString);
        }
        this.Initialize();
        if ($(this.Selector).attr("onrenderitems") != null && $(this.Selector).attr("onrenderitems") != "") {
            var functionName = $(this.Selector).attr("onrenderitems") + "('" + this.ID + "')";
            eval(functionName);
        }
    } else {
        $(this.Selector).empty();
        if (this.DefaultText != null && this.DefaultText != "") {
            $(this.Selector).append("<option value=\"\">" + this.DefaultText + "</option>");
        }
        for (var i = 0; i < this.Items.length; i++) {
            var ddlItemString = "<option ";
            ddlItemString += "value=\"" + this.Items[i].Value + "\" ";
            if (this.Items[i].Selected) {
                ddlItemString += "selected  ";
            }
            ddlItemString += ">";
            ddlItemString += this.Items[i].Text;
            ddlItemString += "</option>";
            $(this.Selector).append(ddlItemString);
        }
        // add another on change
        if ($(this.Selector).attr("onselectedchange") != null && $(this.Selector).attr("onselectedchange") != "") {
            var functionName = $(this.Selector).attr("onselectedchange") + "('" + this.ID + "')";
            eval(functionName);
        }
        if ($(this.Selector).attr("onrenderitems") != null && $(this.Selector).attr("onrenderitems") != "") {
            var functionName = $(this.Selector).attr("onrenderitems") + "('" + this.ID + "')";
            eval(functionName);
        }
    }
}
function Initialize() {
    if (!this.IsInitialized) {
        if (CustomDDLActive) {
            if (this.DefaultText == null) {
                if ($(this.Selector).attr("defaultvalue") != "") {
                    this.DefaultText = $(this.Selector).attr("defaultvalue");
                } else {
                    this.DefaultText = $("#" + this.ID + "_dropdown_selection").html();
                }
            }
            $("#" + this.ID + "_dropdown_dropclick, #" + this.ID + "_dropdown_selection, #" + this.ID + "_dropdown_downclick").unbind("click");
            $("#" + this.ID + "_dropdown_dropclick, #" + this.ID + "_dropdown_selection, #" + this.ID + "_dropdown_downclick").bind("click", function(event) { return toggleDDL(this, event); });
            $("#" + this.ID + "_dropdown_dropclick").data("toggleState", "hidden").data("ddlSelector", this.Selector);
            this.IsInitialized = true;
            var totalHeight = 0;
            var itemCount = 0;
            var dropdownitemMarginTotal = 0;
            $("#" + this.ID + "_dropdown_scrollbar_indicator").draggable({
                axis: 'y',
                containment: 'parent',
                scroll: false,
                drag: function(e, ui) { IndicatorDrag(e, ui); invalidateBlur = true; },
                stop: function(e, ui) {
                    var scrollBar = $(ui.helper).parents("div.dropdown_scrollbar");
                    var itemList = $(scrollBar).data("itemListSelector");
                    $(scrollBar).data("scrollValue", $(itemList).scrollTop());
                    invalidateBlur = false;
                }
            });
            this.IsDrawn = false;
            if (this.SelectedIndex() >= 0) {
                $("#" + this.ID + "_dropdown_selection").html(this.SelectedText());
                $(this.ValueID).val(this.SelectedValue());
                if ($(this.Selector).attr("onrenderitems") != null && $(this.Selector).attr("onrenderitems") != "") {
                    var functionName = $(this.Selector).attr("onrenderitems") + "('" + this.ID + "')";
                    eval(functionName);
                }
            } else {
                $("#" + this.ID + "_dropdown_selection").html(this.DefaultText);
                this.ExecuteSelectedChange();
            }
        } else {
            if (this.DefaultText == null) {
                if ($(this.Selector).attr("defaultvalue") != null && $(this.Selector).attr("defaultvalue") != "") {
                    this.DefaultText = $(this.Selector).attr("defaultvalue");
                } else {
                    this.DefaultText = $(this.Selector + " option:first").text();
                }
            }
            // Need to handle the functionality for the Select Box
            if ($(this.Selector).attr("onselectedchange") != null && $(this.Selector).attr("onselectedchange") != "") {
                $(this.Selector).bind("change", function() {
                    var ddlID = $(this).attr("id");
                    var functionName = $(customDDLs[ddlID].Selector).attr("onselectedchange") + "('" + customDDLs[ddlID].ID + "')";
                    eval(functionName);
                });
            }
            //$(this.Selector).attr("onselectedchange")    ADD ON CHANGE EVENT HANDLER
            //runselectedchangeonempty CASCADE EVENT

        }
    }
}
function ReDraw() {
    if (CustomDDLActive && ($("#" + this.ID + "_dropdown_dropclick").data("toggleState") == "hidden")) {
        var totalHeight = 0;
        var itemCount = 0;
        var dropdownitemMarginTotal = 0;
        var displayX = $(this.Selector).position().left;
        var displayY = $(this.Selector).position().top;
        var ddlSelectionHeight = $(this.Selector).outerHeight();
        displayY += ddlSelectionHeight;

        var dropdownItemListDisplayHeight = 150;
        
        var maxScroll = 0;
        if (this.IsDrawn) {
            maxScroll = $("#" + this.ID + "_dropdown_scrollbar").data("maxScroll");
        } else {
            $("#" + this.ID + "_dropdown_scrollbar").data("scrollValue", 0).data("maxScroll", 0);
        }
        if (maxScroll == 0) {
            this.IsDrawn = true;
            
            $("#" + this.ID + "_dropdown_scrollbar_slide").unbind("click");
            $("#" + this.ID + "_dropdown_scrollbar_slide").bind("click", function(e) { return IndicatorJump(e, this); });

            $("#" + this.ID + "_dropdown_itemlist").css("height", "auto");
            var estimatedHeight = $("#" + this.ID + "_dropdown_itemlist").height();

            $("#" + this.ID + "_dropdown_itemlist").css("height", dropdownItemListDisplayHeight + "px");
            totalHeight = estimatedHeight;
            this.CalculatedHeight = estimatedHeight;
            
            maxScroll = totalHeight - dropdownItemListDisplayHeight;
            if (maxScroll < 0) { maxScroll = 0; }
            else if (maxScroll > 0) {
                $("#" + this.ID + "_dropdown_scrollbar").show();
                $("#" + this.ID + "_dropdown_scrollbar").css("height", dropdownItemListDisplayHeight + "px");
            }
            if (maxScroll == 0) {
                $("#" + this.ID + "_dropdown_scrollbar").hide();
                var currentLeftBorder = $("#" + this.ID + "_dropdown_itemlist").css("border-left-width") + " ";
                currentLeftBorder += $("#" + this.ID + "_dropdown_itemlist").css("border-left-style") + " ";
                currentLeftBorder += $("#" + this.ID + "_dropdown_itemlist").css("border-left-color");
                $("#" + this.ID + "_dropdown_itemlist").css("height", "auto").css("border-right", currentLeftBorder); //used to be height=totalHeight, but it was leaving empty blank space at the bottom when a GIG or GPG name was too long and had to span two lines
            }
            var scrollSlideHeight = $("#" + this.ID + "_dropdown_scrollbar_slide").height();
            var scrollIndicatorHeight = $("#" + this.ID + "_dropdown_scrollbar_indicator").height();
            scrollSlideHeight = scrollSlideHeight - scrollIndicatorHeight;
            itemCount = $("#" + this.ID + "_dropdown_itemlist").children("div.dropdown_item").length;
            var scrollIncrement = Math.round((totalHeight / itemCount));
            $("#" + this.ID + "_dropdown_scrollbar").data("scrollIncrement", scrollIncrement).data("maxScroll", maxScroll).data("scrollSlideHeight", scrollSlideHeight).data("itemListSelector", "#" + this.ID + "_dropdown_itemlist").data("scrollSlideSelector", "#" + this.ID + "_dropdown_scrollbar_slide");
        }
        var ItemListHeight = dropdownItemListDisplayHeight;  //maxScroll + dropdownItemListDisplayHeight;
        if (maxScroll == 0) {
            ItemListHeight = this.CalculatedHeight;
        }
        var ItemListOffsetTop = $("#" + this.ID + "_dropdown_itemlist").offset().top;
        var currentBodyScrollTop = $(window).scrollTop();
        var currentBodyHeight = $(window).height();
        var windowBoundryValue = currentBodyHeight + currentBodyScrollTop;
        var itemListMaxBoundry = ItemListOffsetTop + ItemListHeight;
        if (windowBoundryValue < itemListMaxBoundry) {
            // shift item list to above
            var currentLeftBorder = $("#" + this.ID + "_dropdown_itemlist").css("border-left-width") + " ";
            currentLeftBorder += $("#" + this.ID + "_dropdown_itemlist").css("border-left-style") + " ";
            currentLeftBorder += $("#" + this.ID + "_dropdown_itemlist").css("border-left-color");
            $("#" + this.ID + "_dropdown_itemlist").css("border-top", currentLeftBorder);
            $("#" + this.ID + "_dropdown_itemlist").css("border-top", currentLeftBorder);
            displayY -= (ItemListHeight + ddlSelectionHeight);
        }
        else {
            $("#" + this.ID + "_dropdown_itemlist").css("border-top", "none");
            $("#" + this.ID + "_dropdown_itemlist").css("border-top", "none");
        }
        $("#" + this.ID + "_dropdown_itemlist").css("top", displayY).css("left", displayX);
        var scrollBarX = $(this.Selector).width();
        var scrollbarwidth = $("#" + this.ID + "_dropdown_scrollbar").width();
        scrollBarX -= scrollbarwidth;
        scrollBarX += (displayX+1);
        $("#" + this.ID + "_dropdown_scrollbar").css("top", displayY).css("left", scrollBarX);
        // Hide selected item from dropdrop
        var selectedIndex = this.SelectedIndex();
        $("#" + this.ID + "_dropdown_itemlist").children("div.dropdown_item").each(function(i, domele) {
            if (selectedIndex == i) {
                $(domele).css("display", "none");
            }
            else{
                $(domele).css("display", "block");
            }
        });
    }
}