From 8baaae8b165350234b699ea973b8b19046042786 Mon Sep 17 00:00:00 2001 From: Felix Van der Jeugt Date: Fri, 11 Sep 2015 09:59:31 +0200 Subject: [PATCH 1/7] start with complete rewrite --- app/views/users/show.html.haml | 40 +++++++++++++++++----------------- 1 file changed, 20 insertions(+), 20 deletions(-) diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml index dfbea28..8484fae 100644 --- a/app/views/users/show.html.haml +++ b/app/views/users/show.html.haml @@ -5,14 +5,14 @@ %h3.panel-title Filters .panel-body .pure-g - .bound.input-listen.pure-u-1{ 'data-input-type': 'date-range' } + .bound.input-listen.pure-u-1{ 'data-input-type': 'date-range', 'data-input-value': ''} %fieldset.pure-group-inline %span.fa.fa-calendar.pure-group-addon %input.lower-bound{type: 'date', placeholder: 'after'} \- %input.upper-bound{type: 'date', placeholder: 'before'} .pure-g - .bound.input-listen.pure-u-1{ 'data-input-type': 'number-range' } + .bound.input-listen.pure-u-1{ 'data-input-type': 'number-range', 'data-input-value': ''} %fieldset.pure-group-inline %span.icon-euro.pure-group-addon %input.lower-bound.pure-group-addon{type: 'number', placeholder: 'Minimum'} @@ -21,11 +21,11 @@ %span.icon-euro.pure-group-addon %input.upper-bound.pure-group-addon{type: 'number', placeholder: 'Maximum'} .pure-g - .input-listen.pure-u-md-1-4{ 'data-input-type': 'text' } + .input-listen.pure-u-md-1-4{ 'data-input-type': 'text', 'data-input-value': ''} %input{type: 'text', placeholder: 'Filter on Issuer'} - .input-listen.pure-u-md-1-4{ 'data-input-type': 'text' } + .input-listen.pure-u-md-1-4{ 'data-input-type': 'text', 'data-input-value': ''} %input{type: 'text', placeholder: 'Filter on Peer'} - .input-listen.pure-u-md-1-2{ 'data-input-type': 'text' } + .input-listen.pure-u-md-1-2{ 'data-input-type': 'text', 'data-input-value': ''} %input{type: 'text', placeholder: 'Filter on Message'} @@ -56,27 +56,27 @@ { data: 'amount', name: 'Amount', width: "10%", className: 'min-mobile'}, { data: 'peer', name: 'Peer', width: "15%", className: 'min-mobile'}, { data: 'issuer', name: 'Issuer', width: "15%", className: 'min-desktop'}, - { data: 'message', name: 'Message', width: "45%", className: 'min-tablet-p'}, + { data: 'message', name: 'Message', width: "45%", className: 'min-tablet-p'} ] }); - var tds = $('.input-listen'); - var i = 0; - table.columns().every(function() { - var column = this - tds.eq(i).find('input').on('keyup change', function() { - var value = null; - var td = $(this).parent(); - if(td.hasClass('bound')) { - value = td.find('.lower-bound').val() + '~' + td.find('.upper-bound').val(); + $('.input-listen').each(function(index, element) { + var filter = $(element); + var type = filter.attr('data-input-type'); + filter.find('input').on('keyup change', function() { + var value = null + if(filter.hasClass('bound')) { + var lower = filter.find('.lower-bound'); + var upper = filter.find('.upper-bound'); + value = type + ':' + lower.val() + '~' + upper.val(); } else { - value = $(this).val() + value = type + ':' + $(this).val(); } - value = td.attr('data-input-type') + ':' + value - if(column.search() !== value) { - column.search(value).draw(); + if(filter.attr('data-input-value') !== value) { + console.log(value); + filter.attr('data-input-value', value); + // TODO $.post(...) } }); - i = i + 1; }); }); From 91a0023cd2c61bd130ab4d07196e5ce0a3fca9d6 Mon Sep 17 00:00:00 2001 From: Felix Van der Jeugt Date: Fri, 11 Sep 2015 10:24:29 +0200 Subject: [PATCH 2/7] revert part of rewrite, preparing for reverting the bad commit --- app/views/users/show.html.haml | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml index 8484fae..c7c75ba 100644 --- a/app/views/users/show.html.haml +++ b/app/views/users/show.html.haml @@ -5,14 +5,14 @@ %h3.panel-title Filters .panel-body .pure-g - .bound.input-listen.pure-u-1{ 'data-input-type': 'date-range', 'data-input-value': ''} + .bound.input-listen.pure-u-1{ 'data-input-type': 'date-range' } %fieldset.pure-group-inline %span.fa.fa-calendar.pure-group-addon %input.lower-bound{type: 'date', placeholder: 'after'} \- %input.upper-bound{type: 'date', placeholder: 'before'} .pure-g - .bound.input-listen.pure-u-1{ 'data-input-type': 'number-range', 'data-input-value': ''} + .bound.input-listen.pure-u-1{ 'data-input-type': 'number-range' } %fieldset.pure-group-inline %span.icon-euro.pure-group-addon %input.lower-bound.pure-group-addon{type: 'number', placeholder: 'Minimum'} @@ -21,11 +21,11 @@ %span.icon-euro.pure-group-addon %input.upper-bound.pure-group-addon{type: 'number', placeholder: 'Maximum'} .pure-g - .input-listen.pure-u-md-1-4{ 'data-input-type': 'text', 'data-input-value': ''} + .input-listen.pure-u-md-1-4{ 'data-input-type': 'text' } %input{type: 'text', placeholder: 'Filter on Issuer'} - .input-listen.pure-u-md-1-4{ 'data-input-type': 'text', 'data-input-value': ''} + .input-listen.pure-u-md-1-4{ 'data-input-type': 'text' } %input{type: 'text', placeholder: 'Filter on Peer'} - .input-listen.pure-u-md-1-2{ 'data-input-type': 'text', 'data-input-value': ''} + .input-listen.pure-u-md-1-2{ 'data-input-type': 'text' } %input{type: 'text', placeholder: 'Filter on Message'} @@ -63,6 +63,7 @@ $('.input-listen').each(function(index, element) { var filter = $(element); var type = filter.attr('data-input-type'); + var column = table.column(index); filter.find('input').on('keyup change', function() { var value = null if(filter.hasClass('bound')) { @@ -72,10 +73,9 @@ } else { value = type + ':' + $(this).val(); } - if(filter.attr('data-input-value') !== value) { - console.log(value); - filter.attr('data-input-value', value); - // TODO $.post(...) + value = filter.attr('data-input-type') + ':' + value; + if(column.search() !== value) { + column.search(value).draw(); } }); }); From 5e84d853fcddfc475cfb8bea9b369ff133ba13bb Mon Sep 17 00:00:00 2001 From: Felix Van der Jeugt Date: Fri, 11 Sep 2015 10:20:11 +0200 Subject: [PATCH 3/7] Revert "style user transaction table" This reverts commit da7fb11b78820756c45404aa595aab05abc8726e. --- app/views/users/show.html.haml | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml index c7c75ba..1ba0c3a 100644 --- a/app/views/users/show.html.haml +++ b/app/views/users/show.html.haml @@ -29,7 +29,7 @@ %input{type: 'text', placeholder: 'Filter on Message'} -%table#transactions.pure-table.pure-table-striped{data: { source: user_path(@user) }} +%table#transactions.display.responsive.no-wrap{data: { source: user_path(@user) }} %thead %tr %th Time @@ -44,8 +44,7 @@ var table = $('#transactions').DataTable({ processing: true, serverSide: true, - searching: false, - lengthChange: false, + searching: true, ordering: false, ajax: $('#transactions').data('source'), pagingType: 'full_numbers', From 9dcfa33d1605babb45b390db8dcefa8d813f1a32 Mon Sep 17 00:00:00 2001 From: Felix Van der Jeugt Date: Fri, 11 Sep 2015 10:34:04 +0200 Subject: [PATCH 4/7] reapply iasoon's pretty destructive styling in a non-destructive way --- app/views/users/show.html.haml | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml index 1ba0c3a..4984bff 100644 --- a/app/views/users/show.html.haml +++ b/app/views/users/show.html.haml @@ -29,7 +29,7 @@ %input{type: 'text', placeholder: 'Filter on Message'} -%table#transactions.display.responsive.no-wrap{data: { source: user_path(@user) }} +%table#transactions.pure-table.pure-table-striped{data: { source: user_path(@user) }} %thead %tr %th Time @@ -45,6 +45,7 @@ processing: true, serverSide: true, searching: true, + lengthChange: false, ordering: false, ajax: $('#transactions').data('source'), pagingType: 'full_numbers', @@ -59,6 +60,8 @@ ] }); + $('.dataTables_filter').hide(); + $('.input-listen').each(function(index, element) { var filter = $(element); var type = filter.attr('data-input-type'); From e621f6ef29bb01cafa702944a9fd4cdc5b04bf5c Mon Sep 17 00:00:00 2001 From: Ilion Beyst Date: Fri, 11 Sep 2015 10:39:06 +0200 Subject: [PATCH 5/7] re-enable filters --- app/controllers/concerns/data_table.rb | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/controllers/concerns/data_table.rb b/app/controllers/concerns/data_table.rb index 72d8918..abdfb4d 100644 --- a/app/controllers/concerns/data_table.rb +++ b/app/controllers/concerns/data_table.rb @@ -16,9 +16,9 @@ class DataTable end def query - #pred = predicates + pred = predicates q = @transactions.query - #q = q.where(pred) if pred + q = q.where(pred) if pred q end From fcb11bb036c3d2df512f3d6f3ce00b3cf18a2d30 Mon Sep 17 00:00:00 2001 From: Ilion Beyst Date: Fri, 11 Sep 2015 10:46:03 +0200 Subject: [PATCH 6/7] fix :name in predicates --- app/controllers/concerns/data_table.rb | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/app/controllers/concerns/data_table.rb b/app/controllers/concerns/data_table.rb index abdfb4d..722ce68 100644 --- a/app/controllers/concerns/data_table.rb +++ b/app/controllers/concerns/data_table.rb @@ -34,19 +34,19 @@ class DataTable def range_predicates name col = @params[:columns][name] [ - (@table[:name].gteq(col[:lower]) if col[:lower]), - (@table[:name].lteq(col[:upper]) if col[:upper]) + (@table[name].gteq(col[:lower]) if col[:lower]), + (@table[name].lteq(col[:upper]) if col[:upper]) ] end def eq_predicate name - value = @params[:columns][:name][:value] - @table[:name].eq(value) if value + value = @params[:columns][name][:value] + @table[name].eq(value) if value end def like_predicate name - value = @params[:columns][:name][:value] - @table[:name].matches("%#{value}%") if value + value = @params[:columns][name][:value] + @table[name].matches("%#{value}%") if value end private From 097389874389eed43c22755a2a912e21724a4d6b Mon Sep 17 00:00:00 2001 From: Felix Van der Jeugt Date: Fri, 11 Sep 2015 11:08:15 +0200 Subject: [PATCH 7/7] let filtering column depend on a data field, not the index --- app/views/users/show.html.haml | 17 +++++++++-------- 1 file changed, 9 insertions(+), 8 deletions(-) diff --git a/app/views/users/show.html.haml b/app/views/users/show.html.haml index 4984bff..6d75401 100644 --- a/app/views/users/show.html.haml +++ b/app/views/users/show.html.haml @@ -5,14 +5,14 @@ %h3.panel-title Filters .panel-body .pure-g - .bound.input-listen.pure-u-1{ 'data-input-type': 'date-range' } + .bound.input-listen.pure-u-1{ 'data-input-type': 'date-range', 'data-filter-name': 'Time' } %fieldset.pure-group-inline %span.fa.fa-calendar.pure-group-addon %input.lower-bound{type: 'date', placeholder: 'after'} \- %input.upper-bound{type: 'date', placeholder: 'before'} .pure-g - .bound.input-listen.pure-u-1{ 'data-input-type': 'number-range' } + .bound.input-listen.pure-u-1{ 'data-input-type': 'number-range', 'data-filter-name': 'Amount' } %fieldset.pure-group-inline %span.icon-euro.pure-group-addon %input.lower-bound.pure-group-addon{type: 'number', placeholder: 'Minimum'} @@ -21,11 +21,11 @@ %span.icon-euro.pure-group-addon %input.upper-bound.pure-group-addon{type: 'number', placeholder: 'Maximum'} .pure-g - .input-listen.pure-u-md-1-4{ 'data-input-type': 'text' } + .input-listen.pure-u-md-1-4{ 'data-input-type': 'text', 'data-filter-name': 'Issuer' } %input{type: 'text', placeholder: 'Filter on Issuer'} - .input-listen.pure-u-md-1-4{ 'data-input-type': 'text' } + .input-listen.pure-u-md-1-4{ 'data-input-type': 'text', 'data-filter-name': 'Peer' } %input{type: 'text', placeholder: 'Filter on Peer'} - .input-listen.pure-u-md-1-2{ 'data-input-type': 'text' } + .input-listen.pure-u-md-1-2{ 'data-input-type': 'text', 'data-filter-name': 'Message' } %input{type: 'text', placeholder: 'Filter on Message'} @@ -65,15 +65,16 @@ $('.input-listen').each(function(index, element) { var filter = $(element); var type = filter.attr('data-input-type'); - var column = table.column(index); + var column = table.column(filter.attr('data-filter-name') + ':name'); + console.log(column); filter.find('input').on('keyup change', function() { var value = null if(filter.hasClass('bound')) { var lower = filter.find('.lower-bound'); var upper = filter.find('.upper-bound'); - value = type + ':' + lower.val() + '~' + upper.val(); + value = lower.val() + '~' + upper.val(); } else { - value = type + ':' + $(this).val(); + value = $(this).val(); } value = filter.attr('data-input-type') + ':' + value; if(column.search() !== value) {