var ui = ui || {};
ui.Select = function(domElement) {
    var self = this;
    var $ = jQuery;
    var enabled = true;
    var items = [];

    this.domElement = domElement;
    this.onSelect = null;
    this.value = null;

    this.setItems = function(newItems) {
        items = newItems;
    }

    this.setEnabled = function(state) {
        enabled = state;
        if (view) view.css("opacity", enabled ? 1 : 0.5);
    }

    this.setState = function(label, data) {
        if (view) view.find("p").html(label);
        self.value = data;
    }

    this.setStateByValue = function(data) {
        $.each(items, function() {
            if (this.value == data) {
                self.setState(this.label, data);
                return false;
            }
        });
    }


    /* INIT */

    var select = $(domElement);
    if (!select.length)
        return;

	   //Michaël onrécupére l'id pour le réinjecter plus tard
	   var selectId = 'ui-' + select.attr('id');
	
    select.wrap('<div class="uiSelect"><div></div></div>')
        .css({ display: "none" })
		.removeClass("uiSelect");
    var view = select.parent();
    view.parent().addClass(domElement.className);

    if (select.get(0).nodeName == "SELECT") {
        var current = select.find("option:selected").get(0);
        self.value = $(current).val();

        $(select.get(0)).find("option")
            .each(function() {
                if (!$(this).hasClass("hidden"))
                    items.push({ label: $(this).text(), value: $(this).val() });
            });
    }
    else {
        var current = select.find("li.Active").get(0);
        self.value = $(current).text();

        $(select.get(0)).find("li")
            .each(function() {
                items.push({ label: $(this).text(), value: $(this).text() });
            });
    }

    view.append("<p></p>")
        .find("p")
        .html($(current).text())	
		.attr('id', selectId);
		
    if (select.attr("disabled")) {
        enabled = false;
        view.css({ opacity: 0.5 });
    }
	

    /* INTERACTION */

    view.click(showList);
    var list = ui.Select.list;

    function showList() {
        if (!enabled) return;
        if (ui.Select.current == this)
            return;
        if (ui.Select.current)
            ui.Select.current.deselect();
        ui.Select.current = self;

        var target = $(this);
        target.addClass("uiSelect-active");

        list.css({ visibility: "hidden" });
        updateList();		
        list.appendTo(target.parent());
		
        var top = $(view).closest(".uiSelectTop");
        if (top.length) top.css("z-index", 999);

        var top = target.hasClass("uiSelect-up") ? -list.outerHeight() + 1 : target.height() + 3;
        list.css({ top: top, visibility: "visible"})
            .show();	
			
        $(document).unbind("mousedown", docMouseDown)
            .bind("mousedown", docMouseDown);
    }

    function docMouseDown(e) {
        var climb = $(e.target).closest(".uiSelect");
        if (climb.length == 0)
            hideList();
    }

    function hideList() {
        var top = $(view).closest(".uiSelectTop");
        if (top.length) top.css("z-index", "");

        $(document).unbind("mousedown", docMouseDown);
        view.removeClass("uiSelect-active");
        list.hide();
    }

    function updateList() {
        list.empty();
        $.each(items, function() {
            if (this.label == "...")
                $('<li class="hr"></li>')
                    .appendTo(list);
            else
                $('<li><a href="#' + this.value + '">' + this.label + '</a></li>')
                    .click(selectItem)
                    .appendTo(list);
        });
    }

    function selectItem(e) {
        var value = $(this).find("a").attr("href");
        value = value.substr(value.indexOf("#") + 1);
        var u = value.match(/^http:\/\/.*/);

        (!u) ? e.preventDefault() : $(this).find("a").attr("href", u);

        self.setState($(this).text(), value);

        if (self.onSelect)
            self.onSelect(value);

        self.deselect();
    }

    this.deselect = function() {
        ui.Select.current = null;
        hideList();
    }
}

ui.Select.list = jQuery('<ul class="uiSelect-list"></ul>');
ui.Select.current = null;


// automatically replace selects
jQuery(function() {
	jQuery("select.uiSelect").each(function() {
		new ui.Select(this);
	});
});

