AdSpeed.org | Giving it back: Javascript table grid sort

Javascript table grid sort

/** grid sorting class
* @since 3/29/2005
* @author Son Nguyen
* @package Scripts
* @subpackage Grid
*/
function CGridSort($pTableID) {
	this.mTable = $($pTableID);
	this.mSortOrder = null; // asc=0, desc=1
	this.mColumnIndex = null; // which is the actively sorted col
	this.mShouldBeOrder = null; // the correct order after sorted
	this.mCurrentOrder = null; // the current row order
	
	this.mBodyOnClass = null; // mouse over row style
	this.mBodyOffClass = null;
	this.mHeaderOnClass = null; // mouse over header style
	this.mHeaderOffClass = null;
	this.mHeaderUpClass = null; // header sorted up 
	this.mHeaderDownClass = null; 
	
	var $vRows = this.mTable.rows;
	for (var $i=1;$i<$vRows.length;$i++) { // assumption: 1st row is header! Skip!
		if ($vRows[$i].nodeName == 'TR') {
			var oThis = this;
			$vRows[$i].onmouseover = function () { oThis.highLiteRow(this) };
			$vRows[$i].onmouseout = function () { oThis.highLiteRow(this) };
		} // fi
	} // rof
}

CGridSort.prototype.setBodyClass = function($pOn,$pOff) {
	this.mBodyOnClass = $pOn;
	this.mBodyOffClass = $pOff;
}

CGridSort.prototype.setHeaderClass = function($pOn,$pOff,$pUp,$pDown) {
	this.mHeaderOnClass = $pOn;
	this.mHeaderOffClass = $pOff;
	this.mHeaderUpClass = $pUp;
	this.mHeaderDownClass = $pDown;
}

CGridSort.prototype.highLiteRow = function($pRowObj) {
	var $vCSS = new CElementCSS($pRowObj);
	if ($vCSS.hasStyle(this.mBodyOnClass)) {
		$vCSS.removeStyle(this.mBodyOnClass);
		$vCSS.appendStyle(this.mBodyOffClass);
	} else {
		$vCSS.removeStyle(this.mBodyOffClass);
		$vCSS.appendStyle(this.mBodyOnClass);
	} // fi
}

CGridSort.prototype.showSrtOrd = function($pHeaderCell,$pIsHeaderOn) {
	this.clearOrders($pHeaderCell);
	var $pPrimary = ($pIsHeaderOn==true)?this.mHeaderOnClass:this.mHeaderOffClass;
	
	if ($pHeaderCell.cellIndex==this.mColumnIndex && this.mSortOrder==0) {
		$pHeaderCell.className = $pPrimary+' '+this.mHeaderUpClass;
	} else if ($pHeaderCell.cellIndex==this.mColumnIndex && this.mSortOrder==1) {
		$pHeaderCell.className = $pPrimary+' '+this.mHeaderDownClass;
	} else {
		$pHeaderCell.className = $pPrimary;
	} // fi
}
/** clear orders for other headers */
CGridSort.prototype.clearOrders = function($pHeaderCell) {
	var $vHeaders = $pHeaderCell.parentNode.childNodes;
	for (var $i=0;$i<$vHeaders.length;$i++) {
		if ($vHeaders[$i].nodeName=='TH' && $i!=this.mColumnIndex && $vHeaders[$i] != $pHeaderCell) {
			$vHeaders[$i].className = this.mHeaderOffClass;
		} // fi
	} // rof
}

/** actually do the sorting */
CGridSort.prototype.sortCol = function($pColumnIndex) {
	this.mSortOrder = (this.mSortOrder!=null && $pColumnIndex==this.mColumnIndex)?(this.mSortOrder+1)%2:0;
	this.mColumnIndex = $pColumnIndex;

this.initSort();

// swap those not in place
	for (var $i=0;$i<this.mCurrentOrder.length;$i++) {
		if (this.mCurrentOrder[$i]!=this.mShouldBeOrder[this.mColumnIndex][$i]) {
			this.swapRow(this.mCurrentOrder[$i],this.mShouldBeOrder[this.mColumnIndex][$i]);	
		} // fi
	} // rof
	
	
	// reverse the order array
	this.mShouldBeOrder[this.mColumnIndex].reverse();
}

/** init the global vars, done for every col for the first time */
CGridSort.prototype.initSort = function() {
	// init gRows for this table if not done outside already
	if (this.mCurrentOrder==null) {
		this.mCurrentOrder = new Array();
		var $vLength = 0;
		var $vCnt = 0;
		var $vRows = this.mTable.rows;
		for (var $i=1;$i<$vRows.length;$i++) { // assumption: 1st row is header! Skip!
			if ($vRows[$i].nodeName == 'TR') {
				this.mCurrentOrder[this.mCurrentOrder.length] = $vRows[$i].id; 
			} // fi
		} // rof
	} // fi

// init order-by array
	if (this.mShouldBeOrder==null) { this.mShouldBeOrder = new Array(); }
	if (typeof(this.mShouldBeOrder[this.mColumnIndex])=='undefined') {
		this.mShouldBeOrder[this.mColumnIndex] = new Array();
		var $vTmpAry = new Array();
		var $vTmpAry2 = new Array();
		var $vCellValue = null;
		var $vKey = null;
		var $vSampleValue = null;
		for (var $i=0;$i<this.mCurrentOrder.length;$i++) {
			$vCellValue = this.processSortValue($(this.mCurrentOrder[$i]).cells[this.mColumnIndex].innerHTML);
			if ($vCellValue!='') {
				$vSampleValue = $vCellValue;
			} // if
			$vTmpAry[$i] = $vCellValue;

$vKey = $vCellValue;
			while (typeof($vTmpAry2[$vKey])!='undefined') {
				$vKey = $vKey+'x';
			} // rof
			$vTmpAry2[$vKey] = this.mCurrentOrder[$i];			
		} // rof

// determine sort algorithm and sorting
		var $vSortFn = null; // this.sortCaseInsen; // default, use the internally supported, the other give IE "Number Expected" err
		if ($vSampleValue.match(/^\d\d[\/-]\d\d[\/-]\d\d\d\d$/)) $vSortFn = this.sortDate;
	    if ($vSampleValue.match(/^\d\d[\/-]\d\d[\/-]\d\d$/)) $vSortFn = this.sortDate;
		if ($vSampleValue.match(/^[£$]/)) $vSortFn = this.sortCur;
	    if ($vSampleValue.match(/^[\d\.\,\%]+$/)) $vSortFn = this.sortNum;
		//alert($vSortFn);
		if ($vSortFn!=null) {
			$vTmpAry.sort($vSortFn);
		} else {
			$vTmpAry.sort();
		} // fi
		
		//alert('pass sorting');

// correct the duplicate rows
		for (var $i=0;$i<$vTmpAry.length;$i++) {
			for (var $j=$i+1;$j<$vTmpAry.length;$j++) {
				if ($vTmpAry[$i]==$vTmpAry[$j]) {
					$vTmpAry[$j] = $vTmpAry[$j]+'x';
				} else { // break out of the first loop now, save some time
					break;
				} // fi
			} // rof
		} // rof

var $vRowID = null;
		for (var $i=0;$i<$vTmpAry.length;$i++) {
			$vRowID = $vTmpAry2[$vTmpAry[$i]];
			this.mShouldBeOrder[this.mColumnIndex][$i] = $vRowID;
		} // rof
	} // fi
}

/** swapping data and index */
CGridSort.prototype.swapRow = function($pRowA,$pRowB) {
	var $vOne = $($pRowA);
	var $vTwo = $($pRowB);
	var $vTmp;

// 1.3 swap the data
	for (var $k=0;$k<$vOne.cells.length;$k++) {
		$vTmp = $vOne.cells[$k].innerHTML;
		$vOne.cells[$k].innerHTML = $vTwo.cells[$k].innerHTML;
		$vTwo.cells[$k].innerHTML = $vTmp;
	} // for

// 2.3 also swap index
	for (var $k=0;$k<this.mCurrentOrder.length;$k++) {
		if (this.mCurrentOrder[$k] == $pRowA) {
			this.mCurrentOrder[$k] = $pRowB;
		} else if (this.mCurrentOrder[$k] == $pRowB) {
			this.mCurrentOrder[$k] = $pRowA;
		} // else
	} // for

// 3.3 also swap id
	$vOne.id = $pRowB;
	$vTwo.id = $pRowA;
}

/** strip tags, process special comment for timestamp/other special cases */
CGridSort.prototype.processSortValue = function($pValue) {
	var $vResult = $pValue.match(//g);
	if ($vResult) { // comment stores the real value, ignore the outside
		$pValue = $vResult[0];
		$pValue = $pValue.substring(4,$pValue.length-4);
		$pValue = $pValue.replace(/ /g,'');
	} else { // strip tags or everything within tags
		var $vBkup = $pValue;
		// first try to strip everything between a pair of tags
		$pValue = $pValue.replace(/<[^>]+>/g,'<>'); // anything in <>
		$pValue = $pValue.replace(/<>.*<>/g,''); 
		$pValue = $pValue.replace(/<>/g,''); 
		if ($pValue=='') { // then only strip tags, leave everything in between
			$pValue = $vBkup.replace(/<[^>]+>/g,''); 
		} // fi
		$pValue = $pValue.replace(/^\s*|\s*$/g,'');	// whitespaces
		$pValue = $pValue.replace(/ /g,'');
		$pValue = $pValue.replace(/ /g,'');
		$pValue = $pValue.replace(/\n/g,'');
	} // fi
	return $pValue;
}

/** HELPER, SORT FUNCTIONS */

/** sort case insensitive */
CGridSort.prototype.sortCaseInsen = function($pValueA,$pValueB) {
	$pValueA = $pValueA.toLowerCase();
	$pValueB = $pValueB.toLowerCase();

if ($pValueA>$pValueB) return 1;
    if ($pValueA<$pValueB) return -1;
    return 0;
}

CGridSort.prototype.sortNum = function($pValueA,$pValueB) { 
	$pValueA = parseFloat($pValueA.replace(/[^0-9.]/g,''));
    $pValueB = parseFloat($pValueB.replace(/[^0-9.]/g,''));

if (isNaN($pValueA)) $pValueA = 0;
	if (isNaN($pValueB)) $pValueB = 0;

return $pValueA-$pValueB;
}

/** sort on date */
CGridSort.prototype.sortDate = function($pValueA,$pValueB) {
    if ($pValueA.length == 10) {
        $dt1 = $pValueA.substr(6,4)+$pValueA.substr(3,2)+$pValueA.substr(0,2);
    } else {
        $yr = $pValueA.substr(6,2);
        if (parseInt($yr) < 50) { $yr = '20'+$yr; } else { $yr = '19'+$yr; }
        $dt1 = $yr+$pValueA.substr(3,2)+$pValueA.substr(0,2);
    } // if

if ($pValueB.length == 10) {
        $dt2 = $pValueB.substr(6,4)+$pValueB.substr(3,2)+$pValueB.substr(0,2);
    } else {
        $yr = $pValueB.substr(6,2);
        if (parseInt($yr) < 50) { $yr = '20'+$yr; } else { $yr = '19'+$yr; }
        $dt2 = $yr+$pValueB.substr(3,2)+$pValueB.substr(0,2);
    }
    if ($dt1==$dt2) return 0;
    if ($dt1<$dt2) return -1;
    return 1;
}

/** sort currency */
CGridSort.prototype.sortCur = function($pValueA,$pValueB) { 
	$pValueA = $pValueA.replace(/[^0-9.]/g,'');
    $pValueB = $pValueB.replace(/[^0-9.]/g,'');
    return parseFloat($pValueA) - parseFloat($pValueB);
}

0 comments

AdSpeed.org | Giving it back

Javascript table grid sort

0 Comments:

PHP5 Classes

Recent Submissions