So I created a plugin (basically one of your modified plugins) for duration (00:00:00 & 00:00)
And since It's a kak idea to manipulate data server side for display purposes, and that have 00:00:03 is bad ux, it makes sense to render the data differently in the user side.
Now I could quite easily get all the cells of the duration datatype and manipulate them after render, but that is quite nasty, ideally the plugin should encapsulate the rendering.
this is where I'm at, which is not ideal because it requires the user to specify the rendering manually, but at least its still encapsulated in the plugin:
Plugin:
/**
* This plug-in will add automatic detection for time columns to
* DataTables.
*
* The following duration formats are supported:
* <ul>
* <li>10:10</li>
* <li>10:10:10</li>
* <li>123:10:10</li>
* <li>1234:10:10</li>
* </ul>
*
*
* @name Duration
* @summary detect timed time format
* @author Rijnhard Hessel
*/
(function(){
var typeName = 'duration';
/*
* supports:
* 10:10
* 10:10:10
* 123:10:10
* 1234:10:10
*/
var durationRegex = '^(([0-9]{2,4}):)?([0-9]{2}):([0-9]{2})$';
// Init the regex just once for speed
var regex = new RegExp(durationRegex);
jQuery.fn.dataTableExt.aTypes.unshift(
function (data) {
if (typeof data === 'string' && regex.test(data) ) {
return typeName;
}
return null;
}
);
jQuery.fn.dataTable.render[typeName] = function() {
var prefix = '00:';
return {
display: function ( d ) {
//80% faster then regex
if (8 === d.length && d.substr(0, 3) === prefix) {
console.debug('render duration modify:', d);
return d.slice(3);
}
//console.debug('render duration:', d);
return d;
}
};
};
jQuery.extend(jQuery.fn.dataTableExt.oSort, {
"duration-pre": function ( a ) {
var matches = regex.exec(a);
var total = 0;
var hours = parseInt(matches[2], 10);
if (!isNaN(hours)) { //hours
total += hours * 60 * 60;
}
// minutes + sec
total += (parseInt(matches[3]) * 60) + parseInt(matches[4]);
return total;
},
"duration-asc": function ( a, b ) {
return a - b;
},
"duration-desc": function ( a, b ) {
return b - a;
}
});
}());
User init
var dt = $('#peanutsAndJelly').DataTable({
columnDefs: [{
targets: 'timed', //class for target
type: 'duration',
render: $.fn.dataTable.render.duration()
}]
});
So basically is there another way where I can specify the default renderer for a datatype?
Googlefu and digging in the DataTables source only got me this far.