﻿(function ($) {
    $.fn.jdropdown = function () {
        var elements = $(this);
        if (elements.length != 1) { elements.each(function (index, el) { $(el).jdropdown(); }); return }

        if (elements.length != 1) Error("Only a singular element must reach this line.");
        var element = elements;

        // Create wrapper
        element.wrap("<span class='jdropdown-container' />");

        // Fade element to 0
        element.fadeTo(1, 0);

        // prepare internal elements
        var container = element.closest(".jdropdown-container");
        var customizer = $("<span class='jdropdown-customizer' />");
        var textbox = $("<div class='jdropdown-text'/>");
        var image = $("<div class='jdropdown-image'/>");

        // Organise internal elements
        customizer.appendTo(container);
        textbox.appendTo(customizer);
        image.appendTo(customizer);

        // Adjust width and height
        customizer.width(element.width());
        customizer.height(element.height());

        // Adjust initial value
        jdropdown_element_change(element);

        // Bind change event to adjust value
        element.change(jdropdown_element_change_handler);
    };
})(jQuery);

function jdropdown_element_change(element) {
    var element = $(element);
    var text = element.closest(".jdropdown-container").find(".jdropdown-text");
    text.html(element.find("option:selected").html());
}
function jdropdown_element_change_handler() {
    jdropdown_element_change(this);
}
