<%= javascript_tag do %> function disableLinks() { $('a.btn.disabled').click(function (e) { e.preventDefault(); }); } eventsOrder = ["START_ENTITLEMENT", "START_BILLING", "PAUSE_ENTITLEMENT", "PAUSE_BILLING", "RESUME_ENTITLEMENT", "RESUME_BILLING", "PHASE", "CHANGE", "STOP_ENTITLEMENT", "STOP_BILLING", "INVOICE", "AUTHORIZE", "PURCHASE", "CAPTURE", "CREDIT", "REFUND", "VOID", "CHARGEBACK"]; jQuery.fn.dataTableExt.oSort['timeline-event-asc'] = function(e1,e2) { var x = eventsOrder.indexOf(e1); var y = eventsOrder.indexOf(e2); return ((x < y) ? -1 : ((x > y) ? 1 : 0)); }; jQuery.fn.dataTableExt.oSort['timeline-event-desc'] = function(e1,e2) { var x = eventsOrder.indexOf(e1); var y = eventsOrder.indexOf(e2); return ((x < y) ? 1 : ((x > y) ? -1 : 0)); }; function extractTitleAttributeFromText(txt) { // Ugly - better way of doing this? var matches = txt.match(/title="\w+"/g); if (matches == null || matches.size == 0) { return null; } return matches[0].split('=')[1]; } jQuery.fn.dataTableExt.oSort['timeline-details-asc'] = function(e1,e2) { var x = extractTitleAttributeFromText(e1); var y = extractTitleAttributeFromText(e2); return ((x < y) ? -1 : ((x > y) ? 1 : 0)); }; jQuery.fn.dataTableExt.oSort['timeline-details-desc'] = function(e1,e2) { var x = extractTitleAttributeFromText(e1); var y = extractTitleAttributeFromText(e2); return ((x < y) ? 1 : ((x > y) ? -1 : 0)); }; function initTable() { return $("#timeline-table").dataTable({ "dom": "t", "paging": "false", "iDisplayLength": 100, "retrieve": true, // Force a predictive order for event types, invoices and payments "order": [[0, 'desc'], [2, 'desc']], "columns": [ { "type": 'date' }, null, { "type": 'timeline-event' }, { "type": 'timeline-details' }, null ] }); } function filterEachNode(rows) { var bundle = $("#bundles").val(); var event_to_filter = $('#event_types').val().toUpperCase(); for (i = 0; i < rows.length; i++) { tr = $(rows[i]); //filter bundles if (bundle == "" || tr.attr("title").split(",").indexOf(bundle) >= 0) { //first level filtering, so can remove hide tr.removeClass("hide"); } else { //remove tr's not under this filter mode tr.addClass("hide"); } //filter events if ("ALL" != event_to_filter) filterEvents(tr, event_to_filter); //add more filters here //do not unhide any rows } } function filterEvents(tr, event_to_filter) { tr_event_type = tr.data().event_type; core_events = ["INVOICE", "PAYMENT"]; //events which are not entitlements //is tr event not an event in question tr_event_does_not_match_filter = ("ENTITLEMENT" != event_to_filter && tr_event_type != event_to_filter); //tr event is not an entitlement tr_event_is_not_entitlement = ("ENTITLEMENT" == event_to_filter && core_events.indexOf(tr_event_type) >= 0); if ( tr_event_does_not_match_filter || tr_event_is_not_entitlement ) { //add hide to all who dont deserve the filter tr.addClass("hide"); } } function filterTable() { var dataTable = initTable(); var all_nodes = dataTable.fnGetNodes(); filterEachNode(all_nodes); //my rows are filtered, draw table dataTable.fnDraw(); } $(document).ready(function() { disableLinks(); // When going through the pages of the table, disable links as needed $('#timeline-table').bind('draw', function (e) { disableLinks(); }); initTable(); $("#bundles, #event_types").change(filterTable); filterTable(); }); <% end %>