tabulatr2 0.6.0 → 0.8.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: ed16072e8467181351d73105aa639ef912bf45ac
-  data.tar.gz: 2687df6d54ad1eb562ec38af9ee643659103f51d
+  metadata.gz: 8afaef013263f069bdbfe086da580b2bd33449fb
+  data.tar.gz: edaee24b2c81c45043ee7876dbe6ba6136278159
 SHA512:
-  metadata.gz: 94aa03bf3924604e5e9d884f58b61a605fdc2b79f557b0e40fb01953438c06f7a17516f2f6df7555ec1e2d3b27b29699744ba55c38a9cb7dd1d040aedae33ee4
-  data.tar.gz: 2b19e830e2ffd98159636950e057c8fc5939f9cf9922942af7d7f09326ec82bfa031497485f0d18f54b9f2b5dfce7db14b851df0f13d08753f1b436a87b660f8
+  metadata.gz: 4f7493f7ed0672f2795c5942dbe18a117b185d6bd9263ca212119c657305624602885fdb2687b1f9157b5d54ba374c659f1a5dcb151277f6a6d11a38b377913d
+  data.tar.gz: b6c653fb666e1d8a6135c627fa86c6992062cede9796e056824e82461e813af9a59722d9fbbbd13407c0ca71f422a3a7e1cd1964ff04eb088088c01ac8cde31c

data/Gemfile

@@ -5,7 +5,7 @@ gemspec
 gem 'tabulatr2', path: './', require: 'tabulatr'
 
 gem 'jquery-rails'
-
+gem 'slim'
 
 
 group :development, :test do

data/README.md

@@ -9,9 +9,19 @@ Require tabulatr2 in your Gemfile:
 ```ruby
 gem 'tabulatr2', github: 'provideal/tabulatr2', require: 'tabulatr'
 ```
-After that run `bundle` and `rails g tabulatr:install`.
+After that run `bundle install`.
 
-Also add `//= require tabulatr` to your application js file.
+Also add `//= require tabulatr` to your application js file and `*= require tabulatr` to your CSS asset
+pipeline.
+
+If you want to create a `tabulatr` table for an existing model run
+`rails g tabulatr:install product`.
+
+This will generate a `ProductTabulatrData` class in `app/tabulatr_data/product_tabulatr_data.rb` for you.
+
+You can also run the generator for a new model, if you just run the standard Rails `resource` generator.
+
+`rails g resource Product title:string vendor:references description:text`
 
 ### Security
 
@@ -33,10 +43,57 @@ end
 
 ### Models
 
-We suppose we have a couple of models
-* tags has and belong to many products
-* vendors have many products
-* products belong to vendors and have and belong to many tags
+We suppose we have these three models:
+```ruby
+class Tag < ActiveRecord::Base
+  has_and_belongs_to_many :products
+end
+```
+```ruby
+class Product < ActiveRecord::Base
+  belongs_to :vendor
+  has_and_belongs_to_many :tags
+end
+```
+```ruby
+class Vendor < ActiveRecord::Base
+  has_many :products
+end
+```
+
+and we want to display information about products in the `ProductsController#index` action.
+
+## ProductTabulatrData
+
+In this class we define which information should be available for the table and how it is formatted.
+```ruby
+class ProductTabulatrData < Tabulatr::Data
+
+  search :vendor_address, :title
+
+  # search do |query|
+  #   "products.title LIKE '#{query}'"
+  # end
+
+  column :id
+  column :title { title.capitalize }
+  column :price do "#{price} EUR" end
+  column :vendor_address, sort_sql: "vendors.zipcode || '' || vendors.city",
+                        filter_sql: "vendors.street || '' || vendors.zipcode || '' vendors.city" do
+         "#{vendor.house_number} #{vendor.street}, #{vendor.zipcode} #{vendor.city}"
+  end
+  column :edit_link do 
+    link_to "edit #{title}", product_path(id)
+  end
+  column :updated_at do
+    "#{updated_at.strftime('%H:%M %Y/%m/%d')}"
+  end
+  association :vendor, :name
+  association :tags, :title do "'#{tags.map(&:title).map(&:upcase).join(', ')}'" end
+
+end
+```
+The search method is used for a fuzzy search field.
 
 ## Controller
 
@@ -57,33 +114,26 @@ _Hint:_ If you want to prefilter your table, you can do that too! Just pass an `
 
 ### View
 
-To get a simple Table, all we need to do is
+In the view we can use all the attributes which are defined in our `ProductTabulatrData` class. 
 
 ```erb
   <%= table_for Product do |t|
     t.column :title
     t.column :price
-    t.column :active
     t.association :vendor, :name
+    t.column :vendor_address
+    t.column :updated_at
     t.association :tags, :title
+    t.column :edit_link
   end %>
 ```
 
 To add a checkbox column just add
-```ruby
-t.checkbox
-```
-
-
-To add e.g. edit-buttons, we would specify
-
 ```erb
-  t.action do |record|
-    link_to "Edit", edit_product_path(record.id)
-  end
+t.checkbox
 ```
 
-To add a select box with batch-actions (i.e., actions that are to be performed on all selected rows),
+To add a select box with batch-actions (actions that should be performed on all selected rows),
 we add an option to the table_for:
 
 ```erb
@@ -140,20 +190,15 @@ Tabulatr tries to make these common tasks as simple/transparent as possible:
 
 ### Table Options
 
-These options are to be specified at the `table_for` level and change the appearance and behaviour of the table.
+These options should be specified at the view level as parameters to the `table_for` call.
+They change the appearance and behaviour of the table.
 
 ```ruby
-  :table_class => 'tabulatr_table',               # class for the actual data table
-  :control_div_class_before => 'table-controls',  # class of upper div containing the paging and batch action controls
-  :control_div_class_after => 'table-controls',   # class of lower div containing the paging and batch action controls
-  :paginator_div_class => 'pagination',            # class of the div containing the paging controls
-
   # which controls to be rendered above and below the table and in which order
   :before_table_controls => [:filter, :paginator],
   :after_table_controls => [],
 
   :table_html => false,              # a hash with html attributes for the table
-  :row_html => false,                # a hash with html attributes for the normal trs
   :header_html => false,             # a hash with html attributes for the header trs
   :filter_html => false,             # a hash with html attributes for the filter trs
   :filter => true,                   # false for no filter row at all
@@ -161,7 +206,6 @@ These options are to be specified at the `table_for` level and change the appear
                                      # number for limit of items to show via pagination
   :sortable => true,                 # true to allow sorting (can be specified for every sortable column)
   :batch_actions => false,           # :name => value hash of batch action stuff
-  :footer_content => false,          # if given, add a <%= content_for <footer_content> %> before the </table>
   :path => '#'                       # where to send the AJAX-requests to
 ```
 

data/app/assets/javascripts/tabulatr/application.js

@@ -1,3 +1,24 @@
+//  Copyright (c) 2010-2014 Peter Horn & Florian Thomas, Provideal GmbH
+//
+//  Permission is hereby granted, free of charge, to any person obtaining
+//  a copy of this software and associated documentation files (the
+//  "Software"), to deal in the Software without restriction, including
+//  without limitation the rights to use, copy, modify, merge, publish,
+//  distribute, sublicense, and/or sell copies of the Software, and to
+//  permit persons to whom the Software is furnished to do so, subject to
+//  the following conditions:
+//
+//  The above copyright notice and this permission notice shall be
+//  included in all copies or substantial portions of the Software.
+//
+//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+//  EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+//  MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+//  NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+//  LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+//  OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+//  WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
 Tabulatr = {
   moreResults: true,
   storePage: false,
@@ -110,9 +131,10 @@ Tabulatr = {
   },
 
   insertTabulatrData: function(response){
-    columns = [];
-    tableId = response.meta.table_id;
-    tableName = tableId.split('_')[0];
+    var columns = [];
+    var tableId = response.meta.table_id;
+    var tableName = tableId.split('_')[0];
+    var tbody = $('#'+ tableId +' tbody');
     if(!response.meta.append){
       if(Tabulatr.storePage){
         $('#'+ tableId +' tbody tr').hide();
@@ -122,83 +144,35 @@ Tabulatr = {
     }
     if(response.data.length == 0){
       Tabulatr.moreResults = false;
-      $('.tabulatr_count[data-table='+ tableId +']').unbind('inview');
+      $('.pagination_trigger[data-table='+ tableId +']').unbind('inview');
     }else{
       if(response.data.length < response.meta.pagesize){
         Tabulatr.moreResults = false;
-        $('.tabulatr_count[data-table='+ tableId + ']').unbind('inview');
+        $('.pagination_trigger[data-table='+ tableId + ']').unbind('inview');
       }else{
         Tabulatr.moreResults = true;
       }
-      $('#'+ tableId +' th').each(function(ix,el){
-        var column_name = $(el).data('tabulatr-column-name');
-        var association = $(el).data('tabulatr-association');
-        var column_type = $(el).data('tabulatr-column-type');
-        var action = $(el).data('tabulatr-action');
-        var callback_methods = $(el).data('tabulatr-methods').split(',');
-        columns.push({ name: column_name,
-                       methods: callback_methods,
-                       type: column_type,
-                       association: association,
-                       action: action });
-      });
-      $('.empty_row').remove();
-
 
+      // insert the actual data
       for(var i = 0; i < response.data.length; i++){
-        $tr = $('<tr data-page="'+ response.meta.page +'"></tr>');
-        var td = '';
-        var column;
-        for(var c = 0; c < columns.length; c++){
-          column = columns[c];
-          if(column.association === undefined){
-            var value = response.data[i][column.name];
-          }else{
-            try{
-              var assoc = response.data[i][column.association];
-              if(Array.isArray(assoc)){
-                var arry = [];
-                for(var j = 0; j < assoc.length; j++){
-                  arry.push(assoc[j][column.name]);
-                }
-                var value = arry.join(', ');
-              }else{
-                var value = response.data[i][column.association][column.name];
-              }
-            }catch(e){
-              var value = '';
-            }
+        var data = response.data[i];
+        var id = data.id;
+        var tr = $('tr.empty_row').clone();
+        tr.removeClass('empty_row');
+        tr.attr('data-page', response.meta.page);
+        tr.attr('data-id', id);
+        tr.find('td').each(function(i,td_raw) {
+          var td = $(td_raw);
+          var coltype = td.data('tabulatr-type');
+          var name = td.data('tabulatr-column-name');
+          var cont = data[name]
+          if(coltype === 'checkbox') {
+            cont = $("<input>").attr('type', 'checkbox').val(id).addClass('tabulatr-checkbox');
           }
-          var formatters = column.methods;
-          $td = $('<td></td>');
-          if(column.type == 'checkbox'){
-            $td.html(Tabulatr.makeCheckboxFor(response.data[i]));
-          }else if(column.type == 'action'){
-            $td.html(Tabulatr.makeAction(column.action, response.data[i]));
-          }else{
-            if(value === false){
-              value = "false"; // because false won't be displayed
-            }
-            $td.html(value);
-            for(var j = 0; j < formatters.length; j++){
-              var fn = Tabulatr[formatters[j]];
-              if(typeof fn === 'function'){
-                try{
-                  var result = fn(value, $td, $tr, response.data[i]);
-                  if(result != null && result !== undefined){
-                    $td.html(result);
-                    value = result;
-                  }
-                }catch(e){
-                  $td.html('<span class="error">#ERROR</span>');
-                }
-              }
-            }
-          }
-          td += $td[0].outerHTML;
-        }
-        $tr.append(td);
-        $('#'+ tableId +' tbody').append($tr);
+          td.html(cont);
+
+        });
+        tbody.append(tr);
       }
     }
     var count_string = $('.tabulatr_count[data-table='+ tableId +']').data('format-string');
@@ -207,12 +181,6 @@ Tabulatr = {
     count_string = count_string.replace(/%\{per_page\}/,
       response.meta.pagesize);
     $('.tabulatr_count[data-table='+ tableId +']').html(count_string);
-
-  },
-
-  makeCheckboxFor: function(data){
-    return "<input type='checkbox' value='"+ data.id +
-    "' class='tabulatr-checkbox' />";
   },
 
   replacer: function(match, attribute, offset, string){
@@ -226,22 +194,16 @@ Tabulatr = {
   },
 
   createParameterString: function(hash, tableId){
-    tableName = tableId.split('_')[0];
+    var tableName = tableId.split('_')[0];
     if(hash === undefined){
       hash = {};
       hash.append = false;
     }
-    if($('#'+ tableId +' i.sorted').length == 1){
-      hash.sort_by = $('#'+ tableId +' i.sorted').closest('th').data('tabulatr-sorting-name');
-      if($('#'+ tableId +' i.sorted').data('sort') == 'asc'){
-        hash.orientation = 'desc';
-      }else{
-        hash.orientation = 'asc';
-      }
-    }
     if(hash.pagesize === undefined){
-      var pagesize = $('.tabulatr-per-page[data-table='+ tableId +'] a.active').data('items-per-page');
-      if(pagesize == null){ pagesize = 10; }
+      var pagesize = $('table#'+ tableId).data('pagesize');
+      if(pagesize == null) {
+        console.log('Tabulatr: No pagesize specified')
+      }
     }
     if(hash.page === undefined){
       hash.page = Math.floor($('#'+ tableId +' tbody tr[class!=empty_row]').length/pagesize) + 1;
@@ -250,12 +212,13 @@ Tabulatr = {
       }
     }
     hash.pagesize = pagesize;
-    hash.arguments = $.map($('#'+ tableId +' th'), function(n){ return $(n).data('tabulatr-column-name') })
-                      .filter(function(n){return n}).join();
-    hash.hash = $('#tabulatr_security_'+ tableName).data('hash');
-    hash.salt = $('#tabulatr_security_'+ tableName).data('salt');
+    hash.arguments = $.map($('#'+ tableId +' th'), function(n){
+      return $(n).data('tabulatr-column-name')
+    }).filter(function(n){return n}).join();
     hash.table_id = tableId;
-    var form_array = $('.tabulatr_filter_form[data-table='+ tableId +']').serializeArray();
+    hash[tableName + '_search'] = $('input#'+ tableName +'_fuzzy_search_query').val();
+    var form_array = $('.tabulatr_filter_form[data-table="'+ tableId +'"]')
+      .find('input:visible,select:visible,input[type=hidden]').serializeArray();
     for(var i = 0; i < form_array.length; i++){
       hash[form_array[i].name] = form_array[i].value;
     }
@@ -269,29 +232,24 @@ Tabulatr = {
 
 $(document).on('ready page:load', function(){
 
-  $('.tabulatr-sort').click(function(){
-    orientation = $(this).data('sort');
-    $($(this).parents('tr').find('.tabulatr-sort')).removeClass('sorted');
-    $(this).addClass('sorted');
-    var tableId = $(this).parents('table').attr('id');
+  $('th.tabulatr-sortable').click(function(){
+    var th = $(this);
+    var sort_by = th.data('tabulatr-column-name');
+    var dir = th.attr('data-sorted');
+    var table = th.parents('table');
+    var tableId = table.attr('id');
     var tableName = tableId.split('_')[0];
-    $($(this).parents('table').find('tbody tr')).remove();
-    $('.tabulatr_filter_form[data-table='+ tableId +'] input[name=orientation]').val(orientation);
-    var sort_by = $(this).closest('th').data('tabulatr-sorting-name');
-    $('.tabulatr_filter_form[data-table='+ tableId +'] input[name=sort_by]').val(sort_by);
-    if(orientation == 'asc'){
-      $(this).removeClass('icon-arrow-down').addClass('icon-arrow-up');
-      $(this).data('sort', 'desc');
-    }else{
-      $(this).addClass('icon-arrow-up').addClass('icon-arrow-down');
-      $(this).data('sort', 'asc');
-    }
+    table.find('th.tabulatr-sortable.sorted').removeClass('sorted').removeAttr('data-sorted');
+    dir = (dir === 'asc') ? 'desc' : 'asc';
+    th.addClass('sorted').attr('data-sorted', dir);
+    $('.tabulatr_filter_form[data-table='+ tableId +'] input[name='+ tableName +'_sort]').val(sort_by + ' '+  dir);
     if(!Tabulatr.moreResults){
       Tabulatr.moreResults = true;
       if($('.pagination[data-table='+ tableId +']').length == 0){
-        $('.tabulatr_count[data-table='+ tableId +']').bind('inview', cbfn);
+        $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
       }
     }
+    $($(this).parents('table').find('tbody tr')).remove();
 
     $('.tabulatr_mark_all[data-table='+ tableName +']').prop('checked', false).prop('indeterminate', false);
     Tabulatr.updateTable({}, tableId);
@@ -312,41 +270,40 @@ $(document).on('ready page:load', function(){
 
   $('.tabulatr_table').each(function(ix, el){
     if($('.pagination[data-table='+ $(el).attr('id') +']').length == 0){
-      $('.tabulatr_count[data-table='+ $(el).attr('id') +']').bind('inview', cbfn);
+      $('.pagination_trigger[data-table='+ $(el).attr('id') +']').bind('inview', cbfn);
     }
   });
 
   $('.batch-action-inputs').click(function(){
-    params = {page: 1};
-    params[$(this).attr('name')] = $(this).val();
-    var tableId = $(this).closest('table').attr('id');
+    var a = $(this);
+    var name = a.data('do-batch-action-name');
+    var key = a.data('do-batch-action');
+    var tableId = a.data('table-id');
+    var params = {page: 1};
+    params[name] = key;
     params['tabulatr_checked'] = {checked_ids: jQuery.map($('#'+ tableId +' .tabulatr-checkbox:checked'), function(el){return $(el).val();}).join(',')};
     $('.tabulatr_mark_all[data-table='+ tableId +']').prop('indeterminate', false).prop('checked', false);
     $('#'+ tableId +' .tabulatr-wrench').addClass('disabled');
     Tabulatr.updateTable(params, tableId, true);
   });
 
-  $('form.tabulatr_filter_form').submit(function(ev){
+  $('form.tabulatr-fuzzy-search').submit(function(){
     var tableId = $(this).data('table');
+    if($('.pagination[data-table='+ tableId +']').length == 0){
+      $('.pagination_trigger[data-table='+ tableId +']').unbind('inview', cbfn);
+      $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
+    }
     Tabulatr.updateTable({page: 1, append: false}, tableId, true);
-    var ary = $(this).serializeArray();
-    $('#'+ tableId +' th').removeClass('tabulatr_filtered_column');
-    $('#'+ tableId +' i.icon-remove-sign').remove();
-    for(var i = 0; i < ary.length; i++){
-      if(ary[i].value != ""){
-        var name = ary[i].name.replace(/\[(like|checkbox|from|to)\]/, '');
-        name = name.replace(/(:|\.|\[|\])/g,'\\$1');
-        // var attr = $(this).find("input[name="+ name +"]").data('tabulatr-attribute');
-        var $col = $('#'+ tableId +' th[data-tabulatr-form-name^='+ name +']');
-        if($col.length > 0){
-          $col.addClass('tabulatr_filtered_column');
-          // icon-remove-sign
-          $col.append('<i class="icon-remove-sign '+
-            'tabulatr_remove_filter" ></i>');
-        }
-      }
+    return false;
+  });
+
+  $('form.tabulatr_filter_form').submit(function(ev){
+    var tableId = $(this).data('table');
+    if($('.pagination[data-table='+ tableId +']').length == 0){
+      $('.pagination_trigger[data-table='+ tableId +']').unbind('inview', cbfn);
+      $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
     }
-    $('#tabulatr_filter_dialog_'+ tableId.split('_')[0]).modal('hide');
+    Tabulatr.updateTable({page: 1, append: false}, tableId, true);
     return false;
   });
 
@@ -363,6 +320,9 @@ $(document).on('ready page:load', function(){
     }
     var tableId = $(this).closest('.tabulatr_table').attr('id');
     $(this).remove();
+    if($('.pagination[data-table='+ tableId +']').length == 0){
+      $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
+    }
     Tabulatr.updateTable({}, tableId);
     return false;
   });
@@ -415,7 +375,7 @@ $(document).on('ready page:load', function(){
     var tableId = $(this).closest('div').data('table');
     Tabulatr.moreResults = true;
     if($('.pagination[data-table='+ tableId +']').length == 0){
-      $('.tabulatr_count[data-table='+ tableId +']').bind('inview', cbfn);
+      $('.pagination_trigger[data-table='+ tableId +']').bind('inview', cbfn);
     }
     if(typeof(Storage) !== undefined){
       localStorage.tabulatr_page_display_count = $(this).data('items-per-page');
@@ -450,3 +410,40 @@ $(document).on('click', '.pagination a', function(){
   Tabulatr.updateTable({append: false, page: a.data('page')}, tableId);
   return false;
 });
+
+
+// TODO: We absolutely need to clean that up!
+
+$(document).on('click', 'a[data-show-table-filter]', function(){
+  var a = $(this);
+  var nam = a.data('show-table-filter');
+  $('div[data-filter-column-name="'+nam+'"]').show('blind');
+  $('div[data-filter-column-name="_submit"]').show('blind');
+
+  a.hide();
+  return false;
+})
+
+$(document).on('click', 'a[data-hide-table-filter]', function(){
+  var a = $(this);
+  var nam = a.data('hide-table-filter');
+  var t = $('div[data-filter-column-name="'+nam+'"]');
+  t.hide('blind');
+  t.find('input[type=text]').val("");
+  $('a[data-show-table-filter="'+nam+'"]').show();
+  if ($('div[data-filter-column-name]:visible').length <= 2)
+    $('div[data-filter-column-name="_submit"]').hide('blind');
+  return false;
+})
+
+$(document).on('change', 'select[data-tabulatr-date-filter]', function() {
+  var select = $(this);
+  var option = select.find('option:selected');
+  var val = option.val();
+  console.log(val);
+  if (val === 'from_to') {
+    select.parents('.controls').find(".from_to").show().removeClass('hidden');
+  } else {
+    select.parents('.controls').find(".from_to").hide().val('');
+  }
+});