jumbo-jekyll-theme 3.0.40 → 3.0.41
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.
- checksums.yaml +4 -4
- metadata +17 -246
- data/LICENSE.txt +0 -21
- data/README.md +0 -26
- data/_config.yml +0 -127
- data/_data/authors.yml +0 -7
- data/_data/footer.yml +0 -57
- data/_data/nav.yml +0 -75
- data/_data/news.yaml +0 -230
- data/_data/settings.yml +0 -93
- data/_data/sidebar-nav.yml +0 -23
- data/_data/sticky-tab-bar.yml +0 -29
- data/_includes/author-pagination.html +0 -36
- data/_includes/authors-posts.html +0 -49
- data/_includes/breadcrumb.html +0 -95
- data/_includes/carousel-header.html +0 -15
- data/_includes/css.html +0 -11
- data/_includes/custom.html +0 -1
- data/_includes/display-blog-posts.html +0 -67
- data/_includes/disqus-comments.html +0 -8
- data/_includes/footer.html +0 -68
- data/_includes/github-edit.html +0 -60
- data/_includes/google-analytics-script.html +0 -9
- data/_includes/gtm-noscript.html +0 -5
- data/_includes/gtm-script.html +0 -7
- data/_includes/head.html +0 -44
- data/_includes/hero-banner.html +0 -21
- data/_includes/image.html +0 -6
- data/_includes/javascript.html +0 -9
- data/_includes/jumbotron.html +0 -71
- data/_includes/linaro-404.html +0 -10
- data/_includes/linaro-svg.html +0 -1
- data/_includes/media.html +0 -11
- data/_includes/members.html +0 -63
- data/_includes/nav.html +0 -132
- data/_includes/newsletter-script.html +0 -30
- data/_includes/owl-carousel-homepage.html +0 -103
- data/_includes/pagination-authors.html +0 -36
- data/_includes/pagination-news.html +0 -36
- data/_includes/pagination.html +0 -36
- data/_includes/post-sidebar.html +0 -74
- data/_includes/post-tags.html +0 -9
- data/_includes/read_time.html +0 -2
- data/_includes/schema.html +0 -50
- data/_includes/sidebar.html +0 -55
- data/_includes/sticky-tab-bar.html +0 -61
- data/_includes/thumbnail_image.html +0 -10
- data/_includes/universal-nav.html +0 -28
- data/_includes/youtube.html +0 -7
- data/_layouts/author-layout.html +0 -13
- data/_layouts/author.html +0 -7
- data/_layouts/container-breadcrumb-tabs.html +0 -10
- data/_layouts/container-breadcrumb.html +0 -19
- data/_layouts/container.html +0 -8
- data/_layouts/default.html +0 -27
- data/_layouts/error.html +0 -23
- data/_layouts/jumbotron-container.html +0 -19
- data/_layouts/jumbotron.html +0 -12
- data/_layouts/post-index.html +0 -18
- data/_layouts/post-old.html +0 -70
- data/_layouts/post.html +0 -149
- data/_layouts/redirect.html +0 -11
- data/_sass/_bootstrap-compass.scss +0 -9
- data/_sass/_bootstrap-mincer.scss +0 -19
- data/_sass/_bootstrap-sprockets.scss +0 -9
- data/_sass/_bootstrap.scss +0 -56
- data/_sass/app/blog.scss +0 -59
- data/_sass/app/contact.scss +0 -3
- data/_sass/app/custom.scss +0 -1
- data/_sass/app/overrides.scss +0 -37
- data/_sass/app/search.scss +0 -1
- data/_sass/blog.scss +0 -9
- data/_sass/bootstrap/_alerts.scss +0 -73
- data/_sass/bootstrap/_badges.scss +0 -68
- data/_sass/bootstrap/_breadcrumbs.scss +0 -28
- data/_sass/bootstrap/_button-groups.scss +0 -244
- data/_sass/bootstrap/_buttons.scss +0 -168
- data/_sass/bootstrap/_carousel.scss +0 -270
- data/_sass/bootstrap/_close.scss +0 -36
- data/_sass/bootstrap/_code.scss +0 -69
- data/_sass/bootstrap/_component-animations.scss +0 -37
- data/_sass/bootstrap/_dropdowns.scss +0 -216
- data/_sass/bootstrap/_forms.scss +0 -617
- data/_sass/bootstrap/_glyphicons.scss +0 -307
- data/_sass/bootstrap/_grid.scss +0 -84
- data/_sass/bootstrap/_input-groups.scss +0 -171
- data/_sass/bootstrap/_jumbotron.scss +0 -54
- data/_sass/bootstrap/_labels.scss +0 -66
- data/_sass/bootstrap/_list-group.scss +0 -130
- data/_sass/bootstrap/_media.scss +0 -66
- data/_sass/bootstrap/_mixins.scss +0 -40
- data/_sass/bootstrap/_modals.scss +0 -150
- data/_sass/bootstrap/_navbar.scss +0 -662
- data/_sass/bootstrap/_navs.scss +0 -242
- data/_sass/bootstrap/_normalize.scss +0 -424
- data/_sass/bootstrap/_pager.scss +0 -54
- data/_sass/bootstrap/_pagination.scss +0 -89
- data/_sass/bootstrap/_panels.scss +0 -271
- data/_sass/bootstrap/_popovers.scss +0 -131
- data/_sass/bootstrap/_print.scss +0 -101
- data/_sass/bootstrap/_progress-bars.scss +0 -87
- data/_sass/bootstrap/_responsive-embed.scss +0 -35
- data/_sass/bootstrap/_responsive-utilities.scss +0 -179
- data/_sass/bootstrap/_scaffolding.scss +0 -161
- data/_sass/bootstrap/_tables.scss +0 -234
- data/_sass/bootstrap/_theme.scss +0 -291
- data/_sass/bootstrap/_thumbnails.scss +0 -38
- data/_sass/bootstrap/_tooltip.scss +0 -101
- data/_sass/bootstrap/_type.scss +0 -298
- data/_sass/bootstrap/_utilities.scss +0 -55
- data/_sass/bootstrap/_variables.scss +0 -932
- data/_sass/bootstrap/_wells.scss +0 -29
- data/_sass/bootstrap/mixins/_alerts.scss +0 -14
- data/_sass/bootstrap/mixins/_background-variant.scss +0 -12
- data/_sass/bootstrap/mixins/_border-radius.scss +0 -18
- data/_sass/bootstrap/mixins/_buttons.scss +0 -65
- data/_sass/bootstrap/mixins/_center-block.scss +0 -7
- data/_sass/bootstrap/mixins/_clearfix.scss +0 -22
- data/_sass/bootstrap/mixins/_forms.scss +0 -88
- data/_sass/bootstrap/mixins/_gradients.scss +0 -58
- data/_sass/bootstrap/mixins/_grid-framework.scss +0 -81
- data/_sass/bootstrap/mixins/_grid.scss +0 -122
- data/_sass/bootstrap/mixins/_hide-text.scss +0 -21
- data/_sass/bootstrap/mixins/_image.scss +0 -33
- data/_sass/bootstrap/mixins/_labels.scss +0 -12
- data/_sass/bootstrap/mixins/_list-group.scss +0 -32
- data/_sass/bootstrap/mixins/_nav-divider.scss +0 -10
- data/_sass/bootstrap/mixins/_nav-vertical-align.scss +0 -9
- data/_sass/bootstrap/mixins/_opacity.scss +0 -8
- data/_sass/bootstrap/mixins/_pagination.scss +0 -24
- data/_sass/bootstrap/mixins/_panels.scss +0 -24
- data/_sass/bootstrap/mixins/_progress-bar.scss +0 -10
- data/_sass/bootstrap/mixins/_reset-filter.scss +0 -8
- data/_sass/bootstrap/mixins/_reset-text.scss +0 -18
- data/_sass/bootstrap/mixins/_resize.scss +0 -6
- data/_sass/bootstrap/mixins/_responsive-visibility.scss +0 -21
- data/_sass/bootstrap/mixins/_size.scss +0 -10
- data/_sass/bootstrap/mixins/_tab-focus.scss +0 -9
- data/_sass/bootstrap/mixins/_table-row.scss +0 -28
- data/_sass/bootstrap/mixins/_text-emphasis.scss +0 -12
- data/_sass/bootstrap/mixins/_text-overflow.scss +0 -8
- data/_sass/bootstrap/mixins/_vendor-prefixes.scss +0 -222
- data/_sass/core.scss +0 -18
- data/_sass/core/animations.scss +0 -125
- data/_sass/core/blog.scss +0 -438
- data/_sass/core/breadcrumb.scss +0 -98
- data/_sass/core/carousel-header.scss +0 -91
- data/_sass/core/carousel-styles.scss +0 -4
- data/_sass/core/carousel.scss +0 -312
- data/_sass/core/cookieconsent.scss +0 -39
- data/_sass/core/critical.scss +0 -0
- data/_sass/core/custom.scss +0 -3
- data/_sass/core/error.scss +0 -186
- data/_sass/core/fa.scss +0 -2336
- data/_sass/core/featherlight.scss +0 -158
- data/_sass/core/flipclock.scss +0 -434
- data/_sass/core/fly.scss +0 -10
- data/_sass/core/font-awesome.min.scss +0 -4
- data/_sass/core/fonts.scss +0 -3
- data/_sass/core/footer.scss +0 -146
- data/_sass/core/forms.scss +0 -3
- data/_sass/core/homepage.scss +0 -19
- data/_sass/core/jumbotron.scss +0 -116
- data/_sass/core/lightbox.scss +0 -212
- data/_sass/core/nav.scss +0 -958
- data/_sass/core/owl.carousel.min.scss +0 -6
- data/_sass/core/owl.theme.default.min.scss +0 -6
- data/_sass/core/social-media-icons.scss +0 -67
- data/_sass/core/syntax.scss +0 -65
- data/_sass/core/tables.scss +0 -145
- data/_sass/core/theme.scss +0 -714
- data/_sass/core/universal-nav.scss +0 -161
- data/_sass/core/youtube-lazy.scss +0 -51
- data/_sass/core/youtube.scss +0 -65
- data/_sass/home.scss +0 -2
- data/assets/css/main-blog.scss +0 -19
- data/assets/css/main-error.scss +0 -14
- data/assets/css/main-search.scss +0 -13
- data/assets/css/main.scss +0 -12
- data/assets/fonts/fontawesome-webfont.eot +0 -0
- data/assets/fonts/fontawesome-webfont.svg +0 -2671
- data/assets/fonts/fontawesome-webfont.ttf +0 -0
- data/assets/fonts/fontawesome-webfont.woff +0 -0
- data/assets/fonts/fontawesome-webfont.woff2 +0 -0
- data/assets/fonts/fontello.eot +0 -0
- data/assets/fonts/fontello.svg +0 -44
- data/assets/fonts/glyphicons-halflings-regular.ttf +0 -0
- data/assets/fonts/glyphicons-halflings-regular.woff +0 -0
- data/assets/fonts/glyphicons-halflings-regular.woff2 +0 -0
- data/assets/fonts/lato-regular/LICENSE.txt +0 -93
- data/assets/fonts/lato-regular/Lato-regular.eot +0 -0
- data/assets/fonts/lato-regular/Lato-regular.svg +0 -435
- data/assets/fonts/lato-regular/Lato-regular.ttf +0 -0
- data/assets/fonts/lato-regular/Lato-regular.woff +0 -0
- data/assets/fonts/lato-regular/Lato-regular.woff2 +0 -0
- data/assets/images/Linaro-Logo.svg +0 -1
- data/assets/images/Linaro-Logo_light.png +0 -0
- data/assets/images/Linaro-Logo_standard.svg +0 -1
- data/assets/images/Linaro-Sprinkle.png +0 -0
- data/assets/images/avatar-placeholder.png +0 -0
- data/assets/images/breadcrumb-image.jpg +0 -0
- data/assets/images/close.png +0 -0
- data/assets/images/content/background-image1.jpg +0 -0
- data/assets/images/content/background-image2.png +0 -0
- data/assets/images/content/background-image3.jpg +0 -0
- data/assets/images/favicon.ico +0 -0
- data/assets/images/favicon.png +0 -0
- data/assets/images/loading.gif +0 -0
- data/assets/images/next.png +0 -0
- data/assets/images/owl.video.play.png +0 -0
- data/assets/images/placeholder.png +0 -0
- data/assets/images/prev.png +0 -0
- data/assets/images/social-media-image.png +0 -0
- data/assets/js/app/blog-comments.js +0 -50
- data/assets/js/app/custom.js +0 -0
- data/assets/js/app/facebook.js +0 -8
- data/assets/js/app/fly.js +0 -45
- data/assets/js/app/home.js +0 -46
- data/assets/js/app/main.js +0 -163
- data/assets/js/app/scroll-to-anchors.js +0 -10
- data/assets/js/app/search.js +0 -29
- data/assets/js/app/sticky-tab-bar.js +0 -71
- data/assets/js/app/tables.js +0 -35
- data/assets/js/app/youtube-lazy.js +0 -25
- data/assets/js/package-blog.js +0 -14
- data/assets/js/package-extended.js +0 -15
- data/assets/js/package-home.js +0 -14
- data/assets/js/package-main.js +0 -14
- data/assets/js/package-search.js +0 -10
- data/assets/js/vendor/bootstrap.js +0 -2377
- data/assets/js/vendor/cognito.js +0 -11
- data/assets/js/vendor/cookieconsent.js +0 -1495
- data/assets/js/vendor/disqus-loader.js +0 -87
- data/assets/js/vendor/featherlight.js +0 -641
- data/assets/js/vendor/jquery.js +0 -10364
- data/assets/js/vendor/jquery.rss.js +0 -333
- data/assets/js/vendor/jquery.validate.js +0 -1601
- data/assets/js/vendor/lazysizes.js +0 -698
- data/assets/js/vendor/loadCSS.js +0 -35
- data/assets/js/vendor/ls.unveilhooks.js +0 -145
- data/assets/js/vendor/mc.js +0 -255
- data/assets/js/vendor/owl.carousel.js +0 -3475
- data/assets/js/vendor/picturefill.js +0 -1471
- data/assets/js/vendor/shuffle.js +0 -2004
- data/robots.txt +0 -9
data/assets/js/vendor/shuffle.js
DELETED
@@ -1,2004 +0,0 @@
|
|
1
|
-
(function (global, factory) {
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
3
|
-
typeof define === 'function' && define.amd ? define(factory) :
|
4
|
-
(global.shuffle = factory());
|
5
|
-
}(this, (function () { 'use strict';
|
6
|
-
|
7
|
-
// Polyfill for creating CustomEvents on IE9/10/11
|
8
|
-
|
9
|
-
// code pulled from:
|
10
|
-
// https://github.com/d4tocchini/customevent-polyfill
|
11
|
-
// https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent#Polyfill
|
12
|
-
|
13
|
-
try {
|
14
|
-
var ce = new window.CustomEvent('test');
|
15
|
-
ce.preventDefault();
|
16
|
-
if (ce.defaultPrevented !== true) {
|
17
|
-
// IE has problems with .preventDefault() on custom events
|
18
|
-
// http://stackoverflow.com/questions/23349191
|
19
|
-
throw new Error('Could not prevent default');
|
20
|
-
}
|
21
|
-
} catch(e) {
|
22
|
-
var CustomEvent$1 = function(event, params) {
|
23
|
-
var evt, origPrevent;
|
24
|
-
params = params || {
|
25
|
-
bubbles: false,
|
26
|
-
cancelable: false,
|
27
|
-
detail: undefined
|
28
|
-
};
|
29
|
-
|
30
|
-
evt = document.createEvent("CustomEvent");
|
31
|
-
evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
|
32
|
-
origPrevent = evt.preventDefault;
|
33
|
-
evt.preventDefault = function () {
|
34
|
-
origPrevent.call(this);
|
35
|
-
try {
|
36
|
-
Object.defineProperty(this, 'defaultPrevented', {
|
37
|
-
get: function () {
|
38
|
-
return true;
|
39
|
-
}
|
40
|
-
});
|
41
|
-
} catch(e) {
|
42
|
-
this.defaultPrevented = true;
|
43
|
-
}
|
44
|
-
};
|
45
|
-
return evt;
|
46
|
-
};
|
47
|
-
|
48
|
-
CustomEvent$1.prototype = window.Event.prototype;
|
49
|
-
window.CustomEvent = CustomEvent$1; // expose definition to window
|
50
|
-
}
|
51
|
-
|
52
|
-
var proto = Element.prototype;
|
53
|
-
var vendor = proto.matches
|
54
|
-
|| proto.matchesSelector
|
55
|
-
|| proto.webkitMatchesSelector
|
56
|
-
|| proto.mozMatchesSelector
|
57
|
-
|| proto.msMatchesSelector
|
58
|
-
|| proto.oMatchesSelector;
|
59
|
-
|
60
|
-
var index = match;
|
61
|
-
|
62
|
-
/**
|
63
|
-
* Match `el` to `selector`.
|
64
|
-
*
|
65
|
-
* @param {Element} el
|
66
|
-
* @param {String} selector
|
67
|
-
* @return {Boolean}
|
68
|
-
* @api public
|
69
|
-
*/
|
70
|
-
|
71
|
-
function match(el, selector) {
|
72
|
-
if (vendor) return vendor.call(el, selector);
|
73
|
-
var nodes = el.parentNode.querySelectorAll(selector);
|
74
|
-
for (var i = 0; i < nodes.length; i++) {
|
75
|
-
if (nodes[i] == el) return true;
|
76
|
-
}
|
77
|
-
return false;
|
78
|
-
}
|
79
|
-
|
80
|
-
var commonjsGlobal = typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
81
|
-
|
82
|
-
|
83
|
-
|
84
|
-
|
85
|
-
|
86
|
-
function createCommonjsModule(fn, module) {
|
87
|
-
return module = { exports: {} }, fn(module, module.exports), module.exports;
|
88
|
-
}
|
89
|
-
|
90
|
-
var index$1 = createCommonjsModule(function (module) {
|
91
|
-
'use strict';
|
92
|
-
|
93
|
-
// there's 3 implementations written in increasing order of efficiency
|
94
|
-
|
95
|
-
// 1 - no Set type is defined
|
96
|
-
function uniqNoSet(arr) {
|
97
|
-
var ret = [];
|
98
|
-
|
99
|
-
for (var i = 0; i < arr.length; i++) {
|
100
|
-
if (ret.indexOf(arr[i]) === -1) {
|
101
|
-
ret.push(arr[i]);
|
102
|
-
}
|
103
|
-
}
|
104
|
-
|
105
|
-
return ret;
|
106
|
-
}
|
107
|
-
|
108
|
-
// 2 - a simple Set type is defined
|
109
|
-
function uniqSet(arr) {
|
110
|
-
var seen = new Set();
|
111
|
-
return arr.filter(function (el) {
|
112
|
-
if (!seen.has(el)) {
|
113
|
-
seen.add(el);
|
114
|
-
return true;
|
115
|
-
}
|
116
|
-
|
117
|
-
return false;
|
118
|
-
});
|
119
|
-
}
|
120
|
-
|
121
|
-
// 3 - a standard Set type is defined and it has a forEach method
|
122
|
-
function uniqSetWithForEach(arr) {
|
123
|
-
var ret = [];
|
124
|
-
|
125
|
-
(new Set(arr)).forEach(function (el) {
|
126
|
-
ret.push(el);
|
127
|
-
});
|
128
|
-
|
129
|
-
return ret;
|
130
|
-
}
|
131
|
-
|
132
|
-
// V8 currently has a broken implementation
|
133
|
-
// https://github.com/joyent/node/issues/8449
|
134
|
-
function doesForEachActuallyWork() {
|
135
|
-
var ret = false;
|
136
|
-
|
137
|
-
(new Set([true])).forEach(function (el) {
|
138
|
-
ret = el;
|
139
|
-
});
|
140
|
-
|
141
|
-
return ret === true;
|
142
|
-
}
|
143
|
-
|
144
|
-
if ('Set' in commonjsGlobal) {
|
145
|
-
if (typeof Set.prototype.forEach === 'function' && doesForEachActuallyWork()) {
|
146
|
-
module.exports = uniqSetWithForEach;
|
147
|
-
} else {
|
148
|
-
module.exports = uniqSet;
|
149
|
-
}
|
150
|
-
} else {
|
151
|
-
module.exports = uniqNoSet;
|
152
|
-
}
|
153
|
-
});
|
154
|
-
|
155
|
-
var immutable = extend;
|
156
|
-
|
157
|
-
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
158
|
-
|
159
|
-
function extend() {
|
160
|
-
var target = {};
|
161
|
-
|
162
|
-
for (var i = 0; i < arguments.length; i++) {
|
163
|
-
var source = arguments[i];
|
164
|
-
|
165
|
-
for (var key in source) {
|
166
|
-
if (hasOwnProperty.call(source, key)) {
|
167
|
-
target[key] = source[key];
|
168
|
-
}
|
169
|
-
}
|
170
|
-
}
|
171
|
-
|
172
|
-
return target
|
173
|
-
}
|
174
|
-
|
175
|
-
var index$2 = throttle;
|
176
|
-
|
177
|
-
/**
|
178
|
-
* Returns a new function that, when invoked, invokes `func` at most once per `wait` milliseconds.
|
179
|
-
*
|
180
|
-
* @param {Function} func Function to wrap.
|
181
|
-
* @param {Number} wait Number of milliseconds that must elapse between `func` invocations.
|
182
|
-
* @return {Function} A new function that wraps the `func` function passed in.
|
183
|
-
*/
|
184
|
-
|
185
|
-
function throttle (func, wait) {
|
186
|
-
var ctx, args, rtn, timeoutID; // caching
|
187
|
-
var last = 0;
|
188
|
-
|
189
|
-
return function throttled () {
|
190
|
-
ctx = this;
|
191
|
-
args = arguments;
|
192
|
-
var delta = new Date() - last;
|
193
|
-
if (!timeoutID)
|
194
|
-
if (delta >= wait) call();
|
195
|
-
else timeoutID = setTimeout(call, wait - delta);
|
196
|
-
return rtn;
|
197
|
-
};
|
198
|
-
|
199
|
-
function call () {
|
200
|
-
timeoutID = 0;
|
201
|
-
last = +new Date();
|
202
|
-
rtn = func.apply(ctx, args);
|
203
|
-
ctx = null;
|
204
|
-
args = null;
|
205
|
-
}
|
206
|
-
}
|
207
|
-
|
208
|
-
var index$3 = function parallel(fns, context, callback) {
|
209
|
-
if (!callback) {
|
210
|
-
if (typeof context === 'function') {
|
211
|
-
callback = context;
|
212
|
-
context = null;
|
213
|
-
} else {
|
214
|
-
callback = noop;
|
215
|
-
}
|
216
|
-
}
|
217
|
-
|
218
|
-
var pending = fns && fns.length;
|
219
|
-
if (!pending) return callback(null, []);
|
220
|
-
|
221
|
-
var finished = false;
|
222
|
-
var results = new Array(pending);
|
223
|
-
|
224
|
-
fns.forEach(context ? function (fn, i) {
|
225
|
-
fn.call(context, maybeDone(i));
|
226
|
-
} : function (fn, i) {
|
227
|
-
fn(maybeDone(i));
|
228
|
-
});
|
229
|
-
|
230
|
-
function maybeDone(i) {
|
231
|
-
return function (err, result) {
|
232
|
-
if (finished) return;
|
233
|
-
|
234
|
-
if (err) {
|
235
|
-
callback(err, results);
|
236
|
-
finished = true;
|
237
|
-
return
|
238
|
-
}
|
239
|
-
|
240
|
-
results[i] = result;
|
241
|
-
|
242
|
-
if (!--pending) callback(null, results);
|
243
|
-
}
|
244
|
-
}
|
245
|
-
};
|
246
|
-
|
247
|
-
function noop() {}
|
248
|
-
|
249
|
-
/**
|
250
|
-
* Always returns a numeric value, given a value. Logic from jQuery's `isNumeric`.
|
251
|
-
* @param {*} value Possibly numeric value.
|
252
|
-
* @return {number} `value` or zero if `value` isn't numeric.
|
253
|
-
*/
|
254
|
-
function getNumber(value) {
|
255
|
-
return parseFloat(value) || 0;
|
256
|
-
}
|
257
|
-
|
258
|
-
var classCallCheck = function (instance, Constructor) {
|
259
|
-
if (!(instance instanceof Constructor)) {
|
260
|
-
throw new TypeError("Cannot call a class as a function");
|
261
|
-
}
|
262
|
-
};
|
263
|
-
|
264
|
-
var createClass = function () {
|
265
|
-
function defineProperties(target, props) {
|
266
|
-
for (var i = 0; i < props.length; i++) {
|
267
|
-
var descriptor = props[i];
|
268
|
-
descriptor.enumerable = descriptor.enumerable || false;
|
269
|
-
descriptor.configurable = true;
|
270
|
-
if ("value" in descriptor) descriptor.writable = true;
|
271
|
-
Object.defineProperty(target, descriptor.key, descriptor);
|
272
|
-
}
|
273
|
-
}
|
274
|
-
|
275
|
-
return function (Constructor, protoProps, staticProps) {
|
276
|
-
if (protoProps) defineProperties(Constructor.prototype, protoProps);
|
277
|
-
if (staticProps) defineProperties(Constructor, staticProps);
|
278
|
-
return Constructor;
|
279
|
-
};
|
280
|
-
}();
|
281
|
-
|
282
|
-
var Point = function () {
|
283
|
-
|
284
|
-
/**
|
285
|
-
* Represents a coordinate pair.
|
286
|
-
* @param {number} [x=0] X.
|
287
|
-
* @param {number} [y=0] Y.
|
288
|
-
*/
|
289
|
-
function Point(x, y) {
|
290
|
-
classCallCheck(this, Point);
|
291
|
-
|
292
|
-
this.x = getNumber(x);
|
293
|
-
this.y = getNumber(y);
|
294
|
-
}
|
295
|
-
|
296
|
-
/**
|
297
|
-
* Whether two points are equal.
|
298
|
-
* @param {Point} a Point A.
|
299
|
-
* @param {Point} b Point B.
|
300
|
-
* @return {boolean}
|
301
|
-
*/
|
302
|
-
|
303
|
-
|
304
|
-
createClass(Point, null, [{
|
305
|
-
key: 'equals',
|
306
|
-
value: function equals(a, b) {
|
307
|
-
return a.x === b.x && a.y === b.y;
|
308
|
-
}
|
309
|
-
}]);
|
310
|
-
return Point;
|
311
|
-
}();
|
312
|
-
|
313
|
-
var Classes = {
|
314
|
-
BASE: 'shuffle',
|
315
|
-
SHUFFLE_ITEM: 'shuffle-item',
|
316
|
-
VISIBLE: 'shuffle-item--visible',
|
317
|
-
HIDDEN: 'shuffle-item--hidden'
|
318
|
-
};
|
319
|
-
|
320
|
-
var id$1 = 0;
|
321
|
-
|
322
|
-
var ShuffleItem = function () {
|
323
|
-
function ShuffleItem(element) {
|
324
|
-
classCallCheck(this, ShuffleItem);
|
325
|
-
|
326
|
-
id$1 += 1;
|
327
|
-
this.id = id$1;
|
328
|
-
this.element = element;
|
329
|
-
this.isVisible = true;
|
330
|
-
}
|
331
|
-
|
332
|
-
createClass(ShuffleItem, [{
|
333
|
-
key: 'show',
|
334
|
-
value: function show() {
|
335
|
-
this.isVisible = true;
|
336
|
-
this.element.classList.remove(Classes.HIDDEN);
|
337
|
-
this.element.classList.add(Classes.VISIBLE);
|
338
|
-
}
|
339
|
-
}, {
|
340
|
-
key: 'hide',
|
341
|
-
value: function hide() {
|
342
|
-
this.isVisible = false;
|
343
|
-
this.element.classList.remove(Classes.VISIBLE);
|
344
|
-
this.element.classList.add(Classes.HIDDEN);
|
345
|
-
}
|
346
|
-
}, {
|
347
|
-
key: 'init',
|
348
|
-
value: function init() {
|
349
|
-
this.addClasses([Classes.SHUFFLE_ITEM, Classes.VISIBLE]);
|
350
|
-
this.applyCss(ShuffleItem.Css.INITIAL);
|
351
|
-
this.scale = ShuffleItem.Scale.VISIBLE;
|
352
|
-
this.point = new Point();
|
353
|
-
}
|
354
|
-
}, {
|
355
|
-
key: 'addClasses',
|
356
|
-
value: function addClasses(classes) {
|
357
|
-
var _this = this;
|
358
|
-
|
359
|
-
classes.forEach(function (className) {
|
360
|
-
_this.element.classList.add(className);
|
361
|
-
});
|
362
|
-
}
|
363
|
-
}, {
|
364
|
-
key: 'removeClasses',
|
365
|
-
value: function removeClasses(classes) {
|
366
|
-
var _this2 = this;
|
367
|
-
|
368
|
-
classes.forEach(function (className) {
|
369
|
-
_this2.element.classList.remove(className);
|
370
|
-
});
|
371
|
-
}
|
372
|
-
}, {
|
373
|
-
key: 'applyCss',
|
374
|
-
value: function applyCss(obj) {
|
375
|
-
var _this3 = this;
|
376
|
-
|
377
|
-
Object.keys(obj).forEach(function (key) {
|
378
|
-
_this3.element.style[key] = obj[key];
|
379
|
-
});
|
380
|
-
}
|
381
|
-
}, {
|
382
|
-
key: 'dispose',
|
383
|
-
value: function dispose() {
|
384
|
-
this.removeClasses([Classes.HIDDEN, Classes.VISIBLE, Classes.SHUFFLE_ITEM]);
|
385
|
-
|
386
|
-
this.element.removeAttribute('style');
|
387
|
-
this.element = null;
|
388
|
-
}
|
389
|
-
}]);
|
390
|
-
return ShuffleItem;
|
391
|
-
}();
|
392
|
-
|
393
|
-
ShuffleItem.Css = {
|
394
|
-
INITIAL: {
|
395
|
-
position: 'absolute',
|
396
|
-
top: 0,
|
397
|
-
left: 0,
|
398
|
-
visibility: 'visible',
|
399
|
-
'will-change': 'transform'
|
400
|
-
},
|
401
|
-
VISIBLE: {
|
402
|
-
before: {
|
403
|
-
opacity: 1,
|
404
|
-
visibility: 'visible'
|
405
|
-
},
|
406
|
-
after: {}
|
407
|
-
},
|
408
|
-
HIDDEN: {
|
409
|
-
before: {
|
410
|
-
opacity: 0
|
411
|
-
},
|
412
|
-
after: {
|
413
|
-
visibility: 'hidden'
|
414
|
-
}
|
415
|
-
}
|
416
|
-
};
|
417
|
-
|
418
|
-
ShuffleItem.Scale = {
|
419
|
-
VISIBLE: 1,
|
420
|
-
HIDDEN: 0.001
|
421
|
-
};
|
422
|
-
|
423
|
-
var element = document.body || document.documentElement;
|
424
|
-
var e$1 = document.createElement('div');
|
425
|
-
e$1.style.cssText = 'width:10px;padding:2px;box-sizing:border-box;';
|
426
|
-
element.appendChild(e$1);
|
427
|
-
|
428
|
-
var width = window.getComputedStyle(e$1, null).width;
|
429
|
-
var ret = width === '10px';
|
430
|
-
|
431
|
-
element.removeChild(e$1);
|
432
|
-
|
433
|
-
/**
|
434
|
-
* Retrieve the computed style for an element, parsed as a float.
|
435
|
-
* @param {Element} element Element to get style for.
|
436
|
-
* @param {string} style Style property.
|
437
|
-
* @param {CSSStyleDeclaration} [styles] Optionally include clean styles to
|
438
|
-
* use instead of asking for them again.
|
439
|
-
* @return {number} The parsed computed value or zero if that fails because IE
|
440
|
-
* will return 'auto' when the element doesn't have margins instead of
|
441
|
-
* the computed style.
|
442
|
-
*/
|
443
|
-
function getNumberStyle(element, style) {
|
444
|
-
var styles = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : window.getComputedStyle(element, null);
|
445
|
-
|
446
|
-
var value = getNumber(styles[style]);
|
447
|
-
|
448
|
-
// Support IE<=11 and W3C spec.
|
449
|
-
if (!ret && style === 'width') {
|
450
|
-
value += getNumber(styles.paddingLeft) + getNumber(styles.paddingRight) + getNumber(styles.borderLeftWidth) + getNumber(styles.borderRightWidth);
|
451
|
-
} else if (!ret && style === 'height') {
|
452
|
-
value += getNumber(styles.paddingTop) + getNumber(styles.paddingBottom) + getNumber(styles.borderTopWidth) + getNumber(styles.borderBottomWidth);
|
453
|
-
}
|
454
|
-
|
455
|
-
return value;
|
456
|
-
}
|
457
|
-
|
458
|
-
/**
|
459
|
-
* Fisher-Yates shuffle.
|
460
|
-
* http://stackoverflow.com/a/962890/373422
|
461
|
-
* https://bost.ocks.org/mike/shuffle/
|
462
|
-
* @param {Array} array Array to shuffle.
|
463
|
-
* @return {Array} Randomly sorted array.
|
464
|
-
*/
|
465
|
-
function randomize(array) {
|
466
|
-
var n = array.length;
|
467
|
-
|
468
|
-
while (n) {
|
469
|
-
n -= 1;
|
470
|
-
var i = Math.floor(Math.random() * (n + 1));
|
471
|
-
var temp = array[i];
|
472
|
-
array[i] = array[n];
|
473
|
-
array[n] = temp;
|
474
|
-
}
|
475
|
-
|
476
|
-
return array;
|
477
|
-
}
|
478
|
-
|
479
|
-
var defaults$1 = {
|
480
|
-
// Use array.reverse() to reverse the results
|
481
|
-
reverse: false,
|
482
|
-
|
483
|
-
// Sorting function
|
484
|
-
by: null,
|
485
|
-
|
486
|
-
// If true, this will skip the sorting and return a randomized order in the array
|
487
|
-
randomize: false,
|
488
|
-
|
489
|
-
// Determines which property of each item in the array is passed to the
|
490
|
-
// sorting method.
|
491
|
-
key: 'element'
|
492
|
-
};
|
493
|
-
|
494
|
-
// You can return `undefined` from the `by` function to revert to DOM order.
|
495
|
-
function sorter(arr, options) {
|
496
|
-
var opts = immutable(defaults$1, options);
|
497
|
-
var original = [].slice.call(arr);
|
498
|
-
var revert = false;
|
499
|
-
|
500
|
-
if (!arr.length) {
|
501
|
-
return [];
|
502
|
-
}
|
503
|
-
|
504
|
-
if (opts.randomize) {
|
505
|
-
return randomize(arr);
|
506
|
-
}
|
507
|
-
|
508
|
-
// Sort the elements by the opts.by function.
|
509
|
-
// If we don't have opts.by, default to DOM order
|
510
|
-
if (typeof opts.by === 'function') {
|
511
|
-
arr.sort(function (a, b) {
|
512
|
-
// Exit early if we already know we want to revert
|
513
|
-
if (revert) {
|
514
|
-
return 0;
|
515
|
-
}
|
516
|
-
|
517
|
-
var valA = opts.by(a[opts.key]);
|
518
|
-
var valB = opts.by(b[opts.key]);
|
519
|
-
|
520
|
-
// If both values are undefined, use the DOM order
|
521
|
-
if (valA === undefined && valB === undefined) {
|
522
|
-
revert = true;
|
523
|
-
return 0;
|
524
|
-
}
|
525
|
-
|
526
|
-
if (valA < valB || valA === 'sortFirst' || valB === 'sortLast') {
|
527
|
-
return -1;
|
528
|
-
}
|
529
|
-
|
530
|
-
if (valA > valB || valA === 'sortLast' || valB === 'sortFirst') {
|
531
|
-
return 1;
|
532
|
-
}
|
533
|
-
|
534
|
-
return 0;
|
535
|
-
});
|
536
|
-
}
|
537
|
-
|
538
|
-
// Revert to the original array if necessary
|
539
|
-
if (revert) {
|
540
|
-
return original;
|
541
|
-
}
|
542
|
-
|
543
|
-
if (opts.reverse) {
|
544
|
-
arr.reverse();
|
545
|
-
}
|
546
|
-
|
547
|
-
return arr;
|
548
|
-
}
|
549
|
-
|
550
|
-
var transitions = {};
|
551
|
-
var eventName = 'transitionend';
|
552
|
-
var count = 0;
|
553
|
-
|
554
|
-
function uniqueId() {
|
555
|
-
count += 1;
|
556
|
-
return eventName + count;
|
557
|
-
}
|
558
|
-
|
559
|
-
function cancelTransitionEnd(id) {
|
560
|
-
if (transitions[id]) {
|
561
|
-
transitions[id].element.removeEventListener(eventName, transitions[id].listener);
|
562
|
-
transitions[id] = null;
|
563
|
-
return true;
|
564
|
-
}
|
565
|
-
|
566
|
-
return false;
|
567
|
-
}
|
568
|
-
|
569
|
-
function onTransitionEnd(element, callback) {
|
570
|
-
var id = uniqueId();
|
571
|
-
var listener = function listener(evt) {
|
572
|
-
if (evt.currentTarget === evt.target) {
|
573
|
-
cancelTransitionEnd(id);
|
574
|
-
callback(evt);
|
575
|
-
}
|
576
|
-
};
|
577
|
-
|
578
|
-
element.addEventListener(eventName, listener);
|
579
|
-
|
580
|
-
transitions[id] = { element: element, listener: listener };
|
581
|
-
|
582
|
-
return id;
|
583
|
-
}
|
584
|
-
|
585
|
-
function arrayMax(array) {
|
586
|
-
return Math.max.apply(Math, array); // eslint-disable-line prefer-spread
|
587
|
-
}
|
588
|
-
|
589
|
-
function arrayMin(array) {
|
590
|
-
return Math.min.apply(Math, array); // eslint-disable-line prefer-spread
|
591
|
-
}
|
592
|
-
|
593
|
-
/**
|
594
|
-
* Determine the number of columns an items spans.
|
595
|
-
* @param {number} itemWidth Width of the item.
|
596
|
-
* @param {number} columnWidth Width of the column (includes gutter).
|
597
|
-
* @param {number} columns Total number of columns
|
598
|
-
* @param {number} threshold A buffer value for the size of the column to fit.
|
599
|
-
* @return {number}
|
600
|
-
*/
|
601
|
-
function getColumnSpan(itemWidth, columnWidth, columns, threshold) {
|
602
|
-
var columnSpan = itemWidth / columnWidth;
|
603
|
-
|
604
|
-
// If the difference between the rounded column span number and the
|
605
|
-
// calculated column span number is really small, round the number to
|
606
|
-
// make it fit.
|
607
|
-
if (Math.abs(Math.round(columnSpan) - columnSpan) < threshold) {
|
608
|
-
// e.g. columnSpan = 4.0089945390298745
|
609
|
-
columnSpan = Math.round(columnSpan);
|
610
|
-
}
|
611
|
-
|
612
|
-
// Ensure the column span is not more than the amount of columns in the whole layout.
|
613
|
-
return Math.min(Math.ceil(columnSpan), columns);
|
614
|
-
}
|
615
|
-
|
616
|
-
/**
|
617
|
-
* Retrieves the column set to use for placement.
|
618
|
-
* @param {number} columnSpan The number of columns this current item spans.
|
619
|
-
* @param {number} columns The total columns in the grid.
|
620
|
-
* @return {Array.<number>} An array of numbers represeting the column set.
|
621
|
-
*/
|
622
|
-
function getAvailablePositions(positions, columnSpan, columns) {
|
623
|
-
// The item spans only one column.
|
624
|
-
if (columnSpan === 1) {
|
625
|
-
return positions;
|
626
|
-
}
|
627
|
-
|
628
|
-
// The item spans more than one column, figure out how many different
|
629
|
-
// places it could fit horizontally.
|
630
|
-
// The group count is the number of places within the positions this block
|
631
|
-
// could fit, ignoring the current positions of items.
|
632
|
-
// Imagine a 2 column brick as the second item in a 4 column grid with
|
633
|
-
// 10px height each. Find the places it would fit:
|
634
|
-
// [20, 10, 10, 0]
|
635
|
-
// | | |
|
636
|
-
// * * *
|
637
|
-
//
|
638
|
-
// Then take the places which fit and get the bigger of the two:
|
639
|
-
// max([20, 10]), max([10, 10]), max([10, 0]) = [20, 10, 0]
|
640
|
-
//
|
641
|
-
// Next, find the first smallest number (the short column).
|
642
|
-
// [20, 10, 0]
|
643
|
-
// |
|
644
|
-
// *
|
645
|
-
//
|
646
|
-
// And that's where it should be placed!
|
647
|
-
//
|
648
|
-
// Another example where the second column's item extends past the first:
|
649
|
-
// [10, 20, 10, 0] => [20, 20, 10] => 10
|
650
|
-
var available = [];
|
651
|
-
|
652
|
-
// For how many possible positions for this item there are.
|
653
|
-
for (var i = 0; i <= columns - columnSpan; i++) {
|
654
|
-
// Find the bigger value for each place it could fit.
|
655
|
-
available.push(arrayMax(positions.slice(i, i + columnSpan)));
|
656
|
-
}
|
657
|
-
|
658
|
-
return available;
|
659
|
-
}
|
660
|
-
|
661
|
-
/**
|
662
|
-
* Find index of short column, the first from the left where this item will go.
|
663
|
-
*
|
664
|
-
* @param {Array.<number>} positions The array to search for the smallest number.
|
665
|
-
* @param {number} buffer Optional buffer which is very useful when the height
|
666
|
-
* is a percentage of the width.
|
667
|
-
* @return {number} Index of the short column.
|
668
|
-
*/
|
669
|
-
function getShortColumn(positions, buffer) {
|
670
|
-
var minPosition = arrayMin(positions);
|
671
|
-
for (var i = 0, len = positions.length; i < len; i++) {
|
672
|
-
if (positions[i] >= minPosition - buffer && positions[i] <= minPosition + buffer) {
|
673
|
-
return i;
|
674
|
-
}
|
675
|
-
}
|
676
|
-
|
677
|
-
return 0;
|
678
|
-
}
|
679
|
-
|
680
|
-
/**
|
681
|
-
* Determine the location of the next item, based on its size.
|
682
|
-
* @param {Object} itemSize Object with width and height.
|
683
|
-
* @param {Array.<number>} positions Positions of the other current items.
|
684
|
-
* @param {number} gridSize The column width or row height.
|
685
|
-
* @param {number} total The total number of columns or rows.
|
686
|
-
* @param {number} threshold Buffer value for the column to fit.
|
687
|
-
* @param {number} buffer Vertical buffer for the height of items.
|
688
|
-
* @return {Point}
|
689
|
-
*/
|
690
|
-
function getItemPosition(_ref) {
|
691
|
-
var itemSize = _ref.itemSize,
|
692
|
-
positions = _ref.positions,
|
693
|
-
gridSize = _ref.gridSize,
|
694
|
-
total = _ref.total,
|
695
|
-
threshold = _ref.threshold,
|
696
|
-
buffer = _ref.buffer;
|
697
|
-
|
698
|
-
var span = getColumnSpan(itemSize.width, gridSize, total, threshold);
|
699
|
-
var setY = getAvailablePositions(positions, span, total);
|
700
|
-
var shortColumnIndex = getShortColumn(setY, buffer);
|
701
|
-
|
702
|
-
// Position the item
|
703
|
-
var point = new Point(Math.round(gridSize * shortColumnIndex), Math.round(setY[shortColumnIndex]));
|
704
|
-
|
705
|
-
// Update the columns array with the new values for each column.
|
706
|
-
// e.g. before the update the columns could be [250, 0, 0, 0] for an item
|
707
|
-
// which spans 2 columns. After it would be [250, itemHeight, itemHeight, 0].
|
708
|
-
var setHeight = setY[shortColumnIndex] + itemSize.height;
|
709
|
-
for (var i = 0; i < span; i++) {
|
710
|
-
positions[shortColumnIndex + i] = setHeight;
|
711
|
-
}
|
712
|
-
|
713
|
-
return point;
|
714
|
-
}
|
715
|
-
|
716
|
-
function toArray(arrayLike) {
|
717
|
-
return Array.prototype.slice.call(arrayLike);
|
718
|
-
}
|
719
|
-
|
720
|
-
function arrayIncludes(array, obj) {
|
721
|
-
return array.indexOf(obj) > -1;
|
722
|
-
}
|
723
|
-
|
724
|
-
// Used for unique instance variables
|
725
|
-
var id = 0;
|
726
|
-
|
727
|
-
var Shuffle = function () {
|
728
|
-
|
729
|
-
/**
|
730
|
-
* Categorize, sort, and filter a responsive grid of items.
|
731
|
-
*
|
732
|
-
* @param {Element} element An element which is the parent container for the grid items.
|
733
|
-
* @param {Object} [options=Shuffle.options] Options object.
|
734
|
-
* @constructor
|
735
|
-
*/
|
736
|
-
function Shuffle(element) {
|
737
|
-
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
738
|
-
classCallCheck(this, Shuffle);
|
739
|
-
|
740
|
-
this.options = immutable(Shuffle.options, options);
|
741
|
-
|
742
|
-
this.useSizer = false;
|
743
|
-
this.lastSort = {};
|
744
|
-
this.group = Shuffle.ALL_ITEMS;
|
745
|
-
this.lastFilter = Shuffle.ALL_ITEMS;
|
746
|
-
this.isEnabled = true;
|
747
|
-
this.isDestroyed = false;
|
748
|
-
this.isInitialized = false;
|
749
|
-
this._transitions = [];
|
750
|
-
this.isTransitioning = false;
|
751
|
-
this._queue = [];
|
752
|
-
|
753
|
-
var el = this._getElementOption(element);
|
754
|
-
|
755
|
-
if (!el) {
|
756
|
-
throw new TypeError('Shuffle needs to be initialized with an element.');
|
757
|
-
}
|
758
|
-
|
759
|
-
this.element = el;
|
760
|
-
this.id = 'shuffle_' + id;
|
761
|
-
id += 1;
|
762
|
-
|
763
|
-
this._init();
|
764
|
-
this.isInitialized = true;
|
765
|
-
}
|
766
|
-
|
767
|
-
createClass(Shuffle, [{
|
768
|
-
key: '_init',
|
769
|
-
value: function _init() {
|
770
|
-
this.items = this._getItems();
|
771
|
-
|
772
|
-
this.options.sizer = this._getElementOption(this.options.sizer);
|
773
|
-
|
774
|
-
if (this.options.sizer) {
|
775
|
-
this.useSizer = true;
|
776
|
-
}
|
777
|
-
|
778
|
-
// Add class and invalidate styles
|
779
|
-
this.element.classList.add(Shuffle.Classes.BASE);
|
780
|
-
|
781
|
-
// Set initial css for each item
|
782
|
-
this._initItems();
|
783
|
-
|
784
|
-
// Bind resize events
|
785
|
-
this._onResize = this._getResizeFunction();
|
786
|
-
window.addEventListener('resize', this._onResize);
|
787
|
-
|
788
|
-
// Get container css all in one request. Causes reflow
|
789
|
-
var containerCss = window.getComputedStyle(this.element, null);
|
790
|
-
var containerWidth = Shuffle.getSize(this.element).width;
|
791
|
-
|
792
|
-
// Add styles to the container if it doesn't have them.
|
793
|
-
this._validateStyles(containerCss);
|
794
|
-
|
795
|
-
// We already got the container's width above, no need to cause another
|
796
|
-
// reflow getting it again... Calculate the number of columns there will be
|
797
|
-
this._setColumns(containerWidth);
|
798
|
-
|
799
|
-
// Kick off!
|
800
|
-
this.filter(this.options.group, this.options.initialSort);
|
801
|
-
|
802
|
-
// The shuffle items haven't had transitions set on them yet so the user
|
803
|
-
// doesn't see the first layout. Set them now that the first layout is done.
|
804
|
-
// First, however, a synchronous layout must be caused for the previous
|
805
|
-
// styles to be applied without transitions.
|
806
|
-
this.element.offsetWidth; // eslint-disable-line no-unused-expressions
|
807
|
-
this._setTransitions();
|
808
|
-
this.element.style.transition = 'height ' + this.options.speed + 'ms ' + this.options.easing;
|
809
|
-
}
|
810
|
-
|
811
|
-
/**
|
812
|
-
* Returns a throttled and proxied function for the resize handler.
|
813
|
-
* @return {Function}
|
814
|
-
* @private
|
815
|
-
*/
|
816
|
-
|
817
|
-
}, {
|
818
|
-
key: '_getResizeFunction',
|
819
|
-
value: function _getResizeFunction() {
|
820
|
-
var resizeFunction = this._handleResize.bind(this);
|
821
|
-
return this.options.throttle ? this.options.throttle(resizeFunction, this.options.throttleTime) : resizeFunction;
|
822
|
-
}
|
823
|
-
|
824
|
-
/**
|
825
|
-
* Retrieve an element from an option.
|
826
|
-
* @param {string|jQuery|Element} option The option to check.
|
827
|
-
* @return {?Element} The plain element or null.
|
828
|
-
* @private
|
829
|
-
*/
|
830
|
-
|
831
|
-
}, {
|
832
|
-
key: '_getElementOption',
|
833
|
-
value: function _getElementOption(option) {
|
834
|
-
// If column width is a string, treat is as a selector and search for the
|
835
|
-
// sizer element within the outermost container
|
836
|
-
if (typeof option === 'string') {
|
837
|
-
return this.element.querySelector(option);
|
838
|
-
|
839
|
-
// Check for an element
|
840
|
-
} else if (option && option.nodeType && option.nodeType === 1) {
|
841
|
-
return option;
|
842
|
-
|
843
|
-
// Check for jQuery object
|
844
|
-
} else if (option && option.jquery) {
|
845
|
-
return option[0];
|
846
|
-
}
|
847
|
-
|
848
|
-
return null;
|
849
|
-
}
|
850
|
-
|
851
|
-
/**
|
852
|
-
* Ensures the shuffle container has the css styles it needs applied to it.
|
853
|
-
* @param {Object} styles Key value pairs for position and overflow.
|
854
|
-
* @private
|
855
|
-
*/
|
856
|
-
|
857
|
-
}, {
|
858
|
-
key: '_validateStyles',
|
859
|
-
value: function _validateStyles(styles) {
|
860
|
-
// Position cannot be static.
|
861
|
-
if (styles.position === 'static') {
|
862
|
-
this.element.style.position = 'relative';
|
863
|
-
}
|
864
|
-
|
865
|
-
// Overflow has to be hidden.
|
866
|
-
if (styles.overflow !== 'hidden') {
|
867
|
-
this.element.style.overflow = 'hidden';
|
868
|
-
}
|
869
|
-
}
|
870
|
-
|
871
|
-
/**
|
872
|
-
* Filter the elements by a category.
|
873
|
-
* @param {string} [category] Category to filter by. If it's given, the last
|
874
|
-
* category will be used to filter the items.
|
875
|
-
* @param {Array} [collection] Optionally filter a collection. Defaults to
|
876
|
-
* all the items.
|
877
|
-
* @return {!{visible: Array, hidden: Array}}
|
878
|
-
* @private
|
879
|
-
*/
|
880
|
-
|
881
|
-
}, {
|
882
|
-
key: '_filter',
|
883
|
-
value: function _filter() {
|
884
|
-
var category = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.lastFilter;
|
885
|
-
var collection = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.items;
|
886
|
-
|
887
|
-
var set$$1 = this._getFilteredSets(category, collection);
|
888
|
-
|
889
|
-
// Individually add/remove hidden/visible classes
|
890
|
-
this._toggleFilterClasses(set$$1);
|
891
|
-
|
892
|
-
// Save the last filter in case elements are appended.
|
893
|
-
this.lastFilter = category;
|
894
|
-
|
895
|
-
// This is saved mainly because providing a filter function (like searching)
|
896
|
-
// will overwrite the `lastFilter` property every time its called.
|
897
|
-
if (typeof category === 'string') {
|
898
|
-
this.group = category;
|
899
|
-
}
|
900
|
-
|
901
|
-
return set$$1;
|
902
|
-
}
|
903
|
-
|
904
|
-
/**
|
905
|
-
* Returns an object containing the visible and hidden elements.
|
906
|
-
* @param {string|Function} category Category or function to filter by.
|
907
|
-
* @param {Array.<Element>} items A collection of items to filter.
|
908
|
-
* @return {!{visible: Array, hidden: Array}}
|
909
|
-
* @private
|
910
|
-
*/
|
911
|
-
|
912
|
-
}, {
|
913
|
-
key: '_getFilteredSets',
|
914
|
-
value: function _getFilteredSets(category, items) {
|
915
|
-
var _this = this;
|
916
|
-
|
917
|
-
var visible = [];
|
918
|
-
var hidden = [];
|
919
|
-
|
920
|
-
// category === 'all', add visible class to everything
|
921
|
-
if (category === Shuffle.ALL_ITEMS) {
|
922
|
-
visible = items;
|
923
|
-
|
924
|
-
// Loop through each item and use provided function to determine
|
925
|
-
// whether to hide it or not.
|
926
|
-
} else {
|
927
|
-
items.forEach(function (item) {
|
928
|
-
if (_this._doesPassFilter(category, item.element)) {
|
929
|
-
visible.push(item);
|
930
|
-
} else {
|
931
|
-
hidden.push(item);
|
932
|
-
}
|
933
|
-
});
|
934
|
-
}
|
935
|
-
|
936
|
-
return {
|
937
|
-
visible: visible,
|
938
|
-
hidden: hidden
|
939
|
-
};
|
940
|
-
}
|
941
|
-
|
942
|
-
/**
|
943
|
-
* Test an item to see if it passes a category.
|
944
|
-
* @param {string|Function} category Category or function to filter by.
|
945
|
-
* @param {Element} element An element to test.
|
946
|
-
* @return {boolean} Whether it passes the category/filter.
|
947
|
-
* @private
|
948
|
-
*/
|
949
|
-
|
950
|
-
}, {
|
951
|
-
key: '_doesPassFilter',
|
952
|
-
value: function _doesPassFilter(category, element) {
|
953
|
-
if (typeof category === 'function') {
|
954
|
-
return category.call(element, element, this);
|
955
|
-
}
|
956
|
-
|
957
|
-
// Check each element's data-groups attribute against the given category.
|
958
|
-
var attr = element.getAttribute('data-' + Shuffle.FILTER_ATTRIBUTE_KEY);
|
959
|
-
var keys = this.options.delimeter ? attr.split(this.options.delimeter) : JSON.parse(attr);
|
960
|
-
|
961
|
-
function testCategory(category) {
|
962
|
-
return arrayIncludes(keys, category);
|
963
|
-
}
|
964
|
-
|
965
|
-
if (Array.isArray(category)) {
|
966
|
-
if (this.options.filterMode === Shuffle.FilterMode.ANY) {
|
967
|
-
return category.some(testCategory);
|
968
|
-
}
|
969
|
-
return category.every(testCategory);
|
970
|
-
}
|
971
|
-
|
972
|
-
return arrayIncludes(keys, category);
|
973
|
-
}
|
974
|
-
|
975
|
-
/**
|
976
|
-
* Toggles the visible and hidden class names.
|
977
|
-
* @param {{visible, hidden}} Object with visible and hidden arrays.
|
978
|
-
* @private
|
979
|
-
*/
|
980
|
-
|
981
|
-
}, {
|
982
|
-
key: '_toggleFilterClasses',
|
983
|
-
value: function _toggleFilterClasses(_ref) {
|
984
|
-
var visible = _ref.visible,
|
985
|
-
hidden = _ref.hidden;
|
986
|
-
|
987
|
-
visible.forEach(function (item) {
|
988
|
-
item.show();
|
989
|
-
});
|
990
|
-
|
991
|
-
hidden.forEach(function (item) {
|
992
|
-
item.hide();
|
993
|
-
});
|
994
|
-
}
|
995
|
-
|
996
|
-
/**
|
997
|
-
* Set the initial css for each item
|
998
|
-
* @param {Array.<ShuffleItem>} [items] Optionally specifiy at set to initialize.
|
999
|
-
* @private
|
1000
|
-
*/
|
1001
|
-
|
1002
|
-
}, {
|
1003
|
-
key: '_initItems',
|
1004
|
-
value: function _initItems() {
|
1005
|
-
var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.items;
|
1006
|
-
|
1007
|
-
items.forEach(function (item) {
|
1008
|
-
item.init();
|
1009
|
-
});
|
1010
|
-
}
|
1011
|
-
|
1012
|
-
/**
|
1013
|
-
* Remove element reference and styles.
|
1014
|
-
* @private
|
1015
|
-
*/
|
1016
|
-
|
1017
|
-
}, {
|
1018
|
-
key: '_disposeItems',
|
1019
|
-
value: function _disposeItems() {
|
1020
|
-
var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.items;
|
1021
|
-
|
1022
|
-
items.forEach(function (item) {
|
1023
|
-
item.dispose();
|
1024
|
-
});
|
1025
|
-
}
|
1026
|
-
|
1027
|
-
/**
|
1028
|
-
* Updates the visible item count.
|
1029
|
-
* @private
|
1030
|
-
*/
|
1031
|
-
|
1032
|
-
}, {
|
1033
|
-
key: '_updateItemCount',
|
1034
|
-
value: function _updateItemCount() {
|
1035
|
-
this.visibleItems = this._getFilteredItems().length;
|
1036
|
-
}
|
1037
|
-
|
1038
|
-
/**
|
1039
|
-
* Sets css transform transition on a group of elements. This is not executed
|
1040
|
-
* at the same time as `item.init` so that transitions don't occur upon
|
1041
|
-
* initialization of Shuffle.
|
1042
|
-
* @param {Array.<ShuffleItem>} items Shuffle items to set transitions on.
|
1043
|
-
* @private
|
1044
|
-
*/
|
1045
|
-
|
1046
|
-
}, {
|
1047
|
-
key: '_setTransitions',
|
1048
|
-
value: function _setTransitions() {
|
1049
|
-
var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.items;
|
1050
|
-
|
1051
|
-
var speed = this.options.speed;
|
1052
|
-
var easing = this.options.easing;
|
1053
|
-
|
1054
|
-
var str = this.options.useTransforms ? 'transform ' + speed + 'ms ' + easing + ', opacity ' + speed + 'ms ' + easing : 'top ' + speed + 'ms ' + easing + ', left ' + speed + 'ms ' + easing + ', opacity ' + speed + 'ms ' + easing;
|
1055
|
-
|
1056
|
-
items.forEach(function (item) {
|
1057
|
-
item.element.style.transition = str;
|
1058
|
-
});
|
1059
|
-
}
|
1060
|
-
}, {
|
1061
|
-
key: '_getItems',
|
1062
|
-
value: function _getItems() {
|
1063
|
-
var _this2 = this;
|
1064
|
-
|
1065
|
-
return toArray(this.element.children).filter(function (el) {
|
1066
|
-
return index(el, _this2.options.itemSelector);
|
1067
|
-
}).map(function (el) {
|
1068
|
-
return new ShuffleItem(el);
|
1069
|
-
});
|
1070
|
-
}
|
1071
|
-
|
1072
|
-
/**
|
1073
|
-
* When new elements are added to the shuffle container, update the array of
|
1074
|
-
* items because that is the order `_layout` calls them.
|
1075
|
-
*/
|
1076
|
-
|
1077
|
-
}, {
|
1078
|
-
key: '_updateItemsOrder',
|
1079
|
-
value: function _updateItemsOrder() {
|
1080
|
-
var children = this.element.children;
|
1081
|
-
this.items = sorter(this.items, {
|
1082
|
-
by: function by(element) {
|
1083
|
-
return Array.prototype.indexOf.call(children, element);
|
1084
|
-
}
|
1085
|
-
});
|
1086
|
-
}
|
1087
|
-
}, {
|
1088
|
-
key: '_getFilteredItems',
|
1089
|
-
value: function _getFilteredItems() {
|
1090
|
-
return this.items.filter(function (item) {
|
1091
|
-
return item.isVisible;
|
1092
|
-
});
|
1093
|
-
}
|
1094
|
-
}, {
|
1095
|
-
key: '_getConcealedItems',
|
1096
|
-
value: function _getConcealedItems() {
|
1097
|
-
return this.items.filter(function (item) {
|
1098
|
-
return !item.isVisible;
|
1099
|
-
});
|
1100
|
-
}
|
1101
|
-
|
1102
|
-
/**
|
1103
|
-
* Returns the column size, based on column width and sizer options.
|
1104
|
-
* @param {number} containerWidth Size of the parent container.
|
1105
|
-
* @param {number} gutterSize Size of the gutters.
|
1106
|
-
* @return {number}
|
1107
|
-
* @private
|
1108
|
-
*/
|
1109
|
-
|
1110
|
-
}, {
|
1111
|
-
key: '_getColumnSize',
|
1112
|
-
value: function _getColumnSize(containerWidth, gutterSize) {
|
1113
|
-
var size = void 0;
|
1114
|
-
|
1115
|
-
// If the columnWidth property is a function, then the grid is fluid
|
1116
|
-
if (typeof this.options.columnWidth === 'function') {
|
1117
|
-
size = this.options.columnWidth(containerWidth);
|
1118
|
-
|
1119
|
-
// columnWidth option isn't a function, are they using a sizing element?
|
1120
|
-
} else if (this.useSizer) {
|
1121
|
-
size = Shuffle.getSize(this.options.sizer).width;
|
1122
|
-
|
1123
|
-
// if not, how about the explicitly set option?
|
1124
|
-
} else if (this.options.columnWidth) {
|
1125
|
-
size = this.options.columnWidth;
|
1126
|
-
|
1127
|
-
// or use the size of the first item
|
1128
|
-
} else if (this.items.length > 0) {
|
1129
|
-
size = Shuffle.getSize(this.items[0].element, true).width;
|
1130
|
-
|
1131
|
-
// if there's no items, use size of container
|
1132
|
-
} else {
|
1133
|
-
size = containerWidth;
|
1134
|
-
}
|
1135
|
-
|
1136
|
-
// Don't let them set a column width of zero.
|
1137
|
-
if (size === 0) {
|
1138
|
-
size = containerWidth;
|
1139
|
-
}
|
1140
|
-
|
1141
|
-
return size + gutterSize;
|
1142
|
-
}
|
1143
|
-
|
1144
|
-
/**
|
1145
|
-
* Returns the gutter size, based on gutter width and sizer options.
|
1146
|
-
* @param {number} containerWidth Size of the parent container.
|
1147
|
-
* @return {number}
|
1148
|
-
* @private
|
1149
|
-
*/
|
1150
|
-
|
1151
|
-
}, {
|
1152
|
-
key: '_getGutterSize',
|
1153
|
-
value: function _getGutterSize(containerWidth) {
|
1154
|
-
var size = void 0;
|
1155
|
-
if (typeof this.options.gutterWidth === 'function') {
|
1156
|
-
size = this.options.gutterWidth(containerWidth);
|
1157
|
-
} else if (this.useSizer) {
|
1158
|
-
size = getNumberStyle(this.options.sizer, 'marginLeft');
|
1159
|
-
} else {
|
1160
|
-
size = this.options.gutterWidth;
|
1161
|
-
}
|
1162
|
-
|
1163
|
-
return size;
|
1164
|
-
}
|
1165
|
-
|
1166
|
-
/**
|
1167
|
-
* Calculate the number of columns to be used. Gets css if using sizer element.
|
1168
|
-
* @param {number} [containerWidth] Optionally specify a container width if
|
1169
|
-
* it's already available.
|
1170
|
-
*/
|
1171
|
-
|
1172
|
-
}, {
|
1173
|
-
key: '_setColumns',
|
1174
|
-
value: function _setColumns() {
|
1175
|
-
var containerWidth = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : Shuffle.getSize(this.element).width;
|
1176
|
-
|
1177
|
-
var gutter = this._getGutterSize(containerWidth);
|
1178
|
-
var columnWidth = this._getColumnSize(containerWidth, gutter);
|
1179
|
-
var calculatedColumns = (containerWidth + gutter) / columnWidth;
|
1180
|
-
|
1181
|
-
// Widths given from getStyles are not precise enough...
|
1182
|
-
if (Math.abs(Math.round(calculatedColumns) - calculatedColumns) < this.options.columnThreshold) {
|
1183
|
-
// e.g. calculatedColumns = 11.998876
|
1184
|
-
calculatedColumns = Math.round(calculatedColumns);
|
1185
|
-
}
|
1186
|
-
|
1187
|
-
this.cols = Math.max(Math.floor(calculatedColumns), 1);
|
1188
|
-
this.containerWidth = containerWidth;
|
1189
|
-
this.colWidth = columnWidth;
|
1190
|
-
}
|
1191
|
-
|
1192
|
-
/**
|
1193
|
-
* Adjust the height of the grid
|
1194
|
-
*/
|
1195
|
-
|
1196
|
-
}, {
|
1197
|
-
key: '_setContainerSize',
|
1198
|
-
value: function _setContainerSize() {
|
1199
|
-
this.element.style.height = this._getContainerSize() + 'px';
|
1200
|
-
}
|
1201
|
-
|
1202
|
-
/**
|
1203
|
-
* Based on the column heights, it returns the biggest one.
|
1204
|
-
* @return {number}
|
1205
|
-
* @private
|
1206
|
-
*/
|
1207
|
-
|
1208
|
-
}, {
|
1209
|
-
key: '_getContainerSize',
|
1210
|
-
value: function _getContainerSize() {
|
1211
|
-
return arrayMax(this.positions);
|
1212
|
-
}
|
1213
|
-
|
1214
|
-
/**
|
1215
|
-
* Get the clamped stagger amount.
|
1216
|
-
* @param {number} index Index of the item to be staggered.
|
1217
|
-
* @return {number}
|
1218
|
-
*/
|
1219
|
-
|
1220
|
-
}, {
|
1221
|
-
key: '_getStaggerAmount',
|
1222
|
-
value: function _getStaggerAmount(index$$1) {
|
1223
|
-
return Math.min(index$$1 * this.options.staggerAmount, this.options.staggerAmountMax);
|
1224
|
-
}
|
1225
|
-
|
1226
|
-
/**
|
1227
|
-
* @return {boolean} Whether the event was prevented or not.
|
1228
|
-
*/
|
1229
|
-
|
1230
|
-
}, {
|
1231
|
-
key: '_dispatch',
|
1232
|
-
value: function _dispatch(name) {
|
1233
|
-
var details = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
1234
|
-
|
1235
|
-
if (this.isDestroyed) {
|
1236
|
-
return false;
|
1237
|
-
}
|
1238
|
-
|
1239
|
-
details.shuffle = this;
|
1240
|
-
return !this.element.dispatchEvent(new CustomEvent(name, {
|
1241
|
-
bubbles: true,
|
1242
|
-
cancelable: false,
|
1243
|
-
detail: details
|
1244
|
-
}));
|
1245
|
-
}
|
1246
|
-
|
1247
|
-
/**
|
1248
|
-
* Zeros out the y columns array, which is used to determine item placement.
|
1249
|
-
* @private
|
1250
|
-
*/
|
1251
|
-
|
1252
|
-
}, {
|
1253
|
-
key: '_resetCols',
|
1254
|
-
value: function _resetCols() {
|
1255
|
-
var i = this.cols;
|
1256
|
-
this.positions = [];
|
1257
|
-
while (i) {
|
1258
|
-
i -= 1;
|
1259
|
-
this.positions.push(0);
|
1260
|
-
}
|
1261
|
-
}
|
1262
|
-
|
1263
|
-
/**
|
1264
|
-
* Loops through each item that should be shown and calculates the x, y position.
|
1265
|
-
* @param {Array.<ShuffleItem>} items Array of items that will be shown/layed
|
1266
|
-
* out in order in their array.
|
1267
|
-
*/
|
1268
|
-
|
1269
|
-
}, {
|
1270
|
-
key: '_layout',
|
1271
|
-
value: function _layout(items) {
|
1272
|
-
var _this3 = this;
|
1273
|
-
|
1274
|
-
var count = 0;
|
1275
|
-
items.forEach(function (item) {
|
1276
|
-
var currPos = item.point;
|
1277
|
-
var currScale = item.scale;
|
1278
|
-
var itemSize = Shuffle.getSize(item.element, true);
|
1279
|
-
var pos = _this3._getItemPosition(itemSize);
|
1280
|
-
|
1281
|
-
function callback() {
|
1282
|
-
item.element.style.transitionDelay = '';
|
1283
|
-
item.applyCss(ShuffleItem.Css.VISIBLE.after);
|
1284
|
-
}
|
1285
|
-
|
1286
|
-
// If the item will not change its position, do not add it to the render
|
1287
|
-
// queue. Transitions don't fire when setting a property to the same value.
|
1288
|
-
if (Point.equals(currPos, pos) && currScale === ShuffleItem.Scale.VISIBLE) {
|
1289
|
-
item.applyCss(ShuffleItem.Css.VISIBLE.before);
|
1290
|
-
callback();
|
1291
|
-
return;
|
1292
|
-
}
|
1293
|
-
|
1294
|
-
item.point = pos;
|
1295
|
-
item.scale = ShuffleItem.Scale.VISIBLE;
|
1296
|
-
|
1297
|
-
// Use xtend here to clone the object so that the `before` object isn't
|
1298
|
-
// modified when the transition delay is added.
|
1299
|
-
var styles = immutable(ShuffleItem.Css.VISIBLE.before);
|
1300
|
-
styles.transitionDelay = _this3._getStaggerAmount(count) + 'ms';
|
1301
|
-
|
1302
|
-
_this3._queue.push({
|
1303
|
-
item: item,
|
1304
|
-
styles: styles,
|
1305
|
-
callback: callback
|
1306
|
-
});
|
1307
|
-
|
1308
|
-
count += 1;
|
1309
|
-
});
|
1310
|
-
}
|
1311
|
-
|
1312
|
-
/**
|
1313
|
-
* Determine the location of the next item, based on its size.
|
1314
|
-
* @param {{width: number, height: number}} itemSize Object with width and height.
|
1315
|
-
* @return {Point}
|
1316
|
-
* @private
|
1317
|
-
*/
|
1318
|
-
|
1319
|
-
}, {
|
1320
|
-
key: '_getItemPosition',
|
1321
|
-
value: function _getItemPosition(itemSize) {
|
1322
|
-
return getItemPosition({
|
1323
|
-
itemSize: itemSize,
|
1324
|
-
positions: this.positions,
|
1325
|
-
gridSize: this.colWidth,
|
1326
|
-
total: this.cols,
|
1327
|
-
threshold: this.options.columnThreshold,
|
1328
|
-
buffer: this.options.buffer
|
1329
|
-
});
|
1330
|
-
}
|
1331
|
-
|
1332
|
-
/**
|
1333
|
-
* Hides the elements that don't match our filter.
|
1334
|
-
* @param {Array.<ShuffleItem>} collection Collection to shrink.
|
1335
|
-
* @private
|
1336
|
-
*/
|
1337
|
-
|
1338
|
-
}, {
|
1339
|
-
key: '_shrink',
|
1340
|
-
value: function _shrink() {
|
1341
|
-
var _this4 = this;
|
1342
|
-
|
1343
|
-
var collection = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this._getConcealedItems();
|
1344
|
-
|
1345
|
-
var count = 0;
|
1346
|
-
collection.forEach(function (item) {
|
1347
|
-
function callback() {
|
1348
|
-
item.applyCss(ShuffleItem.Css.HIDDEN.after);
|
1349
|
-
}
|
1350
|
-
|
1351
|
-
// Continuing would add a transitionend event listener to the element, but
|
1352
|
-
// that listener would not execute because the transform and opacity would
|
1353
|
-
// stay the same.
|
1354
|
-
// The callback is executed here because it is not guaranteed to be called
|
1355
|
-
// after the transitionend event because the transitionend could be
|
1356
|
-
// canceled if another animation starts.
|
1357
|
-
if (item.scale === ShuffleItem.Scale.HIDDEN) {
|
1358
|
-
item.applyCss(ShuffleItem.Css.HIDDEN.before);
|
1359
|
-
callback();
|
1360
|
-
return;
|
1361
|
-
}
|
1362
|
-
|
1363
|
-
item.scale = ShuffleItem.Scale.HIDDEN;
|
1364
|
-
|
1365
|
-
var styles = immutable(ShuffleItem.Css.HIDDEN.before);
|
1366
|
-
styles.transitionDelay = _this4._getStaggerAmount(count) + 'ms';
|
1367
|
-
|
1368
|
-
_this4._queue.push({
|
1369
|
-
item: item,
|
1370
|
-
styles: styles,
|
1371
|
-
callback: callback
|
1372
|
-
});
|
1373
|
-
|
1374
|
-
count += 1;
|
1375
|
-
});
|
1376
|
-
}
|
1377
|
-
|
1378
|
-
/**
|
1379
|
-
* Resize handler.
|
1380
|
-
* @private
|
1381
|
-
*/
|
1382
|
-
|
1383
|
-
}, {
|
1384
|
-
key: '_handleResize',
|
1385
|
-
value: function _handleResize() {
|
1386
|
-
// If shuffle is disabled, destroyed, don't do anything
|
1387
|
-
if (!this.isEnabled || this.isDestroyed) {
|
1388
|
-
return;
|
1389
|
-
}
|
1390
|
-
|
1391
|
-
// Will need to check height in the future if it's layed out horizontaly
|
1392
|
-
var containerWidth = Shuffle.getSize(this.element).width;
|
1393
|
-
|
1394
|
-
// containerWidth hasn't changed, don't do anything
|
1395
|
-
if (containerWidth === this.containerWidth) {
|
1396
|
-
return;
|
1397
|
-
}
|
1398
|
-
|
1399
|
-
this.update();
|
1400
|
-
}
|
1401
|
-
|
1402
|
-
/**
|
1403
|
-
* Returns styles which will be applied to the an item for a transition.
|
1404
|
-
* @param {Object} obj Transition options.
|
1405
|
-
* @return {!Object} Transforms for transitions, left/top for animate.
|
1406
|
-
* @private
|
1407
|
-
*/
|
1408
|
-
|
1409
|
-
}, {
|
1410
|
-
key: '_getStylesForTransition',
|
1411
|
-
value: function _getStylesForTransition(_ref2) {
|
1412
|
-
var item = _ref2.item,
|
1413
|
-
styles = _ref2.styles;
|
1414
|
-
|
1415
|
-
if (!styles.transitionDelay) {
|
1416
|
-
styles.transitionDelay = '0ms';
|
1417
|
-
}
|
1418
|
-
|
1419
|
-
var x = item.point.x;
|
1420
|
-
var y = item.point.y;
|
1421
|
-
|
1422
|
-
if (this.options.useTransforms) {
|
1423
|
-
styles.transform = 'translate(' + x + 'px, ' + y + 'px) scale(' + item.scale + ')';
|
1424
|
-
} else {
|
1425
|
-
styles.left = x + 'px';
|
1426
|
-
styles.top = y + 'px';
|
1427
|
-
}
|
1428
|
-
|
1429
|
-
return styles;
|
1430
|
-
}
|
1431
|
-
|
1432
|
-
/**
|
1433
|
-
* Listen for the transition end on an element and execute the itemCallback
|
1434
|
-
* when it finishes.
|
1435
|
-
* @param {Element} element Element to listen on.
|
1436
|
-
* @param {Function} itemCallback Callback for the item.
|
1437
|
-
* @param {Function} done Callback to notify `parallel` that this one is done.
|
1438
|
-
*/
|
1439
|
-
|
1440
|
-
}, {
|
1441
|
-
key: '_whenTransitionDone',
|
1442
|
-
value: function _whenTransitionDone(element, itemCallback, done) {
|
1443
|
-
var id = onTransitionEnd(element, function (evt) {
|
1444
|
-
itemCallback();
|
1445
|
-
done(null, evt);
|
1446
|
-
});
|
1447
|
-
|
1448
|
-
this._transitions.push(id);
|
1449
|
-
}
|
1450
|
-
|
1451
|
-
/**
|
1452
|
-
* Return a function which will set CSS styles and call the `done` function
|
1453
|
-
* when (if) the transition finishes.
|
1454
|
-
* @param {Object} opts Transition object.
|
1455
|
-
* @return {Function} A function to be called with a `done` function.
|
1456
|
-
*/
|
1457
|
-
|
1458
|
-
}, {
|
1459
|
-
key: '_getTransitionFunction',
|
1460
|
-
value: function _getTransitionFunction(opts) {
|
1461
|
-
var _this5 = this;
|
1462
|
-
|
1463
|
-
return function (done) {
|
1464
|
-
opts.item.applyCss(_this5._getStylesForTransition(opts));
|
1465
|
-
_this5._whenTransitionDone(opts.item.element, opts.callback, done);
|
1466
|
-
};
|
1467
|
-
}
|
1468
|
-
|
1469
|
-
/**
|
1470
|
-
* Execute the styles gathered in the style queue. This applies styles to elements,
|
1471
|
-
* triggering transitions.
|
1472
|
-
* @private
|
1473
|
-
*/
|
1474
|
-
|
1475
|
-
}, {
|
1476
|
-
key: '_processQueue',
|
1477
|
-
value: function _processQueue() {
|
1478
|
-
if (this.isTransitioning) {
|
1479
|
-
this._cancelMovement();
|
1480
|
-
}
|
1481
|
-
|
1482
|
-
var hasSpeed = this.options.speed > 0;
|
1483
|
-
var hasQueue = this._queue.length > 0;
|
1484
|
-
|
1485
|
-
if (hasQueue && hasSpeed && this.isInitialized) {
|
1486
|
-
this._startTransitions(this._queue);
|
1487
|
-
} else if (hasQueue) {
|
1488
|
-
this._styleImmediately(this._queue);
|
1489
|
-
this._dispatchLayout();
|
1490
|
-
|
1491
|
-
// A call to layout happened, but none of the newly visible items will
|
1492
|
-
// change position or the transition duration is zero, which will not trigger
|
1493
|
-
// the transitionend event.
|
1494
|
-
} else {
|
1495
|
-
this._dispatchLayout();
|
1496
|
-
}
|
1497
|
-
|
1498
|
-
// Remove everything in the style queue
|
1499
|
-
this._queue.length = 0;
|
1500
|
-
}
|
1501
|
-
|
1502
|
-
/**
|
1503
|
-
* Wait for each transition to finish, the emit the layout event.
|
1504
|
-
* @param {Array.<Object>} transitions Array of transition objects.
|
1505
|
-
*/
|
1506
|
-
|
1507
|
-
}, {
|
1508
|
-
key: '_startTransitions',
|
1509
|
-
value: function _startTransitions(transitions) {
|
1510
|
-
var _this6 = this;
|
1511
|
-
|
1512
|
-
// Set flag that shuffle is currently in motion.
|
1513
|
-
this.isTransitioning = true;
|
1514
|
-
|
1515
|
-
// Create an array of functions to be called.
|
1516
|
-
var callbacks = transitions.map(function (obj) {
|
1517
|
-
return _this6._getTransitionFunction(obj);
|
1518
|
-
});
|
1519
|
-
|
1520
|
-
index$3(callbacks, this._movementFinished.bind(this));
|
1521
|
-
}
|
1522
|
-
}, {
|
1523
|
-
key: '_cancelMovement',
|
1524
|
-
value: function _cancelMovement() {
|
1525
|
-
// Remove the transition end event for each listener.
|
1526
|
-
this._transitions.forEach(cancelTransitionEnd);
|
1527
|
-
|
1528
|
-
// Reset the array.
|
1529
|
-
this._transitions.length = 0;
|
1530
|
-
|
1531
|
-
// Show it's no longer active.
|
1532
|
-
this.isTransitioning = false;
|
1533
|
-
}
|
1534
|
-
|
1535
|
-
/**
|
1536
|
-
* Apply styles without a transition.
|
1537
|
-
* @param {Array.<Object>} objects Array of transition objects.
|
1538
|
-
* @private
|
1539
|
-
*/
|
1540
|
-
|
1541
|
-
}, {
|
1542
|
-
key: '_styleImmediately',
|
1543
|
-
value: function _styleImmediately(objects) {
|
1544
|
-
var _this7 = this;
|
1545
|
-
|
1546
|
-
if (objects.length) {
|
1547
|
-
var elements = objects.map(function (obj) {
|
1548
|
-
return obj.item.element;
|
1549
|
-
});
|
1550
|
-
|
1551
|
-
Shuffle._skipTransitions(elements, function () {
|
1552
|
-
objects.forEach(function (obj) {
|
1553
|
-
obj.item.applyCss(_this7._getStylesForTransition(obj));
|
1554
|
-
obj.callback();
|
1555
|
-
});
|
1556
|
-
});
|
1557
|
-
}
|
1558
|
-
}
|
1559
|
-
}, {
|
1560
|
-
key: '_movementFinished',
|
1561
|
-
value: function _movementFinished() {
|
1562
|
-
this._transitions.length = 0;
|
1563
|
-
this.isTransitioning = false;
|
1564
|
-
this._dispatchLayout();
|
1565
|
-
}
|
1566
|
-
}, {
|
1567
|
-
key: '_dispatchLayout',
|
1568
|
-
value: function _dispatchLayout() {
|
1569
|
-
this._dispatch(Shuffle.EventType.LAYOUT);
|
1570
|
-
}
|
1571
|
-
|
1572
|
-
/**
|
1573
|
-
* The magic. This is what makes the plugin 'shuffle'
|
1574
|
-
* @param {string|Function|Array.<string>} [category] Category to filter by.
|
1575
|
-
* Can be a function, string, or array of strings.
|
1576
|
-
* @param {Object} [sortObj] A sort object which can sort the visible set
|
1577
|
-
*/
|
1578
|
-
|
1579
|
-
}, {
|
1580
|
-
key: 'filter',
|
1581
|
-
value: function filter(category, sortObj) {
|
1582
|
-
if (!this.isEnabled) {
|
1583
|
-
return;
|
1584
|
-
}
|
1585
|
-
|
1586
|
-
if (!category || category && category.length === 0) {
|
1587
|
-
category = Shuffle.ALL_ITEMS; // eslint-disable-line no-param-reassign
|
1588
|
-
}
|
1589
|
-
|
1590
|
-
this._filter(category);
|
1591
|
-
|
1592
|
-
// Shrink each hidden item
|
1593
|
-
this._shrink();
|
1594
|
-
|
1595
|
-
// How many visible elements?
|
1596
|
-
this._updateItemCount();
|
1597
|
-
|
1598
|
-
// Update transforms on visible elements so they will animate to their new positions.
|
1599
|
-
this.sort(sortObj);
|
1600
|
-
}
|
1601
|
-
|
1602
|
-
/**
|
1603
|
-
* Gets the visible elements, sorts them, and passes them to layout.
|
1604
|
-
* @param {Object} opts the options object for the sorted plugin
|
1605
|
-
*/
|
1606
|
-
|
1607
|
-
}, {
|
1608
|
-
key: 'sort',
|
1609
|
-
value: function sort() {
|
1610
|
-
var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.lastSort;
|
1611
|
-
|
1612
|
-
if (!this.isEnabled) {
|
1613
|
-
return;
|
1614
|
-
}
|
1615
|
-
|
1616
|
-
this._resetCols();
|
1617
|
-
|
1618
|
-
var items = this._getFilteredItems();
|
1619
|
-
items = sorter(items, opts);
|
1620
|
-
|
1621
|
-
this._layout(items);
|
1622
|
-
|
1623
|
-
// `_layout` always happens after `_shrink`, so it's safe to process the style
|
1624
|
-
// queue here with styles from the shrink method.
|
1625
|
-
this._processQueue();
|
1626
|
-
|
1627
|
-
// Adjust the height of the container.
|
1628
|
-
this._setContainerSize();
|
1629
|
-
|
1630
|
-
this.lastSort = opts;
|
1631
|
-
}
|
1632
|
-
|
1633
|
-
/**
|
1634
|
-
* Reposition everything.
|
1635
|
-
* @param {boolean} isOnlyLayout If true, column and gutter widths won't be
|
1636
|
-
* recalculated.
|
1637
|
-
*/
|
1638
|
-
|
1639
|
-
}, {
|
1640
|
-
key: 'update',
|
1641
|
-
value: function update(isOnlyLayout) {
|
1642
|
-
if (this.isEnabled) {
|
1643
|
-
if (!isOnlyLayout) {
|
1644
|
-
// Get updated colCount
|
1645
|
-
this._setColumns();
|
1646
|
-
}
|
1647
|
-
|
1648
|
-
// Layout items
|
1649
|
-
this.sort();
|
1650
|
-
}
|
1651
|
-
}
|
1652
|
-
|
1653
|
-
/**
|
1654
|
-
* Use this instead of `update()` if you don't need the columns and gutters updated
|
1655
|
-
* Maybe an image inside `shuffle` loaded (and now has a height), which means calculations
|
1656
|
-
* could be off.
|
1657
|
-
*/
|
1658
|
-
|
1659
|
-
}, {
|
1660
|
-
key: 'layout',
|
1661
|
-
value: function layout() {
|
1662
|
-
this.update(true);
|
1663
|
-
}
|
1664
|
-
|
1665
|
-
/**
|
1666
|
-
* New items have been appended to shuffle. Mix them in with the current
|
1667
|
-
* filter or sort status.
|
1668
|
-
* @param {Array.<Element>} newItems Collection of new items.
|
1669
|
-
*/
|
1670
|
-
|
1671
|
-
}, {
|
1672
|
-
key: 'add',
|
1673
|
-
value: function add(newItems) {
|
1674
|
-
var items = index$1(newItems).map(function (el) {
|
1675
|
-
return new ShuffleItem(el);
|
1676
|
-
});
|
1677
|
-
|
1678
|
-
// Add classes and set initial positions.
|
1679
|
-
this._initItems(items);
|
1680
|
-
|
1681
|
-
// Add transition to each item.
|
1682
|
-
this._setTransitions(items);
|
1683
|
-
|
1684
|
-
// Update the list of items.
|
1685
|
-
this.items = this.items.concat(items);
|
1686
|
-
this._updateItemsOrder();
|
1687
|
-
this.filter(this.lastFilter);
|
1688
|
-
}
|
1689
|
-
|
1690
|
-
/**
|
1691
|
-
* Disables shuffle from updating dimensions and layout on resize
|
1692
|
-
*/
|
1693
|
-
|
1694
|
-
}, {
|
1695
|
-
key: 'disable',
|
1696
|
-
value: function disable() {
|
1697
|
-
this.isEnabled = false;
|
1698
|
-
}
|
1699
|
-
|
1700
|
-
/**
|
1701
|
-
* Enables shuffle again
|
1702
|
-
* @param {boolean} [isUpdateLayout=true] if undefined, shuffle will update columns and gutters
|
1703
|
-
*/
|
1704
|
-
|
1705
|
-
}, {
|
1706
|
-
key: 'enable',
|
1707
|
-
value: function enable(isUpdateLayout) {
|
1708
|
-
this.isEnabled = true;
|
1709
|
-
if (isUpdateLayout !== false) {
|
1710
|
-
this.update();
|
1711
|
-
}
|
1712
|
-
}
|
1713
|
-
|
1714
|
-
/**
|
1715
|
-
* Remove 1 or more shuffle items
|
1716
|
-
* @param {Array.<Element>} elements An array containing one or more
|
1717
|
-
* elements in shuffle
|
1718
|
-
* @return {Shuffle} The shuffle object
|
1719
|
-
*/
|
1720
|
-
|
1721
|
-
}, {
|
1722
|
-
key: 'remove',
|
1723
|
-
value: function remove(elements) {
|
1724
|
-
var _this8 = this;
|
1725
|
-
|
1726
|
-
if (!elements.length) {
|
1727
|
-
return;
|
1728
|
-
}
|
1729
|
-
|
1730
|
-
var collection = index$1(elements);
|
1731
|
-
|
1732
|
-
var oldItems = collection.map(function (element) {
|
1733
|
-
return _this8.getItemByElement(element);
|
1734
|
-
}).filter(function (item) {
|
1735
|
-
return !!item;
|
1736
|
-
});
|
1737
|
-
|
1738
|
-
var handleLayout = function handleLayout() {
|
1739
|
-
_this8.element.removeEventListener(Shuffle.EventType.LAYOUT, handleLayout);
|
1740
|
-
_this8._disposeItems(oldItems);
|
1741
|
-
|
1742
|
-
// Remove the collection in the callback
|
1743
|
-
collection.forEach(function (element) {
|
1744
|
-
element.parentNode.removeChild(element);
|
1745
|
-
});
|
1746
|
-
|
1747
|
-
_this8._dispatch(Shuffle.EventType.REMOVED, { collection: collection });
|
1748
|
-
};
|
1749
|
-
|
1750
|
-
// Hide collection first.
|
1751
|
-
this._toggleFilterClasses({
|
1752
|
-
visible: [],
|
1753
|
-
hidden: oldItems
|
1754
|
-
});
|
1755
|
-
|
1756
|
-
this._shrink(oldItems);
|
1757
|
-
|
1758
|
-
this.sort();
|
1759
|
-
|
1760
|
-
// Update the list of items here because `remove` could be called again
|
1761
|
-
// with an item that is in the process of being removed.
|
1762
|
-
this.items = this.items.filter(function (item) {
|
1763
|
-
return !arrayIncludes(oldItems, item);
|
1764
|
-
});
|
1765
|
-
this._updateItemCount();
|
1766
|
-
|
1767
|
-
this.element.addEventListener(Shuffle.EventType.LAYOUT, handleLayout);
|
1768
|
-
}
|
1769
|
-
|
1770
|
-
/**
|
1771
|
-
* Retrieve a shuffle item by its element.
|
1772
|
-
* @param {Element} element Element to look for.
|
1773
|
-
* @return {?ShuffleItem} A shuffle item or null if it's not found.
|
1774
|
-
*/
|
1775
|
-
|
1776
|
-
}, {
|
1777
|
-
key: 'getItemByElement',
|
1778
|
-
value: function getItemByElement(element) {
|
1779
|
-
for (var i = this.items.length - 1; i >= 0; i--) {
|
1780
|
-
if (this.items[i].element === element) {
|
1781
|
-
return this.items[i];
|
1782
|
-
}
|
1783
|
-
}
|
1784
|
-
|
1785
|
-
return null;
|
1786
|
-
}
|
1787
|
-
|
1788
|
-
/**
|
1789
|
-
* Destroys shuffle, removes events, styles, and classes
|
1790
|
-
*/
|
1791
|
-
|
1792
|
-
}, {
|
1793
|
-
key: 'destroy',
|
1794
|
-
value: function destroy() {
|
1795
|
-
this._cancelMovement();
|
1796
|
-
window.removeEventListener('resize', this._onResize);
|
1797
|
-
|
1798
|
-
// Reset container styles
|
1799
|
-
this.element.classList.remove('shuffle');
|
1800
|
-
this.element.removeAttribute('style');
|
1801
|
-
|
1802
|
-
// Reset individual item styles
|
1803
|
-
this._disposeItems();
|
1804
|
-
|
1805
|
-
// Null DOM references
|
1806
|
-
this.items = null;
|
1807
|
-
this.options.sizer = null;
|
1808
|
-
this.element = null;
|
1809
|
-
this._transitions = null;
|
1810
|
-
|
1811
|
-
// Set a flag so if a debounced resize has been triggered,
|
1812
|
-
// it can first check if it is actually isDestroyed and not doing anything
|
1813
|
-
this.isDestroyed = true;
|
1814
|
-
}
|
1815
|
-
|
1816
|
-
/**
|
1817
|
-
* Returns the outer width of an element, optionally including its margins.
|
1818
|
-
*
|
1819
|
-
* There are a few different methods for getting the width of an element, none of
|
1820
|
-
* which work perfectly for all Shuffle's use cases.
|
1821
|
-
*
|
1822
|
-
* 1. getBoundingClientRect() `left` and `right` properties.
|
1823
|
-
* - Accounts for transform scaled elements, making it useless for Shuffle
|
1824
|
-
* elements which have shrunk.
|
1825
|
-
* 2. The `offsetWidth` property.
|
1826
|
-
* - This value stays the same regardless of the elements transform property,
|
1827
|
-
* however, it does not return subpixel values.
|
1828
|
-
* 3. getComputedStyle()
|
1829
|
-
* - This works great Chrome, Firefox, Safari, but IE<=11 does not include
|
1830
|
-
* padding and border when box-sizing: border-box is set, requiring a feature
|
1831
|
-
* test and extra work to add the padding back for IE and other browsers which
|
1832
|
-
* follow the W3C spec here.
|
1833
|
-
*
|
1834
|
-
* @param {Element} element The element.
|
1835
|
-
* @param {boolean} [includeMargins] Whether to include margins. Default is false.
|
1836
|
-
* @return {{width: number, height: number}} The width and height.
|
1837
|
-
*/
|
1838
|
-
|
1839
|
-
}], [{
|
1840
|
-
key: 'getSize',
|
1841
|
-
value: function getSize(element, includeMargins) {
|
1842
|
-
// Store the styles so that they can be used by others without asking for it again.
|
1843
|
-
var styles = window.getComputedStyle(element, null);
|
1844
|
-
var width = getNumberStyle(element, 'width', styles);
|
1845
|
-
var height = getNumberStyle(element, 'height', styles);
|
1846
|
-
|
1847
|
-
if (includeMargins) {
|
1848
|
-
var marginLeft = getNumberStyle(element, 'marginLeft', styles);
|
1849
|
-
var marginRight = getNumberStyle(element, 'marginRight', styles);
|
1850
|
-
var marginTop = getNumberStyle(element, 'marginTop', styles);
|
1851
|
-
var marginBottom = getNumberStyle(element, 'marginBottom', styles);
|
1852
|
-
width += marginLeft + marginRight;
|
1853
|
-
height += marginTop + marginBottom;
|
1854
|
-
}
|
1855
|
-
|
1856
|
-
return {
|
1857
|
-
width: width,
|
1858
|
-
height: height
|
1859
|
-
};
|
1860
|
-
}
|
1861
|
-
|
1862
|
-
/**
|
1863
|
-
* Change a property or execute a function which will not have a transition
|
1864
|
-
* @param {Array.<Element>} elements DOM elements that won't be transitioned.
|
1865
|
-
* @param {Function} callback A function which will be called while transition
|
1866
|
-
* is set to 0ms.
|
1867
|
-
* @private
|
1868
|
-
*/
|
1869
|
-
|
1870
|
-
}, {
|
1871
|
-
key: '_skipTransitions',
|
1872
|
-
value: function _skipTransitions(elements, callback) {
|
1873
|
-
var zero = '0ms';
|
1874
|
-
|
1875
|
-
// Save current duration and delay.
|
1876
|
-
var data = elements.map(function (element) {
|
1877
|
-
var style = element.style;
|
1878
|
-
var duration = style.transitionDuration;
|
1879
|
-
var delay = style.transitionDelay;
|
1880
|
-
|
1881
|
-
// Set the duration to zero so it happens immediately
|
1882
|
-
style.transitionDuration = zero;
|
1883
|
-
style.transitionDelay = zero;
|
1884
|
-
|
1885
|
-
return {
|
1886
|
-
duration: duration,
|
1887
|
-
delay: delay
|
1888
|
-
};
|
1889
|
-
});
|
1890
|
-
|
1891
|
-
callback();
|
1892
|
-
|
1893
|
-
// Cause reflow.
|
1894
|
-
elements[0].offsetWidth; // eslint-disable-line no-unused-expressions
|
1895
|
-
|
1896
|
-
// Put the duration back
|
1897
|
-
elements.forEach(function (element, i) {
|
1898
|
-
element.style.transitionDuration = data[i].duration;
|
1899
|
-
element.style.transitionDelay = data[i].delay;
|
1900
|
-
});
|
1901
|
-
}
|
1902
|
-
}]);
|
1903
|
-
return Shuffle;
|
1904
|
-
}();
|
1905
|
-
|
1906
|
-
Shuffle.ShuffleItem = ShuffleItem;
|
1907
|
-
|
1908
|
-
Shuffle.ALL_ITEMS = 'all';
|
1909
|
-
Shuffle.FILTER_ATTRIBUTE_KEY = 'groups';
|
1910
|
-
|
1911
|
-
/**
|
1912
|
-
* @enum {string}
|
1913
|
-
*/
|
1914
|
-
Shuffle.EventType = {
|
1915
|
-
LAYOUT: 'shuffle:layout',
|
1916
|
-
REMOVED: 'shuffle:removed'
|
1917
|
-
};
|
1918
|
-
|
1919
|
-
/** @enum {string} */
|
1920
|
-
Shuffle.Classes = Classes;
|
1921
|
-
|
1922
|
-
/**
|
1923
|
-
* @enum {string}
|
1924
|
-
*/
|
1925
|
-
Shuffle.FilterMode = {
|
1926
|
-
ANY: 'any',
|
1927
|
-
ALL: 'all'
|
1928
|
-
};
|
1929
|
-
|
1930
|
-
// Overrideable options
|
1931
|
-
Shuffle.options = {
|
1932
|
-
// Initial filter group.
|
1933
|
-
group: Shuffle.ALL_ITEMS,
|
1934
|
-
|
1935
|
-
// Transition/animation speed (milliseconds).
|
1936
|
-
speed: 250,
|
1937
|
-
|
1938
|
-
// CSS easing function to use.
|
1939
|
-
easing: 'ease',
|
1940
|
-
|
1941
|
-
// e.g. '.picture-item'.
|
1942
|
-
itemSelector: '*',
|
1943
|
-
|
1944
|
-
// Element or selector string. Use an element to determine the size of columns
|
1945
|
-
// and gutters.
|
1946
|
-
sizer: null,
|
1947
|
-
|
1948
|
-
// A static number or function that tells the plugin how wide the gutters
|
1949
|
-
// between columns are (in pixels).
|
1950
|
-
gutterWidth: 0,
|
1951
|
-
|
1952
|
-
// A static number or function that returns a number which tells the plugin
|
1953
|
-
// how wide the columns are (in pixels).
|
1954
|
-
columnWidth: 0,
|
1955
|
-
|
1956
|
-
// If your group is not json, and is comma delimeted, you could set delimeter
|
1957
|
-
// to ','.
|
1958
|
-
delimeter: null,
|
1959
|
-
|
1960
|
-
// Useful for percentage based heights when they might not always be exactly
|
1961
|
-
// the same (in pixels).
|
1962
|
-
buffer: 0,
|
1963
|
-
|
1964
|
-
// Reading the width of elements isn't precise enough and can cause columns to
|
1965
|
-
// jump between values.
|
1966
|
-
columnThreshold: 0.01,
|
1967
|
-
|
1968
|
-
// Shuffle can be isInitialized with a sort object. It is the same object
|
1969
|
-
// given to the sort method.
|
1970
|
-
initialSort: null,
|
1971
|
-
|
1972
|
-
// By default, shuffle will throttle resize events. This can be changed or
|
1973
|
-
// removed.
|
1974
|
-
throttle: index$2,
|
1975
|
-
|
1976
|
-
// How often shuffle can be called on resize (in milliseconds).
|
1977
|
-
throttleTime: 300,
|
1978
|
-
|
1979
|
-
// Transition delay offset for each item in milliseconds.
|
1980
|
-
staggerAmount: 15,
|
1981
|
-
|
1982
|
-
// Maximum stagger delay in milliseconds.
|
1983
|
-
staggerAmountMax: 250,
|
1984
|
-
|
1985
|
-
// Whether to use transforms or absolute positioning.
|
1986
|
-
useTransforms: true,
|
1987
|
-
|
1988
|
-
// Affects using an array with filter. e.g. `filter(['one', 'two'])`. With "any",
|
1989
|
-
// the element passes the test if any of its groups are in the array. With "all",
|
1990
|
-
// the element only passes if all groups are in the array.
|
1991
|
-
filterMode: Shuffle.FilterMode.ANY
|
1992
|
-
};
|
1993
|
-
|
1994
|
-
// Expose for testing. Hack at your own risk.
|
1995
|
-
Shuffle.__Point = Point;
|
1996
|
-
Shuffle.__sorter = sorter;
|
1997
|
-
Shuffle.__getColumnSpan = getColumnSpan;
|
1998
|
-
Shuffle.__getAvailablePositions = getAvailablePositions;
|
1999
|
-
Shuffle.__getShortColumn = getShortColumn;
|
2000
|
-
|
2001
|
-
return Shuffle;
|
2002
|
-
|
2003
|
-
})));
|
2004
|
-
//# sourceMappingURL=shuffle.js.map
|