/*
调用方法
$("#").monthpicker();
*/
(function ($) {
    function init(target) {
        var table = $('<table class="monthpicker" style="display: none;"></table>').insertAfter(target);
        var thead = $('<thead><tr><th><div class="prev">&nbsp;&nbsp;</div></th><th  class="year"></th><th><div class="next">&nbsp;&nbsp;</div></th></tr></thead>').appendTo(table);
        var tbody = $('<tbody><tr><td><div>1</div></td><td><div>2</div></td><td><div> 3</div></td></tr><tr><td><div>4</div></td> <td><div>5</div></td><td><div>6</div></td></tr><tr><td><div>7</div></td><td><div>8</div></td><td><div>9</div></td></tr><tr><td><div>10</div></td><td><div>11</div></td><td><div>12</div></td></tr></tbody>').appendTo(table);
        thead.find(".year").text(new Date().getFullYear());
        function show() {
            $(document).trigger("mousedown");
            table.css({
                display: "block",
                left: $(target).offset().left,
                top: $(target).offset().top + $(target).outerHeight()
            });
            table.bind("mousedown.monthpicker", function () { return false; }).click(function () { $(this).hide(); return false; });
            $(document).unbind(".monthpicker").bind("mousedown.monthpicker", function () { table.hide(); return false; });
        }
        $(target).bind("click focus", function () { show(); return false; });
        return { head: thead, body: tbody };
    }

    function setEvent(target) {
        var options = $.data(target, "monthpicker").options;
        var thead = $.data(target, "monthpicker").head;
        var tbody = $.data(target, "monthpicker").body;
        thead.click(function (event) {
            var src = $(event.target);
            if (src.is("div.prev")) {
                var year = $(this).find(".year").text() * 1 - 1;
                $(this).find(".year").text(year);
                options.onPrevYear.call(target);
            } else if (src.is("div.next")) {
                var year = $(this).find(".year").text() * 1 + 1;
                $(this).find(".year").text(year);
                options.onNextYear.call(target);
            }
            return false;
        });

        tbody.click(function (event) {
            if ($(event.target).is("div")) {
                var year = thead.find(".year").text();
                var month = $(event.target).text() * 1;
                var val = month < 10 ? (year + "-0" + month) : (year + "-" + month);
                $(target).val(val);
                options.onSelect.call(target);
            }
        });
    }

    function setValue(target, param) {
        var thead = $.data(target, 'monthpicker').head;
        if (!isNaN(param)) {
            thead.find(".year").text(param);
        }
    }

    $.fn.monthpicker = function (options, param) {
        if (typeof options == "string") {
            switch (options) {
                case "setValue":
                    return this.each(function () {
                        setValue(this, param);
                    });
            }
        }
        options = options || {};
        return this.each(function () {
            var state = $.data(this, 'monthpicker');
            if (state) {                                                     //如果有state就说明已经存在combotree对象了
                $.extend(state.options, options);
            } else {                                                         //如果没有则创建对象
                var r = init(this);                                      //这里的this是dom对象
                state = $.data(this, 'monthpicker', {
                    options: $.extend({}, $.fn.monthpicker.defaults, options),
                    head: r.head,
                    body: r.body
                });
            }
            setEvent(this);
        });
    }

    $.fn.monthpicker.defaults = {
        onSelect: function () { },
        onPrevYear: function () { },
        onNextYear: function () { }
    };
})(jQuery);