manualColumnFreeze.js 9.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307
  1. var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
  2. var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } };
  3. function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
  4. function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
  5. function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
  6. import BasePlugin from './../_base';
  7. import { registerPlugin } from './../../plugins';
  8. import { arrayEach } from './../../helpers/array';
  9. import freezeColumnItem from './contextMenuItem/freezeColumn';
  10. import unfreezeColumnItem from './contextMenuItem/unfreezeColumn';
  11. var privatePool = new WeakMap();
  12. /**
  13. * This plugin allows to manually "freeze" and "unfreeze" a column using an entry in the Context Menu.
  14. * You can turn it on by setting a `manualColumnFreeze` property to `true`.
  15. *
  16. * @plugin ManualColumnFreeze
  17. * @dependencies ManualColumnMove
  18. */
  19. var ManualColumnFreeze = function (_BasePlugin) {
  20. _inherits(ManualColumnFreeze, _BasePlugin);
  21. function ManualColumnFreeze(hotInstance) {
  22. _classCallCheck(this, ManualColumnFreeze);
  23. var _this = _possibleConstructorReturn(this, (ManualColumnFreeze.__proto__ || Object.getPrototypeOf(ManualColumnFreeze)).call(this, hotInstance));
  24. privatePool.set(_this, {
  25. moveByFreeze: false,
  26. afterFirstUse: false
  27. });
  28. /**
  29. * Original column positions
  30. *
  31. * @type {Array}
  32. */
  33. _this.frozenColumnsBasePositions = [];
  34. /**
  35. * Reference to the `ManualColumnMove` plugin.
  36. */
  37. _this.manualColumnMovePlugin = void 0;
  38. return _this;
  39. }
  40. /**
  41. * Check if the plugin is enabled in the Handsontable settings.
  42. *
  43. * @returns {Boolean}
  44. */
  45. _createClass(ManualColumnFreeze, [{
  46. key: 'isEnabled',
  47. value: function isEnabled() {
  48. return !!this.hot.getSettings().manualColumnFreeze;
  49. }
  50. /**
  51. * Enable plugin for this Handsontable instance.
  52. */
  53. }, {
  54. key: 'enablePlugin',
  55. value: function enablePlugin() {
  56. var _this2 = this;
  57. if (this.enabled) {
  58. return;
  59. }
  60. this.addHook('afterContextMenuDefaultOptions', function (options) {
  61. return _this2.addContextMenuEntry(options);
  62. });
  63. this.addHook('afterInit', function () {
  64. return _this2.onAfterInit();
  65. });
  66. this.addHook('beforeColumnMove', function (rows, target) {
  67. return _this2.onBeforeColumnMove(rows, target);
  68. });
  69. _get(ManualColumnFreeze.prototype.__proto__ || Object.getPrototypeOf(ManualColumnFreeze.prototype), 'enablePlugin', this).call(this);
  70. }
  71. /**
  72. * Disable plugin for this Handsontable instance.
  73. */
  74. }, {
  75. key: 'disablePlugin',
  76. value: function disablePlugin() {
  77. var priv = privatePool.get(this);
  78. priv.afterFirstUse = false;
  79. priv.moveByFreeze = false;
  80. _get(ManualColumnFreeze.prototype.__proto__ || Object.getPrototypeOf(ManualColumnFreeze.prototype), 'disablePlugin', this).call(this);
  81. }
  82. /**
  83. * Updates the plugin to use the latest options you have specified.
  84. */
  85. }, {
  86. key: 'updatePlugin',
  87. value: function updatePlugin() {
  88. this.disablePlugin();
  89. this.enablePlugin();
  90. _get(ManualColumnFreeze.prototype.__proto__ || Object.getPrototypeOf(ManualColumnFreeze.prototype), 'updatePlugin', this).call(this);
  91. }
  92. /**
  93. * Freeze the given column (add it to fixed columns).
  94. *
  95. * @param {Number} column Column index.
  96. */
  97. }, {
  98. key: 'freezeColumn',
  99. value: function freezeColumn(column) {
  100. var priv = privatePool.get(this);
  101. var settings = this.hot.getSettings();
  102. if (!priv.afterFirstUse) {
  103. priv.afterFirstUse = true;
  104. }
  105. if (settings.fixedColumnsLeft === this.hot.countCols() || column <= settings.fixedColumnsLeft - 1) {
  106. return; // already fixed
  107. }
  108. priv.moveByFreeze = true;
  109. if (column !== this.getMovePlugin().columnsMapper.getValueByIndex(column)) {
  110. this.frozenColumnsBasePositions[settings.fixedColumnsLeft] = column;
  111. }
  112. this.getMovePlugin().moveColumn(column, settings.fixedColumnsLeft++);
  113. }
  114. /**
  115. * Unfreeze the given column (remove it from fixed columns and bring to it's previous position).
  116. *
  117. * @param {Number} column Column index.
  118. */
  119. }, {
  120. key: 'unfreezeColumn',
  121. value: function unfreezeColumn(column) {
  122. var priv = privatePool.get(this);
  123. var settings = this.hot.getSettings();
  124. if (!priv.afterFirstUse) {
  125. priv.afterFirstUse = true;
  126. }
  127. if (settings.fixedColumnsLeft <= 0 || column > settings.fixedColumnsLeft - 1) {
  128. return; // not fixed
  129. }
  130. var returnCol = this.getBestColumnReturnPosition(column);
  131. priv.moveByFreeze = true;
  132. settings.fixedColumnsLeft--;
  133. this.getMovePlugin().moveColumn(column, returnCol + 1);
  134. }
  135. /**
  136. * Get the reference to the ManualColumnMove plugin.
  137. *
  138. * @private
  139. * @returns {Object}
  140. */
  141. }, {
  142. key: 'getMovePlugin',
  143. value: function getMovePlugin() {
  144. if (!this.manualColumnMovePlugin) {
  145. this.manualColumnMovePlugin = this.hot.getPlugin('manualColumnMove');
  146. }
  147. return this.manualColumnMovePlugin;
  148. }
  149. /**
  150. * Estimates the most fitting return position for unfrozen column.
  151. *
  152. * @private
  153. * @param {Number} column Column index.
  154. */
  155. }, {
  156. key: 'getBestColumnReturnPosition',
  157. value: function getBestColumnReturnPosition(column) {
  158. var movePlugin = this.getMovePlugin();
  159. var settings = this.hot.getSettings();
  160. var i = settings.fixedColumnsLeft;
  161. var j = movePlugin.columnsMapper.getValueByIndex(i);
  162. var initialCol = void 0;
  163. if (this.frozenColumnsBasePositions[column] == null) {
  164. initialCol = movePlugin.columnsMapper.getValueByIndex(column);
  165. while (j < initialCol) {
  166. i++;
  167. j = movePlugin.columnsMapper.getValueByIndex(i);
  168. }
  169. } else {
  170. initialCol = this.frozenColumnsBasePositions[column];
  171. this.frozenColumnsBasePositions[column] = void 0;
  172. while (j <= initialCol) {
  173. i++;
  174. j = movePlugin.columnsMapper.getValueByIndex(i);
  175. }
  176. i = j;
  177. }
  178. return i - 1;
  179. }
  180. /**
  181. * Add the manualColumnFreeze context menu entries.
  182. *
  183. * @private
  184. * @param {Object} options Context menu options.
  185. */
  186. }, {
  187. key: 'addContextMenuEntry',
  188. value: function addContextMenuEntry(options) {
  189. options.items.push({ name: '---------' }, freezeColumnItem(this), unfreezeColumnItem(this));
  190. }
  191. /**
  192. * Enabling `manualColumnMove` plugin on `afterInit` hook.
  193. *
  194. * @private
  195. */
  196. }, {
  197. key: 'onAfterInit',
  198. value: function onAfterInit() {
  199. if (!this.getMovePlugin().isEnabled()) {
  200. this.getMovePlugin().enablePlugin();
  201. }
  202. }
  203. /**
  204. * Prevent moving the rows from/to fixed area.
  205. *
  206. * @private
  207. * @param {Array} rows
  208. * @param {Number} target
  209. */
  210. }, {
  211. key: 'onBeforeColumnMove',
  212. value: function onBeforeColumnMove(rows, target) {
  213. var priv = privatePool.get(this);
  214. if (priv.afterFirstUse && !priv.moveByFreeze) {
  215. var frozenLen = this.hot.getSettings().fixedColumnsLeft;
  216. var disallowMoving = target < frozenLen;
  217. if (!disallowMoving) {
  218. arrayEach(rows, function (value, index, array) {
  219. if (value < frozenLen) {
  220. disallowMoving = true;
  221. return false;
  222. }
  223. });
  224. }
  225. if (disallowMoving) {
  226. return false;
  227. }
  228. }
  229. if (priv.moveByFreeze) {
  230. priv.moveByFreeze = false;
  231. }
  232. }
  233. /**
  234. * Destroy plugin instance.
  235. */
  236. }, {
  237. key: 'destroy',
  238. value: function destroy() {
  239. _get(ManualColumnFreeze.prototype.__proto__ || Object.getPrototypeOf(ManualColumnFreeze.prototype), 'destroy', this).call(this);
  240. }
  241. }]);
  242. return ManualColumnFreeze;
  243. }(BasePlugin);
  244. registerPlugin('manualColumnFreeze', ManualColumnFreeze);
  245. export default ManualColumnFreeze;