mirror of
https://github.com/Mottie/tablesorter.git
synced 2024-10-08 13:44:18 +00:00
Add roman numeral parser
This commit is contained in:
Mottie
parent
c3ebbe4cec
commit
0ef9612fdb
239
docs/example-parsers-roman.html
Normal file
239
docs/example-parsers-roman.html
Normal file
@ -0,0 +1,239 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery plugin: Tablesorter 2.0 - Roman Numeral Parser</title>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script src="js/jquery-latest.min.js"></script>
|
||||
|
||||
<!-- Demo stuff -->
|
||||
<link class="ui-theme" rel="stylesheet" href="css/jquery-ui.min.css">
|
||||
<script src="js/jquery-ui-latest.min.js"></script>
|
||||
<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>
|
||||
|
||||
<!-- Tablesorter: required -->
|
||||
<link rel="stylesheet" href="../css/theme.blue.css">
|
||||
<script src="../js/jquery.tablesorter.js"></script>
|
||||
<script src="../js/jquery.tablesorter.widgets.js"></script>
|
||||
<script src="../js/parsers/parser-roman.js"></script>
|
||||
|
||||
<style>
|
||||
th { width: 20%; }
|
||||
</style>
|
||||
|
||||
<script id="js">$(function() {
|
||||
|
||||
$("table").tablesorter({
|
||||
theme: 'blue',
|
||||
widgets: ['zebra'],
|
||||
|
||||
// roman numeral parser option
|
||||
// ===========================
|
||||
// column 0 & 1 are set to zero as placeholders
|
||||
// column 2: ignore last character (1) - for Roman "roman-ignore" numeral parser
|
||||
// column 3: ignore characters that match the set regex (beginning of the string to first space)
|
||||
roman_ignore: [ 0, 0, 1, /^(\w+\s)/ ]
|
||||
|
||||
});
|
||||
|
||||
});</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<div id="banner">
|
||||
<h1>table<em>sorter</em></h1>
|
||||
<h2>Roman Numeral Parser</h2>
|
||||
<h3>Flexible client-side table sorting</h3>
|
||||
<a href="index.html">Back to documentation</a>
|
||||
</div>
|
||||
<div id="main">
|
||||
|
||||
<p></p>
|
||||
<br>
|
||||
|
||||
<div id="root" class="accordion">
|
||||
|
||||
<h3><a href="#">Notes</a></h3>
|
||||
<div>
|
||||
<ul>
|
||||
<li>This parser (added <span class="version">v2.17.3</span>) will convert roman numerals into their decimal equivalent so the table column can be sorted correctly.</li>
|
||||
<li>There are actually 3 separate parsers included with this script.
|
||||
<ul>
|
||||
<li>They are very similar, but were written to cover different use cases.</li>
|
||||
<li> Refer to each in their separate sections below.</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li>This demo includes the stored roman numeral values within the table cells, toggle the view using the button directly above the table.</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<h3><a href="#">"roman" parser</a></h3>
|
||||
<div>
|
||||
<ul>
|
||||
<li>This parser is optimized for columns that contain only roman numerals.</li>
|
||||
<li>In the demo below, this parser is used for the "Short" and "Long" columns.</li>
|
||||
<li>This parser has no option settings.</li>
|
||||
</ul>
|
||||
<pre class="prettyprint lang-js">$(function() {
|
||||
|
||||
$("table").tablesorter({
|
||||
theme: 'blue',
|
||||
widgets: ['zebra'],
|
||||
headers: {
|
||||
0 : { sorter: 'roman' },
|
||||
1 : { sorter: 'roman' }
|
||||
}
|
||||
});
|
||||
|
||||
});</pre>
|
||||
|
||||
</div>
|
||||
|
||||
<h3><a href="#">"roman-ignore" parser</a></h3>
|
||||
<div>
|
||||
This parser is designed to use the <code>roman_ignore</code> option to either:
|
||||
|
||||
<h4>Ignore The Last "X" Characters</h4>
|
||||
For content that contains a roman number followed by an alphabetical character, such as "Ia" or "IIb", this parser can be set to ignore the last character (spaces are trimmed automatically):
|
||||
<pre class="prettyprint lang-js">$(function() {
|
||||
|
||||
$("table").tablesorter({
|
||||
theme: 'blue',
|
||||
widgets: ['zebra'],
|
||||
headers: {
|
||||
2 : { sorter: 'roman-ignore' }
|
||||
},
|
||||
// roman numeral parser option
|
||||
// ignore the last (1) character(s) in column 2 (zero-based index)
|
||||
// the two zeros in the array are just placeholders ( [ , , 1 ] works as well )
|
||||
roman_ignore: [ 0, 0, 1 ]
|
||||
|
||||
});
|
||||
|
||||
});</pre>
|
||||
|
||||
<h4>Remove Non-Roman Numerals</h4>
|
||||
For cells that contain a bit more complex layout, you can define a regular expression to ignore (remove) certain parts of the content.<br>
|
||||
<br>
|
||||
The value obtained from the <code>roman_ignore</code> option array is <em>used within a javascript replace function</em>, so it can be either a <strong>regular expression</strong> or a <strong>string</strong>.<br>
|
||||
<br>
|
||||
In this example (see the "Ignore regex" column in the demo below), content at the beginning of the cell is set to be ignored. This should <em>leave</em> the roman numeral string to be parsed by this script (spaces are trimmed automatically).
|
||||
<pre class="prettyprint lang-js">$(function() {
|
||||
|
||||
$("table").tablesorter({
|
||||
theme: 'blue',
|
||||
widgets: ['zebra'],
|
||||
headers: {
|
||||
3 : { sorter: 'roman-ignore' }
|
||||
},
|
||||
// roman numeral parser option
|
||||
// ignore any words at the beginning of column 3 (zero-based index) using a regular expression
|
||||
// additionally, if all column content contains the same character to ignore, a string can be
|
||||
// passed within this option, e.g. "Chapter "
|
||||
// the three zeros in the array are just placeholders ( [ , , , /^(\w+\s)/ ] works as well )
|
||||
roman_ignore: [ 0, 0, 0, /^(\w+\s)/ ]
|
||||
|
||||
});
|
||||
|
||||
});</pre>
|
||||
</div>
|
||||
|
||||
<h3><a href="#">"roman-extract" parser</a></h3>
|
||||
<div>
|
||||
<ul>
|
||||
<li>This parser will attempt to extract out a roman numeral block from the cell content.</li>
|
||||
<li>It's not perfect. If the content contains two blocks of roman numerals, they will be combined. For example,
|
||||
<ul>
|
||||
<li>If a cell contains <code>X plus VII</code>, the parser will extract out <code>XVII</code> and return a value of 17.</li>
|
||||
<li>Or worse yet, if a cell contains <code>VI minus X</code>, the parser will extract out <code>VIX</code> which is not a valid roman numeral, so it will instead return the initial value of <code>VI minus X</code>. If this is the case, use the "roman-ignore" parser instead.</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
<pre class="prettyprint lang-js">$(function() {
|
||||
|
||||
$("table").tablesorter({
|
||||
theme: 'blue',
|
||||
widgets: ['zebra'],
|
||||
headers: {
|
||||
4 : { sorter: 'roman-extract' }
|
||||
}
|
||||
});
|
||||
|
||||
});</pre>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<h1>Demo</h1>
|
||||
|
||||
<button type="button" class="toggleparsedvalue">toggle</button> parsed values within the column
|
||||
|
||||
<div id="demo"><table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="sorter-false" colspan="2">Pure Roman Numerals</th>
|
||||
<th class="sorter-false" colspan="2">Ignore Non-Roman Numerals</th>
|
||||
<th class="sorter-false">Extract Roman Numerals</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="sorter-roman">Short</th>
|
||||
<th class="sorter-roman">Long</th>
|
||||
<th class="sorter-roman-ignore">Ignore last (1) character *</th>
|
||||
<th class="sorter-roman-ignore">Ignore regex (/^(\w+\s)/)</th>
|
||||
<th class="sorter-roman-extract">Extract</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>I</td><td>MDLXXXV</td><td>iiia</td><td>Mark I</td><td>2000 XXVII Sydney</td></tr>
|
||||
<tr><td>MXI</td><td>MDCLXVI</td><td>iiib</td><td>Mark IV</td><td>2012 XXX London</td></tr>
|
||||
<tr><td>XII</td><td>MMDCCCLVIII</td><td>ia</td><td>Mark V</td><td>2020 XXXII Tokyo</td></tr>
|
||||
<tr><td>CXI</td><td>MMCCI</td><td>va</td><td>Mark VII</td><td>2004 XXVIII Athens</td></tr>
|
||||
<tr><td>XXI</td><td>MDCCCXL</td><td>vi b</td><td>Mk III</td><td>1980 XXII Moscow</td></tr>
|
||||
<tr><td>XIII</td><td>MMMCXXIX</td><td>iva</td><td>Mod X</td><td>1972 XX Munich</td></tr>
|
||||
<tr><td>V</td><td>DLXXVII</td><td>via</td><td>Mod IV</td><td>2016 XXXI Rio de Janeiro</td></tr>
|
||||
<tr><td>X</td><td>MDCLXV</td><td>xia</td><td>Mk VIII</td><td>1996 XXVI Atlanta</td></tr>
|
||||
<tr><td>XI</td><td>MDXVIII</td><td>xiiz</td><td>Mod XII</td><td>1976 XXI Montreal</td></tr>
|
||||
<tr><td>CLXI</td><td>MDCCCLX</td><td>xd</td><td>Mk 0</td><td>1992 XXV Barcelona</td></tr>
|
||||
<tr><td>C</td><td>CCCXCI</td><td>iiic</td><td>Mk VI</td><td>1988 XXIV Seoul</td></tr>
|
||||
<tr><td>LV</td><td>MLXXX</td><td>xxf</td><td>Mk II</td><td>1984 XXIII Los Angeles</td></tr>
|
||||
<tr><td>IX</td><td>DCCLVII</td><td>lig</td><td>Mod L</td><td>2008 XXIX Beijing</td></tr>
|
||||
</tbody>
|
||||
</table></div>
|
||||
<small>* Ignoring the last letter (set number to ignore in <code>roman_ignore</code> option array; notice that "vi b" sorts before "via" - <strong>spaces do matter</strong>!)</small><p>
|
||||
|
||||
<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; requires jQuery -->
|
||||
<script src="../js/jquery.tablesorter.js"></script>
|
||||
|
||||
<!-- load roman numeral parser -->
|
||||
<script src="../js/parsers/parser-roman.js"></script>
|
||||
</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 order & value column
|
||||
addParsedValues($('table'), [0,1,2,3,4]);
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -522,13 +522,14 @@
|
||||
|
||||
<h4 id="extras">Custom Parsers</h4>
|
||||
<ul>
|
||||
<li><a href="example-parsers-dates.html">Assorted date parsers</a> (<span class="version">v2.8</span>; <span class="version updated">v2.14</span>; includes weekday, month, two-digit year & <a href="http://sugarjs.com/dates">sugar.js</a> date parsers).</li>
|
||||
<li><a href="example-parsers-dates.html">Date parsers</a> (<span class="version">v2.8</span>; <span class="version updated">v2.14</span>; includes weekday, month, two-digit year & <a href="http://sugarjs.com/dates">sugar.js</a> date parsers).</li>
|
||||
<li><a href="example-parsers-file-type.html">File type parser</a> (<span class="version">v2.13</span>).</li>
|
||||
<li><a href="example-parsers-ignore-articles.html">Ignore leading articles parser</a> (Ignore "A", "An" and "The" in titles) (<span class="version">v2.8</span>).</li>
|
||||
<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.1</span>).</li>
|
||||
<li><a href="example-parsers-metric.html">Metric parser</a> (<span class="version">v2.8</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-ip-address.html">IPv6 address parser</a> (<span class="version">v2.12</span>).</li>
|
||||
<li><a href="example-parsers-file-type.html">File type parser</a> (<span class="version">v2.13</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-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>
|
||||
</ul>
|
||||
|
||||
|
||||
117
js/parsers/parser-roman.js
Normal file
117
js/parsers/parser-roman.js
Normal file
@ -0,0 +1,117 @@
|
||||
/*! Roman numeral parsers
|
||||
* code modified from both:
|
||||
* Steven Levithan @ http://blog.stevenlevithan.com/archives/javascript-roman-numeral-converter
|
||||
* Jonathan Snook comment @ http://blog.stevenlevithan.com/archives/javascript-roman-numeral-converter#comment-16140
|
||||
*/
|
||||
/*jshint jquery:true, unused:false */
|
||||
;(function($){
|
||||
"use strict";
|
||||
|
||||
// allow lower case roman numerals, since lists use i, ii, iii, etc.
|
||||
var validator = /^M*(?:D?C{0,3}|C[MD])(?:L?X{0,3}|X[CL])(?:V?I{0,3}|I[XV])$/i,
|
||||
matcher = /\b([MCDLXVI]+\b)/gi,
|
||||
lookup = { I:1, V:5, X:10, L:50, C:100, D:500, M:1000 };
|
||||
|
||||
$.tablesorter.addParser({
|
||||
id: 'roman',
|
||||
is: function(){
|
||||
return false;
|
||||
},
|
||||
format: function(s) {
|
||||
var val,
|
||||
roman = s.toUpperCase().split(''),
|
||||
num = 0;
|
||||
|
||||
// roman numerals not found!
|
||||
if ( !(s && validator.test(s)) ) {
|
||||
return s;
|
||||
}
|
||||
|
||||
while (roman.length) {
|
||||
val = lookup[roman.shift()];
|
||||
num += val * (val < lookup[roman[0]] ? -1 : 1);
|
||||
}
|
||||
|
||||
return num;
|
||||
},
|
||||
type: "numeric"
|
||||
});
|
||||
|
||||
$.tablesorter.addParser({
|
||||
id: 'roman-ignore',
|
||||
is: function(){
|
||||
return false;
|
||||
},
|
||||
format: function(s, table, cell, column) {
|
||||
var val, orig,
|
||||
c = table.config,
|
||||
ignore = $.isArray(c.roman_ignore) ? c.roman_ignore[column] : 0,
|
||||
// find roman numerals
|
||||
roman = ( isNaN(ignore) ?
|
||||
// ignore can be a regex or string
|
||||
$.trim( s.replace(ignore, '') ) :
|
||||
// or a number to ignore the last x letters...
|
||||
$.trim( s.substring(0, s.length - ignore) )
|
||||
).match(matcher),
|
||||
v = validator.test(roman),
|
||||
num = 0;
|
||||
|
||||
// roman numerals not found!
|
||||
if ( !(v) ) {
|
||||
return s;
|
||||
}
|
||||
|
||||
// save roman numeral for replacement
|
||||
orig = roman[0];
|
||||
roman = orig.toUpperCase().split('');
|
||||
|
||||
while (roman.length) {
|
||||
val = lookup[roman.shift()];
|
||||
// ignore non-roman numerals
|
||||
if (val) {
|
||||
num += val * (val < lookup[roman[0]] ? -1 : 1);
|
||||
}
|
||||
}
|
||||
|
||||
return num ? s.replace(orig, num) : s;
|
||||
},
|
||||
type: "text"
|
||||
});
|
||||
|
||||
$.tablesorter.addParser({
|
||||
id: 'roman-extract',
|
||||
is: function(){
|
||||
return false;
|
||||
},
|
||||
format: function(s) {
|
||||
var val,
|
||||
// find roman numerals
|
||||
roman = $.grep(s.split(/\b/), function(v, i){
|
||||
return validator.test(v) ? v : '';
|
||||
}).join('').match(matcher),
|
||||
|
||||
v = roman ? validator.test(roman) : 0,
|
||||
num = 0;
|
||||
|
||||
// roman numerals not found!
|
||||
if ( !(v) ) {
|
||||
return s;
|
||||
}
|
||||
|
||||
// save roman numeral for replacement
|
||||
roman = roman[0].toUpperCase().split('');
|
||||
|
||||
while (roman.length) {
|
||||
val = lookup[roman.shift()];
|
||||
// ignore non-roman numerals
|
||||
if (val) {
|
||||
num += val * (val < lookup[roman[0]] ? -1 : 1);
|
||||
}
|
||||
}
|
||||
|
||||
return num ? num : s;
|
||||
},
|
||||
type: "numeric"
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
Loading…
Reference in New Issue
Block a user