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

Skip to content

Commit 67e01c1

Browse files
gregidgregid
committed
Merge remote-tracking branch 'upstream/develop' into develop
2 parents cf2b327 + c60a11f commit 67e01c1

12 files changed

+813
-497
lines changed

‎README.md

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,13 @@ npm install --save gridstack
7171

7272
## Include
7373

74-
* after you install:
74+
after you install:
75+
76+
```js
77+
import 'gridstack/dist/gridstack.all.js';
78+
import 'gridstack/dist/gridstack.css';
79+
```
80+
* alternatively in html
7581

7682
```html
7783
<link rel="stylesheet" href="node_modules/gridstack/dist/gridstack.min.css" />
@@ -81,8 +87,8 @@ npm install --save gridstack
8187
* or using CDN (minimized):
8288

8389
```html
84-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gridstack@1.1.2/dist/gridstack.min.css" />
85-
<script src="https://cdn.jsdelivr.net/npm/gridstack@1.1.2/dist/gridstack.all.js"></script>
90+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gridstack@1.2.0/dist/gridstack.min.css" />
91+
<script src="https://cdn.jsdelivr.net/npm/gridstack@1.2.0/dist/gridstack.all.js"></script>
8692
```
8793

8894
if you need to debug, look at the git demo/ examples for non min includes.
@@ -175,7 +181,7 @@ GridStack.init( {column: N} );
175181

176182
2) include `gridstack-extra.css` if **N < 12** (else custom CSS - see next). Without these, things will not render/work correctly.
177183
```html
178-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gridstack@1.1.2/dist/gridstack-extra.css"/>
184+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gridstack@1.2.0/dist/gridstack-extra.css"/>
179185

180186
<div class="grid-stack grid-stack-N">...</div>
181187
```
@@ -337,7 +343,7 @@ Recommend looking at the [many samples](./demo) for more code examples.
337343
338344
### jQuery Application
339345
340-
We're working on implementing HTML5 drag'n'drop through the plugin system. Right now it is still jquery-ui based. Because of that we are still bundling `jquery` (3.4.1) + `jquery-ui` (1.12.1 minimal drag|drop|resize) internally in `gridstack.all.js`. IFF your app needs to bring it's own version instead, you should **instead** include `gridstack-poly.min.js` (optional IE support) + `gridstack.min.js` + `gridstack.jQueryUI.min.js` after you import your libs.
346+
We're working on implementing HTML5 drag'n'drop through the plugin system. Right now it is still jquery-ui based. Because of that we are still bundling `jquery` (3.5.1) + `jquery-ui` (1.12.1 minimal drag|drop|resize) internally in `gridstack.all.js`. IFF your app needs to bring your own version instead, you should **instead** include `gridstack-poly.min.js` (optional IE support) + `gridstack.min.js` + `gridstack.jQueryUI.min.js` after you import your JQ libs. But note that there are issue with jQuery and ES6 import (see [1306](https://github.com/gridstack/gridstack.js/issues/1306))
341347
342348
Changes
343349
=====

‎doc/CHANGES.md

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ Change log
55
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
66
**Table of Contents** *generated with [DocToc](http://doctoc.herokuapp.com/)*
77

8-
- [1.1.2-dev (upcoming)](#112-dev-upcoming)
8+
- [1.2.0 (2020-08-01)](#120-2020-08-01)
99
- [1.1.2 (2020-05-17)](#112-2020-05-17)
1010
- [1.1.1 (2020-03-17)](#111-2020-03-17)
1111
- [1.1.0 (2020-02-29)](#110-2020-02-29)
@@ -34,9 +34,11 @@ Change log
3434

3535
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
3636

37-
## 1.1.2-dev (upcoming)
37+
## 1.2.0 (2020-08-01)
3838

3939
- fix [1311](https://github.com/gridstack/gridstack.js/issues/1311) domAttr is not defined
40+
- adds `styleInHead` option to allow for selecting older behavior (adding STYLE element to HEAD element instead of parentNode)
41+
- update jquery to v3.5.1
4042

4143
## 1.1.2 (2020-05-17)
4244

‎doc/README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -102,6 +102,7 @@ gridstack.js API
102102
- `row` - fix grid number of rows. This is a shortcut of writing `minRow:N, maxRow:N`. (default `0` no constrain)
103103
- `rtl` - if `true` turns grid to RTL. Possible values are `true`, `false`, `'auto'` (default: `'auto'`) See [example](http://gridstackjs.com/demo/rtl.html)
104104
- `staticGrid` - removes drag&drop&resize (default `false`). If `true` widgets are not movable/resizable by the user, but code can still move and oneColumnMode will still work. You don't even need jQueryUI draggable/resizable. A CSS class `grid-stack-static` is also added to the container.
105+
- `styleInHead` - if `true` will add style element to `<head>` otherwise will add it to element's parent node (default `false`).
105106
- `verticalMargin` - vertical gap size (default: `20`). Can be:
106107
* an integer (px)
107108
* a string (ex: '2em', '20px', '2rem')

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "gridstack",
3-
"version": "1.1.2-dev",
3+
"version": "1.2.0",
44
"description": "JavaScript / TypeScript for dashboard layout and creation, no external dependencies, with many wrappers (React, Angular, Ember, knockout...)",
55
"main": "dist/gridstack",
66
"repository": {

‎spec/gridstack-spec.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1155,6 +1155,34 @@ describe('gridstack', function() {
11551155
expect($('.grid-stack').hasClass('grid-stack-rtl')).toBe(false);
11561156
});
11571157
});
1158+
1159+
describe('grid.opts.styleInHead', function() {
1160+
beforeEach(function() {
1161+
document.body.insertAdjacentHTML('afterbegin', gridstackHTML);
1162+
});
1163+
afterEach(function() {
1164+
document.body.removeChild(document.getElementById('gs-cont'));
1165+
});
1166+
it('should add STYLE to parent node as a default', function() {
1167+
var options = {
1168+
cellHeight: 80,
1169+
verticalMargin: 10,
1170+
float: false,
1171+
};
1172+
var grid = GridStack.init(options);
1173+
expect(grid._styles.ownerNode.parentNode.tagName).toBe('DIV');
1174+
});
1175+
it('should add STYLE to HEAD if styleInHead === true', function() {
1176+
var options = {
1177+
cellHeight: 80,
1178+
verticalMargin: 10,
1179+
float: false,
1180+
styleInHead: true
1181+
};
1182+
var grid = GridStack.init(options);
1183+
expect(grid._styles.ownerNode.parentNode.tagName).toBe('HEAD');
1184+
});
1185+
});
11581186

11591187
describe('grid.enableMove', function() {
11601188
beforeEach(function() {

‎src/gridstack-extra.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* gridstack 1.1.2-dev extra CSS for [2-11] columns (non default)
2+
* gridstack 1.2.0 extra CSS for [2-11] columns (non default)
33
* https://gridstackjs.com/
44
* (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov
55
* gridstack.js may be freely distributed under the MIT license.

‎src/gridstack-poly.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
/** gridstack.js 1.1.2-dev - IE and older browsers Polyfills for this library @preserve*/
1+
/** gridstack.js 1.2.0 - IE and older browsers Polyfills for this library @preserve*/
22
/**
33
* https://gridstackjs.com/
44
* (c) 2019-2020 Alain Dumesny

‎src/gridstack.d.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
// Type definitions for Gridstack 1.1.2-dev
1+
// Type definitions for Gridstack 1.2.0
22
// Project: https://gridstackjs.com/
33
// Definitions by: Pascal Senn <https://github.com/PascalSenn>
44
// Ricky Blankenaufulland <https://github.com/ZoolWay>
@@ -631,6 +631,9 @@ interface GridstackOptions {
631631
*/
632632
staticGrid ? : boolean;
633633

634+
/** if `true` will add style element to `<head>` otherwise will add it to element's parent node (default `false`). */
635+
styleInHead?: boolean;
636+
634637
/**
635638
* vertical gap size (default?: 20). Can be:
636639
* an integer (px)

‎src/gridstack.jQueryUI.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
/** gridstack.js 1.1.2-dev - JQuery UI Drag&Drop plugin @preserve */
1+
/** gridstack.js 1.2.0 - JQuery UI Drag&Drop plugin @preserve */
22
/**
33
* https://gridstackjs.com/
44
* (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov

‎src/gridstack.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/**
2-
* gridstack.js 1.1.2-dev
2+
* gridstack.js 1.2.0
33
* https://gridstackjs.com/
44
* (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov
55
* gridstack.js may be freely distributed under the MIT license.
@@ -733,6 +733,7 @@
733733
placeholderText: '',
734734
handle: '.grid-stack-item-content',
735735
handleClass: null,
736+
styleInHead: false,
736737
cellHeight: 60,
737738
verticalMargin: 20,
738739
auto: true,
@@ -1092,8 +1093,9 @@
10921093
Utils.removeStylesheet(this._stylesId);
10931094
}
10941095
this._stylesId = 'gridstack-style-' + (Math.random() * 100000).toFixed();
1095-
// insert style to parent (instead of 'head') to support WebComponent
1096-
this._styles = Utils.createStylesheet(this._stylesId, this.el.parentNode);
1096+
var styleLocation = this.opts.styleInHead ? undefined : this.el.parentNode
1097+
// if styleInHead === false insert style to parent to support WebComponent
1098+
this._styles = Utils.createStylesheet(this._stylesId, styleLocation);
10971099
if (this._styles !== null) {
10981100
this._styles._max = 0;
10991101
}

‎src/gridstack.scss

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/*!
2-
* required gridstack 1.1.2-dev CSS for default 12 and 1 columnMode size. Use gridstack-extra.css for others
2+
* required gridstack 1.2.0 CSS for default 12 and 1 columnMode size. Use gridstack-extra.css for others
33
* https://gridstackjs.com/
44
* (c) 2014-2020 Alain Dumesny, Dylan Weiss, Pavel Reznikov
55
* gridstack.js may be freely distributed under the MIT license.

0 commit comments

Comments
 (0)