From: Thierry Parmentelat <thierry.parmentelat@inria.fr>
Date: Tue, 3 Dec 2013 11:55:38 +0000 (+0100)
Subject: adding slickgrid’s controls/
X-Git-Url: http://git.onelab.eu/?p=myslice.git;a=commitdiff_plain;h=54010e8989520ee3238bf2edf576fb9c898c2336

adding slickgrid’s controls/
---

diff --git a/third-party/slickgrid-2.1/controls/slick.columnpicker.css b/third-party/slickgrid-2.1/controls/slick.columnpicker.css
new file mode 100644
index 00000000..bcbb3758
--- /dev/null
+++ b/third-party/slickgrid-2.1/controls/slick.columnpicker.css
@@ -0,0 +1,31 @@
+.slick-columnpicker {
+  border: 1px solid #718BB7;
+  background: #f0f0f0;
+  padding: 6px;
+  -moz-box-shadow: 2px 2px 2px silver;
+  -webkit-box-shadow: 2px 2px 2px silver;
+  box-shadow: 2px 2px 2px silver;
+  min-width: 100px;
+  cursor: default;
+}
+
+.slick-columnpicker li {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  background: none;
+}
+
+.slick-columnpicker input {
+  margin: 4px;
+}
+
+.slick-columnpicker li a {
+  display: block;
+  padding: 4px;
+  font-weight: bold;
+}
+
+.slick-columnpicker li a:hover {
+  background: white;
+}
diff --git a/third-party/slickgrid-2.1/controls/slick.columnpicker.js b/third-party/slickgrid-2.1/controls/slick.columnpicker.js
new file mode 100644
index 00000000..be0dc066
--- /dev/null
+++ b/third-party/slickgrid-2.1/controls/slick.columnpicker.js
@@ -0,0 +1,145 @@
+(function ($) {
+  function SlickColumnPicker(columns, grid, options) {
+    var $menu;
+    var columnCheckboxes;
+
+    var defaults = {
+      fadeSpeed:250
+    };
+
+    function init() {
+      grid.onHeaderContextMenu.subscribe(handleHeaderContextMenu);
+      grid.onColumnsReordered.subscribe(updateColumnOrder);
+      options = $.extend({}, defaults, options);
+
+      $menu = $("<span class='slick-columnpicker' style='display:none;position:absolute;z-index:20;' />").appendTo(document.body);
+
+      $menu.bind("mouseleave", function (e) {
+        $(this).fadeOut(options.fadeSpeed)
+      });
+      $menu.bind("click", updateColumn);
+
+    }
+
+    function handleHeaderContextMenu(e, args) {
+      e.preventDefault();
+      $menu.empty();
+      updateColumnOrder();
+      columnCheckboxes = [];
+
+      var $li, $input;
+      for (var i = 0; i < columns.length; i++) {
+        $li = $("<li />").appendTo($menu);
+        $input = $("<input type='checkbox' />").data("column-id", columns[i].id);
+        columnCheckboxes.push($input);
+
+        if (grid.getColumnIndex(columns[i].id) != null) {
+          $input.attr("checked", "checked");
+        }
+
+        $("<label />")
+            .text(columns[i].name)
+            .prepend($input)
+            .appendTo($li);
+      }
+
+      $("<hr/>").appendTo($menu);
+      $li = $("<li />").appendTo($menu);
+      $input = $("<input type='checkbox' />").data("option", "autoresize");
+      $("<label />")
+          .text("Force fit columns")
+          .prepend($input)
+          .appendTo($li);
+      if (grid.getOptions().forceFitColumns) {
+        $input.attr("checked", "checked");
+      }
+
+      $li = $("<li />").appendTo($menu);
+      $input = $("<input type='checkbox' />").data("option", "syncresize");
+      $("<label />")
+          .text("Synchronous resize")
+          .prepend($input)
+          .appendTo($li);
+      if (grid.getOptions().syncColumnCellResize) {
+        $input.attr("checked", "checked");
+      }
+
+      $menu
+          .css("top", e.pageY - 10)
+          .css("left", e.pageX - 10)
+          .fadeIn(options.fadeSpeed);
+    }
+
+    function updateColumnOrder() {
+      // Because columns can be reordered, we have to update the `columns`
+      // to reflect the new order, however we can't just take `grid.getColumns()`,
+      // as it does not include columns currently hidden by the picker.
+      // We create a new `columns` structure by leaving currently-hidden
+      // columns in their original ordinal position and interleaving the results
+      // of the current column sort.
+      var current = grid.getColumns().slice(0);
+      var ordered = new Array(columns.length);
+      for (var i = 0; i < ordered.length; i++) {
+        if ( grid.getColumnIndex(columns[i].id) === undefined ) {
+          // If the column doesn't return a value from getColumnIndex,
+          // it is hidden. Leave it in this position.
+          ordered[i] = columns[i];
+        } else {
+          // Otherwise, grab the next visible column.
+          ordered[i] = current.shift();
+        }
+      }
+      columns = ordered;
+    }
+
+    function updateColumn(e) {
+      if ($(e.target).data("option") == "autoresize") {
+        if (e.target.checked) {
+          grid.setOptions({forceFitColumns:true});
+          grid.autosizeColumns();
+        } else {
+          grid.setOptions({forceFitColumns:false});
+        }
+        return;
+      }
+
+      if ($(e.target).data("option") == "syncresize") {
+        if (e.target.checked) {
+          grid.setOptions({syncColumnCellResize:true});
+        } else {
+          grid.setOptions({syncColumnCellResize:false});
+        }
+        return;
+      }
+
+      if ($(e.target).is(":checkbox")) {
+        var visibleColumns = [];
+        $.each(columnCheckboxes, function (i, e) {
+          if ($(this).is(":checked")) {
+            visibleColumns.push(columns[i]);
+          }
+        });
+
+        if (!visibleColumns.length) {
+          $(e.target).attr("checked", "checked");
+          return;
+        }
+
+        grid.setColumns(visibleColumns);
+      }
+    }
+
+    function getAllColumns() {
+      return columns;
+    }
+
+    init();
+
+    return {
+      "getAllColumns": getAllColumns
+    };
+  }
+
+  // Slick.Controls.ColumnPicker
+  $.extend(true, window, { Slick:{ Controls:{ ColumnPicker:SlickColumnPicker }}});
+})(jQuery);
diff --git a/third-party/slickgrid-2.1/controls/slick.pager.css b/third-party/slickgrid-2.1/controls/slick.pager.css
new file mode 100644
index 00000000..e360ec67
--- /dev/null
+++ b/third-party/slickgrid-2.1/controls/slick.pager.css
@@ -0,0 +1,41 @@
+.slick-pager {
+  width: 100%;
+  height: 26px;
+  border: 1px solid gray;
+  border-top: 0;
+  background: url('../images/header-columns-bg.gif') repeat-x center bottom;
+  vertical-align: middle;
+}
+
+.slick-pager .slick-pager-status {
+  display: inline-block;
+  padding: 6px;
+}
+
+.slick-pager .ui-icon-container {
+  display: inline-block;
+  margin: 2px;
+  border-color: gray;
+}
+
+.slick-pager .slick-pager-nav {
+  display: inline-block;
+  float: left;
+  padding: 2px;
+}
+
+.slick-pager .slick-pager-settings {
+  display: block;
+  float: right;
+  padding: 2px;
+}
+
+.slick-pager .slick-pager-settings * {
+  vertical-align: middle;
+}
+
+.slick-pager .slick-pager-settings a {
+  padding: 2px;
+  text-decoration: underline;
+  cursor: pointer;
+}
diff --git a/third-party/slickgrid-2.1/controls/slick.pager.js b/third-party/slickgrid-2.1/controls/slick.pager.js
new file mode 100644
index 00000000..b9c6b741
--- /dev/null
+++ b/third-party/slickgrid-2.1/controls/slick.pager.js
@@ -0,0 +1,147 @@
+(function ($) {
+  function SlickGridPager(dataView, grid, $container) {
+    var $status;
+
+    function init() {
+      dataView.onPagingInfoChanged.subscribe(function (e, pagingInfo) {
+        updatePager(pagingInfo);
+      });
+
+      constructPagerUI();
+      updatePager(dataView.getPagingInfo());
+    }
+
+    function getNavState() {
+      var cannotLeaveEditMode = !Slick.GlobalEditorLock.commitCurrentEdit();
+      var pagingInfo = dataView.getPagingInfo();
+      var lastPage = pagingInfo.totalPages - 1;
+
+      return {
+        canGotoFirst: !cannotLeaveEditMode && pagingInfo.pageSize != 0 && pagingInfo.pageNum > 0,
+        canGotoLast: !cannotLeaveEditMode && pagingInfo.pageSize != 0 && pagingInfo.pageNum != lastPage,
+        canGotoPrev: !cannotLeaveEditMode && pagingInfo.pageSize != 0 && pagingInfo.pageNum > 0,
+        canGotoNext: !cannotLeaveEditMode && pagingInfo.pageSize != 0 && pagingInfo.pageNum < lastPage,
+        pagingInfo: pagingInfo
+      }
+    }
+
+    function setPageSize(n) {
+      dataView.setRefreshHints({
+        isFilterUnchanged: true
+      });
+      dataView.setPagingOptions({pageSize: n});
+    }
+
+    function gotoFirst() {
+      if (getNavState().canGotoFirst) {
+        dataView.setPagingOptions({pageNum: 0});
+      }
+    }
+
+    function gotoLast() {
+      var state = getNavState();
+      if (state.canGotoLast) {
+        dataView.setPagingOptions({pageNum: state.pagingInfo.totalPages - 1});
+      }
+    }
+
+    function gotoPrev() {
+      var state = getNavState();
+      if (state.canGotoPrev) {
+        dataView.setPagingOptions({pageNum: state.pagingInfo.pageNum - 1});
+      }
+    }
+
+    function gotoNext() {
+      var state = getNavState();
+      if (state.canGotoNext) {
+        dataView.setPagingOptions({pageNum: state.pagingInfo.pageNum + 1});
+      }
+    }
+
+    function constructPagerUI() {
+      $container.empty();
+
+      var $nav = $("<span class='slick-pager-nav' />").appendTo($container);
+      var $settings = $("<span class='slick-pager-settings' />").appendTo($container);
+      $status = $("<span class='slick-pager-status' />").appendTo($container);
+
+      $settings
+          .append("<span class='slick-pager-settings-expanded' style='display:none'>Show: <a data=0>All</a><a data='-1'>Auto</a><a data=25>25</a><a data=50>50</a><a data=100>100</a></span>");
+
+      $settings.find("a[data]").click(function (e) {
+        var pagesize = $(e.target).attr("data");
+        if (pagesize != undefined) {
+          if (pagesize == -1) {
+            var vp = grid.getViewport();
+            setPageSize(vp.bottom - vp.top);
+          } else {
+            setPageSize(parseInt(pagesize));
+          }
+        }
+      });
+
+      var icon_prefix = "<span class='ui-state-default ui-corner-all ui-icon-container'><span class='ui-icon ";
+      var icon_suffix = "' /></span>";
+
+      $(icon_prefix + "ui-icon-lightbulb" + icon_suffix)
+          .click(function () {
+            $(".slick-pager-settings-expanded").toggle()
+          })
+          .appendTo($settings);
+
+      $(icon_prefix + "ui-icon-seek-first" + icon_suffix)
+          .click(gotoFirst)
+          .appendTo($nav);
+
+      $(icon_prefix + "ui-icon-seek-prev" + icon_suffix)
+          .click(gotoPrev)
+          .appendTo($nav);
+
+      $(icon_prefix + "ui-icon-seek-next" + icon_suffix)
+          .click(gotoNext)
+          .appendTo($nav);
+
+      $(icon_prefix + "ui-icon-seek-end" + icon_suffix)
+          .click(gotoLast)
+          .appendTo($nav);
+
+      $container.find(".ui-icon-container")
+          .hover(function () {
+            $(this).toggleClass("ui-state-hover");
+          });
+
+      $container.children().wrapAll("<div class='slick-pager' />");
+    }
+
+
+    function updatePager(pagingInfo) {
+      var state = getNavState();
+
+      $container.find(".slick-pager-nav span").removeClass("ui-state-disabled");
+      if (!state.canGotoFirst) {
+        $container.find(".ui-icon-seek-first").addClass("ui-state-disabled");
+      }
+      if (!state.canGotoLast) {
+        $container.find(".ui-icon-seek-end").addClass("ui-state-disabled");
+      }
+      if (!state.canGotoNext) {
+        $container.find(".ui-icon-seek-next").addClass("ui-state-disabled");
+      }
+      if (!state.canGotoPrev) {
+        $container.find(".ui-icon-seek-prev").addClass("ui-state-disabled");
+      }
+
+      if (pagingInfo.pageSize == 0) {
+        $status.text("Showing all " + pagingInfo.totalRows + " rows");
+      } else {
+        $status.text("Showing page " + (pagingInfo.pageNum + 1) + " of " + pagingInfo.totalPages);
+      }
+    }
+
+    init();
+  }
+
+  // Slick.Controls.Pager
+  $.extend(true, window, { Slick:{ Controls:{ Pager:SlickGridPager }}});
+})(jQuery);