materialize-sass 1.0.0.alpha1 → 1.0.0.alpha2
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
- data/assets/javascripts/materialize-sprockets.js +1 -1
- data/assets/javascripts/materialize.js +1162 -1218
- data/assets/javascripts/materialize/anime.min.js +417 -0
- data/assets/javascripts/materialize/buttons.js +49 -26
- data/assets/javascripts/materialize/cards.js +14 -8
- data/assets/javascripts/materialize/cash.js +3 -5
- data/assets/javascripts/materialize/chips.js +22 -19
- data/assets/javascripts/materialize/collapsible.js +53 -17
- data/assets/javascripts/materialize/datepicker.js +94 -78
- data/assets/javascripts/materialize/dropdown.js +33 -26
- data/assets/javascripts/materialize/extras/nouislider.js +1 -1
- data/assets/javascripts/materialize/extras/nouislider.min.js +1 -1
- data/assets/javascripts/materialize/forms.js +17 -6
- data/assets/javascripts/materialize/global.js +17 -15
- data/assets/javascripts/materialize/materialbox.js +62 -35
- data/assets/javascripts/materialize/modal.js +50 -19
- data/assets/javascripts/materialize/range.js +40 -16
- data/assets/javascripts/materialize/scrollspy.js +9 -3
- data/assets/javascripts/materialize/select.js +62 -38
- data/assets/javascripts/materialize/sidenav.js +52 -18
- data/assets/javascripts/materialize/slider.js +56 -16
- data/assets/javascripts/materialize/tabs.js +35 -23
- data/assets/javascripts/materialize/timepicker.js +581 -579
- data/assets/javascripts/materialize/toasts.js +11 -7
- data/assets/javascripts/materialize/tooltip.js +16 -18
- data/assets/stylesheets/materialize.scss +3 -3
- data/assets/stylesheets/materialize/components/_buttons.scss +2 -2
- data/assets/stylesheets/materialize/components/_color-classes.scss +32 -0
- data/assets/stylesheets/materialize/components/{_color.scss → _color-variables.scss} +0 -42
- data/assets/stylesheets/materialize/components/_datepicker.scss +10 -4
- data/assets/stylesheets/materialize/components/_dropdown.scss +5 -0
- data/assets/stylesheets/materialize/components/_navbar.scss +3 -3
- data/assets/stylesheets/materialize/components/_pulse.scss +1 -1
- data/assets/stylesheets/materialize/components/_timepicker.scss +1 -0
- data/assets/stylesheets/materialize/components/_variables.scss +0 -1
- data/assets/stylesheets/materialize/components/forms/_input-fields.scss +6 -4
- data/assets/stylesheets/materialize/components/forms/_range.scss +3 -3
- data/assets/stylesheets/materialize/components/forms/_select.scss +7 -7
- data/assets/stylesheets/materialize/extras/nouislider.css +1 -1
- data/lib/materialize-sass/engine.rb +2 -0
- data/lib/materialize-sass/helpers.rb +38 -0
- data/lib/materialize-sass/version.rb +1 -1
- metadata +6 -5
- data/assets/javascripts/materialize/velocity.min.js +0 -782
- data/assets/stylesheets/materialize/components/_mixins.scss +0 -5
@@ -2,7 +2,7 @@ var _createClass = function () { function defineProperties(target, props) { for
|
|
2
2
|
|
3
3
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
4
4
|
|
5
|
-
(function ($,
|
5
|
+
(function ($, anim) {
|
6
6
|
'use strict';
|
7
7
|
|
8
8
|
var _defaults = {};
|
@@ -66,12 +66,14 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
66
66
|
key: '_setupEventHandlers',
|
67
67
|
value: function _setupEventHandlers() {
|
68
68
|
this._handleRangeChangeBound = this._handleRangeChange.bind(this);
|
69
|
+
this._handleRangeFocusBound = this._handleRangeFocus.bind(this);
|
69
70
|
this._handleRangeMousedownTouchstartBound = this._handleRangeMousedownTouchstart.bind(this);
|
70
71
|
this._handleRangeInputMousemoveTouchmoveBound = this._handleRangeInputMousemoveTouchmove.bind(this);
|
71
72
|
this._handleRangeMouseupTouchendBound = this._handleRangeMouseupTouchend.bind(this);
|
72
73
|
this._handleRangeBlurMouseoutTouchleaveBound = this._handleRangeBlurMouseoutTouchleave.bind(this);
|
73
74
|
|
74
75
|
this.el.addEventListener('change', this._handleRangeChangeBound);
|
76
|
+
this.el.addEventListener('focus', this._handleRangeFocusBound);
|
75
77
|
|
76
78
|
this.el.addEventListener('mousedown', this._handleRangeMousedownTouchstartBound);
|
77
79
|
this.el.addEventListener('touchstart', this._handleRangeMousedownTouchstartBound);
|
@@ -96,6 +98,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
96
98
|
key: '_removeEventHandlers',
|
97
99
|
value: function _removeEventHandlers() {
|
98
100
|
this.el.removeEventListener('change', this._handleRangeChangeBound);
|
101
|
+
this.el.removeEventListener('focus', this._handleRangeFocusBound);
|
99
102
|
|
100
103
|
this.el.removeEventListener('mousedown', this._handleRangeMousedownTouchstartBound);
|
101
104
|
this.el.removeEventListener('touchstart', this._handleRangeMousedownTouchstartBound);
|
@@ -130,6 +133,19 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
130
133
|
$(this.thumb).addClass('active').css('left', offsetLeft + 'px');
|
131
134
|
}
|
132
135
|
|
136
|
+
/**
|
137
|
+
* Handle Range Focus
|
138
|
+
* @param {Event} e
|
139
|
+
*/
|
140
|
+
|
141
|
+
}, {
|
142
|
+
key: '_handleRangeFocus',
|
143
|
+
value: function _handleRangeFocus() {
|
144
|
+
if (M.tabPressed) {
|
145
|
+
this.$el.addClass('focused');
|
146
|
+
}
|
147
|
+
}
|
148
|
+
|
133
149
|
/**
|
134
150
|
* Handle Range Mousedown and Touchstart
|
135
151
|
* @param {Event} e
|
@@ -191,17 +207,21 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
191
207
|
key: '_handleRangeBlurMouseoutTouchleave',
|
192
208
|
value: function _handleRangeBlurMouseoutTouchleave() {
|
193
209
|
if (!this._mousedown) {
|
210
|
+
this.$el.removeClass('focused');
|
194
211
|
var paddingLeft = parseInt(this.$el.css('padding-left'));
|
195
212
|
var marginLeft = 7 + paddingLeft + 'px';
|
196
213
|
|
197
214
|
if ($(this.thumb).hasClass('active')) {
|
198
|
-
|
199
|
-
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
|
215
|
+
anim.remove(this.thumb);
|
216
|
+
anim({
|
217
|
+
targets: this.thumb,
|
218
|
+
height: 0,
|
219
|
+
width: 0,
|
220
|
+
top: 10,
|
221
|
+
easing: 'easeOutQuad',
|
222
|
+
marginLeft: marginLeft,
|
223
|
+
duration: 100
|
224
|
+
});
|
205
225
|
}
|
206
226
|
$(this.thumb).removeClass('active');
|
207
227
|
}
|
@@ -241,12 +261,16 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
241
261
|
value: function _showRangeBubble() {
|
242
262
|
var paddingLeft = parseInt($(this.thumb).parent().css('padding-left'));
|
243
263
|
var marginLeft = -7 + paddingLeft + 'px'; // TODO: fix magic number?
|
244
|
-
|
245
|
-
|
246
|
-
|
247
|
-
|
248
|
-
|
249
|
-
|
264
|
+
anim.remove(this.thumb);
|
265
|
+
anim({
|
266
|
+
targets: this.thumb,
|
267
|
+
height: 30,
|
268
|
+
width: 30,
|
269
|
+
top: -30,
|
270
|
+
marginLeft: marginLeft,
|
271
|
+
duration: 300,
|
272
|
+
easing: 'easeOutQuint'
|
273
|
+
});
|
250
274
|
}
|
251
275
|
|
252
276
|
/**
|
@@ -301,5 +325,5 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
301
325
|
M.initializeJqueryWrapper(Range, 'range', 'M_Range');
|
302
326
|
}
|
303
327
|
|
304
|
-
Range.init($('input[type=range'));
|
305
|
-
})(cash, M.
|
328
|
+
Range.init($('input[type=range]'));
|
329
|
+
})(cash, M.anime);
|
@@ -2,7 +2,7 @@ var _createClass = function () { function defineProperties(target, props) { for
|
|
2
2
|
|
3
3
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
4
4
|
|
5
|
-
(function ($,
|
5
|
+
(function ($, anim) {
|
6
6
|
'use strict';
|
7
7
|
|
8
8
|
var _defaults = {
|
@@ -120,7 +120,13 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
120
120
|
if ($trigger.is('a[href="#' + scrollspy.$el.attr('id') + '"]')) {
|
121
121
|
e.preventDefault();
|
122
122
|
var offset = scrollspy.$el.offset().top + 1;
|
123
|
-
|
123
|
+
|
124
|
+
anim({
|
125
|
+
targets: [document.documentElement, document.body],
|
126
|
+
scrollTop: offset - scrollspy.options.scrollOffset,
|
127
|
+
duration: 400,
|
128
|
+
easing: 'easeOutCubic'
|
129
|
+
});
|
124
130
|
break;
|
125
131
|
}
|
126
132
|
}
|
@@ -319,4 +325,4 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
319
325
|
if (M.jQueryLoaded) {
|
320
326
|
M.initializeJqueryWrapper(ScrollSpy, 'scrollSpy', 'M_ScrollSpy');
|
321
327
|
}
|
322
|
-
})(cash, M.
|
328
|
+
})(cash, M.anime);
|
@@ -42,8 +42,8 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
42
42
|
this.isMultiple = this.$el.prop('multiple');
|
43
43
|
|
44
44
|
// Setup
|
45
|
-
this.
|
46
|
-
this
|
45
|
+
this._keysSelected = {};
|
46
|
+
this._valueDict = {}; // Maps key to original and generated option element.
|
47
47
|
this._setupDropdown();
|
48
48
|
|
49
49
|
this._setupEventHandlers();
|
@@ -120,14 +120,14 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
120
120
|
value: function _handleOptionClick(e) {
|
121
121
|
e.preventDefault();
|
122
122
|
var option = $(e.target).closest('li')[0];
|
123
|
-
var
|
124
|
-
if (!$(option).hasClass('disabled') && !$(option).hasClass('optgroup')) {
|
123
|
+
var key = option.id;
|
124
|
+
if (!$(option).hasClass('disabled') && !$(option).hasClass('optgroup') && key.length) {
|
125
125
|
var selected = true;
|
126
126
|
|
127
127
|
if (this.isMultiple) {
|
128
128
|
var checkbox = $(option).find('input[type="checkbox"]');
|
129
129
|
checkbox.prop('checked', !checkbox.prop('checked'));
|
130
|
-
selected = this._toggleEntryFromArray(
|
130
|
+
selected = this._toggleEntryFromArray(key);
|
131
131
|
} else {
|
132
132
|
$(this.dropdownOptions).find('li').removeClass('active');
|
133
133
|
$(option).toggleClass('active');
|
@@ -135,7 +135,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
135
135
|
}
|
136
136
|
|
137
137
|
this._activateOption($(this.dropdownOptions), option);
|
138
|
-
this
|
138
|
+
$(this._valueDict[key].el).prop('selected', selected);
|
139
139
|
this.$el.trigger('change');
|
140
140
|
}
|
141
141
|
|
@@ -165,7 +165,6 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
165
165
|
var _this3 = this;
|
166
166
|
|
167
167
|
this.wrapper = document.createElement('div');
|
168
|
-
this.wrapper.classList.add();
|
169
168
|
$(this.wrapper).addClass('select-wrapper' + ' ' + this.options.classes);
|
170
169
|
this.$el.before($(this.wrapper));
|
171
170
|
this.wrapper.appendChild(this.el);
|
@@ -192,9 +191,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
192
191
|
optionEl = _this3._appendOptionWithIcon(_this3.$el, el);
|
193
192
|
}
|
194
193
|
|
195
|
-
|
196
|
-
_this3.$selectedOptions.add(optionEl);
|
197
|
-
}
|
194
|
+
_this3._addOptionToValueDict(el, optionEl);
|
198
195
|
} else if ($(el).is('optgroup')) {
|
199
196
|
// Optgroup.
|
200
197
|
var selectOptions = $(el).children('option');
|
@@ -202,9 +199,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
202
199
|
|
203
200
|
selectOptions.each(function (el) {
|
204
201
|
var optionEl = _this3._appendOptionWithIcon(_this3.$el, el, 'optgroup-option');
|
205
|
-
|
206
|
-
_this3.$selectedOptions.add(optionEl);
|
207
|
-
}
|
202
|
+
_this3._addOptionToValueDict(el, optionEl);
|
208
203
|
});
|
209
204
|
}
|
210
205
|
});
|
@@ -226,7 +221,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
226
221
|
this._setValueToInput();
|
227
222
|
|
228
223
|
// Add caret
|
229
|
-
var dropdownIcon = $('<svg class="caret"
|
224
|
+
var dropdownIcon = $('<svg class="caret" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');
|
230
225
|
this.$el.before(dropdownIcon[0]);
|
231
226
|
|
232
227
|
// Initialize dropdown
|
@@ -242,6 +237,25 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
242
237
|
this._setSelectedStates();
|
243
238
|
}
|
244
239
|
|
240
|
+
/**
|
241
|
+
* Add option to value dict
|
242
|
+
* @param {Element} el original option element
|
243
|
+
* @param {Element} optionEl generated option element
|
244
|
+
*/
|
245
|
+
|
246
|
+
}, {
|
247
|
+
key: '_addOptionToValueDict',
|
248
|
+
value: function _addOptionToValueDict(el, optionEl) {
|
249
|
+
var index = Object.keys(this._valueDict).length;
|
250
|
+
var key = this.dropdownOptions.id + index;
|
251
|
+
var obj = {};
|
252
|
+
optionEl.id = key;
|
253
|
+
|
254
|
+
obj.el = el;
|
255
|
+
obj.optionEl = optionEl;
|
256
|
+
this._valueDict[key] = obj;
|
257
|
+
}
|
258
|
+
|
245
259
|
/**
|
246
260
|
* Remove dropdown
|
247
261
|
*/
|
@@ -292,26 +306,24 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
292
306
|
|
293
307
|
/**
|
294
308
|
* Toggle entry from option
|
295
|
-
* @param {
|
309
|
+
* @param {String} key Option key
|
296
310
|
* @return {Boolean} if entry was added or removed
|
297
311
|
*/
|
298
312
|
|
299
313
|
}, {
|
300
314
|
key: '_toggleEntryFromArray',
|
301
|
-
value: function _toggleEntryFromArray(
|
302
|
-
var
|
303
|
-
notAdded = index === -1;
|
304
|
-
|
315
|
+
value: function _toggleEntryFromArray(key) {
|
316
|
+
var notAdded = !this._keysSelected.hasOwnProperty(key);
|
305
317
|
if (notAdded) {
|
306
|
-
this.
|
318
|
+
this._keysSelected[key] = true;
|
307
319
|
} else {
|
308
|
-
this.
|
320
|
+
delete this._keysSelected[key];
|
309
321
|
}
|
310
322
|
|
311
|
-
$(this.
|
323
|
+
$(this._valueDict[key].optionEl).toggleClass('active');
|
312
324
|
|
313
325
|
// use notAdded instead of true (to detect if the option is selected or not)
|
314
|
-
this
|
326
|
+
$(this._valueDict[key].el).prop('selected', notAdded);
|
315
327
|
|
316
328
|
return notAdded;
|
317
329
|
}
|
@@ -326,7 +338,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
326
338
|
var value = '';
|
327
339
|
var options = this.$el.find('option');
|
328
340
|
|
329
|
-
options.each(function (el
|
341
|
+
options.each(function (el) {
|
330
342
|
if ($(el).prop('selected')) {
|
331
343
|
var text = $(el).text();
|
332
344
|
value === '' ? value += text : value += ', ' + text;
|
@@ -350,22 +362,19 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
350
362
|
}, {
|
351
363
|
key: '_setSelectedStates',
|
352
364
|
value: function _setSelectedStates() {
|
353
|
-
|
354
|
-
|
355
|
-
this.
|
356
|
-
|
357
|
-
|
358
|
-
|
359
|
-
|
360
|
-
|
361
|
-
option.find('input[type="checkbox"]').prop("checked", true);
|
362
|
-
_this4._activateOption($(_this4.dropdownOptions), option);
|
363
|
-
_this4.valuesSelected.push(i);
|
365
|
+
this._keysSelected = {};
|
366
|
+
|
367
|
+
for (var key in this._valueDict) {
|
368
|
+
var option = this._valueDict[key];
|
369
|
+
if ($(option.el).prop('selected')) {
|
370
|
+
$(option.optionEl).find('input[type="checkbox"]').prop("checked", true);
|
371
|
+
this._activateOption($(this.dropdownOptions), $(option.optionEl));
|
372
|
+
this._keysSelected[key] = true;
|
364
373
|
} else {
|
365
|
-
option.find('input[type="checkbox"]').prop("checked", false);
|
366
|
-
option.removeClass('selected');
|
374
|
+
$(option.optionEl).find('input[type="checkbox"]').prop("checked", false);
|
375
|
+
$(option.optionEl).removeClass('selected');
|
367
376
|
}
|
368
|
-
}
|
377
|
+
}
|
369
378
|
}
|
370
379
|
|
371
380
|
/**
|
@@ -386,6 +395,21 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
386
395
|
option.addClass('selected');
|
387
396
|
}
|
388
397
|
}
|
398
|
+
|
399
|
+
/**
|
400
|
+
* Get Selected Values
|
401
|
+
* @return {Array} Array of selected values
|
402
|
+
*/
|
403
|
+
|
404
|
+
}, {
|
405
|
+
key: 'getSelectedValues',
|
406
|
+
value: function getSelectedValues() {
|
407
|
+
var selectedValues = [];
|
408
|
+
for (var key in this._keysSelected) {
|
409
|
+
selectedValues.push(this._valueDict[key].el.value);
|
410
|
+
}
|
411
|
+
return selectedValues;
|
412
|
+
}
|
389
413
|
}], [{
|
390
414
|
key: 'init',
|
391
415
|
value: function init($els, options) {
|
@@ -2,7 +2,7 @@ var _createClass = function () { function defineProperties(target, props) { for
|
|
2
2
|
|
3
3
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
4
4
|
|
5
|
-
(function ($,
|
5
|
+
(function ($, anim) {
|
6
6
|
'use strict';
|
7
7
|
|
8
8
|
var _defaults = {
|
@@ -181,7 +181,7 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
181
181
|
|
182
182
|
/**
|
183
183
|
* Set variables needed at the beggining of drag
|
184
|
-
* and stop any current
|
184
|
+
* and stop any current transition.
|
185
185
|
* @param {Event} e
|
186
186
|
*/
|
187
187
|
|
@@ -195,8 +195,8 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
195
195
|
this._time = Date.now();
|
196
196
|
this._width = this.el.getBoundingClientRect().width;
|
197
197
|
this._overlay.style.display = 'block';
|
198
|
-
|
199
|
-
|
198
|
+
anim.remove(this.el);
|
199
|
+
anim.remove(this._overlay);
|
200
200
|
}
|
201
201
|
|
202
202
|
/**
|
@@ -425,8 +425,13 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
425
425
|
|
426
426
|
// Handle fixed Sidenav
|
427
427
|
if (this.isFixed && window.innerWidth > 992) {
|
428
|
-
|
429
|
-
|
428
|
+
anim.remove(this.el);
|
429
|
+
anim({
|
430
|
+
targets: this.el,
|
431
|
+
translateX: 0,
|
432
|
+
duration: 0,
|
433
|
+
easing: 'easeOutQuad'
|
434
|
+
});
|
430
435
|
this._enableBodyScrolling();
|
431
436
|
this._overlay.style.display = 'none';
|
432
437
|
|
@@ -485,13 +490,19 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
485
490
|
slideOutPercent = this.options.edge === 'left' ? slideOutPercent + this.percentOpen : slideOutPercent - this.percentOpen;
|
486
491
|
}
|
487
492
|
|
488
|
-
|
489
|
-
|
493
|
+
anim.remove(this.el);
|
494
|
+
anim({
|
495
|
+
targets: this.el,
|
496
|
+
translateX: [slideOutPercent * 100 + '%', 0],
|
497
|
+
duration: this.options.inDuration,
|
498
|
+
easing: 'easeOutQuad',
|
499
|
+
complete: function () {
|
490
500
|
// Run onOpenEnd callback
|
491
501
|
if (typeof _this.options.onOpenEnd === 'function') {
|
492
502
|
_this.options.onOpenEnd.call(_this, _this.el);
|
493
503
|
}
|
494
|
-
}
|
504
|
+
}
|
505
|
+
});
|
495
506
|
}
|
496
507
|
}, {
|
497
508
|
key: '_animateOverlayIn',
|
@@ -500,11 +511,18 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
500
511
|
if (this.isDragged) {
|
501
512
|
start = this.percentOpen;
|
502
513
|
} else {
|
503
|
-
|
514
|
+
$(this._overlay).css({
|
515
|
+
display: 'block'
|
516
|
+
});
|
504
517
|
}
|
505
518
|
|
506
|
-
|
507
|
-
|
519
|
+
anim.remove(this._overlay);
|
520
|
+
anim({
|
521
|
+
targets: this._overlay,
|
522
|
+
opacity: [start, 1],
|
523
|
+
duration: this.options.inDuration,
|
524
|
+
easing: 'easeOutQuad'
|
525
|
+
});
|
508
526
|
}
|
509
527
|
}, {
|
510
528
|
key: '_animateOut',
|
@@ -523,19 +541,35 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
523
541
|
slideOutPercent = this.options.edge === 'left' ? endPercent + this.percentOpen : endPercent - this.percentOpen;
|
524
542
|
}
|
525
543
|
|
526
|
-
|
527
|
-
|
544
|
+
anim.remove(this.el);
|
545
|
+
anim({
|
546
|
+
targets: this.el,
|
547
|
+
translateX: [slideOutPercent * 100 + '%', endPercent * 105 + '%'],
|
548
|
+
duration: this.options.outDuration,
|
549
|
+
easing: 'easeOutQuad',
|
550
|
+
complete: function () {
|
528
551
|
// Run onOpenEnd callback
|
529
552
|
if (typeof _this2.options.onCloseEnd === 'function') {
|
530
553
|
_this2.options.onCloseEnd.call(_this2, _this2.el);
|
531
554
|
}
|
532
|
-
}
|
555
|
+
}
|
556
|
+
});
|
533
557
|
}
|
534
558
|
}, {
|
535
559
|
key: '_animateOverlayOut',
|
536
560
|
value: function _animateOverlayOut() {
|
537
|
-
|
538
|
-
|
561
|
+
var _this3 = this;
|
562
|
+
|
563
|
+
anim.remove(this._overlay);
|
564
|
+
anim({
|
565
|
+
targets: this._overlay,
|
566
|
+
opacity: 0,
|
567
|
+
duration: this.options.outDuration,
|
568
|
+
easing: 'easeOutQuad',
|
569
|
+
complete: function () {
|
570
|
+
$(_this3._overlay).css('display', 'none');
|
571
|
+
}
|
572
|
+
});
|
539
573
|
}
|
540
574
|
}], [{
|
541
575
|
key: 'init',
|
@@ -581,4 +615,4 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
|
|
581
615
|
if (M.jQueryLoaded) {
|
582
616
|
M.initializeJqueryWrapper(Sidenav, 'sidenav', 'M_Sidenav');
|
583
617
|
}
|
584
|
-
})(cash, M.
|
618
|
+
})(cash, M.anime);
|