@get-set/gs-sortable 0.0.19 → 0.0.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/actions/afterAllImagesLoad.js +53 -43
- package/dist/actions/calculate.js +140 -145
- package/dist/actions/calculateOnSort.js +247 -278
- package/dist/actions/checkItemInContainer.js +26 -28
- package/dist/actions/destroy.js +33 -22
- package/dist/actions/general.js +90 -81
- package/dist/actions/getCurrentParams.js +35 -32
- package/dist/actions/init.js +33 -24
- package/dist/actions/initDraggable.js +88 -87
- package/dist/actions/initMouseMove.js +102 -117
- package/dist/actions/initScroll.js +26 -23
- package/dist/actions/initSortEnd.js +73 -84
- package/dist/components/GSSortable.js +155 -161
- package/dist/constants/constParams.js +10 -5
- package/dist/constants/defaultParams.js +24 -19
- package/dist/constants/types.js +12 -7
- package/dist/helpers/uihelpers.js +56 -52
- package/package.json +3 -3
|
@@ -1,43 +1,53 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
var _calculate = _interopRequireDefault(require("./calculate"));
|
|
8
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
9
|
+
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
|
|
10
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
11
|
+
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
12
|
+
function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
|
|
13
|
+
function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
|
|
14
|
+
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
15
|
+
var afterAllImagesLoad = function afterAllImagesLoad(ref) {
|
|
16
|
+
var $images = _toConsumableArray(ref.grid.querySelectorAll("img"));
|
|
17
|
+
var count = $images.length;
|
|
18
|
+
if (count > 0) {
|
|
19
|
+
var alreadyLoaded = 0;
|
|
20
|
+
$images.map(function (img) {
|
|
21
|
+
if (img.complete) {
|
|
22
|
+
alreadyLoaded++;
|
|
23
|
+
if (alreadyLoaded === count) {
|
|
24
|
+
setTimeout(function () {
|
|
25
|
+
(0, _calculate["default"])(ref);
|
|
26
|
+
}, 500);
|
|
27
|
+
}
|
|
28
|
+
} else {
|
|
29
|
+
img.onload = function () {
|
|
30
|
+
alreadyLoaded++;
|
|
31
|
+
if (alreadyLoaded === count) {
|
|
32
|
+
setTimeout(function () {
|
|
33
|
+
(0, _calculate["default"])(ref);
|
|
34
|
+
}, 500);
|
|
35
|
+
}
|
|
36
|
+
};
|
|
37
|
+
img.onerror = function () {
|
|
38
|
+
alreadyLoaded++;
|
|
39
|
+
if (alreadyLoaded === count) {
|
|
40
|
+
setTimeout(function () {
|
|
41
|
+
(0, _calculate["default"])(ref);
|
|
42
|
+
}, 500);
|
|
43
|
+
}
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
} else {
|
|
48
|
+
setTimeout(function () {
|
|
49
|
+
(0, _calculate["default"])(ref);
|
|
50
|
+
}, 500);
|
|
51
|
+
}
|
|
52
|
+
};
|
|
53
|
+
var _default = exports["default"] = afterAllImagesLoad;
|
|
@@ -1,145 +1,140 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
ref.grid.style.width = `${currentWidth}px`;
|
|
142
|
-
}
|
|
143
|
-
};
|
|
144
|
-
|
|
145
|
-
export default calculate;
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports["default"] = void 0;
|
|
7
|
+
var _constParams = _interopRequireDefault(require("../constants/constParams"));
|
|
8
|
+
var _types = _interopRequireDefault(require("../constants/types"));
|
|
9
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
|
|
10
|
+
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
|
|
11
|
+
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
12
|
+
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
13
|
+
function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
|
|
14
|
+
function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
|
|
15
|
+
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
16
|
+
var calculate = function calculate(ref) {
|
|
17
|
+
var params = ref.currentParams;
|
|
18
|
+
if (typeof ref.currentParams.beforeInit === 'function') {
|
|
19
|
+
ref.currentParams.beforeInit();
|
|
20
|
+
}
|
|
21
|
+
var $items = _toConsumableArray(ref.grid.children).filter(function (x) {
|
|
22
|
+
return !x.classList.contains('gs-sortable-item-inmove');
|
|
23
|
+
});
|
|
24
|
+
var itemsCount = $items.length;
|
|
25
|
+
ref.grid.style.position = 'relative';
|
|
26
|
+
if (params.gap != '') {
|
|
27
|
+
ref.grid.style.gap = params.gap;
|
|
28
|
+
}
|
|
29
|
+
var gridStyles = getComputedStyle(ref.grid);
|
|
30
|
+
var cssGap = gridStyles.gap;
|
|
31
|
+
var gapX = 0;
|
|
32
|
+
var gapY = 0;
|
|
33
|
+
if (typeof cssGap !== 'undefined' && cssGap !== null) {
|
|
34
|
+
var cssGapYValue = cssGap.includes(' ') ? cssGap.split(' ')[0] : cssGap;
|
|
35
|
+
var cssGapXValue = cssGap.includes(' ') ? cssGap.split(' ')[1] : cssGap;
|
|
36
|
+
var gapYSize = parseInt(cssGapYValue);
|
|
37
|
+
var gapXSize = parseInt(cssGapXValue);
|
|
38
|
+
if (!Number.isNaN(gapYSize)) {
|
|
39
|
+
gapY = gapYSize;
|
|
40
|
+
}
|
|
41
|
+
if (!Number.isNaN(gapXSize)) {
|
|
42
|
+
gapX = gapXSize;
|
|
43
|
+
}
|
|
44
|
+
}
|
|
45
|
+
var borderBottomWidth = parseFloat(gridStyles.borderBottomWidth);
|
|
46
|
+
var borderTopWidth = parseFloat(gridStyles.borderTopWidth);
|
|
47
|
+
var borderLeftWidth = parseFloat(gridStyles.borderLeftWidth);
|
|
48
|
+
var borderRightWidth = parseFloat(gridStyles.borderRightWidth);
|
|
49
|
+
var containerPT = parseFloat(gridStyles.paddingTop);
|
|
50
|
+
var containerPR = parseFloat(gridStyles.paddingRight);
|
|
51
|
+
var containerPB = parseFloat(gridStyles.paddingBottom);
|
|
52
|
+
var containerPL = parseFloat(gridStyles.paddingLeft);
|
|
53
|
+
var containerWidth = ref.grid.clientWidth - containerPR - containerPL;
|
|
54
|
+
var itemWidth = 0;
|
|
55
|
+
var strItemWidth = 'max-content';
|
|
56
|
+
if (params.type == _types["default"].grid) {
|
|
57
|
+
itemWidth = (containerWidth - (params.count - 1) * gapX) / params.count;
|
|
58
|
+
strItemWidth = itemWidth + 'px';
|
|
59
|
+
} else if (params.type == _types["default"].column) {
|
|
60
|
+
itemWidth = containerWidth;
|
|
61
|
+
strItemWidth = itemWidth + 'px';
|
|
62
|
+
}
|
|
63
|
+
ref.itemWidth = strItemWidth;
|
|
64
|
+
var currentLeft = containerPL;
|
|
65
|
+
var currentTop = containerPT;
|
|
66
|
+
var currentHeight = containerPT + containerPB + borderBottomWidth + borderTopWidth; //ref.grid.offsetHeight;
|
|
67
|
+
var currentWidth = containerPL + containerPR + borderLeftWidth + borderRightWidth;
|
|
68
|
+
var maxHeight = 0;
|
|
69
|
+
$items.map(function (el) {
|
|
70
|
+
if (params.type != _types["default"].row || !el.classList.contains('gs-sortable-placeholder')) {
|
|
71
|
+
el.style.width = strItemWidth;
|
|
72
|
+
}
|
|
73
|
+
});
|
|
74
|
+
ref.uiData = {
|
|
75
|
+
containerPT: containerPT,
|
|
76
|
+
containerPR: containerPR,
|
|
77
|
+
containerPB: containerPB,
|
|
78
|
+
containerPL: containerPL,
|
|
79
|
+
containerWidth: containerWidth,
|
|
80
|
+
currentHeight: currentHeight,
|
|
81
|
+
currentWidth: currentWidth,
|
|
82
|
+
itemWidth: itemWidth,
|
|
83
|
+
gapX: gapX,
|
|
84
|
+
gapY: gapY
|
|
85
|
+
};
|
|
86
|
+
var colHeight = 0;
|
|
87
|
+
$items.map(function (el, index) {
|
|
88
|
+
var height = el.offsetHeight;
|
|
89
|
+
var width = el.offsetWidth;
|
|
90
|
+
if (params.type == _types["default"].column) {
|
|
91
|
+
el.style.left = "".concat(containerPL, "px");
|
|
92
|
+
if (currentTop == containerPT) {
|
|
93
|
+
el.style.top = "".concat(containerPT, "px");
|
|
94
|
+
currentTop = containerPT + height;
|
|
95
|
+
currentHeight = currentHeight + height;
|
|
96
|
+
} else {
|
|
97
|
+
el.style.top = "".concat(currentTop + gapY, "px");
|
|
98
|
+
currentTop = currentTop + gapY + height;
|
|
99
|
+
currentHeight = currentHeight + height + gapY;
|
|
100
|
+
}
|
|
101
|
+
} else if (params.type == _types["default"].row) {
|
|
102
|
+
el.style.top = "".concat(containerPT, "px");
|
|
103
|
+
if (currentLeft == containerPL) {
|
|
104
|
+
el.style.left = "".concat(containerPL, "px");
|
|
105
|
+
currentLeft = containerPL + width;
|
|
106
|
+
currentWidth = currentWidth + width;
|
|
107
|
+
} else {
|
|
108
|
+
el.style.left = "".concat(currentLeft + gapX, "px");
|
|
109
|
+
currentLeft = currentLeft + gapX + width;
|
|
110
|
+
currentWidth = currentWidth + width + gapX;
|
|
111
|
+
}
|
|
112
|
+
if (height > maxHeight) {
|
|
113
|
+
maxHeight = height;
|
|
114
|
+
}
|
|
115
|
+
} else if (params.type == _types["default"].grid) {
|
|
116
|
+
var left = index % params.count == 0 ? containerPL : containerPL + index % params.count * (itemWidth + gapX);
|
|
117
|
+
var top = currentTop;
|
|
118
|
+
if (height > colHeight) {
|
|
119
|
+
colHeight = height;
|
|
120
|
+
}
|
|
121
|
+
if (index % params.count === params.count - 1 || index === itemsCount - 1) {
|
|
122
|
+
if (top === containerPT) {
|
|
123
|
+
currentHeight = currentHeight + colHeight;
|
|
124
|
+
} else {
|
|
125
|
+
currentHeight = currentHeight + colHeight + gapY;
|
|
126
|
+
}
|
|
127
|
+
currentTop = currentTop + colHeight + gapY;
|
|
128
|
+
colHeight = 0;
|
|
129
|
+
}
|
|
130
|
+
el.style.left = "".concat(left, "px");
|
|
131
|
+
el.style.top = "".concat(top, "px");
|
|
132
|
+
}
|
|
133
|
+
});
|
|
134
|
+
ref.grid.style.height = "".concat(currentHeight, "px");
|
|
135
|
+
if (params.type == _types["default"].row) {
|
|
136
|
+
ref.grid.style.height = "".concat(currentHeight + maxHeight, "px");
|
|
137
|
+
ref.grid.style.width = "".concat(currentWidth, "px");
|
|
138
|
+
}
|
|
139
|
+
};
|
|
140
|
+
var _default = exports["default"] = calculate;
|