// JavaScript Document
(function($){
    $.fn.scrollable = function(options) {

        var opts = $.extend({}, $.fn.scrollable.defaults, options);

        return this.each(function() {

            var scrolTable = $(this);

            // TODO: Move this into default options (if possible)
            // Set the default table width/height (if not provided)
            opts.tableWidth = opts.tableWidth ? opts.tableWidth : scrolTable.width();
            opts.tableHeight = opts.tableHeight ? opts.tableHeight : scrolTable.height();

           // if (jQuery.browser.msie) {
			//	alert(2);
                // Create container for table;
                var containerDiv = $("<div></div>");
                containerDiv.insertBefore(scrolTable);

                // Find tfoot and thead if exists
                var tableFoot = scrolTable.find("tfoot");
                var tableHead = scrolTable.find("thead");

                // If we have a header, move it to a new div
                if (tableHead) {
                    var headerTable = scrolTable.clone(true);
                    headerTable.find("tbody").remove();
                    headerTable.find("tfoot").remove();
                    headerTable.css("margin", "0px");
                    headerTable.width(opts.tableWidth - opts.scrollWidth);

                    // Remove thead from table and add clone to container
                    scrolTable.find("thead").remove();
                    containerDiv.append(headerTable);
                }

                // Create a div to "scroll" table in IE
				var div_first = $('<div class="holder oslist"></div>'); //fix
                var tableDiv = $('<div class="nb_scroll-pane"></div>'); //fix
				div_first.append(tableDiv); //fix
                tableDiv.append(scrolTable);
                tableDiv.width(opts.tableWidth);
                tableDiv.css("overflow", "auto");
				tableDiv.css("overflow-x", "hidden"); //fix
								
                tableDiv.height(opts.tableHeight)
                scrolTable.css("margin", "0px");
                scrolTable.width(opts.tableWidth - opts.scrollWidth);
                containerDiv.append(div_first); //fix
				try{
					tableDiv.jScrollPane({showArrows:true, scrollbarWidth: 8, arrowSize: 20});
				}catch(e){}	

                // If we have a footer, move it to a new div
                if (tableFoot) {
                    var footerTable = scrolTable.clone(true);
                    footerTable.find("thead").remove();
                    footerTable.find("tbody").remove();
                    footerTable.css("margin", "0px");
                    footerTable.width(opts.tableWidth - opts.scrollWidth);

                    // Remove tfoot from table and add clone to container
                    scrolTable.find("tfoot").remove();
                    containerDiv.append(footerTable);
                }

                // Sync table column widths
                $.scrollable.syncWidths(containerDiv);

            
        });
    };

    $.scrollable = {
        syncWidths : function(container) {
        //    if (jQuery.browser.msie) {

                var thead = container.find("thead");
                var tbody = container.find("tbody");
                var tfoot = container.find("tfoot");

                // Determine which to use for widths (head or body).
                var columnList = thead ? thead.find("tr:first th") : tbody.find("tr:first td");

                // Set table body column fix widths
                $.each(tbody.find("tr:first td"), function(i,td) {
                    var column = $(columnList[i]);
                    $(td).removeAttr("width");
                    $(td).width(column.width());
                });

                //*********************************
                // Because of "non breaking text" we now copy the body column sizes back to the header/footer
                //*********************************

                if(thead) {
                    var theadColumns = thead.find("tr:first th");

                    // Remove width/style from header and set word break
                    $.each(theadColumns, function(i,th) {
                        $(th).css("wordBreak","break-all");
                        $(th).removeAttr("width");
                        $(th).css("width", "");
                    });

                    // Set the widths on the header columns instead
                    $.each(tbody.find("tr:first td"), function(i,td) {
                        $(theadColumns[i]).width($(td).width());
                    });
                }

                // Set table foot column widths
                if(tfoot) {
                    var tfootColumns = tfoot.find("tr:first th");

                    // Remove width/style from footer and set word break
                    $.each(tfootColumns, function(i,th) {
                        $(th).css("wordBreak","break-all");
                        $(th).removeAttr("width");
                        $(th).css("width", "");
                    });

                    // Set the widths on the footer columns instead
                    $.each(tbody.find("tr:first td"), function(i,td) {
                        $(tfootColumns[i]).width($(td).width());
                    });
                }
        //    }
        }
    };
    
    $.fn.scrollable.defaults = {
        scrollWidth: 13
    };
})(jQuery);