|
295 | 295 |
|
296 | 296 | var idSeq = 0; |
297 | 297 |
|
298 | | - var GridStackEngine = function(columns, onchange, floatMode, maxRows, items) { |
299 | | - this.columns = columns; |
| 298 | + var GridStackEngine = function(column, onchange, floatMode, maxRow, items) { |
| 299 | + this.column = column; |
300 | 300 | this.float = floatMode || false; |
301 | | - this.maxRows = maxRows || 0; |
| 301 | + this.maxRow = maxRow || 0; |
302 | 302 |
|
303 | 303 | this.nodes = items || []; |
304 | 304 | this.onchange = onchange || function() {}; |
|
336 | 336 | var nn = node; |
337 | 337 | var hasLocked = Boolean(this.nodes.find(function(n) { return n.locked; })); |
338 | 338 | if (!this.float && !hasLocked) { |
339 | | - nn = {x: 0, y: node.y, width: this.columns, height: node.height}; |
| 339 | + nn = {x: 0, y: node.y, width: this.column, height: node.height}; |
340 | 340 | } |
341 | 341 | while (true) { |
342 | 342 | var collisionNode = this.nodes.find(Utils._collisionNodeCheck, {node: node, nn: nn}); |
|
355 | 355 | }; |
356 | 356 |
|
357 | 357 | GridStackEngine.prototype._sortNodes = function(dir) { |
358 | | - this.nodes = Utils.sort(this.nodes, dir, this.columns); |
| 358 | + this.nodes = Utils.sort(this.nodes, dir, this.column); |
359 | 359 | }; |
360 | 360 |
|
361 | 361 | GridStackEngine.prototype._packNodes = function() { |
|
432 | 432 | if (Number.isNaN(node.width)) { node.width = defaults.width; } |
433 | 433 | if (Number.isNaN(node.height)) { node.height = defaults.height; } |
434 | 434 |
|
435 | | - if (node.width > this.columns) { |
436 | | - node.width = this.columns; |
| 435 | + if (node.width > this.column) { |
| 436 | + node.width = this.column; |
437 | 437 | } else if (node.width < 1) { |
438 | 438 | node.width = 1; |
439 | 439 | } |
|
446 | 446 | node.x = 0; |
447 | 447 | } |
448 | 448 |
|
449 | | - if (node.x + node.width > this.columns) { |
| 449 | + if (node.x + node.width > this.column) { |
450 | 450 | if (resizing) { |
451 | | - node.width = this.columns - node.x; |
| 451 | + node.width = this.column - node.x; |
452 | 452 | } else { |
453 | | - node.x = this.columns - node.width; |
| 453 | + node.x = this.column - node.width; |
454 | 454 | } |
455 | 455 | } |
456 | 456 |
|
|
498 | 498 | this._sortNodes(); |
499 | 499 |
|
500 | 500 | for (var i = 0;; ++i) { |
501 | | - var x = i % this.columns; |
502 | | - var y = Math.floor(i / this.columns); |
503 | | - if (x + node.width > this.columns) { |
| 501 | + var x = i % this.column; |
| 502 | + var y = Math.floor(i / this.column); |
| 503 | + if (x + node.width > this.column) { |
504 | 504 | continue; |
505 | 505 | } |
506 | 506 | if (!this.nodes.find(Utils._isAddNodeIntercepted, {x: x, y: y, node: node})) { |
|
537 | 537 | } |
538 | 538 | var hasLocked = Boolean(this.nodes.find(function(n) { return n.locked; })); |
539 | 539 |
|
540 | | - if (!this.maxRows && !hasLocked) { |
| 540 | + if (!this.maxRow && !hasLocked) { |
541 | 541 | return true; |
542 | 542 | } |
543 | 543 |
|
544 | 544 | var clonedNode; |
545 | 545 | var clone = new GridStackEngine( |
546 | | - this.columns, |
| 546 | + this.column, |
547 | 547 | null, |
548 | 548 | this.float, |
549 | 549 | 0, |
|
566 | 566 | return n !== clonedNode && Boolean(n.locked) && Boolean(n._dirty); |
567 | 567 | })); |
568 | 568 | } |
569 | | - if (this.maxRows) { |
570 | | - res &= clone.getGridHeight() <= this.maxRows; |
| 569 | + if (this.maxRow) { |
| 570 | + res &= clone.getGridHeight() <= this.maxRow; |
571 | 571 | } |
572 | 572 |
|
573 | 573 | return res; |
574 | 574 | }; |
575 | 575 |
|
576 | 576 | GridStackEngine.prototype.canBePlacedWithRespectToHeight = function(node) { |
577 | | - if (!this.maxRows) { |
| 577 | + if (!this.maxRow) { |
578 | 578 | return true; |
579 | 579 | } |
580 | 580 |
|
581 | 581 | var clone = new GridStackEngine( |
582 | | - this.columns, |
| 582 | + this.column, |
583 | 583 | null, |
584 | 584 | this.float, |
585 | 585 | 0, |
586 | 586 | this.nodes.map(function(n) { return $.extend({}, n); })); |
587 | 587 | clone.addNode(node); |
588 | | - return clone.getGridHeight() <= this.maxRows; |
| 588 | + return clone.getGridHeight() <= this.maxRow; |
589 | 589 | }; |
590 | 590 |
|
591 | 591 | GridStackEngine.prototype.isNodeChangedPosition = function(node, x, y, width, height) { |
|
686 | 686 | obsoleteOpts(opts, 'static_grid', 'staticGrid'); |
687 | 687 | obsoleteOpts(opts, 'is_nested', 'isNested'); |
688 | 688 | obsoleteOpts(opts, 'always_show_resize_handle', 'alwaysShowResizeHandle'); |
689 | | - obsoleteOpts(opts, 'width', 'columns'); |
690 | | - obsoleteOpts(opts, 'height', 'maxRows'); |
| 689 | + obsoleteOpts(opts, 'width', 'column'); |
| 690 | + obsoleteOpts(opts, 'height', 'maxRow'); |
691 | 691 |
|
692 | 692 | // container attributes |
693 | | - obsoleteAttr(this.container, 'data-gs-width', 'data-gs-columns'); |
694 | | - obsoleteAttr(this.container, 'data-gs-height', 'data-gs-max-rows'); |
| 693 | + obsoleteAttr(this.container, 'data-gs-width', 'data-gs-column'); |
| 694 | + obsoleteAttr(this.container, 'data-gs-height', 'data-gs-max-row'); |
695 | 695 | /*eslint-enable camelcase */ |
696 | 696 |
|
697 | 697 | opts.itemClass = opts.itemClass || 'grid-stack-item'; |
698 | 698 | var isNested = this.container.closest('.' + opts.itemClass).length > 0; |
699 | 699 |
|
700 | 700 | this.opts = Utils.defaults(opts || {}, { |
701 | | - columns: parseInt(this.container.attr('data-gs-columns')) || 12, |
702 | | - maxRows: parseInt(this.container.attr('data-gs-max-rows')) || 0, |
| 701 | + column: parseInt(this.container.attr('data-gs-column')) || 12, |
| 702 | + maxRow: parseInt(this.container.attr('data-gs-max-row')) || 0, |
703 | 703 | itemClass: 'grid-stack-item', |
704 | 704 | placeholderClass: 'grid-stack-placeholder', |
705 | 705 | placeholderText: '', |
|
776 | 776 |
|
777 | 777 | this._initStyles(); |
778 | 778 |
|
779 | | - this.grid = new GridStackEngine(this.opts.columns, function(nodes, detachNode) { |
| 779 | + this.grid = new GridStackEngine(this.opts.column, function(nodes, detachNode) { |
780 | 780 | detachNode = detachNode === undefined ? true : detachNode; |
781 | 781 | var maxHeight = 0; |
782 | 782 | this.nodes.forEach(function(n) { |
|
796 | 796 | } |
797 | 797 | }); |
798 | 798 | self._updateStyles(maxHeight + 10); |
799 | | - }, this.opts.float, this.opts.maxRows); |
| 799 | + }, this.opts.float, this.opts.maxRow); |
800 | 800 |
|
801 | 801 | if (this.opts.auto) { |
802 | 802 | var elements = []; |
|
808 | 808 | el: el, |
809 | 809 | // if x,y are missing (autoPosition) add them to end of list - keep their respective DOM order |
810 | 810 | i: (parseInt(el.attr('data-gs-x')) || 100) + |
811 | | - (parseInt(el.attr('data-gs-y')) || 100) * _this.opts.columns |
| 811 | + (parseInt(el.attr('data-gs-y')) || 100) * _this.opts.column |
812 | 812 | }); |
813 | 813 | }); |
814 | 814 | Utils.sortBy(elements, function(x) { return x.i; }).forEach(function(item) { |
|
1296 | 1296 | self.grid.beginUpdate(node); |
1297 | 1297 | cellWidth = self.cellWidth(); |
1298 | 1298 | var strictCellHeight = self.cellHeight(); |
1299 | | - // TODO: cellHeight cannot be set to cellHeight() (i.e. remove strictCellHeight) right here otherwise |
| 1299 | + // TODO: cellHeight = cellHeight() causes issue (i.e. remove strictCellHeight above) otherwise |
1300 | 1300 | // when sizing up we jump almost right away to next size instead of half way there. Not sure |
1301 | | - // why as we don't use ceil() is many places but round(). |
| 1301 | + // why as we don't use ceil() in many places but round() instead. |
1302 | 1302 | cellHeight = self.container.height() / parseInt(self.container.attr('data-gs-current-height')); |
1303 | 1303 | self.placeholder |
1304 | 1304 | .attr('data-gs-x', o.attr('data-gs-x')) |
|
1710 | 1710 |
|
1711 | 1711 | var heightData = Utils.parseHeight(val); |
1712 | 1712 |
|
1713 | | - if (this.opts.verticalMarginUnit === heightData.unit && this.opts.maxRows === heightData.height) { |
| 1713 | + if (this.opts.verticalMarginUnit === heightData.unit && this.opts.maxRow === heightData.height) { |
1714 | 1714 | return ; |
1715 | 1715 | } |
1716 | 1716 | this.opts.verticalMarginUnit = heightData.unit; |
|
1750 | 1750 |
|
1751 | 1751 | GridStack.prototype.cellWidth = function() { |
1752 | 1752 | // TODO: take margin into account ($horizontal_padding in .scss) to make cellHeight='auto' square ? (see 810-many-columns.html) |
1753 | | - return Math.round(this.container.outerWidth() / this.opts.columns); |
| 1753 | + return Math.round(this.container.outerWidth() / this.opts.column); |
1754 | 1754 | }; |
1755 | 1755 |
|
1756 | 1756 | GridStack.prototype.getCellFromPixel = function(position, useOffset) { |
|
1759 | 1759 | var relativeLeft = position.left - containerPos.left; |
1760 | 1760 | var relativeTop = position.top - containerPos.top; |
1761 | 1761 |
|
1762 | | - var columnWidth = Math.floor(this.container.width() / this.opts.columns); |
| 1762 | + var columnWidth = Math.floor(this.container.width() / this.opts.column); |
1763 | 1763 | var rowHeight = Math.floor(this.container.height() / parseInt(this.container.attr('data-gs-current-height'))); |
1764 | 1764 |
|
1765 | 1765 | return {x: Math.floor(relativeLeft / columnWidth), y: Math.floor(relativeTop / rowHeight)}; |
|
1808 | 1808 | }; |
1809 | 1809 |
|
1810 | 1810 | GridStack.prototype.setGridWidth = function(gridWidth,doNotPropagate) { |
1811 | | - this.container.removeClass('grid-stack-' + this.opts.columns); |
| 1811 | + this.container.removeClass('grid-stack-' + this.opts.column); |
1812 | 1812 | if (doNotPropagate !== true) { |
1813 | | - this._updateNodeWidths(this.opts.columns, gridWidth); |
| 1813 | + this._updateNodeWidths(this.opts.column, gridWidth); |
1814 | 1814 | } |
1815 | | - this.opts.columns = gridWidth; |
| 1815 | + this.opts.column = gridWidth; |
1816 | 1816 | this.grid.width = gridWidth; |
1817 | 1817 | this.container.addClass('grid-stack-' + gridWidth); |
1818 | 1818 | }; |
|
0 commit comments