Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit 3e5071d

Browse files
adumesnyadumesny
committed
fix to getElements() methods
* tweaks code made in gridstack#1365 * reverted back to supporting multiple selectors, but now checking for '.' and '#' before adding them * getGridElement() now re-uses getElement()
1 parent a397166 commit 3e5071d

File tree

3 files changed

+31
-21
lines changed

3 files changed

+31
-21
lines changed

‎doc/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -411,7 +411,7 @@ Parameters:
411411
```js
412412
let grid = GridStack.init();
413413
grid.el.appendChild('<div id="gsi-1" data-gs-x="0" data-gs-y="0" data-gs-width="3" data-gs-height="2" data-gs-auto-position="true"></div>')
414-
grid.makeWidget('gsi-1');
414+
grid.makeWidget('#gsi-1');
415415
```
416416

417417
### margin(value: numberOrString)

‎spec/gridstack-spec.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ describe('gridstack', function() {
5252
});
5353
it('use selector no dot', function() {
5454
let grid = GridStack.init(null, 'grid-stack');
55-
expect(grid).toEqual(null);
55+
expect(grid).not.toBe(null);
5656
});
5757
it('use wrong selector', function() {
5858
let grid = GridStack.init(null, 'FOO');
@@ -64,7 +64,7 @@ describe('gridstack', function() {
6464
});
6565
it('initAll use selector no dot', function() {
6666
let grids = GridStack.initAll(undefined, 'grid-stack');
67-
expect(grids.length).toBe(0);
67+
expect(grids.length).toBe(1);
6868
});
6969
it('initAll use wrong selector', function() {
7070
let grids = GridStack.initAll(undefined, 'FOO');

‎src/gridstack.ts

Lines changed: 28 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -681,7 +681,7 @@ export class GridStack {
681681
* @param val if true widget will be locked.
682682
*/
683683
public locked(els: GridStackElement, val: boolean): GridStack {
684-
this.getElements(els).forEach(el => {
684+
GridStack.getElements(els).forEach(el => {
685685
let node = el.gridstackNode;
686686
if (!node) return;
687687
node.locked = (val || false);
@@ -703,10 +703,10 @@ export class GridStack {
703703
* @example
704704
* let grid = GridStack.init();
705705
* grid.el.appendChild('<div id="gsi-1" data-gs-width="3"></div>');
706-
* grid.makeWidget('gsi-1');
706+
* grid.makeWidget('#gsi-1');
707707
*/
708708
public makeWidget(els: GridStackElement): GridItemHTMLElement {
709-
let el = this.getElement(els);
709+
let el = GridStack.getElement(els);
710710
this._prepareElement(el, true);
711711
this._updateContainerHeight();
712712
this._triggerAddEvent();
@@ -756,7 +756,7 @@ export class GridStack {
756756
* @param val if true widget will be draggable.
757757
*/
758758
public movable(els: GridStackElement, val: boolean): GridStack {
759-
this.getElements(els).forEach(el => {
759+
GridStack.getElements(els).forEach(el => {
760760
let node = el.gridstackNode;
761761
if (!node) { return }
762762
node.noMove = !(val || false);
@@ -861,7 +861,7 @@ export class GridStack {
861861
* @param triggerEvent if `false` (quiet mode) element will not be added to removed list and no 'removed' callbacks will be called (Default? true).
862862
*/
863863
public removeWidget(els: GridStackElement, removeDOM = true, triggerEvent = true): GridStack {
864-
this.getElements(els).forEach(el => {
864+
GridStack.getElements(els).forEach(el => {
865865
if (el.parentElement !== this.el) return; // not our child!
866866
let node = el.gridstackNode;
867867
// For Meteor support: https://github.com/gridstack/gridstack.js/pull/272
@@ -924,7 +924,7 @@ export class GridStack {
924924
* @param val if true widget will be resizable.
925925
*/
926926
public resizable(els: GridStackElement, val: boolean): GridStack {
927-
this.getElements(els).forEach(el => {
927+
GridStack.getElements(els).forEach(el => {
928928
let node = el.gridstackNode;
929929
if (!node) { return; }
930930
node.noResize = !(val || false);
@@ -1450,7 +1450,7 @@ export class GridStack {
14501450

14511451
/** @internal */
14521452
private _updateElement(els: GridStackElement, callback: (el: GridItemHTMLElement, node: GridStackNode) => void): GridStack {
1453-
let el = this.getElement(els);
1453+
let el = GridStack.getElement(els);
14541454
if (!el) { return this; }
14551455
let node = el.gridstackNode;
14561456
if (!node) { return this; }
@@ -1687,28 +1687,38 @@ export class GridStack {
16871687
return this;
16881688
}
16891689

1690-
/** @internal */
1691-
private getElement(els: GridStackElement = '.grid-stack-item'): GridItemHTMLElement {
1692-
return (typeof els === 'string' ?
1693-
(document.querySelector(els) || document.querySelector('#' + els) || document.querySelector('.' + els)) : els);
1690+
/** @internal convert a potential selector into actual element */
1691+
private static getElement(els: GridStackElement = '.grid-stack-item'): GridItemHTMLElement {
1692+
if (typeof els === 'string') {
1693+
let el = document.querySelector(els);
1694+
if (!el && els[0] !== '.' && els[0] !== '#') {
1695+
el = document.querySelector('#' + els);
1696+
if (!el) { el = document.querySelector('.' + els) }
1697+
}
1698+
return el as GridItemHTMLElement;
1699+
}
1700+
return els;
16941701
}
1695-
/** @internal */
1696-
private getElements(els: GridStackElement = '.grid-stack-item'): GridItemHTMLElement[] {
1702+
1703+
/** @internal convert a potential selector into actual list of elements */
1704+
private static getElements(els: GridStackElement = '.grid-stack-item'): GridItemHTMLElement[] {
16971705
if (typeof els === 'string') {
16981706
let list = document.querySelectorAll(els);
1699-
if (!list.length) { list = document.querySelectorAll('.' + els) }
1700-
if (!list.length) { list = document.querySelectorAll('#' + els) }
1707+
if (!list.length && els[0] !== '.' && els[0] !== '#') {
1708+
list = document.querySelectorAll('.' + els);
1709+
if (!list.length) { list = document.querySelectorAll('#' + els) }
1710+
}
17011711
return Array.from(list) as GridItemHTMLElement[];
17021712
}
17031713
return [els];
17041714
}
17051715
/** @internal */
17061716
private static getGridElement(els: string | HTMLElement = '.grid-stack'): GridHTMLElement {
1707-
return (typeof els === 'string' ? document.querySelector(els) : els);
1717+
return GridStack.getElement(els) as GridHTMLElement;
17081718
}
17091719
/** @internal */
17101720
private static getGridElements(els: string | HTMLElement = '.grid-stack'): GridHTMLElement[] {
1711-
return (typeof els === 'string') ? Array.from(document.querySelectorAll(els)) : [els];
1721+
return GridStack.getElements(els) as GridHTMLElement[];
17121722
}
17131723

17141724
/** @internal initialize margin top/bottom/left/right and units */
@@ -1755,7 +1765,7 @@ export class GridStack {
17551765

17561766
/** @internal called to update an element(s) attributes and node values */
17571767
private _updateAttr(els: GridStackElement, val: number, attr: string, field: string): GridStack {
1758-
this.getElements(els).forEach(el => {
1768+
GridStack.getElements(els).forEach(el => {
17591769
if (val) {
17601770
el.setAttribute(attr, String(val));
17611771
} else {

0 commit comments

Comments
 (0)