addEvent(window, "load", sortables_init);
addEvent(window, "load", alternate_table_rows);
addEvent(window, "load", generate_table_manager_control);
addEvent(window, "load", generate_table_manager_content);

var COLUMN_HEADER_SORT_ICON_NEUTRAL = "&nbsp;<span class=\"sortarrow\">&nbsp;&nbsp;&nbsp;</span>";
var COLUMN_HEADER_SORT_ICON_ASCENDING = "&nbsp;<span id=\"iconAscending\">&nbsp;&nbsp;&nbsp;</span>";
var COLUMN_HEADER_SORT_ICON_DESCENDING = "&nbsp;<span id=\"iconDescending\">&nbsp;&nbsp;&nbsp;</span>";

var DATABASE_SORT_DIRECTION_ASCENDING = "asc";
var DATABASE_SORT_DIRECTION_DESCENDING = "desc";

var TABLE_CLASS_SORTABLE = "sortable";
var TABLE_CLASS_SHOW_CONTROL_BOX = "showControlBox";
var TABLE_CLASS_SHOW_ROW_STATS = "showRowStats";
var TABLE_CLASS_SHOW_PAGE_STATS = "showPageStats";
var TABLE_CLASS_ALLOW_ACTION_ADD = "add";
var TABLE_CLASS_ALLOW_ACTION_EDIT = "edit";
var TABLE_CLASS_ALLOW_ACTION_DELETE = "delete";

var SORT_COLUMN_INDEX;

var USE_SERVER_SORT = false;


/**
 * Generate table manager box and control link and add them to the DOM
 */
function generate_table_manager_control() 
{
    if (!document.getElementsByTagName) return;

    tbls = document.getElementsByTagName("table");
    for (ti=0;ti<tbls.length;ti++) 
    {
 		var showControlBox = false;
    
        thisTbl = tbls[ti];
        if (((' ' + thisTbl.className + ' ').indexOf(TABLE_CLASS_SORTABLE) != -1) && (thisTbl.id)) 
        {
			if ((' ' + thisTbl.className + ' ').indexOf(TABLE_CLASS_SHOW_CONTROL_BOX) != -1) 
			{
				showControlBox = true;
			}	
					
			if (showControlBox) 
			{
	            tableId = thisTbl.id;

	            // Create column picker object
	            columnPicker = document.createElement("div");
	            columnPicker.name = "columnPicker_" + tableId;
	            columnPicker.id = "columnPicker_" + tableId;
	            columnPicker.className = "columnPicker";
	            columnPicker.style.visibility = "hidden";
	
	            // Create columnControl link
	            columnControl = document.createElement("span");
	            columnControl.name = "columnControl_" + tableId;
	            columnControl.id = "columnControl_" + tableId;
	            columnControl.className = "columnControl";
	            columnControlContent = "[<a href=\"#\" onclick=\"toggleColumnPicker('columnPicker_" + tableId + "');this.blur();\" id=\"columnControlLink_" + tableId + "\">x</a>]";
	            // Create line break
	            htmlBreak = document.createElement("br");
	
	            // Add new objects to dom (before table, so they appear above table)
	            thisTbl.parentNode.insertBefore(columnControl,thisTbl);
	            thisTbl.parentNode.insertBefore(htmlBreak,thisTbl);
	            thisTbl.parentNode.insertBefore(columnPicker,thisTbl);
	
	            columnControl.innerHTML = columnControlContent;
            }
        }
    }
}

/**
 * Generate filter box content and add it to the DOM
 */
function generate_table_manager_content() 
{
    if (!document.getElementsByTagName) return;

    var output = "<ul>";

    tbls = document.getElementsByTagName("table");
    for (ti=0;ti<tbls.length;ti++) 
    {
        thisTbl = tbls[ti];
        if (((' '+thisTbl.className+' ').indexOf(TABLE_CLASS_SORTABLE) != -1) && (thisTbl.id)) 
        {
            if (thisTbl.rows && thisTbl.rows.length > 0) 
            {
                var firstRow = thisTbl.rows[0];

                output = "<ul>";

                for (var i=0;i<firstRow.cells.length;i++) 
                {
                    var cell = firstRow.cells[i];
                    var txt = ts_getInnerText(cell);
                    output += "<li><input type=\"checkbox\" value=\"\" name=\"column_" + i + "\" onclick=\"toggle_column_visibility('" + thisTbl.id + "', " +  i + ");this.blur();\" checked=\"checked\" />" + txt + "</li>";
                }
                output += "</ul>"

                if (!document.getElementById) return;
                picker = document.getElementById("columnPicker_" + thisTbl.id);
				if (picker != null)
				{
                	picker.innerHTML = output;
                }
            }
        }
    }
}

/**
 * Toggle the visibility of the given column
 */
function toggle_column_visibility(tableId, colIndex) 
{
    if (!document.getElementById) return;
    tbl = document.getElementById(tableId + "");

    for (var r = 0; r < tbl.rows.length; r++) {
        if (tbl.rows[r].cells[colIndex].style.display == 'none') 
        {
            tbl.rows[r].cells[colIndex].style.display = '';
        } 
        else 
        {
            tbl.rows[r].cells[colIndex].style.display = 'none';
        }
    }
}

function toggleColumnPicker(picker_name) 
{
    if (!document.getElementById) return;
    picker_name = picker_name + "";

    picker = document.getElementById(picker_name);

    if (picker.style.visibility == "hidden") 
    {
        picker.style.visibility = "visible";
    } 
    else 
    {
        picker.style.visibility = "hidden";
    }
}


/**
 * Apply a style to the odd and even table rows
 */
function alternate_table_rows() 
{
    if (!document.getElementsByTagName) return;
    tbls = document.getElementsByTagName("table");
    for (ti=0;ti<tbls.length;ti++) 
    {
        thisTbl = tbls[ti];
        if (((' '+thisTbl.className+' ').indexOf(TABLE_CLASS_SORTABLE) != -1) && (thisTbl.id)) 
        {

            if (thisTbl.rows && thisTbl.rows.length > 0) 
            {
                var firstRow = thisTbl.rows[0];
                for (var i=0;i<thisTbl.rows.length;i++) 
                {
                    // ignore tableheader row
                    var headerClass = thisTbl.rows[i].getAttribute('class');
                    // NOTE: IE uses className, moz uses class
                    if (headerClass == null) 
                    {
                        headerClass = thisTbl.rows[i].getAttribute('className');
                    }

                    if (headerClass != 'tableheader' &&
                        headerClass != 'filterColumnHeader') 
                        {
                        // alternate row colors
                        if (i % 2) 
                        {
                            thisTbl.rows[i].setAttribute('class', 'tableRowOdd');
                            thisTbl.rows[i].setAttribute('className', 'tableRowOdd');
                        } 
                        else 
                        {
                            thisTbl.rows[i].setAttribute('class', 'tableRowEven');
                            thisTbl.rows[i].setAttribute('className', 'tableRowEven');
                        }
                    }
                }
            }
        }
    }
}


/**
 * Find all tables with class sortable and make them sortable
 */
function sortables_init() 
{
    if (!document.getElementsByTagName) return;
    tbls = document.getElementsByTagName("table");
    for (ti=0;ti<tbls.length;ti++) 
    {
        thisTbl = tbls[ti];
        if (((' '+thisTbl.className+' ').indexOf(TABLE_CLASS_SORTABLE) != -1) && (thisTbl.id)) 
        {
            ts_makeSortable(thisTbl);
        }
    }
}

function ts_makeSortable(table) 
{
	//alert("make sortable");

    if (table.rows && table.rows.length > 0)
    {
        var firstRow = table.rows[0];
    }
    if (!firstRow) return;
    
    // Determine if sorting should occur on the server side
   	var serverSortField = document.getElementById('server_sort');
	if (serverSortField !== null)
	{
		//alert("serverSortField.value = " + serverSortField.value);
		if (serverSortField.value == "true") 
		{
			//alert("server sort");
			USE_SERVER_SORT = true;
		} 
		else 
		{
			//alert("client sort");
			USE_SERVER_SORT = false;
		}
	}
    
    // Get sortable column and direction
    if (USE_SERVER_SORT) 
    {
	    // get sort column
	    var sortColumn = "";
	   	var sortColumnField = document.getElementById('sort_column');
		if (sortColumnField !== null)
		{
			sortColumn = sortColumnField.value;
		}
	
	   	// get sort direction
	    var sortDirection = "";
	 	var sortArrow = "";
	 
	   	var sortDirectionField = document.getElementById('sort_direction');
		if (sortDirectionField !== null)
		{
			sortDirection = sortDirectionField.value;
		}
	    //alert("1: script caught: sortColumn = " + sortColumn + ", sortDirection = " + sortDirection);
    }
        
    // We have a first row: assume it's the header, and make its contents clickable links
    for (var i=0;i<firstRow.cells.length;i++) 
    {
        var cell = firstRow.cells[i];
        var txt = ts_getInnerText(cell);

        sortArrow = COLUMN_HEADER_SORT_ICON_NEUTRAL;

		if (USE_SERVER_SORT) 
   		{
	        // if this is the right cell, set the appropriate sort direction
	        var tableColumnName = cell.id.substr(19);
	        //alert("2: tableColumnName = " + tableColumnName + ", sortColumn = " + sortColumn);
	        
	        if (tableColumnName == sortColumn) 
			{
		        if (sortDirection == DATABASE_SORT_DIRECTION_ASCENDING) 
				{
					sortArrow = COLUMN_HEADER_SORT_ICON_ASCENDING;
				}
				if (sortDirection == DATABASE_SORT_DIRECTION_DESCENDING) 
				{
					sortArrow = COLUMN_HEADER_SORT_ICON_DESCENDING;
				}
			}
        }
        
        cell.innerHTML = '<a href="#" class="sortheader" onclick="ts_resortTable(this);this.blur();return false;">' + txt + sortArrow + '</a>';
    }
}

function ts_getInnerText(el)
{
	if (typeof el == "string") return el;
	if (typeof el == "undefined") 
	{ 
		return el 
	};
	if (el.innerText) return el.innerText;	//Not needed but it is faster
	var str = "";
	
	var cs = el.childNodes;
	var l = cs.length;
	for (var i = 0; i < l; i++) 
	{
		switch (cs[i].nodeType) 
		{
			case 1: //ELEMENT_NODE
				str += ts_getInnerText(cs[i]);
				break;
			case 3:	//TEXT_NODE
				str += cs[i].nodeValue;
				break;
		}
	}
	return str;
}

function ts_resortTable(lnk)
{
    // get the span
    var span;
    for (var ci=0;ci<lnk.childNodes.length;ci++) 
    {
        if (lnk.childNodes[ci].tagName && lnk.childNodes[ci].tagName.toLowerCase() == 'span') span = lnk.childNodes[ci];
    }
    var spantext = ts_getInnerText(span);
    var td = lnk.parentNode;
    
    if (USE_SERVER_SORT) 
    {
    	var sortDirection = "";
    	var tableColumnName = td.id.substr(19); //"datagridHeaderCell_"
    	
    	// If same field was previously selected, reverse direction
    	// get sort column
    	var sortColumnField = document.getElementById('sort_column');
		if (sortColumnField !== null)
		{
			if (sortColumnField.value == tableColumnName) 
			{
				// Set sort direction
		    	var sortDirectionField = document.getElementById('sort_direction');
				if (sortDirectionField !== null)
				{
					//alert("reversing sort direction");
					if (sortDirectionField.value == DATABASE_SORT_DIRECTION_ASCENDING) 
			    	{
			    		sortDirection = DATABASE_SORT_DIRECTION_DESCENDING;	
			    	}
			    	else 
			    	{
			    		sortDirection = DATABASE_SORT_DIRECTION_ASCENDING;	
			    	}
				
					sortDirectionField.value = sortDirection;
				}
			}
			else 
			{
				// set sort column field
				sortColumnField.value = tableColumnName;
				
				// Set default sort direction
		    	var sortDirectionField = document.getElementById('sort_direction');
				if (sortDirectionField !== null)
				{
					sortDirectionField.value = DATABASE_SORT_DIRECTION_ASCENDING;
				}
			}
		}
    	
    	//alert("pitching to server: tableColumnName = " + tableColumnName + ", sortDirection = " + sortDirection);
    	
    	// call server side sort
    	RequestUsers();
    	
    	return;
    }
    
    var column = td.cellIndex;
    var table = getParent(td,'TABLE');
    
    // Work out a type for the column
    if (table.rows.length <= 1) return;
    var itm = ts_getInnerText(table.rows[1].cells[column]);
    sortfn = ts_sort_caseinsensitive;
    if (itm.match(/^\d\d[\/-]\d\d[\/-]\d\d\d\d$/)) sortfn = ts_sort_date;
    if (itm.match(/^\d\d[\/-]\d\d[\/-]\d\d$/)) sortfn = ts_sort_date;
    if (itm.match(/^[£$]/)) sortfn = ts_sort_currency;
    if (itm.match(/^[\d\.]+$/)) sortfn = ts_sort_numeric;
    SORT_COLUMN_INDEX = column;
    var firstRow = new Array();
    var newRows = new Array();
    for (i=0;i<table.rows[0].length;i++) 
    { 
    	firstRow[i] = table.rows[0][i]; 
    }
    for (j=1;j<table.rows.length;j++) 
    { 
    	newRows[j-1] = table.rows[j]; 
   	}

    newRows.sort(sortfn);

    if (span.getAttribute("sortdir") == 'down') 
    {
        //ARROW = '&nbsp;&nbsp;&uarr;';

        ARROW = COLUMN_HEADER_SORT_ICON_ASCENDING;

        newRows.reverse();
        span.setAttribute('sortdir','up');

        //span.parentNode.parentNode.setAttribute("class", "selected ascending");
    } 
    else 
    {
        //ARROW = '&nbsp;&nbsp;&darr;';

        ARROW = COLUMN_HEADER_SORT_ICON_DESCENDING;

        span.setAttribute('sortdir','down');

        //span.parentNode.parentNode.setAttribute("class", "selected descending");
    }
    
    // We appendChild rows that already exist to the tbody, so it moves them rather than creating new ones
    // don't do sortbottom rows
    for (i=0;i<newRows.length;i++) 
    { 
    	if (!newRows[i].className || (newRows[i].className && (newRows[i].className.indexOf('sortbottom') == -1))) table.tBodies[0].appendChild(newRows[i]);
   	}
    // do sortbottom rows only
    for (i=0;i<newRows.length;i++) 
    { 
    	if (newRows[i].className && (newRows[i].className.indexOf('sortbottom') != -1)) table.tBodies[0].appendChild(newRows[i]);
   	}
    
    // Delete any other arrows there may be showing
    var allspans = document.getElementsByTagName("span");
    for (var ci=0;ci<allspans.length;ci++) 
    {
        if (allspans[ci].className == 'sortarrow') 
        {
            if (getParent(allspans[ci],"table") == getParent(lnk,"table")) // in the same table as us?
            { 
                allspans[ci].innerHTML = '&nbsp;&nbsp;&nbsp;';
            }
        }
    }
        
    span.innerHTML = ARROW;
    alternate_table_rows();
}

function getParent(el, pTagName) 
{
	if (el == null) 
	{
		return null;
	}
	else if (el.nodeType == 1 && el.tagName.toLowerCase() == pTagName.toLowerCase())	// Gecko bug, supposed to be uppercase
	{
		return el;
	}
	else
	{
		return getParent(el.parentNode, pTagName);
	}
}

function ts_sort_date(a, b) 
{
    // y2k notes: two digit years less than 50 are treated as 20XX, greater than 50 are treated as 19XX
    aa = ts_getInnerText(a.cells[SORT_COLUMN_INDEX]);
    bb = ts_getInnerText(b.cells[SORT_COLUMN_INDEX]);
    if (aa.length == 10) 
    {
        dt1 = aa.substr(6,4)+aa.substr(3,2)+aa.substr(0,2);
    } 
    else 
    {
        yr = aa.substr(6,2);
        if (parseInt(yr) < 50) 
        { 
        	yr = '20'+yr; 
       	} 
      	else 
      	{ 
      		yr = '19'+yr; 
     	}
        dt1 = yr+aa.substr(3,2)+aa.substr(0,2);
    }
    if (bb.length == 10) 
    {
        dt2 = bb.substr(6,4)+bb.substr(3,2)+bb.substr(0,2);
    } 
    else 
    {
        yr = bb.substr(6,2);
        if (parseInt(yr) < 50) 
        { 
        	yr = '20'+yr; 
        } 
        else 
        { 
        	yr = '19'+yr;
        }
        dt2 = yr+bb.substr(3,2)+bb.substr(0,2);
    }
    if (dt1==dt2) return 0;
    if (dt1<dt2) return -1;
    return 1;
}

function ts_sort_currency(a, b) 
{ 
    aa = ts_getInnerText(a.cells[SORT_COLUMN_INDEX]).replace(/[^0-9.]/g,'');
    bb = ts_getInnerText(b.cells[SORT_COLUMN_INDEX]).replace(/[^0-9.]/g,'');
    return parseFloat(aa) - parseFloat(bb);
}

function ts_sort_numeric(a, b) 
{ 
    aa = parseFloat(ts_getInnerText(a.cells[SORT_COLUMN_INDEX]));
    if (isNaN(aa)) aa = 0;
    bb = parseFloat(ts_getInnerText(b.cells[SORT_COLUMN_INDEX])); 
    if (isNaN(bb)) bb = 0;
    return aa-bb;
}

function ts_sort_caseinsensitive(a, b) 
{
    aa = ts_getInnerText(a.cells[SORT_COLUMN_INDEX]).toLowerCase();
    bb = ts_getInnerText(b.cells[SORT_COLUMN_INDEX]).toLowerCase();
    if (aa==bb) return 0;
    if (aa<bb) return -1;
    return 1;
}

function ts_sort_default(a, b) 
{
    aa = ts_getInnerText(a.cells[SORT_COLUMN_INDEX]);
    bb = ts_getInnerText(b.cells[SORT_COLUMN_INDEX]);
    if (aa==bb) return 0;
    if (aa<bb) return -1;
    return 1;
}


function addEvent(elm, evType, fn, useCapture) 
{
	if (elm.addEventListener)
	{
		elm.addEventListener(evType, fn, useCapture);
		return true;
	} 
	else if (elm.attachEvent)
	{
		var r = elm.attachEvent("on"+evType, fn);
		return r;
	} 
	else
	{
		alert("Handler could not be removed");
	}
}