third-party/slickgrid-2.1/controls/slick.columnpicker.js

   1 (function ($) {
   2   function SlickColumnPicker(columns, grid, options) {
   3     var $menu;
   4     var columnCheckboxes;
   5
   6     var defaults = {
   7       fadeSpeed:250
   8     };
   9
  10     function init() {
  11       grid.onHeaderContextMenu.subscribe(handleHeaderContextMenu);
  12       grid.onColumnsReordered.subscribe(updateColumnOrder);
  13       options = $.extend({}, defaults, options);
  14
  15       $menu = $("<span class='slick-columnpicker' style='display:none;position:absolute;z-index:20;' />").appendTo(document.body);
  16
  17       $menu.bind("mouseleave", function (e) {
  18         $(this).fadeOut(options.fadeSpeed)
  19       });
  20       $menu.bind("click", updateColumn);
  21
  22     }
  23
  24     function handleHeaderContextMenu(e, args) {
  25       e.preventDefault();
  26       $menu.empty();
  27       updateColumnOrder();
  28       columnCheckboxes = [];
  29
  30       var $li, $input;
  31       for (var i = 0; i < columns.length; i++) {
  32         $li = $("<li />").appendTo($menu);
  33         $input = $("<input type='checkbox' />").data("column-id", columns[i].id);
  34         columnCheckboxes.push($input);
  35
  36         if (grid.getColumnIndex(columns[i].id) != null) {
  37           $input.attr("checked", "checked");
  38         }
  39
  40         $("<label />")
  41             .text(columns[i].name)
  42             .prepend($input)
  43             .appendTo($li);
  44       }
  45
  46       $("<hr/>").appendTo($menu);
  47       $li = $("<li />").appendTo($menu);
  48       $input = $("<input type='checkbox' />").data("option", "autoresize");
  49       $("<label />")
  50           .text("Force fit columns")
  51           .prepend($input)
  52           .appendTo($li);
  53       if (grid.getOptions().forceFitColumns) {
  54         $input.attr("checked", "checked");
  55       }
  56
  57       $li = $("<li />").appendTo($menu);
  58       $input = $("<input type='checkbox' />").data("option", "syncresize");
  59       $("<label />")
  60           .text("Synchronous resize")
  61           .prepend($input)
  62           .appendTo($li);
  63       if (grid.getOptions().syncColumnCellResize) {
  64         $input.attr("checked", "checked");
  65       }
  66
  67       $menu
  68           .css("top", e.pageY - 10)
  69           .css("left", e.pageX - 10)
  70           .fadeIn(options.fadeSpeed);
  71     }
  72
  73     function updateColumnOrder() {
  74       // Because columns can be reordered, we have to update the `columns`
  75       // to reflect the new order, however we can't just take `grid.getColumns()`,
  76       // as it does not include columns currently hidden by the picker.
  77       // We create a new `columns` structure by leaving currently-hidden
  78       // columns in their original ordinal position and interleaving the results
  79       // of the current column sort.
  80       var current = grid.getColumns().slice(0);
  81       var ordered = new Array(columns.length);
  82       for (var i = 0; i < ordered.length; i++) {
  83         if ( grid.getColumnIndex(columns[i].id) === undefined ) {
  84           // If the column doesn't return a value from getColumnIndex,
  85           // it is hidden. Leave it in this position.
  86           ordered[i] = columns[i];
  87         } else {
  88           // Otherwise, grab the next visible column.
  89           ordered[i] = current.shift();
  90         }
  91       }
  92       columns = ordered;
  93     }
  94
  95     function updateColumn(e) {
  96       if ($(e.target).data("option") == "autoresize") {
  97         if (e.target.checked) {
  98           grid.setOptions({forceFitColumns:true});
  99           grid.autosizeColumns();
 100         } else {
 101           grid.setOptions({forceFitColumns:false});
 102         }
 103         return;
 104       }
 105
 106       if ($(e.target).data("option") == "syncresize") {
 107         if (e.target.checked) {
 108           grid.setOptions({syncColumnCellResize:true});
 109         } else {
 110           grid.setOptions({syncColumnCellResize:false});
 111         }
 112         return;
 113       }
 114
 115       if ($(e.target).is(":checkbox")) {
 116         var visibleColumns = [];
 117         $.each(columnCheckboxes, function (i, e) {
 118           if ($(this).is(":checked")) {
 119             visibleColumns.push(columns[i]);
 120           }
 121         });
 122
 123         if (!visibleColumns.length) {
 124           $(e.target).attr("checked", "checked");
 125           return;
 126         }
 127
 128         grid.setColumns(visibleColumns);
 129       }
 130     }
 131
 132     function getAllColumns() {
 133       return columns;
 134     }
 135
 136     init();
 137
 138     return {
 139       "getAllColumns": getAllColumns
 140     };
 141   }
 142
 143   // Slick.Controls.ColumnPicker
 144   $.extend(true, window, { Slick:{ Controls:{ ColumnPicker:SlickColumnPicker }}});
 145 })(jQuery);