mirror of
https://github.com/Mottie/tablesorter.git
synced 2024-11-15 23:54:22 +00:00
Added file type parser
This commit is contained in:
Mottie
parent
8d37bdecda
commit
dd921f0fa2
190
docs/example-parsers-file-type.html
Normal file
190
docs/example-parsers-file-type.html
Normal file
@ -0,0 +1,190 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery plugin: Tablesorter 2.0 - File Type Parser</title>
|
||||
|
||||
<!-- jQuery -->
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.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 id="css">tr.group-header td {
|
||||
background: #eee;
|
||||
}
|
||||
.group-name {
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
}
|
||||
.group-count {
|
||||
color: #999;
|
||||
}
|
||||
.group-hidden {
|
||||
display: none;
|
||||
}
|
||||
.group-header, .group-header td {
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
}
|
||||
/* collapsed arrow */
|
||||
tr.group-header td i {
|
||||
display: inline-block;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-top: 4px solid transparent;
|
||||
border-bottom: 4px solid #888;
|
||||
border-right: 4px solid #888;
|
||||
border-left: 4px solid transparent;
|
||||
margin-right: 7px;
|
||||
user-select: none;
|
||||
-moz-user-select: none;
|
||||
}
|
||||
tr.group-header.collapsed td i {
|
||||
border-top: 5px solid transparent;
|
||||
border-bottom: 5px solid transparent;
|
||||
border-left: 5px solid #888;
|
||||
border-right: 0;
|
||||
margin-right: 10px;
|
||||
}</style>
|
||||
|
||||
<!-- 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>
|
||||
|
||||
<!-- grouping widget -->
|
||||
<script src="../js/parsers/parser-file-type.js"></script>
|
||||
<script src="../js/widgets/widget-grouping.js"></script>
|
||||
|
||||
<script id="js">$(function() {
|
||||
|
||||
// basic list from http://en.wikipedia.org/wiki/List_of_file_formats
|
||||
// there is no need to include this unless you plan on replacing the
|
||||
// default settings completely
|
||||
$.tablesorter.fileTypes = {
|
||||
// divides filetype extensions in the equivalent list below
|
||||
separator : '|',
|
||||
equivalents : {
|
||||
"3D Image" : "3dm|3ds|dwg|max|obj",
|
||||
"Audio" : "aif|aac|ape|flac|la|m4a|mid|midi|mp2|mp3|ogg|ra|raw|rm|wav|wma",
|
||||
"Compressed" : "7z|bin|cab|cbr|gz|gzip|iso|lha|lz|rar|tar|tgz|zip|zipx|zoo",
|
||||
"Database" : "csv|dat|db|dbf|json|ldb|mdb|myd|pdb|sql|tsv|wdb|wmdb|xlr|xls|xlsx|xml",
|
||||
"Development" : "asm|c|class|cls|cpp|cc|cs|cxx|cbp|cs|dba|fla|h|java|lua|pl|py|pyc|pyo|sh|sln|r|rb|vb",
|
||||
"Document" : "doc|docx|odt|ott|pages|pdf|rtf|tex|wpd|wps|wrd|wri",
|
||||
"Executable" : "apk|app|com|exe|gadget|lnk|msi",
|
||||
"Fonts" : "eot|fnt|fon|otf|ttf|woff",
|
||||
"Icons" : "ani|cur|icns|ico",
|
||||
"Images" : "bmp|gif|jpg|jpeg|jpe|jp2|pic|png|psd|tga|tif|tiff|wmf|webp",
|
||||
"Presentation" : "pps|ppt",
|
||||
"Published" : "chp|epub|lit|pub|ppp|fm|mobi",
|
||||
"Script" : "as|bat|cgi|cmd|jar|js|lua|scpt|scptd|sh|vbs|vb|wsf",
|
||||
"Styles" : "css|less|sass",
|
||||
"Text" : "info|log|md|markdown|nfo|tex|text|txt",
|
||||
"Vectors" : "awg|ai|eps|cdr|ps|svg",
|
||||
"Video" : "asf|avi|flv|m4v|mkv|mov|mp4|mpe|mpeg|mpg|ogg|rm|rv|swf|vob|wmv",
|
||||
"Web" : "asp|aspx|cer|cfm|htm|html|php|url|xhtml"
|
||||
}
|
||||
};
|
||||
|
||||
// To add a custom equivalent, define:
|
||||
// $.tablesorter.fileTypes.equivalents['xx'] = "A|B|C";
|
||||
|
||||
// This demo uses the group widget to organize the file type equivalents
|
||||
$("table").tablesorter({
|
||||
theme: 'blue',
|
||||
widgets : [ 'group', 'zebra' ],
|
||||
widgetOptions: {
|
||||
group_separator : '-' // default setting
|
||||
}
|
||||
});
|
||||
|
||||
});</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="banner">
|
||||
<h1>table<em>sorter</em></h1>
|
||||
<h2>File Type Parser</h2>
|
||||
<h3>Flexible client-side table sorting</h3>
|
||||
<a href="index.html">Back to documentation</a>
|
||||
</div>
|
||||
<div id="main">
|
||||
|
||||
<p></p>
|
||||
<br>
|
||||
|
||||
<ul>
|
||||
<li>If this parser finds the file type extension within the equivalents list, it will add the equivalents group name to the beginning of the file so that during sorting, those file names will sort by the group they are in.</li>
|
||||
<li>Please look in the javascript code section below for a full list of default equivalents. This list is by no means extensive, but it can be easily modified or extended as needed.</li>
|
||||
<li>To add a new group to the equivalents list, just define a new group, <em>before initializing tablesorter</em>, as follows:
|
||||
<pre class="prettyprint lang-javascript">$.tablesorter.fileTypes.equivalents['xx'] = "A|B|C"</pre>
|
||||
</li>
|
||||
<li>But lets say your table is primarily being used to sort font file names, but you notice "svg" is listed under "vectors" (graphics) so you want to modify the equivalents list. Do it as follows:
|
||||
<pre class="prettyprint lang-javascript">$.tablesorter.fileTypes.equivalents["Vectors"] = "awg|ai|eps|cdr"; // redefine vectors without "svg"
|
||||
$.tablesorter.fileTypes.equivalents["Fonts"] += '|svg'; // just add it to the end (but first include the vertical bar = shift+\; above the enter key)!</pre>
|
||||
</li>
|
||||
<li>This parser only looks to see if an extension exists within the equivalents list, so any separator can be used (spaces, commas or vertical bars).</li>
|
||||
</ul>
|
||||
|
||||
<h1>Demo</h1>
|
||||
<div id="demo">
|
||||
|
||||
<button>Swap</button> (swap media column between "group-separator-1" & "group-separator-2")
|
||||
|
||||
<table class="tablesorter">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="sorter-filetype group-separator">Desktop Files</th>
|
||||
<th class="sorter-filetype group-separator-1">Tablesorter Files</th>
|
||||
<th id="media" class="group-separator-2">Media</th>
|
||||
<th class="sorter-filetype group-separator-1">Media Files</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td>github.url</td><td>package.json</td><td>Music Disc #1 - Green Day - Boulevard of Broken Dreams</td><td>Muse - Supermassive Black Hole.mp3</td></tr>
|
||||
<tr><td>tablesorter.zip</td><td>readme.md</td><td>Music Disc #1 - Green Day - Holiday</td><td>Gorillaz - Feel Good Inc.mp3</td></tr>
|
||||
<tr><td>learn-git.pdf</td><td>index.html</td><td>Music Disc #1 - M83 - Midnight City</td><td>M83 - Midnight City.mp4</td></tr>
|
||||
<tr><td>pancake-cat.jpg</td><td>jquery.tablesorter.js</td><td>Music Disc #1 - Bob Marley - Everything is Gonna Be Alright</td><td>Radiohead - Creep.ogg</td></tr>
|
||||
<tr><td>to-do-list.txt</td><td>theme.blue.css</td><td>Music Disc #1 - Bob Marley - Jamming</td><td>Ellie Goulding - Lights.flv</td></tr>
|
||||
<tr><td>css-tips.docx</td><td>theme.less</td><td>Music Disc #1 - Bob Marley - Oh, Baby I Love Your Way</td><td>Imagine Dragons - Radioactive.avi</td></tr>
|
||||
<tr><td>frisbee-cat.png</td><td>black-asc.gif</td><td>Music Disc #1 - Bob Marley - Red Red Wine</td><td>Muse - Supermassive Black Hole.avi</td></tr>
|
||||
<tr><td>Diablo.lnk</td><td>green-unsorted.psd</td><td>Music Disc #1 - Bob Marley - No Woman No Cry</td><td>Alex Clare - Too Close.wma</td></tr>
|
||||
<tr><td>Warcraft.lnk</td><td>jquery.tablesorter.widgets.js</td><td>Music Disc #2 - Sublime - Santeria</td><td>The XX - Intro.mp3</td></tr>
|
||||
<tr><td>google.url</td><td>glyphicons-halflings.png</td><td>Music Disc #2 - Sublime - What I Got</td><td>AWOLNATION - Sail.wmv</td></tr>
|
||||
<tr><td>swimming-cat.gif</td><td>component.json</td><td>Music Disc #2 - Massive Attack - Teardrop</td><td>Of Monsters and Men - Little Talks.m4a</td></tr>
|
||||
<tr><td>photo-album.zip</td><td>themes.html</td><td>Music Disc #2 - Massive Attack - Dissolved Girl</td><td>Nina Simone - Feeling Good.flac</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</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>
|
||||
|
||||
<script>
|
||||
/* DEMO ONLY CODE */
|
||||
$(function(){
|
||||
$('button').click(function(){
|
||||
$('#media').toggleClass('group-separator-1 group-separator-2');
|
||||
$('table').trigger('sorton', [ [[2,0]] ]);
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<div class="next-up">
|
||||
<hr />
|
||||
Next up: <a href="example-option-sort-force.html">Force a default sorting order ››</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -326,6 +326,8 @@
|
||||
<li><a href="example-widget-grouping.html">Input/select parsers</a> (used by Grouping rows widget) (<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-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.12.1</span>).</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
|
||||
73
js/parsers/parser-file-type.js
Normal file
73
js/parsers/parser-file-type.js
Normal file
@ -0,0 +1,73 @@
|
||||
/*! File Type parser
|
||||
* When a file type extension is found, the equivalent name is
|
||||
* prefixed into the parsed data, so sorting occurs in groups
|
||||
*/
|
||||
/*global jQuery: false */
|
||||
;(function($){
|
||||
"use strict";
|
||||
|
||||
// basic list from http://en.wikipedia.org/wiki/List_of_file_formats
|
||||
// To add a custom equivalent, define:
|
||||
// $.tablesorter.fileTypes.equivalents['xx'] = "A|B|C";
|
||||
$.tablesorter.fileTypes = {
|
||||
// divides filetype extensions in the equivalent list below
|
||||
separator : '|',
|
||||
equivalents : {
|
||||
"3D Image" : "3dm|3ds|dwg|max|obj",
|
||||
"Audio" : "aif|aac|ape|flac|la|m4a|mid|midi|mp2|mp3|ogg|ra|raw|rm|wav|wma",
|
||||
"Compressed" : "7z|bin|cab|cbr|gz|gzip|iso|lha|lz|rar|tar|tgz|zip|zipx|zoo",
|
||||
"Database" : "csv|dat|db|dbf|json|ldb|mdb|myd|pdb|sql|tsv|wdb|wmdb|xlr|xls|xlsx|xml",
|
||||
"Development" : "asm|c|class|cls|cpp|cc|cs|cxx|cbp|cs|dba|fla|h|java|lua|pl|py|pyc|pyo|sh|sln|r|rb|vb",
|
||||
"Document" : "doc|docx|odt|ott|pages|pdf|rtf|tex|wpd|wps|wrd|wri",
|
||||
"Executable" : "apk|app|com|exe|gadget|lnk|msi",
|
||||
"Fonts" : "eot|fnt|fon|otf|ttf|woff",
|
||||
"Icons" : "ani|cur|icns|ico",
|
||||
"Images" : "bmp|gif|jpg|jpeg|jpe|jp2|pic|png|psd|tga|tif|tiff|wmf|webp",
|
||||
"Presentation" : "pps|ppt",
|
||||
"Published" : "chp|epub|lit|pub|ppp|fm|mobi",
|
||||
"Script" : "as|bat|cgi|cmd|jar|js|lua|scpt|scptd|sh|vbs|vb|wsf",
|
||||
"Styles" : "css|less|sass",
|
||||
"Text" : "info|log|md|markdown|nfo|tex|text|txt",
|
||||
"Vectors" : "awg|ai|eps|cdr|ps|svg",
|
||||
"Video" : "asf|avi|flv|m4v|mkv|mov|mp4|mpe|mpeg|mpg|ogg|rm|rv|swf|vob|wmv",
|
||||
"Web" : "asp|aspx|cer|cfm|htm|html|php|url|xhtml"
|
||||
}
|
||||
};
|
||||
|
||||
$.tablesorter.addParser({
|
||||
id: 'filetype',
|
||||
is: function() {
|
||||
return false;
|
||||
},
|
||||
format: function(s, table) {
|
||||
var t,
|
||||
c = table.config,
|
||||
wo = c.widgetOptions,
|
||||
i = s.lastIndexOf('.'),
|
||||
sep = $.tablesorter.fileTypes.separator,
|
||||
m = $.tablesorter.fileTypes.matching,
|
||||
types = $.tablesorter.fileTypes.equivalents;
|
||||
if (!m) {
|
||||
// make a string to "quick" match the existing equivalents
|
||||
var t = [];
|
||||
$.each(types, function(i,v){
|
||||
t.push(v);
|
||||
});
|
||||
m = $.tablesorter.fileTypes.matching = sep + t.join(sep) + sep;
|
||||
}
|
||||
if (i >= 0) {
|
||||
t = sep + s.substring(i + 1, s.length) + sep;
|
||||
if (m.indexOf(t) >= 0) {
|
||||
for (i in types) {
|
||||
if ((sep + types[i] + sep).indexOf(t) >= 0) {
|
||||
return i + (wo.group_separator ? wo.group_separator : '-') + s;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return s;
|
||||
},
|
||||
type: 'text'
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
Loading…
Reference in New Issue
Block a user