mirror of
https://github.com/Mottie/tablesorter.git
synced 2024-11-15 23:54:22 +00:00
Add searching to main document page
This commit is contained in:
Mottie
parent
d544d46402
commit
0d1d3d249c
@ -43,6 +43,7 @@ ul {list-style:square;}
|
||||
#root #banner h2 { margin-right: 100px; }
|
||||
#banner h3 {clear:both;display:block;font-size:12px;margin-top:-20px;border-bottom:1px solid #888;}
|
||||
#banner a {display:block;font-size:14px;margin:5px 0 0;padding:10px 0 0;float:right;}
|
||||
.github-btn {border:0;overflow:hidden;vertical-align: middle;}
|
||||
a.external {background-image:url(../img/external.png);background-position:center right;background-repeat:no-repeat;padding-right:12px;}
|
||||
form {font-size:10pt;margin-bottom:20px;width:auto;}
|
||||
form fieldset {padding:10px;text-align:left;width:140px;}
|
||||
@ -53,7 +54,6 @@ p.small {padding-left: 25px;}
|
||||
p.tip em, div.tip em {padding: 2px; background-color: #6cf; color: #fff;}
|
||||
span.tip em {padding: 0 2px;background-color: #00ce53; color: #fff; font-size:90%; }
|
||||
span.tip.old em { background-color: #cfd; color: #000; }
|
||||
.beta:before { content: "Beta"; background: #888; border-radius: 3px; color: #fff; padding: 0 2px; margin: 0 4px 0 0; font-style: italic; }
|
||||
span.warn em { background-color: #ce5300; }
|
||||
tr td.lookhere, span.lookhere { background-color: rgba(230,191,153,0.5); }
|
||||
.ui-slider .ui-slider-handle { width: 0.8em; height: 0.8em; }
|
||||
@ -65,13 +65,11 @@ div.digg {float: right;}
|
||||
#pager-demo th.remove { width: 20px; } /* pager demo */
|
||||
#pager-demo button.remove { width: 20px; height: 20px; font-size: 10px; color: #800; }
|
||||
.box { width: 48%; min-width: 300px; float: left; padding: 0 1%; }
|
||||
a.deprecated,a.removed { color: #a00; }
|
||||
span.deprecated,.alert { background: #a00; color: #fff; padding: 1px 3px; }
|
||||
td a.alert { color: #a00; padding: 0; }
|
||||
span.alert { padding: 1px 3px; }
|
||||
.hidden { display: none; }
|
||||
.results { color: red; }
|
||||
.clear { clear: both; }
|
||||
.download { color: #fff; text-decoration: none; padding: 3px 10px; border: 1px solid #0c7396; background-color: #11aadd; background-image: -webkit-gradient(linear, left top, left bottom, from(#11aadd), to(#0d86ae )); background-image: -webkit-linear-gradient(top, #11aadd, #0d86ae ); background-image: -moz-linear-gradient(top, #11aadd, #0d86ae ); background-image: -o-linear-gradient(top, #11aadd, #0d86ae ); background-image: linear-gradient(to bottom, #11aadd, #0d86ae ); border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-shadow: 0 -1px 0 rgba(black, 0.4); box-shadow: 0 1px 5px rgba(black, 0.4); }
|
||||
.download:hover { background: #0d86ae; }
|
||||
.bootstrap_buttons button { margin: 5px 0 0 0; }
|
||||
#main .ui-accordion-header a { font-size: 14px; margin-left: 24px; }
|
||||
#main .ui-accordion-content { font-size: 14px; }
|
||||
|
||||
85
docs/css/menu.css
Normal file
85
docs/css/menu.css
Normal file
@ -0,0 +1,85 @@
|
||||
/* top menu - http://codepen.io/jetpacmonkey/pen/ktIJz */
|
||||
* { box-sizing: border-box; }
|
||||
html, body { min-height: 100%; }
|
||||
a { text-decoration: none; }
|
||||
|
||||
.main-header {
|
||||
background: #3B3B3B;
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
color: white;
|
||||
text-shadow: #222 0px -1px 1px;
|
||||
position: fixed;
|
||||
width: 2em;
|
||||
top: .5em;
|
||||
left: .5em;
|
||||
transition: all 0.3s ease;
|
||||
border-radius: 10px;
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
opacity: .5;
|
||||
}
|
||||
.main-header:hover { opacity: 1; }
|
||||
#main { transition: width 0.3s ease; }
|
||||
.main-nav-check { display: none; }
|
||||
.main-nav { position: fixed; top: 0; width: 0; height: 100%; background: #3B3B3B; color: #fff; overflow: hidden; transition: width 0.3s ease; }
|
||||
.main-nav h2 { margin: 0 0 10px 40px; color: #fff; font-size: 20px; }
|
||||
.main-nav em { color: #6cf; font-style: normal; }
|
||||
.main-nav a { display: block; background: linear-gradient(#3e3e3e, #383838); border-top: 1px solid #484848; border-bottom: 1px solid #2E2E2E; color: white; padding: 10px; }
|
||||
.main-nav a:hover, .main-nav a:focus { background: linear-gradient(#484848, #383838); color: white; text-decoration: none; }
|
||||
.main-nav:after { content: ""; position: absolute; top: 0; right: 0; height: 100%; width: 34px; background: linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)); }
|
||||
.content { padding: 100px 20px 20px 20px; }
|
||||
.close-menu { display: none; }
|
||||
#main-nav-check:checked + #main-nav { width: 250px; }
|
||||
#main-nav-check:checked ~ #main { margin-left: 250px; overflow: hidden; }
|
||||
#main-nav-check:checked ~ #main .open-menu { display: none; }
|
||||
#main-nav-check:checked ~ #main .close-menu { display: block; }
|
||||
#main-nav-check:checked ~ #main .main-header { opacity: 1; }
|
||||
#root #main-nav-check:checked ~ #main #banner h1 { padding-left: 0; }
|
||||
|
||||
#root p { margin: 1em 0; }
|
||||
#root #banner {margin:0;}
|
||||
#root #banner h1 { padding-left: 30px; border: 0; }
|
||||
#root #banner h2 { margin-right: 100px; }
|
||||
#root div#main h1, #root div#main h3 { margin: 0; line-height: normal; }
|
||||
#root #main { margin: 0; padding: 0 15px 15px 15px; }
|
||||
|
||||
.page-search { padding: 10px; }
|
||||
button.search-prev, button.search-next { font-size: 11px; padding: 6px 3px; }
|
||||
.input-group-btn { width: auto; }
|
||||
.search { width: 200px; }
|
||||
.status { float: right; font-size: 10px; margin: 9px 0 0 4px; }
|
||||
|
||||
.highlight { background: yellow; -webkit-border-radius: 4px; border-radius: 4px; padding: 0 5px; cursor: pointer; }
|
||||
.highlight.selected { background: orange; }
|
||||
|
||||
/*
|
||||
.main-header:hover { opacity: 1; }
|
||||
#main { float: right; transition: width 0.3s ease; }
|
||||
.main-nav-check { display: none; }
|
||||
.main-nav { position: fixed; top: 0; width: 0; height: 100%; background: #3B3B3B; color: #fff; overflow: hidden; transition: width 0.3s ease; }
|
||||
.main-nav h2 { margin: 0 0 10px 50px; color: #fff; font-size: 20px; }
|
||||
.main-nav em { color: #6cf; font-style: normal; }
|
||||
.main-nav a { display: block; background: linear-gradient(#3e3e3e, #383838); border-top: 1px solid #484848; border-bottom: 1px solid #2E2E2E; color: white; padding: 10px; }
|
||||
.main-nav a:hover, .main-nav a:focus { background: linear-gradient(#484848, #383838); }
|
||||
.main-nav:after { content: ""; position: absolute; top: 0; right: 0; height: 100%; width: 34px; background: linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.4)); }
|
||||
.content { padding: 100px 20px 20px 20px; }
|
||||
.close-menu { display: none; }
|
||||
#main-nav-check:checked + #main-nav { width: 250px; }
|
||||
#main-nav-check:checked ~ #main { width: 85%; }
|
||||
#main-nav-check:checked ~ #main .open-menu { display: none; }
|
||||
#main-nav-check:checked ~ #main .close-menu { display: block; }
|
||||
#root #main-nav-check:checked ~ #main #banner h1 { padding-left: 0; }
|
||||
|
||||
#root p { margin: 1em 0; }
|
||||
#root #banner {margin:0;}
|
||||
#root #banner h1 { padding-left: 30px; border: 0; }
|
||||
#root #banner h2 { margin-right: 100px; }
|
||||
#root div#main h1, #root div#main h3 { margin: 0; line-height: normal; }
|
||||
#root #main { margin: 0; padding: 0 15px 15px 15px; }
|
||||
|
||||
.page-search { padding: 10px; }
|
||||
|
||||
|
||||
*/
|
||||
116
docs/index.html
116
docs/index.html
@ -8,10 +8,13 @@
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
|
||||
|
||||
<!-- Demo stuff -->
|
||||
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="css/jq.css">
|
||||
<link rel="stylesheet" href="css/menu.css">
|
||||
<link href="css/prettify.css" rel="stylesheet">
|
||||
<script src="js/prettify.js"></script>
|
||||
<script src="js/docs.js"></script>
|
||||
<script src="js/search.js"></script>
|
||||
|
||||
<!-- Tablesorter: required -->
|
||||
<link href="../css/theme.blue.css" rel="stylesheet">
|
||||
@ -27,19 +30,61 @@
|
||||
</script>
|
||||
</head>
|
||||
<body id="root">
|
||||
<div id="banner">
|
||||
<h1>table<em>sorter</em></h1>
|
||||
<h2>Documentation</h2>
|
||||
<h3>Flexible client-side table sorting</h3>
|
||||
|
||||
<input type="checkbox" class="main-nav-check" id="main-nav-check" />
|
||||
<div class="main-nav" id="main-nav">
|
||||
<div class="page-search">
|
||||
<h2 class="title">table<em>sorter</em></h2>
|
||||
<div class="status"></div>
|
||||
<div class="input-group">
|
||||
<input type="search" placeholder="Find on page..." size="25" maxlength="25" class="search form-control input-sm">
|
||||
<div class="input-group-btn">
|
||||
<button type="button" class="search-prev btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-up"></span>
|
||||
</button>
|
||||
<button type="button" class="search-next btn btn-default">
|
||||
<span class="glyphicon glyphicon-chevron-down"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="#Introduction">Introduction</a>
|
||||
<a href="#Demo">Demo</a>
|
||||
<a href="#Getting-Started">Getting started</a>
|
||||
<a href="#Examples">Examples</a>
|
||||
<a href="#Configuration">Configuration</a>
|
||||
<a href="#Widget-options">Widget & Pager Options</a>
|
||||
<a href="#methods">Methods</a>
|
||||
<a href="#events">Events</a>
|
||||
<a href="#Download">Download</a>
|
||||
<a href="#Compatibility">Compatibility</a>
|
||||
<a href="#Support">Support</a>
|
||||
<a href="#Credits">Credits</a>
|
||||
</div>
|
||||
|
||||
<div id="main">
|
||||
|
||||
<label for="main-nav-check" class="toggle-menu main-header">
|
||||
☰
|
||||
</label>
|
||||
|
||||
<div id="banner">
|
||||
<h1>table<em>sorter</em></h1>
|
||||
<h2>Documentation</h2>
|
||||
<h3>Flexible client-side table sorting</h3>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
<strong>Author:</strong> Christian Bach<br>
|
||||
<strong>Version:</strong> <a class="current-version" href="https://github.com/Mottie/tablesorter/archive/master.zip">2.1+</a> (<a href="https://github.com/Mottie/tablesorter">forked on github</a> from <a href="http://tablesorter.com/docs/">version 2.0.5</a>, <a href="https://github.com/Mottie/tablesorter/wiki/Change">changelog</a>)<br>
|
||||
<strong>Maintainer:</strong> Rob Garrison (Mottie)<br>
|
||||
<strong>Version:</strong> <a class="current-version" href="https://github.com/Mottie/tablesorter/archive/master.zip">2.1+</a> (<a href="https://github.com/Mottie/tablesorter/wiki/Change">changelog</a>)
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=mottie&repo=tablesorter&type=fork&count=true" width="102" height="20" title="Fork on GitHub"></iframe>
|
||||
<iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=mottie&repo=tablesorter&type=watch&count=true" width="100" height="20" title="Star on GitHub"></iframe>
|
||||
<br>
|
||||
<strong>Licence:</strong>
|
||||
Dual licensed under <a class="external" href="http://www.opensource.org/licenses/mit-license.php">MIT</a>
|
||||
or <a class="external" href="http://www.opensource.org/licenses/gpl-license.php">GPL</a> licenses.
|
||||
or <a class="external" href="http://www.opensource.org/licenses/gpl-license.php">GPL</a> licenses.<br>
|
||||
</p>
|
||||
|
||||
<a id="Contents"></a>
|
||||
@ -161,10 +206,9 @@
|
||||
</table>
|
||||
|
||||
<p class="tip">
|
||||
<em>TIP!</em> Sort multiple columns simultaneously by holding down the <kbd>Shift</kbd> key and clicking a second, third or even fourth column header!
|
||||
<span class="label label-primary">TIP!</span> Sort multiple columns simultaneously by holding down the <kbd>Shift</kbd> key and clicking a second, third or even fourth column header!
|
||||
</p>
|
||||
|
||||
|
||||
<a id="Getting-Started"></a>
|
||||
<h1>Getting started</h1>
|
||||
<p>
|
||||
@ -244,7 +288,7 @@
|
||||
});</pre>
|
||||
|
||||
<p class="tip">
|
||||
<em>NOTE!</em> tablesorter will auto-detect most data types including numbers, dates, ip-adresses for more information see <a href="#Examples">Examples</a>
|
||||
<span class="label label-primary">NOTE!</span> tablesorter will auto-detect most data types including numbers, dates, ip-adresses for more information see <a href="#Examples">Examples</a>
|
||||
</p>
|
||||
|
||||
<a id="Examples"></a>
|
||||
@ -385,12 +429,12 @@
|
||||
<li><a href="http://jsfiddle.net/Mottie/abkNM/325/">tablesorter basic demo using jQuery UI theme</a></li>
|
||||
<li><a href="http://jsfiddle.net/Mottie/4mVfu/1/">tablesorter basic demo with pager plugin</a></li>
|
||||
<li><a href="http://codepen.io/Mottie/pen/eqBbn">tableSorter LESS theme; modify the colors dynamically in this LESS theme demo!</a></li>
|
||||
<li class="beta"> pager widget (<a href="example-widget-pager.html">basic</a> & <a href="example-widget-pager-ajax.html">ajax</a> demos) (<span class="version">v2.12</span>).</li>
|
||||
<li class="beta"> <a href="../beta-testing/example-pager-custom-controls.html">Custom pager control script</a></li>
|
||||
<li class="beta"> <a href="../beta-testing/example-external-filters-using-select2.html">External filters using Select2 plugin</a></li>
|
||||
<li class="beta"> <a href="../beta-testing/example-widget-column-reorder.html">Column reorder widget</a> - not working 100% with sticky headers</li>
|
||||
<li class="beta"> <a href="../beta-testing/example-widget-sum-columns.html">Column sum widget</a> - still needs LOTS of work!</li>
|
||||
<li>Check out the <a href="https://github.com/Mottie/tablesorter/wiki">home wiki page</a> <span class="tip"><em>more demos</em></span>!</li>
|
||||
<li><span class="label label-default">Beta</span> pager widget (<a href="example-widget-pager.html">basic</a> & <a href="example-widget-pager-ajax.html">ajax</a> demos) (<span class="version">v2.12</span>).</li>
|
||||
<li><span class="label label-default">Beta</span> <a href="../beta-testing/example-pager-custom-controls.html">Custom pager control script</a></li>
|
||||
<li><span class="label label-default">Beta</span> <a href="../beta-testing/example-external-filters-using-select2.html">External filters using Select2 plugin</a></li>
|
||||
<li><span class="label label-default">Beta</span> <a href="../beta-testing/example-widget-column-reorder.html">Column reorder widget</a> - not working 100% with sticky headers</li>
|
||||
<li><span class="label label-default">Beta</span> <a href="../beta-testing/example-widget-sum-columns.html">Column sum widget</a> - still needs LOTS of work!</li>
|
||||
<li>Check out the <a href="https://github.com/Mottie/tablesorter/wiki">home wiki page</a> <span class="label label-success"><em>more demos</em></span>!</li>
|
||||
</ul>
|
||||
|
||||
<h4 id="metadata">Metadata - setting inline options</h4>
|
||||
@ -409,7 +453,7 @@
|
||||
<div class="tip">
|
||||
<p></p>
|
||||
tablesorter has many options you can pass in at initialization to achieve different effects<br>
|
||||
<em>TIP!</em> Click on the link in the property column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location.
|
||||
<span class="label label-primary">TIP!</span> Click on the link in the property column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location.
|
||||
</div>
|
||||
|
||||
<table id="options" class="tablesorter options">
|
||||
@ -611,7 +655,7 @@
|
||||
As an example, I've split up this options table into three (3) tbodies. The first contains the active options, the second is the info block with a row that only contains the text "Deprecated Options", and the last tbody contains the deprecated options. Sort the table to see how each tbody sorts separately.
|
||||
<br>
|
||||
<p class="tip">
|
||||
<em>NOTE!</em> The pager plugin will only be applied to the first tbody, as always. I may work on modifying this behavior in the future, if I can figure out the best implementation.
|
||||
<span class="label label-primary">NOTE!</span> The pager plugin will only be applied to the first tbody, as always. I may work on modifying this behavior in the future, if I can figure out the best implementation.
|
||||
</p>
|
||||
</div>
|
||||
</td>
|
||||
@ -1070,7 +1114,7 @@ From the example function above, you'll end up with something similar to this HT
|
||||
});</pre></li>
|
||||
</ul>
|
||||
<p class="tip">
|
||||
<em>NOTE:</em> See the <a href="https://github.com/Mottie/tablesorter/wiki/Language">Language</a> wiki page for language specific examples and how to extend the character equivalent tables seen in the <a href="example-locale-sort.html">sortLocaleCompare demo</a>.
|
||||
<span class="label label-primary">NOTE!</span> See the <a href="https://github.com/Mottie/tablesorter/wiki/Language">Language</a> wiki page for language specific examples and how to extend the character equivalent tables seen in the <a href="example-locale-sort.html">sortLocaleCompare demo</a>.
|
||||
</p>
|
||||
<del>Boolean flag indicating whenever to use javascript <code>String.localeCompare</code> method or not.<br>
|
||||
This is only used when comparing text with international character strings. A sort using localeCompare will sort accented characters the same as their unaccented counterparts.</del>
|
||||
@ -1246,7 +1290,7 @@ $(function(){
|
||||
<td>Function</td>
|
||||
<td>null</td>
|
||||
<td>
|
||||
Replace the default sorting algorithm with a custom one using this option (<span class="version updated">v2.12</span>) - <span class="alert">*NOTE*</span> The parameters have changed!!.
|
||||
Replace the default sorting algorithm with a custom one using this option (<span class="version updated">v2.12</span>) - <span class="label label-warning">*NOTE*</span> The parameters have changed!!.
|
||||
<div class="collapsible">
|
||||
<br>
|
||||
Include a script like <a href="https://github.com/overset/javascript-natural-sort">naturalSort.js</a> as follows:
|
||||
@ -1494,11 +1538,11 @@ $(function(){
|
||||
|
||||
<tbody>
|
||||
<tr id="widgetcolumns">
|
||||
<td><a href="#" class="permalink deprecated">widgetColumns</a></td>
|
||||
<td><a href="#" class="permalink alert">widgetColumns</a></td>
|
||||
<td>Object with Array</td>
|
||||
<td>{ css:[ "primary", "secondary", "tertiary" ] }</td>
|
||||
<td>
|
||||
This option is being <span class="deprecated">deprecated</span>!
|
||||
This option is being <span class="label label-danger">deprecated</span>!
|
||||
It has been replaced by <a href="#widget-columns"><code>widgetOptions.columns</code></a>; but is still available for backwards compatibility.
|
||||
<div class="collapsible">
|
||||
<br>
|
||||
@ -1515,11 +1559,11 @@ $(function(){
|
||||
</tr>
|
||||
|
||||
<tr id="widgetuitheme">
|
||||
<td><a href="#" class="permalink deprecated">widgetUitheme</a></td>
|
||||
<td><a href="#" class="permalink alert">widgetUitheme</a></td>
|
||||
<td>Object with Array</td>
|
||||
<td>{ css: [ "ui-icon-arrowthick-2-n-s", "ui-icon-arrowthick-1-s", "ui-icon-arrowthick-1-n" ] }</td>
|
||||
<td>
|
||||
This option is being <span class="deprecated">deprecated</span>!
|
||||
This option is being <span class="label label-danger">deprecated</span>!
|
||||
It has been replaced by <a href="#widget-uitheme"><code>widgetOptions.uitheme</code></a>; but is still available for backwards compatibility.
|
||||
<div class="collapsible">
|
||||
<br>
|
||||
@ -1544,11 +1588,11 @@ $(function(){
|
||||
</tr>
|
||||
|
||||
<tr id="widgetzebra">
|
||||
<td><a href="#" class="permalink deprecated">widgetZebra</a></td>
|
||||
<td><a href="#" class="permalink alert">widgetZebra</a></td>
|
||||
<td>Object with Array</td>
|
||||
<td>{ css: [ "even", "odd" ] }</td>
|
||||
<td>
|
||||
This option is being <span class="deprecated">deprecated</span>!
|
||||
This option is being <span class="label label-danger">deprecated</span>!
|
||||
It has been replaced by <a href="#widget-zebra"><code>widgetOptions.zebra</code></a>; but is still available for backwards compatibility.
|
||||
<div class="collapsible">
|
||||
<br>
|
||||
@ -1597,7 +1641,7 @@ $(function(){
|
||||
</ul>
|
||||
|
||||
<br class="clear">
|
||||
<em>TIP!</em> Click on the link in the property column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location.
|
||||
<span class="label label-primary">TIP!</span> Click on the link in the property column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location.
|
||||
</div>
|
||||
|
||||
<table id="widget-options" class="tablesorter options">
|
||||
@ -2015,7 +2059,7 @@ $(function(){
|
||||
<br>
|
||||
This option is useful after one or more columns have been filtered, then the column select filter with this class applied will only show the contents of the column within the dropdown that are currently visible. See the <a href="example-widget-filter-custom.html">custom filter widget</a> demo "Discount" column for an example (sort the "First Name" column first).<br>
|
||||
<br>
|
||||
<span class="alert">Caution:</span> The main issue with this functionality is with keyboard accessibility. If the keyboard is used to select an option, only the first and default options will be available for chosing. The only way to select other options is with the mouse.
|
||||
<span class="label label-warning">Caution:</span> The main issue with this functionality is with keyboard accessibility. If the keyboard is used to select an option, only the first and default options will be available for chosing. The only way to select other options is with the mouse.
|
||||
</div>
|
||||
</td>
|
||||
<td><a href="example-widget-filter-custom.html">Example</a></td>
|
||||
@ -2981,11 +3025,11 @@ $.extend($.tablesorter.themes.jui, {
|
||||
|
||||
<tbody>
|
||||
<tr id="pager-offset">
|
||||
<td><a href="#" class="permalink removed">offset</a></td>
|
||||
<td><a href="#" class="permalink alert">offset</a></td>
|
||||
<td>Numeric</td>
|
||||
<td>0</td>
|
||||
<td>
|
||||
This pager plugin option has been <span class="alert">removed</span>!
|
||||
This pager plugin option has been <span class="label label-danger">removed</span>!
|
||||
<div class="collapsible">
|
||||
<br>
|
||||
The original tablesorter pager plugin absolutely positioned the pager controls at the bottom of the table. It appears that this option was intended to tweak the position of the pager container. The option exists, but no code was found.</div>
|
||||
@ -2994,11 +3038,11 @@ $.extend($.tablesorter.themes.jui, {
|
||||
</tr>
|
||||
|
||||
<tr id="pager-positionfixed">
|
||||
<td><a href="#" class="permalink removed">positionFixed</a></td>
|
||||
<td><a href="#" class="permalink alert">positionFixed</a></td>
|
||||
<td>Boolean</td>
|
||||
<td>true</td>
|
||||
<td>
|
||||
This pager plugin option has been <span class="alert">removed</span>!
|
||||
This pager plugin option has been <span class="label label-danger">removed</span>!
|
||||
<div class="collapsible">
|
||||
<br>
|
||||
If this option were true, the original tablesorter pager plugin would absolutely position the pager controls at the bottom of the table.</div>
|
||||
@ -3007,11 +3051,11 @@ $.extend($.tablesorter.themes.jui, {
|
||||
</tr>
|
||||
|
||||
<tr id="pager-seperator">
|
||||
<td><a href="#" class="permalink removed">seperator</a></td>
|
||||
<td><a href="#" class="permalink alert">seperator</a></td>
|
||||
<td>String</td>
|
||||
<td>"/"</td>
|
||||
<td>
|
||||
This pager plugin option has been <span class="alert">removed</span>! Use the <a href="#pager-output">output</a> option to allow for more control over the formatting.
|
||||
This pager plugin option has been <span class="label label-danger">removed</span>! Use the <a href="#pager-output">output</a> option to allow for more control over the formatting.
|
||||
<div class="collapsible">
|
||||
<br>
|
||||
The original tablesorter pager plugin would combine the current page with the calculated total number of pages within the <a href="#pager-csspagedisplay">cssPageDisplay</a> with this separator string inbetween.</div>
|
||||
@ -3029,7 +3073,7 @@ $.extend($.tablesorter.themes.jui, {
|
||||
<p></p>
|
||||
tablesorter has some methods available to allow updating, resorting or applying widgets to a table after it has been initialized.
|
||||
<br>
|
||||
<em>TIP!</em> Click on the link in the method column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location.
|
||||
<span class="label label-primary">TIP!</span> Click on the link in the method column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location.
|
||||
</div>
|
||||
|
||||
<table id="method" class="tablesorter">
|
||||
@ -3470,7 +3514,7 @@ $.tablesorter.addHeaderResizeEvent( table, true );</pre></div>
|
||||
<p></p>
|
||||
tablesorter has some methods available to allow updating, resorting or applying widgets to a table after it has been initialized.
|
||||
<br>
|
||||
<em>TIP!</em> Click on the link in the event column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location.
|
||||
<span class="label label-primary">TIP!</span> Click on the link in the event column to reveal full details (or <a href="#" class="toggleAll">toggle</a>|<a href="#" class="showAll">show</a>|<a href="#" class="hideAll">hide</a> all) or double click to update the browser location.
|
||||
</div>
|
||||
|
||||
<table id="event" class="tablesorter">
|
||||
@ -3801,7 +3845,7 @@ $.tablesorter.addHeaderResizeEvent( table, true );</pre></div>
|
||||
<a id="Download"></a>
|
||||
<h1>Download</h1>
|
||||
|
||||
<p><strong>Full release</strong> - Plugin, Documentation, Add-ons, Themes. Download: <a class="download zip" href="https://github.com/Mottie/tablesorter/archive/master.zip">zip</a> or <a class="download tar" href="https://github.com/Mottie/tablesorter/archive/master.tar.gz">tar.gz</a></p>
|
||||
<p><strong>Full release</strong> - Plugin, Documentation, Add-ons, Themes. Download: <a class="btn btn-primary" href="https://github.com/Mottie/tablesorter/archive/master.zip">zip</a> or <a class="btn btn-primary" href="https://github.com/Mottie/tablesorter/archive/master.tar.gz">tar.gz</a></p>
|
||||
|
||||
<p><strong>Pick n choose</strong> - Place at least the required files in a directory on your webserver that is accessible to a web browser. Record this location.</p>
|
||||
|
||||
|
||||
@ -84,7 +84,8 @@ $(function(){
|
||||
i = $t.text().replace(/(v|version|\+)/g, '').split('.');
|
||||
t = [ parseInt(i[0], 10) || 1, parseInt(i[1], 10) || 0 ];
|
||||
if (t[0] === v[0] && t[1] >= v[1] - 1 ) {
|
||||
$t.prepend('<span class="tip' + ( t[0] === v[0] && t[1] < v[1] ? ' old' : '' ) + '"><em>'+ ($t.hasClass('updated') ? 'Updated' : 'New') + '</em></span> ');
|
||||
$t.prepend('<span class="label ' + ( t[0] === v[0] && t[1] < v[1] ? ' label-default' : ' label-success' ) +
|
||||
'"><em>'+ ($t.hasClass('updated') ? 'Updated' : 'New') + '</em></span> ');
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
94
docs/js/search.js
Normal file
94
docs/js/search.js
Normal file
@ -0,0 +1,94 @@
|
||||
/* jQuery Highlight plugin
|
||||
* Based on highlight v3 by Johann Burkard
|
||||
* http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
|
||||
* Copyright (c) 2009 Bartek Szopka
|
||||
* Licensed under MIT license.
|
||||
*/
|
||||
;jQuery.extend({highlight:function(a,c,b,e){if(3===a.nodeType){if(c=a.data.match(c))return b=document.createElement(b||"span"),b.className=e||"highlight",a=a.splitText(c.index),a.splitText(c[0].length),e=a.cloneNode(!0),b.appendChild(e),a.parentNode.replaceChild(b,a),1}else if(1===a.nodeType&&a.childNodes&&!/(script|style)/i.test(a.tagName)&&(a.tagName!==b.toUpperCase()||a.className!==e))for(var d=0;d<a.childNodes.length;d++)d+=jQuery.highlight(a.childNodes[d],c,b,e);return 0}}); jQuery.fn.unhighlight=function(a){var c={className:"highlight",element:"span"};jQuery.extend(c,a);return this.find(c.element+"."+c.className).each(function(){var a=this.parentNode;a.replaceChild(this.firstChild,this);a.normalize()}).end()}; jQuery.fn.highlight=function(a,c){var b={className:"highlight",element:"span",caseSensitive:!1,wordsOnly:!1};jQuery.extend(b,c);a.constructor===String&&(a=[a]);a=jQuery.grep(a,function(a,b){return""!=a});a=jQuery.map(a,function(a,b){return a.replace(/[-[\]{}()*+?.,\\^$|#\s]/g,"\\$&")});if(0==a.length)return this;var e=b.caseSensitive?"":"i",d="("+a.join("|")+")";b.wordsOnly&&(d="\\b"+d+"\\b");var f=RegExp(d,e);return this.each(function(){jQuery.highlight(this,f,b.element,b.className)})};
|
||||
|
||||
/*!
|
||||
query-string
|
||||
Parse and stringify URL query strings
|
||||
https://github.com/sindresorhus/query-string
|
||||
by Sindre Sorhus
|
||||
MIT License
|
||||
*/
|
||||
(function(){var b={parse:function(a){return"string"!==typeof a?{}:(a=a.trim().replace(/^\?/,""))?a.trim().split("&").reduce(function(a,b){var c=b.replace(/\+/g," ").split("=");a[c[0]]=void 0===c[1]?null:decodeURIComponent(c[1]);return a},{}):{}},stringify:function(a){return a?Object.keys(a).map(function(b){return encodeURIComponent(b)+"="+encodeURIComponent(a[b])}).join("&"):""}};"undefined"!==typeof module&&module.exports?module.exports=b:window.queryString=b})();
|
||||
|
||||
/* page search */
|
||||
jQuery(function($){
|
||||
// $("body p").highlight(["jQuery", "highlight", "plugin"]);
|
||||
var resultsLength, searching,
|
||||
search = window.location.search,
|
||||
$results = [],
|
||||
index = 0,
|
||||
$window = $(window),
|
||||
$main = $('#main'),
|
||||
$body = $('body'),
|
||||
$status = $('.status'),
|
||||
updateStatus = function(){
|
||||
$status.empty();
|
||||
if (resultsLength) {
|
||||
$results.removeClass('selected').eq(index).addClass('selected');
|
||||
$status.html( (index + 1) + ' of ' + resultsLength );
|
||||
}
|
||||
},
|
||||
jumpTo = function(){
|
||||
if (resultsLength) {
|
||||
var resultPosition, parentPosition,
|
||||
windowHeight = $window.height(),
|
||||
$current = $results.eq(index),
|
||||
$collapsible = $current.closest('.collapsible, tr[id]');
|
||||
if ($collapsible.length && $collapsible.is(':hidden')) {
|
||||
$collapsible.slideToggle();
|
||||
}
|
||||
resultPosition = $current.position().top;
|
||||
parentPosition = $collapsible.length ? $current.closest('tr[id]').position().top : resultPosition;
|
||||
if (parentPosition + $(window).height() < resultPosition) {
|
||||
parentPosition = resultPosition;
|
||||
}
|
||||
$body.scrollTop( parentPosition - 28 );
|
||||
}
|
||||
updateStatus();
|
||||
},
|
||||
applySearch = function(){
|
||||
searching = queryString.parse(search);
|
||||
if (searching.q) {
|
||||
$('#main-nav-check').prop('checked', true);
|
||||
$('.search')
|
||||
.val( searching.q )
|
||||
// make searching.index a zero-based index
|
||||
.trigger('change', [ isNaN(searching.index) ? 0 : parseInt(searching.index, 10) - 1 ]);
|
||||
}
|
||||
};
|
||||
|
||||
$('.search').change(function(event, newIndex){
|
||||
index = newIndex || 0;
|
||||
$main.unhighlight().highlight( $(this).val() );
|
||||
$results = $('.highlight');
|
||||
resultsLength = $results.length;
|
||||
if (index > resultsLength) {
|
||||
index = resultsLength;
|
||||
}
|
||||
jumpTo();
|
||||
});
|
||||
$('.search-prev, .search-next').click(function(){
|
||||
if (resultsLength) {
|
||||
index = index + ($(this).hasClass('search-prev') ? -1 : 1);
|
||||
if (index < 0) { index = resultsLength - 1; }
|
||||
if (index > resultsLength - 1) { index = 0; }
|
||||
jumpTo();
|
||||
}
|
||||
});
|
||||
$main.on('click', '.highlight', function(){
|
||||
index = $results.index(this);
|
||||
updateStatus();
|
||||
});
|
||||
|
||||
// search on load
|
||||
// ?q=array&index=10
|
||||
if (search) {
|
||||
applySearch();
|
||||
}
|
||||
|
||||
});
|
||||
Loading…
Reference in New Issue
Block a user