From 54010e8989520ee3238bf2edf576fb9c898c2336 Mon Sep 17 00:00:00 2001
From: Thierry Parmentelat <thierry.parmentelat@inria.fr>
Date: Tue, 3 Dec 2013 12:55:38 +0100
Subject: [PATCH] =?utf8?q?adding=20slickgrid=E2=80=99s=20controls/?=
MIME-Version: 1.0
Content-Type: text/plain; charset=utf8
Content-Transfer-Encoding: 8bit
---
.../controls/slick.columnpicker.css | 31 ++++
.../controls/slick.columnpicker.js | 145 +++++++++++++++++
.../slickgrid-2.1/controls/slick.pager.css | 41 +++++
.../slickgrid-2.1/controls/slick.pager.js | 147 ++++++++++++++++++
4 files changed, 364 insertions(+)
create mode 100644 third-party/slickgrid-2.1/controls/slick.columnpicker.css
create mode 100644 third-party/slickgrid-2.1/controls/slick.columnpicker.js
create mode 100644 third-party/slickgrid-2.1/controls/slick.pager.css
create mode 100644 third-party/slickgrid-2.1/controls/slick.pager.js
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);
--
2.47.0