﻿(function($) {
    jQuery.fn.tabList = function(options) {
        try {
            options = jQuery.extend(
			    {
			},
			    options
		    );

            //$.log(options.data);

            var edge = $(this);
            var clientID = edge.attr('id');
            edge.prepend('<ul class="edit"></ul>');

            var ul = $('ul', edge);

            ul.after('<textarea name="' + clientID + '_value" style="width: 100%; height: 100px; display: none;" />');
            var output = $('textarea', edge);
            //output.show();

            var exists = function(key) {
                for (var i = 0; i < options.data.length; i++) {
                    if (options.data[i] == key) return true;
                }
                return false;
            }

            //		var get_choice = function(key) {
            //			for (var i=0; i < options.choices.length; i++) {
            //				if (options.choices[i][0] == key) return options.choices[i];
            //			}
            //			return null;
            //		}


            var update = function() {
                options.data = [];

                $('li input:checked', ul).each(
    				function() {
    				    options.data.push($(this).val());
    				}
			    );
                serialize();
            }

            var update_fields = function() {

                $('.right-widget-authoring').hide();
                var container = $('.right-widget-authoring-container');

                $.each(
				    options.data,
				    function() {
				        //alert(this);					
				        var field = $('.right-widget-authoring.' + this);
				        container.append(field);
				        field.show();
				    }
			    );
            }

            var serialize = function() {
                output.text(JSON.stringify(options.data));
                //alert(output.text());
                update_fields();
            }


            var bind = function() {

                ul.empty();

                var found = [];

                //			$.each(
                //				options.data,
                //				function() {
                //					var item = get_choice(this);
                //					if (item != null) {
                //						found.push(item);
                //						//<span class="ui-icon ui-icon-arrowthick-2-n-s"></span>
                //						ul.append('<li class="ui-state-default"><input type="checkbox" checked="true" name="' + item[0] + '" value="' + item[0] + '" />' + item[1] + '</li>');
                //					}
                //				}
                //			);

                //			$.each(
                //				options.choices,
                //				function() {
                //					if (!item_exists(found, this)) {
                //						//<span class="ui-icon ui-icon-arrowthick-2-n-s"></span>
                //						ul.append('<li class="ui-state-default"><input type="checkbox" name="' + this[0] + '" value="' + this[0] + '" />' + this[1] + '</li>');
                //					}
                //				}
                //			);


                $.each(
				options.choices,
				function() {
				    var checked = (item_exists(options.data, this[0])) ? 'checked="true"' : '';
				    ul.append('<li class="ui-state-default"><input type="checkbox" name="' + this[0] + '" value="' + this[0] + '" ' + checked + ' />' + this[1] + ' (' + this[2] + ')</li>');
				}
			);

                serialize();
            }

            $('li input[type="checkbox"]', ul).live(
		        'click',
		        function() {
		            update();
		        }
	        );

            bind();

            ul.sortable({ update: function() { update(); } });

        } catch (ex) {
            $.log(ex);
        }

    };
})(jQuery);




