mirror of
https://github.com/Mottie/tablesorter.git
synced 2024-11-15 23:54:22 +00:00
Parser: add named number parser & demo
This commit is contained in:
parent
3058060a63
commit
7ceb69056b
156
docs/example-parsers-named-numbers.html
Normal file
156
docs/example-parsers-named-numbers.html
Normal file
@ -0,0 +1,156 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery plugin: Tablesorter - Named Numbers Parser</title>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script src="js/jquery-latest.min.js"></script>
|
||||
|
||||
<!-- Demo stuff -->
|
||||
<link rel="stylesheet" href="css/jq.css">
|
||||
<link href="css/prettify.css" rel="stylesheet">
|
||||
<script src="js/prettify.js"></script>
|
||||
<script src="js/docs.js"></script>
|
||||
<style>
|
||||
th { width: 50%; }
|
||||
</style>
|
||||
|
||||
<link href="../css/theme.blue.css" rel="stylesheet">
|
||||
<script src="../js/jquery.tablesorter.js"></script>
|
||||
|
||||
<!-- load metric parser -->
|
||||
<script src="../js/parsers/parser-named-numbers.js"></script>
|
||||
|
||||
<script id="js">$(function() {
|
||||
|
||||
$("table").tablesorter({
|
||||
theme : 'blue',
|
||||
widgets : ["zebra"]
|
||||
});
|
||||
|
||||
});</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="banner">
|
||||
<h1>table<em>sorter</em></h1>
|
||||
<h2>Named Numbers Parser</h2>
|
||||
<h3>Flexible client-side table sorting</h3>
|
||||
<a href="index.html">Back to documentation</a>
|
||||
</div>
|
||||
<div id="main">
|
||||
|
||||
<p class="tip">
|
||||
<em>NOTE!</em>
|
||||
<ul>
|
||||
<li>This parser will convert named numbers into appropriate values so they are sorted correctly.</li>
|
||||
<li>Named numbers include values:
|
||||
<ul>
|
||||
<li>zero to twenty; by one ("one", "two", "three", ..., "nineteen", "twenty")</li>
|
||||
<li>twenty to hundred; by ten ("twenty", "thirty", "forty", ... "ninety", "hundred")</li>
|
||||
<li>thousand (1e3) to duotrigintillion (1e99); by 10^(3n+3) value ("thousand", "million", "billion", ... "untrigintillion", "duotrigintillion")</li>
|
||||
<li>googl (1e100)</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>Even bigger named values will need to be manually added to the parser code; see <a href="http://en.wikipedia.org/wiki/Names_of_large_numbers">this wikipedia page</a> for more names.</li>
|
||||
</ul>
|
||||
<p>
|
||||
|
||||
<h1>Demo</h1>
|
||||
<button type="button" class="toggleparsedvalue">Toggle parsed values</button>
|
||||
<div id="demo"><table class="tablesorter">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="sorter-namedNumbers">Numbers</th>
|
||||
<th class="sorter-namedNumbers">Large Numbers</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>5 hundred</td>
|
||||
<td>one hundred and fifty two million</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>four hundred thousand five hundred fourty three</td>
|
||||
<td>710,231,000</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>one hundred and fifty five</td>
|
||||
<td>10 million three hundred sixty five thousand four hundred and ninety one</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>negative twelve</td>
|
||||
<td>10 million and three</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>minus three hundred and fifty seven thousand four hundred and two</td>
|
||||
<td>6 billion eight thousand</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>zero</td>
|
||||
<td>3 hundred quadrillion</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>three hundred twenty</td>
|
||||
<td>145 decillion</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>forty-two</td>
|
||||
<td>700 thousand</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ninety-nine thousand nine hundred and ninety-nine</td>
|
||||
<td>2.3 million</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>2.3 thousand</td>
|
||||
<td>2.3 googl</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>minus one</td>
|
||||
<td>8 hundred thousand</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>seven hundred fifty two</td>
|
||||
<td>9 hundred-million</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>one hundred and thirty-three</td>
|
||||
<td>Twenty-three trillion</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></div>
|
||||
|
||||
<h1>Page Header</h1>
|
||||
<div>
|
||||
<pre class="prettyprint lang-html"><!-- blue theme stylesheet with additional css styles added in v2.0.17 -->
|
||||
<link rel="stylesheet" href="../css/theme.blue.css">
|
||||
<!-- tablesorter plugin -->
|
||||
<script src="../js/jquery.tablesorter.js"></script>
|
||||
|
||||
<!-- load metric parser -->
|
||||
<script src="../js/parsers/parser-named-numbers.js"></script></pre>
|
||||
</div>
|
||||
|
||||
<h1>Javascript</h1>
|
||||
<div id="javascript">
|
||||
<pre class="prettyprint lang-javascript"></pre>
|
||||
</div>
|
||||
|
||||
<h1>HTML</h1>
|
||||
<div id="html">
|
||||
<pre class="prettyprint lang-html"></pre>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
$(function(){
|
||||
// add parsed values to columns [0,1]
|
||||
addParsedValues($('table'), [0,1]);
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
@ -530,6 +530,7 @@
|
||||
<li><a href="example-widget-grouping.html">Input/select parsers</a> (used by Grouping rows widget) (<span class="version">v2.8</span>; <span class="version updated">v2.17.5</span>).</li>
|
||||
<li><a href="example-parsers-feet-inch-fraction.html">Feet-inch-fraction parser</a> (<span class="version">v2.8</span>).</li>
|
||||
<li><a href="example-parsers-metric.html">Metric parser</a> (<span class="version">v2.8</span>).</li>
|
||||
<li><a href="example-parsers-named-numbers.html">Named Numbers parser</a> (<span class="version">v2.18.0</span>).</li>
|
||||
<li><a href="example-parsers-ip-address.html">Network (IPv4, IPv6 and MAC address parser</a> (<span class="version">v2.12</span>; <span class="version updated">v2.18.0</span>).</li>
|
||||
<li><a href="example-parsers-roman.html">Roman Numeral parser</a> (<span class="version">v2.17.3</span>).</li>
|
||||
<li><a href="example-option-textsorter-semver.html">Semantic Versioning (Semver) sorting</a> (<span class="version">v2.14.3</span>).</li>
|
||||
|
121
js/parsers/parser-named-numbers.js
Normal file
121
js/parsers/parser-named-numbers.js
Normal file
@ -0,0 +1,121 @@
|
||||
/*! Named Numbers Parser
|
||||
* code modified from http://stackoverflow.com/a/12014376/145346
|
||||
*/
|
||||
/*jshint jquery:true */
|
||||
;(function($){
|
||||
"use strict";
|
||||
|
||||
// Change language of the named numbers as needed
|
||||
var named = {
|
||||
negative: [ 'negative', 'minus' ],
|
||||
numbers : {
|
||||
'zero' : 0,
|
||||
'one' : 1,
|
||||
'two' : 2,
|
||||
'three' : 3,
|
||||
'four' : 4,
|
||||
'five' : 5,
|
||||
'six' : 6,
|
||||
'seven' : 7,
|
||||
'eight' : 8,
|
||||
'nine' : 9,
|
||||
'ten' : 10,
|
||||
'eleven' : 11,
|
||||
'twelve' : 12,
|
||||
'thirteen' : 13,
|
||||
'fourteen' : 14,
|
||||
'fifteen' : 15,
|
||||
'sixteen' : 16,
|
||||
'seventeen' : 17,
|
||||
'eighteen' : 18,
|
||||
'nineteen' : 19,
|
||||
'twenty' : 20,
|
||||
'thirty' : 30,
|
||||
'forty' : 40,
|
||||
'fourty' : 40, // common misspelling
|
||||
'fifty' : 50,
|
||||
'sixty' : 60,
|
||||
'seventy' : 70,
|
||||
'eighty' : 80,
|
||||
'ninety' : 90
|
||||
},
|
||||
// special case
|
||||
hundred : 'hundred',
|
||||
// multiples
|
||||
powers : {
|
||||
'thousand' : 1e3,
|
||||
'million' : 1e6,
|
||||
'billion' : 1e9,
|
||||
'trillion' : 1e12,
|
||||
'quadrillion' : 1e15,
|
||||
'quintillion' : 1e18,
|
||||
'sextillion' : 1e21,
|
||||
'septillion' : 1e24,
|
||||
'octillion' : 1e27,
|
||||
'nonillion' : 1e30,
|
||||
'decillion' : 1e33,
|
||||
'undecillion' : 1e36,
|
||||
'duodecillion' : 1e39,
|
||||
'tredecillion' : 1e42,
|
||||
'quattuordecillion' : 1e45,
|
||||
'quindecillion' : 1e48,
|
||||
'sexdecillion' : 1e51,
|
||||
'septendecillion' : 1e54,
|
||||
'octodecillion' : 1e57,
|
||||
'novemdecillion' : 1e60,
|
||||
'vigintillion' : 1e63,
|
||||
'unvigintillion' : 1e66,
|
||||
'duovigintillion' : 1e69,
|
||||
'trevigintillion' : 1e72,
|
||||
'quattuorvigintillion' : 1e75,
|
||||
'quinvigintillion' : 1e78,
|
||||
'sexvigintillion' : 1e81,
|
||||
'septenvigintillion' : 1e84,
|
||||
'octovigintillion' : 1e87,
|
||||
'novemvigintillion' : 1e90,
|
||||
'trigintillion' : 1e93,
|
||||
'untrigintillion' : 1e96,
|
||||
'duotrigintillion' : 1e99,
|
||||
'googl' : 1e100
|
||||
}
|
||||
},
|
||||
result, group,
|
||||
negativeRegex = new RegExp('(' + named.negative.join('|') + ')'),
|
||||
calc = function ( word, table ) {
|
||||
var num = named.numbers.hasOwnProperty( word ) ? named.numbers[ word ] : null,
|
||||
power = named.powers.hasOwnProperty( word ) ? named.powers[ word ] : null;
|
||||
if ( !num && !isNaN( word ) ) {
|
||||
num = $.tablesorter.formatFloat( word || '', table );
|
||||
}
|
||||
if ( num !== null ) {
|
||||
group += num;
|
||||
} else if ( word === named.hundred ) {
|
||||
group *= 100;
|
||||
} else if ( power !== null ) {
|
||||
result += group * power;
|
||||
group = 0;
|
||||
}
|
||||
};
|
||||
|
||||
$.tablesorter.addParser({
|
||||
id: "namedNumbers",
|
||||
is: function () {
|
||||
return false;
|
||||
},
|
||||
format: function ( str, table ) {
|
||||
result = 0;
|
||||
group = 0;
|
||||
var indx,
|
||||
arry = ( str || '' ).split( /[\s-]+/ ),
|
||||
len = arry.length;
|
||||
for ( indx = 0; indx < len; indx++ ) {
|
||||
calc( arry[ indx ].toLowerCase(), table );
|
||||
}
|
||||
result = ( result + group ) * ( str.match( negativeRegex ) ? -1 : 1 );
|
||||
// make sure to let zero get parsed, so check hasOwnProperty
|
||||
return result || named.numbers.hasOwnProperty( str ) ? result : $.tablesorter.formatFloat( str || '', table );
|
||||
},
|
||||
type: "numeric"
|
||||
});
|
||||
|
||||
})( jQuery );
|
Loading…
Reference in New Issue
Block a user