Grouping: Add "group-date-hour" group type

This commit is contained in:
Rob Garrison 2016-08-31 13:20:45 -05:00
parent 6d1ab40ba0
commit 92c4adb3a8
No known key found for this signature in database
GPG Key ID: A6B138ABD8A3FF4A
4 changed files with 29 additions and 20 deletions

File diff suppressed because one or more lines are too long

View File

@ -165,6 +165,7 @@ tr.group-header.collapsed td i {
<li>This widget will <strong>only work</strong> in tablesorter version 2.8+ and jQuery version 1.7+.</li>
<li>Please do not use this widget in very large tables (it might be really slow) <del>or when your table includes multiple tbodies</del>.<br><br></li>
<li>In <span class="version updated">v2.27.6</span>, added <code>group-date-hour</code> group type to the Header Class Names.</li>
<li>In <span class="version updated">v2.25.4</span>, the zebra widget is reapplied to the table after opening a collapsed group.</li>
<li>In <span class="version">v2.24.1</span>
<ul>
@ -563,33 +564,37 @@ group_dateString : function(date, config, $header ) {
</tr>
<tr>
<td rowspan="7">Date</td>
<td rowspan="8">Date</td>
<td><code>&quot;group-date&quot;</code></td>
<td>Group the rows by full date (this shows the current UTC time corrected for your time zone).</td>
<td>Group the rows by full date (this shows the current UTC time corrected for your time zone) - <code>&quot;sorter-shortDate&quot;</code> parser needed.</td>
</tr>
<tr>
<td><code>&quot;group-date-year&quot;</code><span class="remark">*</span></td>
<td>Group the rows by year.</td>
<td>Group the rows by year - <code>&quot;sorter-shortDate&quot;</code> parser needed.</td>
</tr>
<tr>
<td><code>&quot;group-date-month&quot;</code><span class="remark">*</span></td>
<td>Group the rows by month.</td>
<td>Group the rows by month - <code>&quot;sorter-shortDate&quot;</code> parser needed.</td>
</tr>
<tr>
<td><code>&quot;group-date-monthyear&quot;</code><span class="remark">*</span></td>
<td>Group the rows by month &amp; year.</td>
</tr>
<tr>
<td><code>&quot;group-date-week&quot;</code><span class="remark">*</span></td>
<td>Group the rows by day of the week.</td>
<td>Group the rows by month &amp; year - <code>&quot;sorter-shortDate&quot;</code> parser needed.</td>
</tr>
<tr>
<td><code>&quot;group-date-day&quot;</code><span class="remark">*</span></td>
<td>Group the rows by month/day.</td>
<td>Group the rows by month/day - <code>&quot;sorter-shortDate&quot;</code> parser needed.</td>
</tr>
<tr>
<td><code>&quot;group-date-week&quot;</code><span class="remark">*</span></td>
<td>Group the rows by day of the week - <code>&quot;sorter-weekday-index&quot;</code> parser needed.</td>
</tr>
<tr>
<td><code>&quot;group-date-time&quot;</code><span class="remark">*</span></td>
<td>Group the rows by time.</td>
<td>Group the rows by time - <code>&quot;sorter-time&quot;</code> parser needed.</td>
</tr>
<tr>
<td><code>&quot;group-date-hour&quot;</code><span class="remark">*</span></td>
<td>Group the rows by each hour - <code>&quot;sorter-time&quot;</code> parser needed.</td>
</tr>
</tbody>
@ -827,10 +832,10 @@ $(function() {
</tfoot>
<tbody>
<tr><td><input type="checkbox" checked></td><td>1</td><td>10</td><td><select><option selected>A</option><option>B</option><option>C</option></select></td><td>Koala</td><td>abc 123</td><td><input type="text" value="item: truck" /></td><td>1/13/2013 12:01 AM</td></tr>
<tr><td><input type="checkbox"></td><td>3</td><td>29</td><td><select><option>A</option><option>B</option><option selected>C</option></select></td><td>Kangaroo</td><td>abc 1</td><td><input type="text" value="item: car" /></td><td>1/15/2013</td></tr>
<tr><td><input type="checkbox"></td><td>3</td><td>29</td><td><select><option>A</option><option>B</option><option selected>C</option></select></td><td>Kangaroo</td><td>abc 1</td><td><input type="text" value="item: car" /></td><td>1/15/2013 4:20 AM</td></tr>
<tr><td><input type="checkbox"></td><td>2</td><td>10</td><td><select><option>A</option><option>B</option><option selected>C</option></select></td><td>Ant</td><td>abc 9</td><td><input type="text" value="item: motorcycle" /></td><td>1/13/2013</td></tr>
<tr><td><input type="checkbox"></td><td>3</td><td>81</td><td><select><option>A</option><option selected>B</option><option>C</option></select></td><td>Bee</td><td>zyx 24</td><td><input type="text" value="item: golf cart" /></td><td>1/11/2013</td></tr>
<tr><td><input type="checkbox" checked></td><td>3</td><td>21</td><td><select><option>A</option><option selected>B</option><option>C</option></select></td><td>Aardwolf</td><td>zyx 55</td><td><input type="text" value="item: scooter" /></td><td>1/13/2013 03:30 AM</td></tr>
<tr><td><input type="checkbox"></td><td>3</td><td>81</td><td><select><option>A</option><option selected>B</option><option>C</option></select></td><td>Bee</td><td>zyx 24</td><td><input type="text" value="item: golf cart" /></td><td>1/11/2013 12:45 AM</td></tr>
<tr><td><input type="checkbox" checked></td><td>3</td><td>21</td><td><select><option>A</option><option selected>B</option><option>C</option></select></td><td>Aardwolf</td><td>zyx 55</td><td><input type="text" value="item: scooter" /></td><td>1/13/2013 3:30 AM</td></tr>
<tr><td><input type="checkbox"></td><td>1</td><td>3</td><td><select><option selected>A</option><option>B</option><option>C</option></select></td><td>Bear</td><td>abc 11</td><td><input type="text" /></td><td>1/15/2013</td></tr>
<tr><td><input type="checkbox"></td><td>4</td><td>12</td><td><select><option>A</option><option selected>B</option><option>C</option></select></td><td>Armadillo</td><td>zyx 2</td><td><input type="text" /></td><td>1/15/2013 12:30 PM</td></tr>
<tr><td><input type="checkbox" checked></td><td>2</td><td>56</td><td><select><option selected>A</option><option>B</option><option>C</option></select></td><td>Aardvark</td><td>abc 2</td><td><input type="text" value="item: skateboard" /></td><td>1/22/2013</td></tr>
@ -881,7 +886,7 @@ $(function() {
numcol = 2,
letcol = 4,
datecol = 7,
dateGroups = [ '', 'year', 'month', 'monthyear', 'day', 'week', 'time' ];
dateGroups = [ '', 'year', 'month', 'monthyear', 'day', 'week', 'time', 'hour' ];
// Numeric column slider
$( "#slider0" ).slider({
value: startBlock,
@ -941,7 +946,7 @@ $(function() {
if ( dateGroups[ui.value] === 'week' ) {
$h.addClass('sorter-weekday-index');
$groups.trigger('update', [ [[datecol,0]] ]);
} else if ( dateGroups[ui.value] === 'time' ) {
} else if ( dateGroups[ui.value] === 'time' || dateGroups[ui.value] === 'hour' ) {
$h.addClass('sorter-time');
$groups.trigger('update', [ [[datecol,0]] ]);
} else {

View File

@ -478,13 +478,13 @@
<li><span class="label label-info">Beta</span> <a href="example-widget-formatter.html">Formatter widget</a> (<span class="version">v2.19.1</span>).</li>
<li>Grouping rows widget:
<ul>
<li><a href="example-widget-grouping.html">basic</a> (v2.8; <span class="version updated">v2.27.0</span>).</li>
<li><a href="example-widget-grouping.html">basic</a> (v2.8; <span class="version updated">v2.27.6</span>).</li>
<li><a href="example-widget-grouping-filter-childrows.html">Grouping + filter + child rows</a> (<span class="updated version">v2.15.12</span>).</li>
</ul>
</li>
<li><a href="example-widget-header-titles.html">Header titles widget</a> (v2.15.6; <span class="version updated">v2.24.4</span>).</li>
<li><span class="label label-info">Beta</span> <a href="example-widget-lazyload.html">Lazyload widget</a> (<span class="version">v2.24.0</span>; <span class="version updated">v2.25.7</span>).</li>
<li><a href="example-widget-mark.html">Mark widget</a> (<span class="version">v2.27.2</span>).</li>
<li><a href="example-widget-mark.html">Mark widget</a> (<span class="version">v2.27.6</span>).</li>
<li><a href="example-widget-math.html">Math widget</a> (<span class="version">v2.16</span>; <span class="version updated">v2.27.0</span>).</li>
<li>
<a href="example-widget-output.html">Output widget</a> (<span class="version">v2.16</span>; <span class="version updated">v2.27.0</span>).

View File

@ -57,6 +57,7 @@
part === 'day' ? month + ' ' + time.getDate() :
part === 'week' ? tsg.findWeek( wo, time.getDay() ) :
part === 'time' ? tsg.findTime( wo, time ) :
part === 'hour' ? tsg.findTime( wo, time, 'hour' ) :
wo.group_dateString( time, c, $column );
} else {
return wo.group_dateInvalid;
@ -78,7 +79,7 @@
return wo.group_week[ cldrWeek[ day ] ];
}
},
findTime : function( wo, time ) {
findTime : function( wo, time, part ) {
var suffix,
// CLDR returns { am: "AM", pm: "PM", ... }
isObj = wo.group_time.am && wo.group_time.pm,
@ -89,6 +90,9 @@
hours = ( '00' + p24 ).slice(-2),
min = ( '00' + time.getMinutes() ).slice(-2);
suffix = wo.group_time[ isObj ? [ 'am', 'pm' ][ period ] : period ];
if ( part === 'hour' ) {
return hours;
}
return hours + ':' + min + ( wo.group_time24Hour ? '' : ' ' + ( suffix || '' ) );
},