3 * Full featured mobile HTML framework for building iOS & Android apps
4 * http://framework7.io/
6 * Copyright 2014-2019 Vladimir Kharlampidi
8 * Released under the MIT License
10 * Released on: July 19, 2019
13 (function (global
, factory
) {
14 typeof exports
=== 'object' && typeof module
!== 'undefined' ? module
.exports
= factory() :
15 typeof define
=== 'function' && define
.amd
? define(factory
) :
16 (global
= global
|| self
, global
.Framework7
= factory());
17 }(this, function () { 'use strict';
21 * Mobile-first HTML template engine
23 * http://www.idangero.us/template7/
25 * Copyright 2019, Vladimir Kharlampidi
27 * http://www.idangero.us/
31 * Released on: June 14, 2019
35 if (typeof window
!== 'undefined') {
37 } else if (typeof global
!== 'undefined') {
43 var Template7Context
= t7ctx
;
45 var Template7Utils
= {
46 quoteSingleRexExp
: new RegExp('\'', 'g'),
47 quoteDoubleRexExp
: new RegExp('"', 'g'),
48 isFunction
: function isFunction(func
) {
49 return typeof func
=== 'function';
51 escape
: function escape(string
) {
52 if ( string
=== void 0 ) string
= '';
55 .replace(/&/g
, '&')
56 .replace(/</g
, '<')
57 .replace(/>/g
, '>')
58 .replace(/"/g, '"')
59 .replace(/'/g, ''');
61 helperToSlices: function helperToSlices(string) {
62 var quoteDoubleRexExp = Template7Utils.quoteDoubleRexExp;
63 var quoteSingleRexExp = Template7Utils.quoteSingleRexExp;
64 var helperParts = string.replace(/[{}#}]/g, '').trim().split(' ');
69 for (i = 0; i < helperParts.length; i += 1) {
70 var part = helperParts[i];
71 var blockQuoteRegExp = (void 0);
72 var openingQuote = (void 0);
73 if (i === 0) { slices.push(part); }
74 else if (part.indexOf('"') === 0 || part.indexOf('\'') === 0) {
75 blockQuoteRegExp = part.indexOf('"') === 0 ? quoteDoubleRexExp : quoteSingleRexExp;
76 openingQuote = part.indexOf('"') === 0 ? '"' : '\'';
78 if (part.match(blockQuoteRegExp).length === 2) {
84 for (j = i + 1; j < helperParts.length; j += 1) {
85 part += " " + (helperParts[j]);
86 if (helperParts[j].indexOf(openingQuote) >= 0) {
92 if (shiftIndex) { i = shiftIndex; }
94 } else if (part.indexOf('=') > 0) {
96 var hashParts = part.split('=');
97 var hashName = hashParts[0];
98 var hashContent = hashParts[1];
99 if (!blockQuoteRegExp) {
100 blockQuoteRegExp = hashContent.indexOf('"') === 0 ? quoteDoubleRexExp : quoteSingleRexExp;
101 openingQuote = hashContent.indexOf('"') === 0 ? '"' : '\'';
103 if (hashContent.match(blockQuoteRegExp).length !== 2) {
105 for (j = i + 1; j < helperParts.length; j += 1) {
106 hashContent += " " + (helperParts[j]);
107 if (helperParts[j].indexOf(openingQuote) >= 0) {
112 if (shiftIndex) { i = shiftIndex; }
114 var hash = [hashName, hashContent.replace(blockQuoteRegExp, '')];
123 stringToBlocks: function stringToBlocks(string) {
127 if (!string) { return []; }
128 var stringBlocks = string.split(/({{[^{^}]*}})/);
129 for (i = 0; i < stringBlocks.length; i += 1) {
130 var block = stringBlocks[i];
131 if (block === '') { continue; }
132 if (block.indexOf('{{') < 0) {
138 if (block.indexOf('{/') >= 0) {
142 .replace(/{{([#/])*([ ])*/, '{{$1')
143 .replace(/([ ])*}}/, '}}');
144 if (block.indexOf('{#') < 0 && block.indexOf(' ') < 0 && block.indexOf('else') < 0) {
148 contextName: block.replace(/[{}]/g, ''),
153 var helperSlices = Template7Utils.helperToSlices(block);
154 var helperName = helperSlices[0];
155 var isPartial = helperName === '>';
156 var helperContext = [];
158 for (j = 1; j < helperSlices.length; j += 1) {
159 var slice = helperSlices[j];
160 if (Array.isArray(slice)) {
162 helperHash[slice[0]] = slice[1] === 'false' ? false : slice[1];
164 helperContext.push(slice);
168 if (block.indexOf('{#') >= 0) {
170 var helperContent = '';
171 var elseContent = '';
173 var shiftIndex = (void 0);
174 var foundClosed = false;
175 var foundElse = false;
177 for (j = i + 1; j < stringBlocks.length; j += 1) {
178 if (stringBlocks[j].indexOf('{{#') >= 0) {
181 if (stringBlocks[j].indexOf('{{/') >= 0) {
184 if (stringBlocks[j].indexOf(("{{#" + helperName)) >= 0) {
185 helperContent += stringBlocks[j];
186 if (foundElse) { elseContent += stringBlocks[j]; }
188 } else if (stringBlocks[j].indexOf(("{{/" + helperName)) >= 0) {
191 helperContent += stringBlocks[j];
192 if (foundElse) { elseContent += stringBlocks[j]; }
198 } else if (stringBlocks[j].indexOf('else') >= 0 && depth === 0) {
201 if (!foundElse) { helperContent += stringBlocks[j]; }
202 if (foundElse) { elseContent += stringBlocks[j]; }
206 if (shiftIndex) { i = shiftIndex; }
207 if (helperName === 'raw
') {
210 content: helperContent,
215 helperName: helperName,
216 contextName: helperContext,
217 content: helperContent,
218 inverseContent: elseContent,
223 } else if (block.indexOf(' ') > 0) {
225 helperName = '_partial
';
226 if (helperContext[0]) {
227 if (helperContext[0].indexOf('[') === 0) { helperContext[0] = helperContext[0].replace(/[[\]]/g, ''); }
228 else { helperContext[0] = "\"" + (helperContext[0].replace(/"|'/g
, '')) + "\""; }
233 helperName
: helperName
,
234 contextName
: helperContext
,
242 parseJsVariable
: function parseJsVariable(expression
, replace
, object
) {
243 return expression
.split(/([+ \-*/^()&=|<>!%:?])/g
).reduce(function (arr
, part
) {
247 if (part
.indexOf(replace
) < 0) {
252 arr
.push(JSON
.stringify(''));
256 var variable
= object
;
257 if (part
.indexOf((replace
+ ".")) >= 0) {
258 part
.split((replace
+ "."))[1].split('.').forEach(function (partName
) {
259 if (partName
in variable
) { variable
= variable
[partName
]; }
260 else { variable
= undefined; }
264 (typeof variable
=== 'string')
265 || Array
.isArray(variable
)
266 || (variable
.constructor && variable
.constructor === Object
)
268 variable
= JSON
.stringify(variable
);
270 if (variable
=== undefined) { variable
= 'undefined'; }
277 parseJsParents
: function parseJsParents(expression
, parents
) {
278 return expression
.split(/([+ \-*^()&=|<>!%:?])/g).reduce(function (arr
, part
) {
283 if (part
.indexOf('../') < 0) {
288 if (!parents
|| parents
.length
=== 0) {
289 arr
.push(JSON
.stringify(''));
293 var levelsUp
= part
.split('../').length
- 1;
294 var parentData
= levelsUp
> parents
.length
? parents
[parents
.length
- 1] : parents
[levelsUp
- 1];
296 var variable
= parentData
;
297 var parentPart
= part
.replace(/..\//g, '');
298 parentPart
.split('.').forEach(function (partName
) {
299 if (typeof variable
[partName
] !== 'undefined') { variable
= variable
[partName
]; }
300 else { variable
= 'undefined'; }
302 if (variable
=== false || variable
=== true) {
303 arr
.push(JSON
.stringify(variable
));
306 if (variable
=== null || variable
=== 'undefined') {
307 arr
.push(JSON
.stringify(''));
310 arr
.push(JSON
.stringify(variable
));
314 getCompileVar
: function getCompileVar(name
, ctx
, data
) {
315 if ( data
=== void 0 ) data
= 'data_1';
321 if (name
.indexOf('../') === 0) {
322 levelsUp
= name
.split('../').length
- 1;
323 newDepth
= variable
.split('_')[1] - levelsUp
;
324 variable
= "ctx_" + (newDepth
>= 1 ? newDepth
: 1);
325 parts
= name
.split('../')[levelsUp
].split('.');
326 } else if (name
.indexOf('@global') === 0) {
327 variable
= 'Template7.global';
328 parts
= name
.split('@global.')[1].split('.');
329 } else if (name
.indexOf('@root') === 0) {
331 parts
= name
.split('@root.')[1].split('.');
333 parts
= name
.split('.');
335 for (var i
= 0; i
< parts
.length
; i
+= 1) {
337 if (part
.indexOf('@') === 0) {
338 var dataLevel
= data
.split('_')[1];
340 dataLevel
= newDepth
;
343 variable
+= "[(data_" + dataLevel
+ " && data_" + dataLevel
+ "." + (part
.replace('@', '')) + ")]";
345 variable
= "(data_" + dataLevel
+ " && data_" + dataLevel
+ "." + (part
.replace('@', '')) + ")";
347 } else if (Number
.isFinite
? Number
.isFinite(part
) : Template7Context
.isFinite(part
)) {
348 variable
+= "[" + part
+ "]";
349 } else if (part
=== 'this' || part
.indexOf('this.') >= 0 || part
.indexOf('this[') >= 0 || part
.indexOf('this(') >= 0) {
350 variable
= part
.replace('this', ctx
);
352 variable
+= "." + part
;
357 getCompiledArguments
: function getCompiledArguments(contextArray
, ctx
, data
) {
359 for (var i
= 0; i
< contextArray
.length
; i
+= 1) {
360 if (/^['"]/.test(contextArray
[i
])) { arr
.push(contextArray
[i
]); }
361 else if (/^(true|false|\d+)$/.test(contextArray
[i
])) { arr
.push(contextArray
[i
]); }
363 arr
.push(Template7Utils
.getCompileVar(contextArray
[i
], ctx
, data
));
367 return arr
.join(', ');
371 /* eslint no-eval: "off" */
373 var Template7Helpers
= {
374 _partial
: function _partial(partialName
, options
) {
376 var p
= Template7Class
.partials
[partialName
];
377 if (!p
|| (p
&& !p
.template
)) { return ''; }
379 p
.compiled
= new Template7Class(p
.template
).compile();
381 Object
.keys(options
.hash
).forEach(function (hashName
) {
382 ctx
[hashName
] = options
.hash
[hashName
];
384 return p
.compiled(ctx
, options
.data
, options
.root
);
386 escape
: function escape(context
) {
387 if (typeof context
=== 'undefined' || context
=== null) { return ''; }
388 if (typeof context
!== 'string') {
389 throw new Error('Template7: Passed context to "escape" helper should be a string');
391 return Template7Utils
.escape(context
);
393 if: function if$1(context
, options
) {
395 if (Template7Utils
.isFunction(ctx
)) { ctx
= ctx
.call(this); }
397 return options
.fn(this, options
.data
);
400 return options
.inverse(this, options
.data
);
402 unless
: function unless(context
, options
) {
404 if (Template7Utils
.isFunction(ctx
)) { ctx
= ctx
.call(this); }
406 return options
.fn(this, options
.data
);
409 return options
.inverse(this, options
.data
);
411 each
: function each(context
, options
) {
415 if (Template7Utils
.isFunction(ctx
)) { ctx
= ctx
.call(this); }
416 if (Array
.isArray(ctx
)) {
417 if (options
.hash
.reverse
) {
420 for (i
= 0; i
< ctx
.length
; i
+= 1) {
421 ret
+= options
.fn(ctx
[i
], { first
: i
=== 0, last
: i
=== ctx
.length
- 1, index
: i
});
423 if (options
.hash
.reverse
) {
427 // eslint-disable-next-line
428 for (var key
in ctx
) {
430 ret
+= options
.fn(ctx
[key
], { key
: key
});
433 if (i
> 0) { return ret
; }
434 return options
.inverse(this);
436 with: function with$1(context
, options
) {
438 if (Template7Utils
.isFunction(ctx
)) { ctx
= context
.call(this); }
439 return options
.fn(ctx
);
441 join
: function join(context
, options
) {
443 if (Template7Utils
.isFunction(ctx
)) { ctx
= ctx
.call(this); }
444 return ctx
.join(options
.hash
.delimiter
|| options
.hash
.delimeter
);
446 js
: function js(expression
, options
) {
447 var data
= options
.data
;
449 var execute
= expression
;
450 ('index first last key').split(' ').forEach(function (prop
) {
451 if (typeof data
[prop
] !== 'undefined') {
452 var re1
= new RegExp(("this.@" + prop
), 'g');
453 var re2
= new RegExp(("@" + prop
), 'g');
455 .replace(re1
, JSON
.stringify(data
[prop
]))
456 .replace(re2
, JSON
.stringify(data
[prop
]));
459 if (options
.root
&& execute
.indexOf('@root') >= 0) {
460 execute
= Template7Utils
.parseJsVariable(execute
, '@root', options
.root
);
462 if (execute
.indexOf('@global') >= 0) {
463 execute
= Template7Utils
.parseJsVariable(execute
, '@global', Template7Context
.Template7
.global
);
465 if (execute
.indexOf('../') >= 0) {
466 execute
= Template7Utils
.parseJsParents(execute
, options
.parents
);
468 if (execute
.indexOf('return') >= 0) {
469 func
= "(function(){" + execute
+ "})";
471 func
= "(function(){return (" + execute
+ ")})";
473 return eval(func
).call(this);
475 js_if
: function js_if(expression
, options
) {
476 var data
= options
.data
;
478 var execute
= expression
;
479 ('index first last key').split(' ').forEach(function (prop
) {
480 if (typeof data
[prop
] !== 'undefined') {
481 var re1
= new RegExp(("this.@" + prop
), 'g');
482 var re2
= new RegExp(("@" + prop
), 'g');
484 .replace(re1
, JSON
.stringify(data
[prop
]))
485 .replace(re2
, JSON
.stringify(data
[prop
]));
488 if (options
.root
&& execute
.indexOf('@root') >= 0) {
489 execute
= Template7Utils
.parseJsVariable(execute
, '@root', options
.root
);
491 if (execute
.indexOf('@global') >= 0) {
492 execute
= Template7Utils
.parseJsVariable(execute
, '@global', Template7Context
.Template7
.global
);
494 if (execute
.indexOf('../') >= 0) {
495 execute
= Template7Utils
.parseJsParents(execute
, options
.parents
);
497 if (execute
.indexOf('return') >= 0) {
498 func
= "(function(){" + execute
+ "})";
500 func
= "(function(){return (" + execute
+ ")})";
502 var condition
= eval(func
).call(this);
504 return options
.fn(this, options
.data
);
507 return options
.inverse(this, options
.data
);
510 Template7Helpers
.js_compare
= Template7Helpers
.js_if
;
512 var Template7Options
= {};
513 var Template7Partials
= {};
515 var Template7Class
= function Template7Class(template
) {
517 t
.template
= template
;
520 var staticAccessors
= { options
: { configurable
: true },partials
: { configurable
: true },helpers
: { configurable
: true } };
521 Template7Class
.prototype.compile
= function compile (template
, depth
) {
522 if ( template
=== void 0 ) template
= this.template
;
523 if ( depth
=== void 0 ) depth
= 1;
526 if (t
.compiled
) { return t
.compiled
; }
528 if (typeof template
!== 'string') {
529 throw new Error('Template7: Template must be a string');
531 var stringToBlocks
= Template7Utils
.stringToBlocks
;
532 var getCompileVar
= Template7Utils
.getCompileVar
;
533 var getCompiledArguments
= Template7Utils
.getCompiledArguments
;
535 var blocks
= stringToBlocks(template
);
536 var ctx
= "ctx_" + depth
;
537 var data
= "data_" + depth
;
538 if (blocks
.length
=== 0) {
539 return function empty() { return ''; };
542 function getCompileFn(block
, newDepth
) {
543 if (block
.content
) { return t
.compile(block
.content
, newDepth
); }
544 return function empty() { return ''; };
546 function getCompileInverse(block
, newDepth
) {
547 if (block
.inverseContent
) { return t
.compile(block
.inverseContent
, newDepth
); }
548 return function empty() { return ''; };
551 var resultString
= '';
553 resultString
+= "(function (" + ctx
+ ", " + data
+ ", root) {\n";
555 resultString
+= "(function (" + ctx
+ ", " + data
+ ") {\n";
558 resultString
+= 'function isArray(arr){return Array.isArray(arr);}\n';
559 resultString
+= 'function isFunction(func){return (typeof func === \'function\');}\n';
560 resultString
+= 'function c(val, ctx) {if (typeof val !== "undefined" && val !== null) {if (isFunction(val)) {return val.call(ctx);} else return val;} else return "";}\n';
561 resultString
+= 'root = root || ctx_1 || {};\n';
563 resultString
+= 'var r = \'\';\n';
565 for (i
= 0; i
< blocks
.length
; i
+= 1) {
566 var block
= blocks
[i
];
568 if (block
.type
=== 'plain') {
569 // eslint-disable-next-line
570 resultString
+= "r +='" + ((block
.content
).replace(/\r/g, '\\r').replace(/\n/g, '\\n').replace(/'/g, '\\' + '\'')) + "';";
573 var variable = (void 0);
574 var compiledArguments = (void 0);
576 if (block.type === 'variable') {
577 variable = getCompileVar(block.contextName, ctx, data);
578 resultString += "r
+= c(" + variable + ", " + ctx + ");";
581 if (block.type === 'helper') {
582 var parents = (void 0);
583 if (ctx !== 'ctx_1') {
584 var level = ctx.split('_')[1];
585 var parentsString = "ctx_
" + (level - 1);
586 for (var j = level - 2; j >= 1; j -= 1) {
587 parentsString += ", ctx_
" + j;
589 parents = "[" + parentsString + "]";
591 parents = "[" + ctx + "]";
593 var dynamicHelper = (void 0);
594 if (block.helperName.indexOf('[') === 0) {
595 block.helperName = getCompileVar(block.helperName.replace(/[[\]]/g, ''), ctx, data);
596 dynamicHelper = true;
598 if (dynamicHelper || block.helperName in Template7Helpers) {
599 compiledArguments = getCompiledArguments(block.contextName, ctx, data);
600 resultString += "r
+= (Template7Helpers
" + (dynamicHelper ? ("[" + (block.helperName) + "]") : ("." + (block.helperName))) + ").call(" + ctx + ", " + (compiledArguments && ((compiledArguments + ", "))) + "{hash
:" + (JSON.stringify(block.hash)) + ", data
: " + data + " || {}, fn
: " + (getCompileFn(block, depth + 1)) + ", inverse
: " + (getCompileInverse(block, depth + 1)) + ", root
: root
, parents
: " + parents + "});";
601 } else if (block.contextName.length > 0) {
602 throw new Error(("Template7
: Missing helper
: \"" + (block.helperName) + "\""));
604 variable = getCompileVar(block.helperName, ctx, data);
605 resultString += "if (" + variable + ") {";
606 resultString += "if (isArray(" + variable + ")) {";
607 resultString += "r
+= (Template7Helpers
.each
).call(" + ctx + ", " + variable + ", {hash
:" + (JSON.stringify(block.hash)) + ", data
: " + data + " || {}, fn
: " + (getCompileFn(block, depth + 1)) + ", inverse
: " + (getCompileInverse(block, depth + 1)) + ", root
: root
, parents
: " + parents + "});";
608 resultString += '}else {';
609 resultString += "r
+= (Template7Helpers
.with).call(" + ctx + ", " + variable + ", {hash
:" + (JSON.stringify(block.hash)) + ", data
: " + data + " || {}, fn
: " + (getCompileFn(block, depth + 1)) + ", inverse
: " + (getCompileInverse(block, depth + 1)) + ", root
: root
, parents
: " + parents + "});";
610 resultString += '}}';
614 resultString += '\nreturn r;})';
617 // eslint-disable-next-line
618 t.compiled = eval(resultString);
623 staticAccessors.options.get = function () {
624 return Template7Options;
626 staticAccessors.partials.get = function () {
627 return Template7Partials;
629 staticAccessors.helpers.get = function () {
630 return Template7Helpers;
633 Object.defineProperties( Template7Class, staticAccessors );
635 function Template7() {
636 var args = [], len = arguments.length;
637 while ( len-- ) args[ len ] = arguments[ len ];
639 var template = args[0];
641 if (args.length === 2) {
642 var instance = new Template7Class(template);
643 var rendered = instance.compile()(data);
647 return new Template7Class(template);
649 Template7.registerHelper = function registerHelper(name, fn) {
650 Template7Class.helpers[name] = fn;
652 Template7.unregisterHelper = function unregisterHelper(name) {
653 Template7Class.helpers[name] = undefined;
654 delete Template7Class.helpers[name];
656 Template7.registerPartial = function registerPartial(name, template) {
657 Template7Class.partials[name] = { template: template };
659 Template7.unregisterPartial = function unregisterPartial(name) {
660 if (Template7Class.partials[name]) {
661 Template7Class.partials[name] = undefined;
662 delete Template7Class.partials[name];
665 Template7.compile = function compile(template, options) {
666 var instance = new Template7Class(template, options);
667 return instance.compile();
670 Template7.options = Template7Class.options;
671 Template7.helpers = Template7Class.helpers;
672 Template7.partials = Template7Class.partials;
676 * Better handling for window object in SSR environment
677 * https://github.com/nolimits4web/ssr-window
679 * Copyright 2018, Vladimir Kharlampidi
683 * Released on: July 18, 2018
685 var doc = (typeof document === 'undefined') ? {
687 addEventListener: function addEventListener() {},
688 removeEventListener: function removeEventListener() {},
690 blur: function blur() {},
693 querySelector: function querySelector() {
696 querySelectorAll: function querySelectorAll() {
699 getElementById: function getElementById() {
702 createEvent: function createEvent() {
704 initEvent: function initEvent() {},
707 createElement: function createElement() {
712 setAttribute: function setAttribute() {},
713 getElementsByTagName: function getElementsByTagName() {
718 location: { hash: '' },
719 } : document; // eslint-disable-line
721 var win = (typeof window === 'undefined') ? {
728 CustomEvent: function CustomEvent() {
731 addEventListener: function addEventListener() {},
732 removeEventListener: function removeEventListener() {},
733 getComputedStyle: function getComputedStyle() {
735 getPropertyValue: function getPropertyValue() {
740 Image: function Image() {},
741 Date: function Date() {},
743 setTimeout: function setTimeout() {},
744 clearTimeout: function clearTimeout() {},
745 } : window; // eslint-disable-line
749 * Minimalistic JavaScript library for DOM manipulation, with a jQuery-compatible API
750 * http://framework7.io/docs/dom.html
752 * Copyright 2019, Vladimir Kharlampidi
754 * http://www.idangero.us/
758 * Released on: February 11, 2019
761 var Dom7 = function Dom7(arr) {
763 // Create array-like object
764 for (var i = 0; i < arr.length; i += 1) {
767 self.length = arr.length;
768 // Return collection with methods
772 function $(selector, context) {
775 if (selector && !context) {
776 if (selector instanceof Dom7) {
782 if (typeof selector === 'string') {
785 var html = selector.trim();
786 if (html.indexOf('<') >= 0 && html.indexOf('>') >= 0) {
787 var toCreate = 'div';
788 if (html.indexOf('<li') === 0) { toCreate = 'ul'; }
789 if (html.indexOf('<tr') === 0) { toCreate = 'tbody'; }
790 if (html.indexOf('<td') === 0 || html.indexOf('<th') === 0) { toCreate = 'tr'; }
791 if (html.indexOf('<tbody') === 0) { toCreate = 'table'; }
792 if (html.indexOf('<option') === 0) { toCreate = 'select'; }
793 tempParent = doc.createElement(toCreate);
794 tempParent.innerHTML = html;
795 for (i = 0; i < tempParent.childNodes.length; i += 1) {
796 arr.push(tempParent.childNodes[i]);
799 if (!context && selector[0] === '#' && !selector.match(/[ .<>:~]/)) {
801 els = [doc.getElementById(selector.trim().split('#')[1])];
804 els = (context || doc).querySelectorAll(selector.trim());
806 for (i = 0; i < els.length; i += 1) {
807 if (els[i]) { arr.push(els[i]); }
810 } else if (selector.nodeType || selector === win || selector === doc) {
813 } else if (selector.length > 0 && selector[0].nodeType) {
814 // Array of elements or instance of Dom
815 for (i = 0; i < selector.length; i += 1) {
816 arr.push(selector[i]);
820 return new Dom7(arr);
823 $.fn = Dom7.prototype;
827 function unique(arr) {
828 var uniqueArray = [];
829 for (var i = 0; i < arr.length; i += 1) {
830 if (uniqueArray.indexOf(arr[i]) === -1) { uniqueArray.push(arr[i]); }
834 function toCamelCase(string) {
835 return string.toLowerCase().replace(/-(.)/g, function (match, group1) { return group1.toUpperCase(); });
838 function requestAnimationFrame(callback) {
839 if (win.requestAnimationFrame) { return win.requestAnimationFrame(callback); }
840 else if (win.webkitRequestAnimationFrame) { return win.webkitRequestAnimationFrame(callback); }
841 return win.setTimeout(callback, 1000 / 60);
843 function cancelAnimationFrame(id) {
844 if (win.cancelAnimationFrame) { return win.cancelAnimationFrame(id); }
845 else if (win.webkitCancelAnimationFrame) { return win.webkitCancelAnimationFrame(id); }
846 return win.clearTimeout(id);
849 // Classes and attributes
850 function addClass(className) {
851 if (typeof className === 'undefined') {
854 var classes = className.split(' ');
855 for (var i = 0; i < classes.length; i += 1) {
856 for (var j = 0; j < this.length; j += 1) {
857 if (typeof this[j] !== 'undefined' && typeof this[j].classList !== 'undefined') { this[j].classList.add(classes[i]); }
862 function removeClass(className) {
863 var classes = className.split(' ');
864 for (var i = 0; i < classes.length; i += 1) {
865 for (var j = 0; j < this.length; j += 1) {
866 if (typeof this[j] !== 'undefined' && typeof this[j].classList !== 'undefined') { this[j].classList.remove(classes[i]); }
871 function hasClass(className) {
872 if (!this[0]) { return false; }
873 return this[0].classList.contains(className);
875 function toggleClass(className) {
876 var classes = className.split(' ');
877 for (var i = 0; i < classes.length; i += 1) {
878 for (var j = 0; j < this.length; j += 1) {
879 if (typeof this[j] !== 'undefined' && typeof this[j].classList !== 'undefined') { this[j].classList.toggle(classes[i]); }
884 function attr(attrs, value) {
885 var arguments$1 = arguments;
887 if (arguments.length === 1 && typeof attrs === 'string') {
889 if (this[0]) { return this[0].getAttribute(attrs); }
894 for (var i = 0; i < this.length; i += 1) {
895 if (arguments$1.length === 2) {
897 this[i].setAttribute(attrs, value);
900 // eslint-disable-next-line
901 for (var attrName in attrs) {
902 this[i][attrName] = attrs[attrName];
903 this[i].setAttribute(attrName, attrs[attrName]);
909 // eslint-disable-next-line
910 function removeAttr(attr) {
911 for (var i = 0; i < this.length; i += 1) {
912 this[i].removeAttribute(attr);
916 // eslint-disable-next-line
917 function prop(props, value) {
918 var arguments$1 = arguments;
920 if (arguments.length === 1 && typeof props === 'string') {
922 if (this[0]) { return this[0][props]; }
925 for (var i = 0; i < this.length; i += 1) {
926 if (arguments$1.length === 2) {
928 this[i][props] = value;
931 // eslint-disable-next-line
932 for (var propName in props) {
933 this[i][propName] = props[propName];
940 function data(key, value) {
942 if (typeof value === 'undefined') {
946 if (el.dom7ElementDataStorage && (key in el.dom7ElementDataStorage)) {
947 return el.dom7ElementDataStorage[key];
950 var dataKey = el.getAttribute(("data
-" + key));
960 for (var i = 0; i < this.length; i += 1) {
962 if (!el.dom7ElementDataStorage) { el.dom7ElementDataStorage = {}; }
963 el.dom7ElementDataStorage[key] = value;
967 function removeData(key) {
968 for (var i = 0; i < this.length; i += 1) {
970 if (el.dom7ElementDataStorage && el.dom7ElementDataStorage[key]) {
971 el.dom7ElementDataStorage[key] = null;
972 delete el.dom7ElementDataStorage[key];
978 if (!el) { return undefined; }
979 var dataset = {}; // eslint-disable-line
981 // eslint-disable-next-line
982 for (var dataKey in el.dataset) {
983 dataset[dataKey] = el.dataset[dataKey];
986 for (var i = 0; i < el.attributes.length; i += 1) {
987 // eslint-disable-next-line
988 var attr = el.attributes[i];
989 if (attr.name.indexOf('data-') >= 0) {
990 dataset[toCamelCase(attr.name.split('data-')[1])] = attr.value;
994 // eslint-disable-next-line
995 for (var key in dataset) {
996 if (dataset[key] === 'false') { dataset[key] = false; }
997 else if (dataset[key] === 'true') { dataset[key] = true; }
998 else if (parseFloat(dataset[key]) === dataset[key] * 1) { dataset[key] *= 1; }
1002 function val(value) {
1004 if (typeof value === 'undefined') {
1006 if (dom[0].multiple && dom[0].nodeName.toLowerCase() === 'select') {
1008 for (var i = 0; i < dom[0].selectedOptions.length; i += 1) {
1009 values.push(dom[0].selectedOptions[i].value);
1013 return dom[0].value;
1018 for (var i$1 = 0; i$1 < dom.length; i$1 += 1) {
1020 if (Array.isArray(value) && el.multiple && el.nodeName.toLowerCase() === 'select') {
1021 for (var j = 0; j < el.options.length; j += 1) {
1022 el.options[j].selected = value.indexOf(el.options[j].value) >= 0;
1031 // eslint-disable-next-line
1032 function transform(transform) {
1033 for (var i = 0; i < this.length; i += 1) {
1034 var elStyle = this[i].style;
1035 elStyle.webkitTransform = transform;
1036 elStyle.transform = transform;
1040 function transition(duration) {
1041 if (typeof duration !== 'string') {
1042 duration = duration + "ms
"; // eslint-disable-line
1044 for (var i = 0; i < this.length; i += 1) {
1045 var elStyle = this[i].style;
1046 elStyle.webkitTransitionDuration = duration;
1047 elStyle.transitionDuration = duration;
1055 var args = [], len = arguments.length;
1056 while ( len-- ) args[ len ] = arguments[ len ];
1057 var eventType = args[0];
1058 var targetSelector = args[1];
1059 var listener = args[2];
1060 var capture = args[3];
1061 if (typeof args[1] === 'function') {
1062 (assign = args, eventType = assign[0], listener = assign[1], capture = assign[2]);
1063 targetSelector = undefined;
1065 if (!capture) { capture = false; }
1067 function handleLiveEvent(e) {
1068 var target = e.target;
1069 if (!target) { return; }
1070 var eventData = e.target.dom7EventData || [];
1071 if (eventData.indexOf(e) < 0) {
1072 eventData.unshift(e);
1074 if ($(target).is(targetSelector)) { listener.apply(target, eventData); }
1076 var parents = $(target).parents(); // eslint-disable-line
1077 for (var k = 0; k < parents.length; k += 1) {
1078 if ($(parents[k]).is(targetSelector)) { listener.apply(parents[k], eventData); }
1082 function handleEvent(e) {
1083 var eventData = e && e.target ? e.target.dom7EventData || [] : [];
1084 if (eventData.indexOf(e) < 0) {
1085 eventData.unshift(e);
1087 listener.apply(this, eventData);
1089 var events = eventType.split(' ');
1091 for (var i = 0; i < this.length; i += 1) {
1093 if (!targetSelector) {
1094 for (j = 0; j < events.length; j += 1) {
1095 var event = events[j];
1096 if (!el.dom7Listeners) { el.dom7Listeners = {}; }
1097 if (!el.dom7Listeners[event]) { el.dom7Listeners[event] = []; }
1098 el.dom7Listeners[event].push({
1100 proxyListener: handleEvent,
1102 el.addEventListener(event, handleEvent, capture);
1106 for (j = 0; j < events.length; j += 1) {
1107 var event$1 = events[j];
1108 if (!el.dom7LiveListeners) { el.dom7LiveListeners = {}; }
1109 if (!el.dom7LiveListeners[event$1]) { el.dom7LiveListeners[event$1] = []; }
1110 el.dom7LiveListeners[event$1].push({
1112 proxyListener: handleLiveEvent,
1114 el.addEventListener(event$1, handleLiveEvent, capture);
1123 var args = [], len = arguments.length;
1124 while ( len-- ) args[ len ] = arguments[ len ];
1125 var eventType = args[0];
1126 var targetSelector = args[1];
1127 var listener = args[2];
1128 var capture = args[3];
1129 if (typeof args[1] === 'function') {
1130 (assign = args, eventType = assign[0], listener = assign[1], capture = assign[2]);
1131 targetSelector = undefined;
1133 if (!capture) { capture = false; }
1135 var events = eventType.split(' ');
1136 for (var i = 0; i < events.length; i += 1) {
1137 var event = events[i];
1138 for (var j = 0; j < this.length; j += 1) {
1140 var handlers = (void 0);
1141 if (!targetSelector && el.dom7Listeners) {
1142 handlers = el.dom7Listeners[event];
1143 } else if (targetSelector && el.dom7LiveListeners) {
1144 handlers = el.dom7LiveListeners[event];
1146 if (handlers && handlers.length) {
1147 for (var k = handlers.length - 1; k >= 0; k -= 1) {
1148 var handler = handlers[k];
1149 if (listener && handler.listener === listener) {
1150 el.removeEventListener(event, handler.proxyListener, capture);
1151 handlers.splice(k, 1);
1152 } else if (listener && handler.listener && handler.listener.dom7proxy && handler.listener.dom7proxy === listener) {
1153 el.removeEventListener(event, handler.proxyListener, capture);
1154 handlers.splice(k, 1);
1155 } else if (!listener) {
1156 el.removeEventListener(event, handler.proxyListener, capture);
1157 handlers.splice(k, 1);
1168 var args = [], len = arguments.length;
1169 while ( len-- ) args[ len ] = arguments[ len ];
1171 var eventName = args[0];
1172 var targetSelector = args[1];
1173 var listener = args[2];
1174 var capture = args[3];
1175 if (typeof args[1] === 'function') {
1176 (assign = args, eventName = assign[0], listener = assign[1], capture = assign[2]);
1177 targetSelector = undefined;
1179 function onceHandler() {
1180 var eventArgs = [], len = arguments.length;
1181 while ( len-- ) eventArgs[ len ] = arguments[ len ];
1183 listener.apply(this, eventArgs);
1184 dom.off(eventName, targetSelector, onceHandler, capture);
1185 if (onceHandler.dom7proxy) {
1186 delete onceHandler.dom7proxy;
1189 onceHandler.dom7proxy = listener;
1190 return dom.on(eventName, targetSelector, onceHandler, capture);
1192 function trigger() {
1193 var args = [], len = arguments.length;
1194 while ( len-- ) args[ len ] = arguments[ len ];
1196 var events = args[0].split(' ');
1197 var eventData = args[1];
1198 for (var i = 0; i < events.length; i += 1) {
1199 var event = events[i];
1200 for (var j = 0; j < this.length; j += 1) {
1204 evt = new win.CustomEvent(event, {
1210 evt = doc.createEvent('Event');
1211 evt.initEvent(event, true, true);
1212 evt.detail = eventData;
1214 // eslint-disable-next-line
1215 el.dom7EventData = args.filter(function (data, dataIndex) { return dataIndex > 0; });
1216 el.dispatchEvent(evt);
1217 el.dom7EventData = [];
1218 delete el.dom7EventData;
1223 function transitionEnd(callback) {
1224 var events = ['webkitTransitionEnd', 'transitionend'];
1227 function fireCallBack(e) {
1228 /* jshint validthis:true */
1229 if (e.target !== this) { return; }
1230 callback.call(this, e);
1231 for (i = 0; i < events.length; i += 1) {
1232 dom.off(events[i], fireCallBack);
1236 for (i = 0; i < events.length; i += 1) {
1237 dom.on(events[i], fireCallBack);
1242 function animationEnd(callback) {
1243 var events = ['webkitAnimationEnd', 'animationend'];
1246 function fireCallBack(e) {
1247 if (e.target !== this) { return; }
1248 callback.call(this, e);
1249 for (i = 0; i < events.length; i += 1) {
1250 dom.off(events[i], fireCallBack);
1254 for (i = 0; i < events.length; i += 1) {
1255 dom.on(events[i], fireCallBack);
1262 if (this[0] === win) {
1263 return win.innerWidth;
1266 if (this.length > 0) {
1267 return parseFloat(this.css('width'));
1272 function outerWidth(includeMargins) {
1273 if (this.length > 0) {
1274 if (includeMargins) {
1275 // eslint-disable-next-line
1276 var styles = this.styles();
1277 return this[0].offsetWidth + parseFloat(styles.getPropertyValue('margin-right')) + parseFloat(styles.getPropertyValue('margin-left'));
1279 return this[0].offsetWidth;
1284 if (this[0] === win) {
1285 return win.innerHeight;
1288 if (this.length > 0) {
1289 return parseFloat(this.css('height'));
1294 function outerHeight(includeMargins) {
1295 if (this.length > 0) {
1296 if (includeMargins) {
1297 // eslint-disable-next-line
1298 var styles = this.styles();
1299 return this[0].offsetHeight + parseFloat(styles.getPropertyValue('margin-top')) + parseFloat(styles.getPropertyValue('margin-bottom'));
1301 return this[0].offsetHeight;
1306 if (this.length > 0) {
1308 var box = el.getBoundingClientRect();
1309 var body = doc.body;
1310 var clientTop = el.clientTop || body.clientTop || 0;
1311 var clientLeft = el.clientLeft || body.clientLeft || 0;
1312 var scrollTop = el === win ? win.scrollY : el.scrollTop;
1313 var scrollLeft = el === win ? win.scrollX : el.scrollLeft;
1315 top: (box.top + scrollTop) - clientTop,
1316 left: (box.left + scrollLeft) - clientLeft,
1323 for (var i = 0; i < this.length; i += 1) {
1324 this[i].style.display = 'none';
1329 for (var i = 0; i < this.length; i += 1) {
1331 if (el.style.display === 'none') {
1332 el.style.display = '';
1334 if (win.getComputedStyle(el, null).getPropertyValue('display') === 'none') {
1335 // Still not visible
1336 el.style.display = 'block';
1342 if (this[0]) { return win.getComputedStyle(this[0], null); }
1345 function css(props, value) {
1347 if (arguments.length === 1) {
1348 if (typeof props === 'string') {
1349 if (this[0]) { return win.getComputedStyle(this[0], null).getPropertyValue(props); }
1351 for (i = 0; i < this.length; i += 1) {
1352 // eslint-disable-next-line
1353 for (var prop in props) {
1354 this[i].style[prop] = props[prop];
1360 if (arguments.length === 2 && typeof props === 'string') {
1361 for (i = 0; i < this.length; i += 1) {
1362 this[i].style[props] = value;
1370 function toArray() {
1372 for (var i = 0; i < this.length; i += 1) {
1377 // Iterate over the collection passing elements to `callback`
1378 function each(callback) {
1379 // Don't bother continuing without a callback
1380 if (!callback) { return this; }
1381 // Iterate over the current collection
1382 for (var i = 0; i < this.length; i += 1) {
1383 // If the callback returns false
1384 if (callback.call(this[i], i, this[i]) === false) {
1385 // End the loop early
1389 // Return `this` to allow chained DOM operations
1392 function forEach(callback) {
1393 // Don't bother continuing without a callback
1394 if (!callback) { return this; }
1395 // Iterate over the current collection
1396 for (var i = 0; i < this.length; i += 1) {
1397 // If the callback returns false
1398 if (callback.call(this[i], this[i], i) === false) {
1399 // End the loop early
1403 // Return `this` to allow chained DOM operations
1406 function filter(callback) {
1407 var matchedItems = [];
1409 for (var i = 0; i < dom.length; i += 1) {
1410 if (callback.call(dom[i], i, dom[i])) { matchedItems.push(dom[i]); }
1412 return new Dom7(matchedItems);
1414 function map(callback) {
1415 var modifiedItems = [];
1417 for (var i = 0; i < dom.length; i += 1) {
1418 modifiedItems.push(callback.call(dom[i], i, dom[i]));
1420 return new Dom7(modifiedItems);
1422 // eslint-disable-next-line
1423 function html(html) {
1424 if (typeof html === 'undefined') {
1425 return this[0] ? this[0].innerHTML : undefined;
1428 for (var i = 0; i < this.length; i += 1) {
1429 this[i].innerHTML = html;
1433 // eslint-disable-next-line
1434 function text(text) {
1435 if (typeof text === 'undefined') {
1437 return this[0].textContent.trim();
1442 for (var i = 0; i < this.length; i += 1) {
1443 this[i].textContent = text;
1447 function is(selector) {
1451 if (!el || typeof selector === 'undefined') { return false; }
1452 if (typeof selector === 'string') {
1453 if (el.matches) { return el.matches(selector); }
1454 else if (el.webkitMatchesSelector) { return el.webkitMatchesSelector(selector); }
1455 else if (el.msMatchesSelector) { return el.msMatchesSelector(selector); }
1457 compareWith = $(selector);
1458 for (i = 0; i < compareWith.length; i += 1) {
1459 if (compareWith[i] === el) { return true; }
1462 } else if (selector === doc) { return el === doc; }
1463 else if (selector === win) { return el === win; }
1465 if (selector.nodeType || selector instanceof Dom7) {
1466 compareWith = selector.nodeType ? [selector] : selector;
1467 for (i = 0; i < compareWith.length; i += 1) {
1468 if (compareWith[i] === el) { return true; }
1474 function indexOf(el) {
1475 for (var i = 0; i < this.length; i += 1) {
1476 if (this[i] === el) { return i; }
1481 var child = this[0];
1485 // eslint-disable-next-line
1486 while ((child = child.previousSibling) !== null) {
1487 if (child.nodeType === 1) { i += 1; }
1493 // eslint-disable-next-line
1494 function eq(index) {
1495 if (typeof index === 'undefined') { return this; }
1496 var length = this.length;
1498 if (index > length - 1) {
1499 return new Dom7([]);
1502 returnIndex = length + index;
1503 if (returnIndex < 0) { return new Dom7([]); }
1504 return new Dom7([this[returnIndex]]);
1506 return new Dom7([this[index]]);
1509 var args = [], len = arguments.length;
1510 while ( len-- ) args[ len ] = arguments[ len ];
1514 for (var k = 0; k < args.length; k += 1) {
1516 for (var i = 0; i < this.length; i += 1) {
1517 if (typeof newChild === 'string') {
1518 var tempDiv = doc.createElement('div');
1519 tempDiv.innerHTML = newChild;
1520 while (tempDiv.firstChild) {
1521 this[i].appendChild(tempDiv.firstChild);
1523 } else if (newChild instanceof Dom7) {
1524 for (var j = 0; j < newChild.length; j += 1) {
1525 this[i].appendChild(newChild[j]);
1528 this[i].appendChild(newChild);
1535 // eslint-disable-next-line
1536 function appendTo(parent) {
1537 $(parent).append(this);
1540 function prepend(newChild) {
1543 for (i = 0; i < this.length; i += 1) {
1544 if (typeof newChild === 'string') {
1545 var tempDiv = doc.createElement('div');
1546 tempDiv.innerHTML = newChild;
1547 for (j = tempDiv.childNodes.length - 1; j >= 0; j -= 1) {
1548 this[i].insertBefore(tempDiv.childNodes[j], this[i].childNodes[0]);
1550 } else if (newChild instanceof Dom7) {
1551 for (j = 0; j < newChild.length; j += 1) {
1552 this[i].insertBefore(newChild[j], this[i].childNodes[0]);
1555 this[i].insertBefore(newChild, this[i].childNodes[0]);
1560 // eslint-disable-next-line
1561 function prependTo(parent) {
1562 $(parent).prepend(this);
1565 function insertBefore(selector) {
1566 var before = $(selector);
1567 for (var i = 0; i < this.length; i += 1) {
1568 if (before.length === 1) {
1569 before[0].parentNode.insertBefore(this[i], before[0]);
1570 } else if (before.length > 1) {
1571 for (var j = 0; j < before.length; j += 1) {
1572 before[j].parentNode.insertBefore(this[i].cloneNode(true), before[j]);
1577 function insertAfter(selector) {
1578 var after = $(selector);
1579 for (var i = 0; i < this.length; i += 1) {
1580 if (after.length === 1) {
1581 after[0].parentNode.insertBefore(this[i], after[0].nextSibling);
1582 } else if (after.length > 1) {
1583 for (var j = 0; j < after.length; j += 1) {
1584 after[j].parentNode.insertBefore(this[i].cloneNode(true), after[j].nextSibling);
1589 function next(selector) {
1590 if (this.length > 0) {
1592 if (this[0].nextElementSibling && $(this[0].nextElementSibling).is(selector)) {
1593 return new Dom7([this[0].nextElementSibling]);
1595 return new Dom7([]);
1598 if (this[0].nextElementSibling) { return new Dom7([this[0].nextElementSibling]); }
1599 return new Dom7([]);
1601 return new Dom7([]);
1603 function nextAll(selector) {
1606 if (!el) { return new Dom7([]); }
1607 while (el.nextElementSibling) {
1608 var next = el.nextElementSibling; // eslint-disable-line
1610 if ($(next).is(selector)) { nextEls.push(next); }
1611 } else { nextEls.push(next); }
1614 return new Dom7(nextEls);
1616 function prev(selector) {
1617 if (this.length > 0) {
1620 if (el.previousElementSibling && $(el.previousElementSibling).is(selector)) {
1621 return new Dom7([el.previousElementSibling]);
1623 return new Dom7([]);
1626 if (el.previousElementSibling) { return new Dom7([el.previousElementSibling]); }
1627 return new Dom7([]);
1629 return new Dom7([]);
1631 function prevAll(selector) {
1634 if (!el) { return new Dom7([]); }
1635 while (el.previousElementSibling) {
1636 var prev = el.previousElementSibling; // eslint-disable-line
1638 if ($(prev).is(selector)) { prevEls.push(prev); }
1639 } else { prevEls.push(prev); }
1642 return new Dom7(prevEls);
1644 function siblings(selector) {
1645 return this.nextAll(selector).add(this.prevAll(selector));
1647 function parent(selector) {
1648 var parents = []; // eslint-disable-line
1649 for (var i = 0; i < this.length; i += 1) {
1650 if (this[i].parentNode !== null) {
1652 if ($(this[i].parentNode).is(selector)) { parents.push(this[i].parentNode); }
1654 parents.push(this[i].parentNode);
1658 return $(unique(parents));
1660 function parents(selector) {
1661 var parents = []; // eslint-disable-line
1662 for (var i = 0; i < this.length; i += 1) {
1663 var parent = this[i].parentNode; // eslint-disable-line
1666 if ($(parent).is(selector)) { parents.push(parent); }
1668 parents.push(parent);
1670 parent = parent.parentNode;
1673 return $(unique(parents));
1675 function closest(selector) {
1676 var closest = this; // eslint-disable-line
1677 if (typeof selector === 'undefined') {
1678 return new Dom7([]);
1680 if (!closest.is(selector)) {
1681 closest = closest.parents(selector).eq(0);
1685 function find(selector) {
1686 var foundElements = [];
1687 for (var i = 0; i < this.length; i += 1) {
1688 var found = this[i].querySelectorAll(selector);
1689 for (var j = 0; j < found.length; j += 1) {
1690 foundElements.push(found[j]);
1693 return new Dom7(foundElements);
1695 function children(selector) {
1696 var children = []; // eslint-disable-line
1697 for (var i = 0; i < this.length; i += 1) {
1698 var childNodes = this[i].childNodes;
1700 for (var j = 0; j < childNodes.length; j += 1) {
1702 if (childNodes[j].nodeType === 1) { children.push(childNodes[j]); }
1703 } else if (childNodes[j].nodeType === 1 && $(childNodes[j]).is(selector)) {
1704 children.push(childNodes[j]);
1708 return new Dom7(unique(children));
1711 for (var i = 0; i < this.length; i += 1) {
1712 if (this[i].parentNode) { this[i].parentNode.removeChild(this[i]); }
1717 return this.remove();
1720 var args = [], len = arguments.length;
1721 while ( len-- ) args[ len ] = arguments[ len ];
1726 for (i = 0; i < args.length; i += 1) {
1727 var toAdd = $(args[i]);
1728 for (j = 0; j < toAdd.length; j += 1) {
1729 dom[dom.length] = toAdd[j];
1736 for (var i = 0; i < this.length; i += 1) {
1738 if (el.nodeType === 1) {
1739 for (var j = 0; j < el.childNodes.length; j += 1) {
1740 if (el.childNodes[j].parentNode) {
1741 el.childNodes[j].parentNode.removeChild(el.childNodes[j]);
1744 el.textContent = '';
1750 var Methods = /*#__PURE__*/Object.freeze({
1752 removeClass: removeClass,
1754 toggleClass: toggleClass,
1756 removeAttr: removeAttr,
1759 removeData: removeData,
1762 transform: transform,
1763 transition: transition,
1768 transitionEnd: transitionEnd,
1769 animationEnd: animationEnd,
1771 outerWidth: outerWidth,
1773 outerHeight: outerHeight,
1793 prependTo: prependTo,
1794 insertBefore: insertBefore,
1795 insertAfter: insertAfter,
1812 function scrollTo() {
1815 var args = [], len = arguments.length;
1816 while ( len-- ) args[ len ] = arguments[ len ];
1819 var duration = args[2];
1820 var easing = args[3];
1821 var callback = args[4];
1822 if (args.length === 4 && typeof easing === 'function') {
1824 (assign = args, left = assign[0], top = assign[1], duration = assign[2], callback = assign[3], easing = assign[4]);
1826 if (typeof easing === 'undefined') { easing = 'swing'; }
1828 return this.each(function animate() {
1836 var scrollTop; // eslint-disable-line
1837 var scrollLeft; // eslint-disable-line
1838 var animateTop = top > 0 || top === 0;
1839 var animateLeft = left > 0 || left === 0;
1840 if (typeof easing === 'undefined') {
1844 currentTop = el.scrollTop;
1850 currentLeft = el.scrollLeft;
1852 el.scrollLeft = left;
1855 if (!duration) { return; }
1857 maxTop = el.scrollHeight - el.offsetHeight;
1858 newTop = Math.max(Math.min(top, maxTop), 0);
1861 maxLeft = el.scrollWidth - el.offsetWidth;
1862 newLeft = Math.max(Math.min(left, maxLeft), 0);
1864 var startTime = null;
1865 if (animateTop && newTop === currentTop) { animateTop = false; }
1866 if (animateLeft && newLeft === currentLeft) { animateLeft = false; }
1867 function render(time) {
1868 if ( time === void 0 ) time = new Date().getTime();
1870 if (startTime === null) {
1873 var progress = Math.max(Math.min((time - startTime) / duration, 1), 0);
1874 var easeProgress = easing === 'linear' ? progress : (0.5 - (Math.cos(progress * Math.PI) / 2));
1876 if (animateTop) { scrollTop = currentTop + (easeProgress * (newTop - currentTop)); }
1877 if (animateLeft) { scrollLeft = currentLeft + (easeProgress * (newLeft - currentLeft)); }
1878 if (animateTop && newTop > currentTop && scrollTop >= newTop) {
1879 el.scrollTop = newTop;
1882 if (animateTop && newTop < currentTop && scrollTop <= newTop) {
1883 el.scrollTop = newTop;
1886 if (animateLeft && newLeft > currentLeft && scrollLeft >= newLeft) {
1887 el.scrollLeft = newLeft;
1890 if (animateLeft && newLeft < currentLeft && scrollLeft <= newLeft) {
1891 el.scrollLeft = newLeft;
1896 if (callback) { callback(); }
1899 if (animateTop) { el.scrollTop = scrollTop; }
1900 if (animateLeft) { el.scrollLeft = scrollLeft; }
1901 requestAnimationFrame(render);
1903 requestAnimationFrame(render);
1906 // scrollTop(top, duration, easing, callback) {
1907 function scrollTop() {
1910 var args = [], len = arguments.length;
1911 while ( len-- ) args[ len ] = arguments[ len ];
1913 var duration = args[1];
1914 var easing = args[2];
1915 var callback = args[3];
1916 if (args.length === 3 && typeof easing === 'function') {
1917 (assign = args, top = assign[0], duration = assign[1], callback = assign[2], easing = assign[3]);
1920 if (typeof top === 'undefined') {
1921 if (dom.length > 0) { return dom[0].scrollTop; }
1924 return dom.scrollTo(undefined, top, duration, easing, callback);
1926 function scrollLeft() {
1929 var args = [], len = arguments.length;
1930 while ( len-- ) args[ len ] = arguments[ len ];
1932 var duration = args[1];
1933 var easing = args[2];
1934 var callback = args[3];
1935 if (args.length === 3 && typeof easing === 'function') {
1936 (assign = args, left = assign[0], duration = assign[1], callback = assign[2], easing = assign[3]);
1939 if (typeof left === 'undefined') {
1940 if (dom.length > 0) { return dom[0].scrollLeft; }
1943 return dom.scrollTo(left, undefined, duration, easing, callback);
1946 var Scroll = /*#__PURE__*/Object.freeze({
1948 scrollTop: scrollTop,
1949 scrollLeft: scrollLeft
1952 function animate(initialProps, initialParams) {
1955 props: Object.assign({}, initialProps),
1956 params: Object.assign({
1958 easing: 'swing', // or 'linear'
1962 progress(elements, complete, remaining, start, tweenValue)
1970 easingProgress: function easingProgress(easing, progress) {
1971 if (easing === 'swing') {
1972 return 0.5 - (Math.cos(progress * Math.PI) / 2);
1974 if (typeof easing === 'function') {
1975 return easing(progress);
1979 stop: function stop() {
1981 cancelAnimationFrame(a.frameId);
1983 a.animating = false;
1984 a.elements.each(function (index, el) {
1986 delete element.dom7AnimateInstance;
1990 done: function done(complete) {
1991 a.animating = false;
1992 a.elements.each(function (index, el) {
1994 delete element.dom7AnimateInstance;
1996 if (complete) { complete(els); }
1997 if (a.que.length > 0) {
1998 var que = a.que.shift();
1999 a.animate(que[0], que[1]);
2002 animate: function animate(props, params) {
2004 a.que.push([props, params]);
2009 // Define & Cache Initials & Units
2010 a.elements.each(function (index, el) {
2011 var initialFullValue;
2017 if (!el.dom7AnimateInstance) { a.elements[index].dom7AnimateInstance = a; }
2022 Object.keys(props).forEach(function (prop) {
2023 initialFullValue = win.getComputedStyle(el, null).getPropertyValue(prop).replace(',', '.');
2024 initialValue = parseFloat(initialFullValue);
2025 unit = initialFullValue.replace(initialValue, '');
2026 finalValue = parseFloat(props[prop]);
2027 finalFullValue = props[prop] + unit;
2028 elements[index][prop] = {
2029 initialFullValue: initialFullValue,
2030 initialValue: initialValue,
2032 finalValue: finalValue,
2033 finalFullValue: finalFullValue,
2034 currentValue: initialValue,
2039 var startTime = null;
2041 var elementsDone = 0;
2049 time = new Date().getTime();
2055 if (params.begin) { params.begin(els); }
2057 if (startTime === null) {
2060 if (params.progress) {
2061 // eslint-disable-next-line
2062 params.progress(els, Math.max(Math.min((time - startTime) / params.duration, 1), 0), ((startTime + params.duration) - time < 0 ? 0 : (startTime + params.duration) - time), startTime);
2065 elements.forEach(function (element) {
2067 if (done || el.done) { return; }
2068 Object.keys(props).forEach(function (prop) {
2069 if (done || el.done) { return; }
2070 progress = Math.max(Math.min((time - startTime) / params.duration, 1), 0);
2071 easeProgress = a.easingProgress(params.easing, progress);
2073 var initialValue = ref.initialValue;
2074 var finalValue = ref.finalValue;
2075 var unit = ref.unit;
2076 el[prop].currentValue = initialValue + (easeProgress * (finalValue - initialValue));
2077 var currentValue = el[prop].currentValue;
2080 (finalValue > initialValue && currentValue >= finalValue) ||
2081 (finalValue < initialValue && currentValue <= finalValue)) {
2082 el.container.style[prop] = finalValue + unit;
2084 if (propsDone === Object.keys(props).length) {
2088 if (elementsDone === elements.length) {
2093 a.done(params.complete);
2096 el.container.style[prop] = currentValue + unit;
2099 if (done) { return; }
2101 a.frameId = requestAnimationFrame(render);
2103 a.frameId = requestAnimationFrame(render);
2108 if (a.elements.length === 0) {
2112 var animateInstance;
2113 for (var i = 0; i < a.elements.length; i += 1) {
2114 if (a.elements[i].dom7AnimateInstance) {
2115 animateInstance = a.elements[i].dom7AnimateInstance;
2116 } else { a.elements[i].dom7AnimateInstance = a; }
2118 if (!animateInstance) {
2119 animateInstance = a;
2122 if (initialProps === 'stop') {
2123 animateInstance.stop();
2125 animateInstance.animate(a.props, a.params);
2133 for (var i = 0; i < els.length; i += 1) {
2134 if (els[i].dom7AnimateInstance) {
2135 els[i].dom7AnimateInstance.stop();
2140 var Animate = /*#__PURE__*/Object.freeze({
2145 var noTrigger = ('resize scroll').split(' ');
2146 function eventShortcut(name) {
2149 var args = [], len = arguments.length - 1;
2150 while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
2151 if (typeof args[0] === 'undefined') {
2152 for (var i = 0; i < this.length; i += 1) {
2153 if (noTrigger.indexOf(name) < 0) {
2154 if (name in this[i]) { this[i][name](); }
2156 $(this[i]).trigger(name);
2162 return (ref = this).on.apply(ref, [ name ].concat( args ));
2166 var args = [], len = arguments.length;
2167 while ( len-- ) args[ len ] = arguments[ len ];
2169 return eventShortcut.bind(this).apply(void 0, [ 'click' ].concat( args ));
2172 var args = [], len = arguments.length;
2173 while ( len-- ) args[ len ] = arguments[ len ];
2175 return eventShortcut.bind(this).apply(void 0, [ 'blur' ].concat( args ));
2178 var args = [], len = arguments.length;
2179 while ( len-- ) args[ len ] = arguments[ len ];
2181 return eventShortcut.bind(this).apply(void 0, [ 'focus' ].concat( args ));
2183 function focusin() {
2184 var args = [], len = arguments.length;
2185 while ( len-- ) args[ len ] = arguments[ len ];
2187 return eventShortcut.bind(this).apply(void 0, [ 'focusin' ].concat( args ));
2189 function focusout() {
2190 var args = [], len = arguments.length;
2191 while ( len-- ) args[ len ] = arguments[ len ];
2193 return eventShortcut.bind(this).apply(void 0, [ 'focusout' ].concat( args ));
2196 var args = [], len = arguments.length;
2197 while ( len-- ) args[ len ] = arguments[ len ];
2199 return eventShortcut.bind(this).apply(void 0, [ 'keyup' ].concat( args ));
2201 function keydown() {
2202 var args = [], len = arguments.length;
2203 while ( len-- ) args[ len ] = arguments[ len ];
2205 return eventShortcut.bind(this).apply(void 0, [ 'keydown' ].concat( args ));
2207 function keypress() {
2208 var args = [], len = arguments.length;
2209 while ( len-- ) args[ len ] = arguments[ len ];
2211 return eventShortcut.bind(this).apply(void 0, [ 'keypress' ].concat( args ));
2214 var args = [], len = arguments.length;
2215 while ( len-- ) args[ len ] = arguments[ len ];
2217 return eventShortcut.bind(this).apply(void 0, [ 'submit' ].concat( args ));
2220 var args = [], len = arguments.length;
2221 while ( len-- ) args[ len ] = arguments[ len ];
2223 return eventShortcut.bind(this).apply(void 0, [ 'change' ].concat( args ));
2225 function mousedown() {
2226 var args = [], len = arguments.length;
2227 while ( len-- ) args[ len ] = arguments[ len ];
2229 return eventShortcut.bind(this).apply(void 0, [ 'mousedown' ].concat( args ));
2231 function mousemove() {
2232 var args = [], len = arguments.length;
2233 while ( len-- ) args[ len ] = arguments[ len ];
2235 return eventShortcut.bind(this).apply(void 0, [ 'mousemove' ].concat( args ));
2237 function mouseup() {
2238 var args = [], len = arguments.length;
2239 while ( len-- ) args[ len ] = arguments[ len ];
2241 return eventShortcut.bind(this).apply(void 0, [ 'mouseup' ].concat( args ));
2243 function mouseenter() {
2244 var args = [], len = arguments.length;
2245 while ( len-- ) args[ len ] = arguments[ len ];
2247 return eventShortcut.bind(this).apply(void 0, [ 'mouseenter' ].concat( args ));
2249 function mouseleave() {
2250 var args = [], len = arguments.length;
2251 while ( len-- ) args[ len ] = arguments[ len ];
2253 return eventShortcut.bind(this).apply(void 0, [ 'mouseleave' ].concat( args ));
2255 function mouseout() {
2256 var args = [], len = arguments.length;
2257 while ( len-- ) args[ len ] = arguments[ len ];
2259 return eventShortcut.bind(this).apply(void 0, [ 'mouseout' ].concat( args ));
2261 function mouseover() {
2262 var args = [], len = arguments.length;
2263 while ( len-- ) args[ len ] = arguments[ len ];
2265 return eventShortcut.bind(this).apply(void 0, [ 'mouseover' ].concat( args ));
2267 function touchstart() {
2268 var args = [], len = arguments.length;
2269 while ( len-- ) args[ len ] = arguments[ len ];
2271 return eventShortcut.bind(this).apply(void 0, [ 'touchstart' ].concat( args ));
2273 function touchend() {
2274 var args = [], len = arguments.length;
2275 while ( len-- ) args[ len ] = arguments[ len ];
2277 return eventShortcut.bind(this).apply(void 0, [ 'touchend' ].concat( args ));
2279 function touchmove() {
2280 var args = [], len = arguments.length;
2281 while ( len-- ) args[ len ] = arguments[ len ];
2283 return eventShortcut.bind(this).apply(void 0, [ 'touchmove' ].concat( args ));
2286 var args = [], len = arguments.length;
2287 while ( len-- ) args[ len ] = arguments[ len ];
2289 return eventShortcut.bind(this).apply(void 0, [ 'resize' ].concat( args ));
2292 var args = [], len = arguments.length;
2293 while ( len-- ) args[ len ] = arguments[ len ];
2295 return eventShortcut.bind(this).apply(void 0, [ 'scroll' ].concat( args ));
2298 var eventShortcuts = /*#__PURE__*/Object.freeze({
2309 mousedown: mousedown,
2310 mousemove: mousemove,
2312 mouseenter: mouseenter,
2313 mouseleave: mouseleave,
2315 mouseover: mouseover,
2316 touchstart: touchstart,
2318 touchmove: touchmove,
2323 [Methods, Scroll, Animate, eventShortcuts].forEach(function (group) {
2324 Object.keys(group).forEach(function (methodName) {
2325 $.fn[methodName] = group[methodName];
2330 * https://github.com/gre/bezier-easing
2331 * BezierEasing - use bezier curve for transition easing function
2332 * by Gaëtan Renaudeau 2014 - 2015 – MIT License
2335 /* eslint-disable */
2337 // These values are established by empiricism with tests (tradeoff: performance VS precision)
2338 var NEWTON_ITERATIONS = 4;
2339 var NEWTON_MIN_SLOPE = 0.001;
2340 var SUBDIVISION_PRECISION = 0.0000001;
2341 var SUBDIVISION_MAX_ITERATIONS = 10;
2343 var kSplineTableSize = 11;
2344 var kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);
2346 var float32ArraySupported = typeof Float32Array === 'function';
2348 function A (aA1, aA2) { return 1.0 - 3.0 * aA2 + 3.0 * aA1; }
2349 function B (aA1, aA2) { return 3.0 * aA2 - 6.0 * aA1; }
2350 function C (aA1) { return 3.0 * aA1; }
2352 // Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
2353 function calcBezier (aT, aA1, aA2) { return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT; }
2355 // Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2.
2356 function getSlope (aT, aA1, aA2) { return 3.0 * A(aA1, aA2) * aT * aT + 2.0 * B(aA1, aA2) * aT + C(aA1); }
2358 function binarySubdivide (aX, aA, aB, mX1, mX2) {
2359 var currentX, currentT, i = 0;
2361 currentT = aA + (aB - aA) / 2.0;
2362 currentX = calcBezier(currentT, mX1, mX2) - aX;
2363 if (currentX > 0.0) {
2368 } while (Math.abs(currentX) > SUBDIVISION_PRECISION && ++i < SUBDIVISION_MAX_ITERATIONS);
2372 function newtonRaphsonIterate (aX, aGuessT, mX1, mX2) {
2373 for (var i = 0; i < NEWTON_ITERATIONS; ++i) {
2374 var currentSlope = getSlope(aGuessT, mX1, mX2);
2375 if (currentSlope === 0.0) {
2378 var currentX = calcBezier(aGuessT, mX1, mX2) - aX;
2379 aGuessT -= currentX / currentSlope;
2384 function bezier (mX1, mY1, mX2, mY2) {
2385 if (!(0 <= mX1 && mX1 <= 1 && 0 <= mX2 && mX2 <= 1)) {
2386 throw new Error('bezier x values must be in [0, 1] range');
2389 // Precompute samples table
2390 var sampleValues = float32ArraySupported ? new Float32Array(kSplineTableSize) : new Array(kSplineTableSize);
2391 if (mX1 !== mY1 || mX2 !== mY2) {
2392 for (var i = 0; i < kSplineTableSize; ++i) {
2393 sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
2397 function getTForX (aX) {
2398 var intervalStart = 0.0;
2399 var currentSample = 1;
2400 var lastSample = kSplineTableSize - 1;
2402 for (; currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {
2403 intervalStart += kSampleStepSize;
2407 // Interpolate to provide an initial guess for t
2408 var dist = (aX - sampleValues[currentSample]) / (sampleValues[currentSample + 1] - sampleValues[currentSample]);
2409 var guessForT = intervalStart + dist * kSampleStepSize;
2411 var initialSlope = getSlope(guessForT, mX1, mX2);
2412 if (initialSlope >= NEWTON_MIN_SLOPE) {
2413 return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
2414 } else if (initialSlope === 0.0) {
2417 return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2);
2421 return function BezierEasing (x) {
2422 if (mX1 === mY1 && mX2 === mY2) {
2425 // Because JavaScript number are imprecise, we should guarantee the extremes are right.
2432 return calcBezier(getTForX(x), mY1, mY2);
2436 /* eslint no-control-regex: "off
" */
2438 // Remove Diacritics
2439 var defaultDiacriticsRemovalap = [
2440 { base: 'A', letters: '\u0041\u24B6\uFF21\u00C0\u00C1\u00C2\u1EA6\u1EA4\u1EAA\u1EA8\u00C3\u0100\u0102\u1EB0\u1EAE\u1EB4\u1EB2\u0226\u01E0\u00C4\u01DE\u1EA2\u00C5\u01FA\u01CD\u0200\u0202\u1EA0\u1EAC\u1EB6\u1E00\u0104\u023A\u2C6F' },
2441 { base: 'AA', letters: '\uA732' },
2442 { base: 'AE', letters: '\u00C6\u01FC\u01E2' },
2443 { base: 'AO', letters: '\uA734' },
2444 { base: 'AU', letters: '\uA736' },
2445 { base: 'AV', letters: '\uA738\uA73A' },
2446 { base: 'AY', letters: '\uA73C' },
2447 { base: 'B', letters: '\u0042\u24B7\uFF22\u1E02\u1E04\u1E06\u0243\u0182\u0181' },
2448 { base: 'C', letters: '\u0043\u24B8\uFF23\u0106\u0108\u010A\u010C\u00C7\u1E08\u0187\u023B\uA73E' },
2449 { base: 'D', letters: '\u0044\u24B9\uFF24\u1E0A\u010E\u1E0C\u1E10\u1E12\u1E0E\u0110\u018B\u018A\u0189\uA779' },
2450 { base: 'DZ', letters: '\u01F1\u01C4' },
2451 { base: 'Dz', letters: '\u01F2\u01C5' },
2452 { base: 'E', letters: '\u0045\u24BA\uFF25\u00C8\u00C9\u00CA\u1EC0\u1EBE\u1EC4\u1EC2\u1EBC\u0112\u1E14\u1E16\u0114\u0116\u00CB\u1EBA\u011A\u0204\u0206\u1EB8\u1EC6\u0228\u1E1C\u0118\u1E18\u1E1A\u0190\u018E' },
2453 { base: 'F', letters: '\u0046\u24BB\uFF26\u1E1E\u0191\uA77B' },
2454 { base: 'G', letters: '\u0047\u24BC\uFF27\u01F4\u011C\u1E20\u011E\u0120\u01E6\u0122\u01E4\u0193\uA7A0\uA77D\uA77E' },
2455 { base: 'H', letters: '\u0048\u24BD\uFF28\u0124\u1E22\u1E26\u021E\u1E24\u1E28\u1E2A\u0126\u2C67\u2C75\uA78D' },
2456 { base: 'I', letters: '\u0049\u24BE\uFF29\u00CC\u00CD\u00CE\u0128\u012A\u012C\u0130\u00CF\u1E2E\u1EC8\u01CF\u0208\u020A\u1ECA\u012E\u1E2C\u0197' },
2457 { base: 'J', letters: '\u004A\u24BF\uFF2A\u0134\u0248' },
2458 { base: 'K', letters: '\u004B\u24C0\uFF2B\u1E30\u01E8\u1E32\u0136\u1E34\u0198\u2C69\uA740\uA742\uA744\uA7A2' },
2459 { base: 'L', letters: '\u004C\u24C1\uFF2C\u013F\u0139\u013D\u1E36\u1E38\u013B\u1E3C\u1E3A\u0141\u023D\u2C62\u2C60\uA748\uA746\uA780' },
2460 { base: 'LJ', letters: '\u01C7' },
2461 { base: 'Lj', letters: '\u01C8' },
2462 { base: 'M', letters: '\u004D\u24C2\uFF2D\u1E3E\u1E40\u1E42\u2C6E\u019C' },
2463 { base: 'N', letters: '\u004E\u24C3\uFF2E\u01F8\u0143\u00D1\u1E44\u0147\u1E46\u0145\u1E4A\u1E48\u0220\u019D\uA790\uA7A4' },
2464 { base: 'NJ', letters: '\u01CA' },
2465 { base: 'Nj', letters: '\u01CB' },
2466 { base: 'O', letters: '\u004F\u24C4\uFF2F\u00D2\u00D3\u00D4\u1ED2\u1ED0\u1ED6\u1ED4\u00D5\u1E4C\u022C\u1E4E\u014C\u1E50\u1E52\u014E\u022E\u0230\u00D6\u022A\u1ECE\u0150\u01D1\u020C\u020E\u01A0\u1EDC\u1EDA\u1EE0\u1EDE\u1EE2\u1ECC\u1ED8\u01EA\u01EC\u00D8\u01FE\u0186\u019F\uA74A\uA74C' },
2467 { base: 'OI', letters: '\u01A2' },
2468 { base: 'OO', letters: '\uA74E' },
2469 { base: 'OU', letters: '\u0222' },
2470 { base: 'OE', letters: '\u008C\u0152' },
2471 { base: 'oe', letters: '\u009C\u0153' },
2472 { base: 'P', letters: '\u0050\u24C5\uFF30\u1E54\u1E56\u01A4\u2C63\uA750\uA752\uA754' },
2473 { base: 'Q', letters: '\u0051\u24C6\uFF31\uA756\uA758\u024A' },
2474 { base: 'R', letters: '\u0052\u24C7\uFF32\u0154\u1E58\u0158\u0210\u0212\u1E5A\u1E5C\u0156\u1E5E\u024C\u2C64\uA75A\uA7A6\uA782' },
2475 { base: 'S', letters: '\u0053\u24C8\uFF33\u1E9E\u015A\u1E64\u015C\u1E60\u0160\u1E66\u1E62\u1E68\u0218\u015E\u2C7E\uA7A8\uA784' },
2476 { base: 'T', letters: '\u0054\u24C9\uFF34\u1E6A\u0164\u1E6C\u021A\u0162\u1E70\u1E6E\u0166\u01AC\u01AE\u023E\uA786' },
2477 { base: 'TZ', letters: '\uA728' },
2478 { base: 'U', letters: '\u0055\u24CA\uFF35\u00D9\u00DA\u00DB\u0168\u1E78\u016A\u1E7A\u016C\u00DC\u01DB\u01D7\u01D5\u01D9\u1EE6\u016E\u0170\u01D3\u0214\u0216\u01AF\u1EEA\u1EE8\u1EEE\u1EEC\u1EF0\u1EE4\u1E72\u0172\u1E76\u1E74\u0244' },
2479 { base: 'V', letters: '\u0056\u24CB\uFF36\u1E7C\u1E7E\u01B2\uA75E\u0245' },
2480 { base: 'VY', letters: '\uA760' },
2481 { base: 'W', letters: '\u0057\u24CC\uFF37\u1E80\u1E82\u0174\u1E86\u1E84\u1E88\u2C72' },
2482 { base: 'X', letters: '\u0058\u24CD\uFF38\u1E8A\u1E8C' },
2483 { base: 'Y', letters: '\u0059\u24CE\uFF39\u1EF2\u00DD\u0176\u1EF8\u0232\u1E8E\u0178\u1EF6\u1EF4\u01B3\u024E\u1EFE' },
2484 { base: 'Z', letters: '\u005A\u24CF\uFF3A\u0179\u1E90\u017B\u017D\u1E92\u1E94\u01B5\u0224\u2C7F\u2C6B\uA762' },
2485 { base: 'a', letters: '\u0061\u24D0\uFF41\u1E9A\u00E0\u00E1\u00E2\u1EA7\u1EA5\u1EAB\u1EA9\u00E3\u0101\u0103\u1EB1\u1EAF\u1EB5\u1EB3\u0227\u01E1\u00E4\u01DF\u1EA3\u00E5\u01FB\u01CE\u0201\u0203\u1EA1\u1EAD\u1EB7\u1E01\u0105\u2C65\u0250' },
2486 { base: 'aa', letters: '\uA733' },
2487 { base: 'ae', letters: '\u00E6\u01FD\u01E3' },
2488 { base: 'ao', letters: '\uA735' },
2489 { base: 'au', letters: '\uA737' },
2490 { base: 'av', letters: '\uA739\uA73B' },
2491 { base: 'ay', letters: '\uA73D' },
2492 { base: 'b', letters: '\u0062\u24D1\uFF42\u1E03\u1E05\u1E07\u0180\u0183\u0253' },
2493 { base: 'c', letters: '\u0063\u24D2\uFF43\u0107\u0109\u010B\u010D\u00E7\u1E09\u0188\u023C\uA73F\u2184' },
2494 { base: 'd', letters: '\u0064\u24D3\uFF44\u1E0B\u010F\u1E0D\u1E11\u1E13\u1E0F\u0111\u018C\u0256\u0257\uA77A' },
2495 { base: 'dz', letters: '\u01F3\u01C6' },
2496 { base: 'e', letters: '\u0065\u24D4\uFF45\u00E8\u00E9\u00EA\u1EC1\u1EBF\u1EC5\u1EC3\u1EBD\u0113\u1E15\u1E17\u0115\u0117\u00EB\u1EBB\u011B\u0205\u0207\u1EB9\u1EC7\u0229\u1E1D\u0119\u1E19\u1E1B\u0247\u025B\u01DD' },
2497 { base: 'f', letters: '\u0066\u24D5\uFF46\u1E1F\u0192\uA77C' },
2498 { base: 'g', letters: '\u0067\u24D6\uFF47\u01F5\u011D\u1E21\u011F\u0121\u01E7\u0123\u01E5\u0260\uA7A1\u1D79\uA77F' },
2499 { base: 'h', letters: '\u0068\u24D7\uFF48\u0125\u1E23\u1E27\u021F\u1E25\u1E29\u1E2B\u1E96\u0127\u2C68\u2C76\u0265' },
2500 { base: 'hv', letters: '\u0195' },
2501 { base: 'i', letters: '\u0069\u24D8\uFF49\u00EC\u00ED\u00EE\u0129\u012B\u012D\u00EF\u1E2F\u1EC9\u01D0\u0209\u020B\u1ECB\u012F\u1E2D\u0268\u0131' },
2502 { base: 'j', letters: '\u006A\u24D9\uFF4A\u0135\u01F0\u0249' },
2503 { base: 'k', letters: '\u006B\u24DA\uFF4B\u1E31\u01E9\u1E33\u0137\u1E35\u0199\u2C6A\uA741\uA743\uA745\uA7A3' },
2504 { base: 'l', letters: '\u006C\u24DB\uFF4C\u0140\u013A\u013E\u1E37\u1E39\u013C\u1E3D\u1E3B\u017F\u0142\u019A\u026B\u2C61\uA749\uA781\uA747' },
2505 { base: 'lj', letters: '\u01C9' },
2506 { base: 'm', letters: '\u006D\u24DC\uFF4D\u1E3F\u1E41\u1E43\u0271\u026F' },
2507 { base: 'n', letters: '\u006E\u24DD\uFF4E\u01F9\u0144\u00F1\u1E45\u0148\u1E47\u0146\u1E4B\u1E49\u019E\u0272\u0149\uA791\uA7A5' },
2508 { base: 'nj', letters: '\u01CC' },
2509 { base: 'o', letters: '\u006F\u24DE\uFF4F\u00F2\u00F3\u00F4\u1ED3\u1ED1\u1ED7\u1ED5\u00F5\u1E4D\u022D\u1E4F\u014D\u1E51\u1E53\u014F\u022F\u0231\u00F6\u022B\u1ECF\u0151\u01D2\u020D\u020F\u01A1\u1EDD\u1EDB\u1EE1\u1EDF\u1EE3\u1ECD\u1ED9\u01EB\u01ED\u00F8\u01FF\u0254\uA74B\uA74D\u0275' },
2510 { base: 'oi', letters: '\u01A3' },
2511 { base: 'ou', letters: '\u0223' },
2512 { base: 'oo', letters: '\uA74F' },
2513 { base: 'p', letters: '\u0070\u24DF\uFF50\u1E55\u1E57\u01A5\u1D7D\uA751\uA753\uA755' },
2514 { base: 'q', letters: '\u0071\u24E0\uFF51\u024B\uA757\uA759' },
2515 { base: 'r', letters: '\u0072\u24E1\uFF52\u0155\u1E59\u0159\u0211\u0213\u1E5B\u1E5D\u0157\u1E5F\u024D\u027D\uA75B\uA7A7\uA783' },
2516 { base: 's', letters: '\u0073\u24E2\uFF53\u00DF\u015B\u1E65\u015D\u1E61\u0161\u1E67\u1E63\u1E69\u0219\u015F\u023F\uA7A9\uA785\u1E9B' },
2517 { base: 't', letters: '\u0074\u24E3\uFF54\u1E6B\u1E97\u0165\u1E6D\u021B\u0163\u1E71\u1E6F\u0167\u01AD\u0288\u2C66\uA787' },
2518 { base: 'tz', letters: '\uA729' },
2519 { base: 'u', letters: '\u0075\u24E4\uFF55\u00F9\u00FA\u00FB\u0169\u1E79\u016B\u1E7B\u016D\u00FC\u01DC\u01D8\u01D6\u01DA\u1EE7\u016F\u0171\u01D4\u0215\u0217\u01B0\u1EEB\u1EE9\u1EEF\u1EED\u1EF1\u1EE5\u1E73\u0173\u1E77\u1E75\u0289' },
2520 { base: 'v', letters: '\u0076\u24E5\uFF56\u1E7D\u1E7F\u028B\uA75F\u028C' },
2521 { base: 'vy', letters: '\uA761' },
2522 { base: 'w', letters: '\u0077\u24E6\uFF57\u1E81\u1E83\u0175\u1E87\u1E85\u1E98\u1E89\u2C73' },
2523 { base: 'x', letters: '\u0078\u24E7\uFF58\u1E8B\u1E8D' },
2524 { base: 'y', letters: '\u0079\u24E8\uFF59\u1EF3\u00FD\u0177\u1EF9\u0233\u1E8F\u00FF\u1EF7\u1E99\u1EF5\u01B4\u024F\u1EFF' },
2525 { base: 'z', letters: '\u007A\u24E9\uFF5A\u017A\u1E91\u017C\u017E\u1E93\u1E95\u01B6\u0225\u0240\u2C6C\uA763' } ];
2527 var diacriticsMap = {};
2528 for (var i = 0; i < defaultDiacriticsRemovalap.length; i += 1) {
2529 var letters = defaultDiacriticsRemovalap[i].letters;
2530 for (var j = 0; j < letters.length; j += 1) {
2531 diacriticsMap[letters[j]] = defaultDiacriticsRemovalap[i].base;
2535 var uniqueNumber = 1;
2538 uniqueNumber: function uniqueNumber$1() {
2540 return uniqueNumber;
2542 id: function id(mask, map) {
2543 if ( mask === void 0 ) mask = 'xxxxxxxxxx';
2544 if ( map === void 0 ) map = '0123456789abcdef';
2546 var length = map.length;
2547 return mask.replace(/x/g, function () { return map[Math.floor((Math.random() * length))]; });
2549 mdPreloaderContent: "\n <span
class=\"preloader
-inner
\">\n <span
class=\"preloader
-inner
-gap
\"></span>\n <span class=\"preloader-inner-left\">\n <span class=\"preloader-inner-half-circle\"></span>\n </span>\n <span class=\"preloader-inner-right\">\n <span class=\"preloader-inner-half-circle\"></span>\n </span>\n </span>\n ".trim(),
2550 iosPreloaderContent: ("\n <span
class=\"preloader
-inner
\">\n " + ([0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11].map(function () { return '<span class="preloader
-inner
-line
"></span>'; }).join('')) + "\n </span
>\n ").trim(),
2551 auroraPreloaderContent: "\n <span
class=\"preloader
-inner
\">\n <span
class=\"preloader
-inner
-circle
\"></span>\n </span>\n ",
2552 eventNameToColonCase: function eventNameToColonCase(eventName) {
2554 return eventName.split('').map(function (char, index) {
2555 if (char.match(/[A-Z]/) && index !== 0 && !hasColon) {
2557 return (":" + (char.toLowerCase()));
2559 return char.toLowerCase();
2562 deleteProps: function deleteProps(obj) {
2564 Object.keys(object).forEach(function (key) {
2568 // no setter for object
2573 // something got wrong
2577 bezier: function bezier$1() {
2578 var args = [], len = arguments.length;
2579 while ( len-- ) args[ len ] = arguments[ len ];
2581 return bezier.apply(void 0, args);
2583 nextTick: function nextTick(callback, delay) {
2584 if ( delay === void 0 ) delay = 0;
2586 return setTimeout(callback, delay);
2588 nextFrame: function nextFrame(callback) {
2589 return Utils.requestAnimationFrame(function () {
2590 Utils.requestAnimationFrame(callback);
2593 now: function now() {
2596 requestAnimationFrame: function requestAnimationFrame(callback) {
2597 return win.requestAnimationFrame(callback);
2599 cancelAnimationFrame: function cancelAnimationFrame(id) {
2600 return win.cancelAnimationFrame(id);
2602 removeDiacritics: function removeDiacritics(str) {
2603 return str.replace(/[^\u0000-\u007E]/g, function (a) { return diacriticsMap[a] || a; });
2605 parseUrlQuery: function parseUrlQuery(url) {
2607 var urlToParse = url || win.location.href;
2612 if (typeof urlToParse === 'string' && urlToParse.length) {
2613 urlToParse = urlToParse.indexOf('?') > -1 ? urlToParse.replace(/\S*\?/, '') : '';
2614 params = urlToParse.split('&').filter(function (paramsPart) { return paramsPart !== ''; });
2615 length = params.length;
2617 for (i = 0; i < length; i += 1) {
2618 param = params[i].replace(/#\S+/g, '').split('=');
2619 query[decodeURIComponent(param[0])] = typeof param[1] === 'undefined' ? undefined : decodeURIComponent(param.slice(1).join('=')) || '';
2624 getTranslate: function getTranslate(el, axis) {
2625 if ( axis === void 0 ) axis = 'x';
2629 var transformMatrix;
2631 var curStyle = win.getComputedStyle(el, null);
2633 if (win.WebKitCSSMatrix) {
2634 curTransform = curStyle.transform || curStyle.webkitTransform;
2635 if (curTransform.split(',').length > 6) {
2636 curTransform = curTransform.split(', ').map(function (a) { return a.replace(',', '.'); }).join(', ');
2638 // Some old versions of Webkit choke when 'none' is passed; pass
2639 // empty string instead in this case
2640 transformMatrix = new win.WebKitCSSMatrix(curTransform === 'none' ? '' : curTransform);
2642 transformMatrix = curStyle.MozTransform || curStyle.OTransform || curStyle.MsTransform || curStyle.msTransform || curStyle.transform || curStyle.getPropertyValue('transform').replace('translate(', 'matrix(1, 0, 0, 1,');
2643 matrix = transformMatrix.toString().split(',');
2647 // Latest Chrome and webkits Fix
2648 if (win.WebKitCSSMatrix) { curTransform = transformMatrix.m41; }
2649 // Crazy IE10 Matrix
2650 else if (matrix.length === 16) { curTransform = parseFloat(matrix[12]); }
2652 else { curTransform = parseFloat(matrix[4]); }
2655 // Latest Chrome and webkits Fix
2656 if (win.WebKitCSSMatrix) { curTransform = transformMatrix.m42; }
2657 // Crazy IE10 Matrix
2658 else if (matrix.length === 16) { curTransform = parseFloat(matrix[13]); }
2660 else { curTransform = parseFloat(matrix[5]); }
2662 return curTransform || 0;
2664 serializeObject: function serializeObject(obj, parents) {
2665 if ( parents === void 0 ) parents = [];
2667 if (typeof obj === 'string') { return obj; }
2668 var resultArray = [];
2669 var separator = '&';
2671 function varName(name) {
2672 if (parents.length > 0) {
2673 var parentParts = '';
2674 for (var j = 0; j < parents.length; j += 1) {
2675 if (j === 0) { parentParts += parents[j]; }
2676 else { parentParts += "[" + (encodeURIComponent(parents[j])) + "]"; }
2678 return (parentParts + "[" + (encodeURIComponent(name)) + "]");
2680 return encodeURIComponent(name);
2682 function varValue(value) {
2683 return encodeURIComponent(value);
2685 Object.keys(obj).forEach(function (prop) {
2687 if (Array.isArray(obj[prop])) {
2689 for (var i = 0; i < obj[prop].length; i += 1) {
2690 if (!Array.isArray(obj[prop][i]) && typeof obj[prop][i] === 'object') {
2691 newParents = parents.slice();
2692 newParents.push(prop);
2693 newParents.push(String(i));
2694 toPush.push(Utils.serializeObject(obj[prop][i], newParents));
2696 toPush.push(((varName(prop)) + "[]=" + (varValue(obj[prop][i]))));
2699 if (toPush.length > 0) { resultArray.push(toPush.join(separator)); }
2700 } else if (obj[prop] === null || obj[prop] === '') {
2701 resultArray.push(((varName(prop)) + "="));
2702 } else if (typeof obj[prop] === 'object') {
2703 // Object, convert to named array
2704 newParents = parents.slice();
2705 newParents.push(prop);
2706 toPush = Utils.serializeObject(obj[prop], newParents);
2707 if (toPush !== '') { resultArray.push(toPush); }
2708 } else if (typeof obj[prop] !== 'undefined' && obj[prop] !== '') {
2709 // Should be string or plain value
2710 resultArray.push(((varName(prop)) + "=" + (varValue(obj[prop]))));
2711 } else if (obj[prop] === '') { resultArray.push(varName(prop)); }
2713 return resultArray.join(separator);
2715 isObject: function isObject(o) {
2716 return typeof o === 'object' && o !== null && o.constructor && o.constructor === Object;
2718 merge: function merge() {
2719 var args = [], len$1 = arguments.length;
2720 while ( len$1-- ) args[ len$1 ] = arguments[ len$1 ];
2726 for (var i = 0; i < from.length; i += 1) {
2727 var nextSource = args[i];
2728 if (nextSource !== undefined && nextSource !== null) {
2729 var keysArray = Object.keys(Object(nextSource));
2730 for (var nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex += 1) {
2731 var nextKey = keysArray[nextIndex];
2732 var desc = Object.getOwnPropertyDescriptor(nextSource, nextKey);
2733 if (desc !== undefined && desc.enumerable) {
2734 to[nextKey] = nextSource[nextKey];
2741 extend: function extend() {
2742 var args = [], len$1 = arguments.length;
2743 while ( len$1-- ) args[ len$1 ] = arguments[ len$1 ];
2748 if (typeof args[0] === 'boolean') {
2758 for (var i = 0; i < from.length; i += 1) {
2759 var nextSource = args[i];
2760 if (nextSource !== undefined && nextSource !== null) {
2761 var keysArray = Object.keys(Object(nextSource));
2762 for (var nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex += 1) {
2763 var nextKey = keysArray[nextIndex];
2764 var desc = Object.getOwnPropertyDescriptor(nextSource, nextKey);
2765 if (desc !== undefined && desc.enumerable) {
2767 to[nextKey] = nextSource[nextKey];
2768 } else if (Utils.isObject(to[nextKey]) && Utils.isObject(nextSource[nextKey])) {
2769 Utils.extend(to[nextKey], nextSource[nextKey]);
2770 } else if (!Utils.isObject(to[nextKey]) && Utils.isObject(nextSource[nextKey])) {
2772 Utils.extend(to[nextKey], nextSource[nextKey]);
2774 to[nextKey] = nextSource[nextKey];
2782 colorHexToRgb: function colorHexToRgb(hex) {
2783 var h = hex.replace(/^#?([a-f\d])([a-f\d])([a-f\d])$/i, function (m, r, g, b) { return r + r + g + g + b + b; });
2784 var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(h);
2786 ? result.slice(1).map(function (n) { return parseInt(n, 16); })
2789 colorRgbToHex: function colorRgbToHex(r, g, b) {
2790 var result = [r, g, b].map(function (n) {
2791 var hex = n.toString(16);
2792 return hex.length === 1 ? ("0" + hex) : hex;
2794 return ("#" + result);
2796 colorRgbToHsl: function colorRgbToHsl(r, g, b) {
2797 r /= 255; // eslint-disable-line
2798 g /= 255; // eslint-disable-line
2799 b /= 255; // eslint-disable-line
2800 var max = Math.max(r, g, b);
2801 var min = Math.min(r, g, b);
2804 if (d === 0) { h = 0; }
2805 else if (max === r) { h = ((g - b) / d) % 6; }
2806 else if (max === g) { h = (b - r) / d + 2; }
2807 else if (max === b) { h = (r - g) / d + 4; }
2808 var l = (min + max) / 2;
2809 var s = d === 0 ? 0 : d / (1 - Math.abs(2 * l - 1));
2810 if (h < 0) { h = 360 / 60 + h; }
2811 return [h * 60, s, l];
2813 colorHslToRgb: function colorHslToRgb(h, s, l) {
2814 var c = (1 - Math.abs(2 * l - 1)) * s;
2816 var x = c * (1 - Math.abs((hp % 2) - 1));
2818 if (Number.isNaN(h) || typeof h === 'undefined') {
2820 } else if (hp <= 1) { rgb1 = [c, x, 0]; }
2821 else if (hp <= 2) { rgb1 = [x, c, 0]; }
2822 else if (hp <= 3) { rgb1 = [0, c, x]; }
2823 else if (hp <= 4) { rgb1 = [0, x, c]; }
2824 else if (hp <= 5) { rgb1 = [x, 0, c]; }
2825 else if (hp <= 6) { rgb1 = [c, 0, x]; }
2826 var m = l - (c / 2);
2827 return rgb1.map(function (n) { return Math.max(0, Math.min(255, Math.round(255 * (n + m)))); });
2829 colorHsbToHsl: function colorHsbToHsl(h, s, b) {
2835 var HSB = { h: h, s: s, b: b };
2837 HSL.l = (2 - HSB.s) * HSB.b / 2;
2838 HSL.s = HSL.l && HSL.l < 1 ? HSB.s * HSB.b / (HSL.l < 0.5 ? HSL.l * 2 : 2 - HSL.l * 2) : HSL.s;
2840 return [HSL.h, HSL.s, HSL.l];
2842 colorHslToHsb: function colorHslToHsb(h, s, l) {
2848 var HSL = { h: h, s: s, l: l };
2850 var t = HSL.s * (HSL.l < 0.5 ? HSL.l : 1 - HSL.l);
2852 HSB.s = HSL.l > 0 ? 2 * t / HSB.b : HSB.s;
2854 return [HSB.h, HSB.s, HSB.b];
2856 colorThemeCSSProperties: function colorThemeCSSProperties() {
2857 var args = [], len = arguments.length;
2858 while ( len-- ) args[ len ] = arguments[ len ];
2862 if (args.length === 1) {
2864 rgb = Utils.colorHexToRgb(hex);
2865 } else if (args.length === 3) {
2867 hex = Utils.colorRgbToHex.apply(Utils, rgb);
2869 if (!rgb) { return {}; }
2870 var hsl = Utils.colorRgbToHsl.apply(Utils, rgb);
2871 var hslShade = [hsl[0], hsl[1], Math.max(0, (hsl[2] - 0.08))];
2872 var hslTint = [hsl[0], hsl[1], Math.max(0, (hsl[2] + 0.08))];
2873 var shade = Utils.colorRgbToHex.apply(Utils, Utils.colorHslToRgb.apply(Utils, hslShade));
2874 var tint = Utils.colorRgbToHex.apply(Utils, Utils.colorHslToRgb.apply(Utils, hslTint));
2876 '--f7-theme-color': hex,
2877 '--f7-theme-color-rgb': rgb.join(', '),
2878 '--f7-theme-color-shade': shade,
2879 '--f7-theme-color-tint': tint,
2884 var Support = (function Support() {
2885 var testDiv = doc.createElement('div');
2888 touch: (function checkTouch() {
2889 return !!((win.navigator.maxTouchPoints > 0) || ('ontouchstart' in win) || (win.DocumentTouch && doc instanceof win.DocumentTouch));
2892 pointerEvents: !!(win.navigator.pointerEnabled || win.PointerEvent || ('maxTouchPoints' in win.navigator && win.navigator.maxTouchPoints > 0)),
2893 prefixedPointerEvents: !!win.navigator.msPointerEnabled,
2895 transition: (function checkTransition() {
2896 var style = testDiv.style;
2897 return ('transition' in style || 'webkitTransition' in style || 'MozTransition' in style);
2899 transforms3d: (win.Modernizr && win.Modernizr.csstransforms3d === true) || (function checkTransforms3d() {
2900 var style = testDiv.style;
2901 return ('webkitPerspective' in style || 'MozPerspective' in style || 'OPerspective' in style || 'MsPerspective' in style || 'perspective' in style);
2904 flexbox: (function checkFlexbox() {
2905 var div = doc.createElement('div').style;
2906 var styles = ('alignItems webkitAlignItems webkitBoxAlign msFlexAlign mozBoxAlign webkitFlexDirection msFlexDirection mozBoxDirection mozBoxOrient webkitBoxDirection webkitBoxOrient').split(' ');
2907 for (var i = 0; i < styles.length; i += 1) {
2908 if (styles[i] in div) { return true; }
2913 observer: (function checkObserver() {
2914 return ('MutationObserver' in win || 'WebkitMutationObserver' in win);
2917 passiveListener: (function checkPassiveListener() {
2918 var supportsPassive = false;
2920 var opts = Object.defineProperty({}, 'passive', {
2921 // eslint-disable-next-line
2922 get: function get() {
2923 supportsPassive = true;
2926 win.addEventListener('testPassiveListener', null, opts);
2930 return supportsPassive;
2933 gestures: (function checkGestures() {
2934 return 'ongesturestart' in win;
2937 intersectionObserver: (function checkObserver() {
2938 return ('IntersectionObserver' in win);
2943 var Device = (function Device() {
2944 var platform = win.navigator.platform;
2945 var ua = win.navigator.userAgent;
2950 androidChrome: false,
2952 windowsPhone: false,
2962 cordova: !!(win.cordova || win.phonegap),
2963 phonegap: !!(win.cordova || win.phonegap),
2967 var screenWidth = win.screen.width;
2968 var screenHeight = win.screen.height;
2970 var windowsPhone = ua.match(/(Windows Phone);?[\s\/]+([\d.]+)?/); // eslint-disable-line
2971 var android = ua.match(/(Android);?[\s\/]+([\d.]+)?/); // eslint-disable-line
2972 var ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
2973 var ipod = ua.match(/(iPod)(.*OS\s([\d_]+))?/);
2974 var iphone = !ipad && ua.match(/(iPhone\sOS|iOS)\s([\d_]+)/);
2975 var iphoneX = iphone && (
2976 (screenWidth === 375 && screenHeight === 812) // X/XS
2977 || (screenWidth === 414 && screenHeight === 896) // XR / XS Max
2979 var ie = ua.indexOf('MSIE ') >= 0 || ua.indexOf('Trident/') >= 0;
2980 var edge = ua.indexOf('Edge/') >= 0;
2981 var firefox = ua.indexOf('Gecko/') >= 0 && ua.indexOf('Firefox/') >= 0;
2982 var windows = platform === 'Win32';
2983 var electron = ua.toLowerCase().indexOf('electron') >= 0;
2984 var macos = platform === 'MacIntel';
2991 (screenWidth === 1024 && screenHeight === 1366) // Pro 12.9
2992 || (screenWidth === 834 && screenHeight === 1194) // Pro 11
2993 || (screenWidth === 834 && screenHeight === 1112) // Pro 10.5
2994 || (screenWidth === 768 && screenHeight === 1024) // other
2997 ipad = ua.match(/(Version)\/([\d.]+)/);
3003 device.firefox = firefox;
3007 device.os = 'windowsPhone';
3008 device.osVersion = windowsPhone[2];
3009 device.windowsPhone = true;
3012 if (android && !windows) {
3013 device.os = 'android';
3014 device.osVersion = android[2];
3015 device.android = true;
3016 device.androidChrome = ua.toLowerCase().indexOf('chrome') >= 0;
3018 if (ipad || iphone || ipod) {
3023 if (iphone && !ipod) {
3024 device.osVersion = iphone[2].replace(/_/g, '.');
3025 device.iphone = true;
3026 device.iphoneX = iphoneX;
3029 device.osVersion = ipad[2].replace(/_/g, '.');
3033 device.osVersion = ipod[3] ? ipod[3].replace(/_/g, '.') : null;
3036 // iOS 8+ changed UA
3037 if (device.ios && device.osVersion && ua.indexOf('Version/') >= 0) {
3038 if (device.osVersion.split('.')[0] === '10') {
3039 device.osVersion = ua.toLowerCase().split('version/')[1].split(' ')[0];
3044 device.webView = !!((iphone || ipad || ipod) && (ua.match(/.*AppleWebKit(?!.*Safari)/i) || win.navigator.standalone))
3045 || (win.matchMedia && win.matchMedia('(display-mode: standalone)').matches);
3046 device.webview = device.webView;
3047 device.standalone = device.webView;
3050 device.desktop = !(device.ios || device.android || device.windowsPhone) || electron;
3051 if (device.desktop) {
3052 device.electron = electron;
3053 device.macos = macos;
3054 device.windows = windows;
3058 var metaStatusbar = doc.querySelector('meta[name="apple
-mobile
-web
-app
-status
-bar
-style
"]');
3060 // Check for status bar and fullscreen app mode
3061 device.needsStatusbarOverlay = function needsStatusbarOverlay() {
3062 if (device.desktop) { return false; }
3063 if (device.standalone && device.ios && metaStatusbar && metaStatusbar.content === 'black-translucent') {
3066 if ((device.webView || (device.android && device.cordova)) && (win.innerWidth * win.innerHeight === win.screen.width * win.screen.height)) {
3067 if (device.iphoneX && (win.orientation === 90 || win.orientation === -90)) {
3074 device.statusbar = device.needsStatusbarOverlay();
3077 device.pixelRatio = win.devicePixelRatio || 1;
3080 var DARK = '(prefers-color-scheme: dark)';
3081 var LIGHT = '(prefers-color-scheme: light)';
3082 device.prefersColorScheme = function prefersColorTheme() {
3084 if (win.matchMedia && win.matchMedia(LIGHT).matches) {
3087 if (win.matchMedia && win.matchMedia(DARK).matches) {
3097 var EventsClass = function EventsClass(parents) {
3098 if ( parents === void 0 ) parents = [];
3101 self.eventsParents = parents;
3102 self.eventsListeners = {};
3105 EventsClass.prototype.on = function on (events, handler, priority) {
3107 if (typeof handler !== 'function') { return self; }
3108 var method = priority ? 'unshift' : 'push';
3109 events.split(' ').forEach(function (event) {
3110 if (!self.eventsListeners[event]) { self.eventsListeners[event] = []; }
3111 self.eventsListeners[event][method](handler);
3116 EventsClass.prototype.once = function once (events, handler, priority) {
3118 if (typeof handler !== 'function') { return self; }
3119 function onceHandler() {
3120 var args = [], len = arguments.length;
3121 while ( len-- ) args[ len ] = arguments[ len ];
3123 handler.apply(self, args);
3124 self.off(events, onceHandler);
3125 if (onceHandler.f7proxy) {
3126 delete onceHandler.f7proxy;
3129 onceHandler.f7proxy = handler;
3130 return self.on(events, onceHandler, priority);
3133 EventsClass.prototype.off = function off (events, handler) {
3135 if (!self.eventsListeners) { return self; }
3136 events.split(' ').forEach(function (event) {
3137 if (typeof handler === 'undefined') {
3138 self.eventsListeners[event] = [];
3139 } else if (self.eventsListeners[event]) {
3140 self.eventsListeners[event].forEach(function (eventHandler, index) {
3141 if (eventHandler === handler || (eventHandler.f7proxy && eventHandler.f7proxy === handler)) {
3142 self.eventsListeners[event].splice(index, 1);
3150 EventsClass.prototype.emit = function emit () {
3151 var args = [], len = arguments.length;
3152 while ( len-- ) args[ len ] = arguments[ len ];
3155 if (!self.eventsListeners) { return self; }
3160 if (typeof args[0] === 'string' || Array.isArray(args[0])) {
3162 data = args.slice(1, args.length);
3164 eventsParents = self.eventsParents;
3166 events = args[0].events;
3167 data = args[0].data;
3168 context = args[0].context || self;
3169 eventsParents = args[0].local ? [] : args[0].parents || self.eventsParents;
3171 var eventsArray = Array.isArray(events) ? events : events.split(' ');
3172 var localEvents = eventsArray.map(function (eventName) { return eventName.replace('local::', ''); });
3173 var parentEvents = eventsArray.filter(function (eventName) { return eventName.indexOf('local::') < 0; });
3175 localEvents.forEach(function (event) {
3176 if (self.eventsListeners && self.eventsListeners[event]) {
3178 self.eventsListeners[event].forEach(function (eventHandler) {
3179 handlers.push(eventHandler);
3181 handlers.forEach(function (eventHandler) {
3182 eventHandler.apply(context, data);
3186 if (eventsParents && eventsParents.length > 0) {
3187 eventsParents.forEach(function (eventsParent) {
3188 eventsParent.emit.apply(eventsParent, [ parentEvents ].concat( data ));
3194 var Framework7Class = /*@__PURE__*/(function (EventsClass) {
3195 function Framework7Class(params, parents) {
3196 if ( params === void 0 ) params = {};
3197 if ( parents === void 0 ) parents = [];
3199 EventsClass.call(this, parents);
3201 self.params = params;
3203 if (self.params && self.params.on) {
3204 Object.keys(self.params.on).forEach(function (eventName) {
3205 self.on(eventName, self.params.on[eventName]);
3210 if ( EventsClass ) Framework7Class.__proto__ = EventsClass;
3211 Framework7Class.prototype = Object.create( EventsClass && EventsClass.prototype );
3212 Framework7Class.prototype.constructor = Framework7Class;
3214 var staticAccessors = { components: { configurable: true } };
3216 // eslint-disable-next-line
3217 Framework7Class.prototype.useModuleParams = function useModuleParams (module, instanceParams) {
3218 if (module.params) {
3219 var originalParams = {};
3220 Object.keys(module.params).forEach(function (paramKey) {
3221 if (typeof instanceParams[paramKey] === 'undefined') { return; }
3222 originalParams[paramKey] = Utils.extend({}, instanceParams[paramKey]);
3224 Utils.extend(instanceParams, module.params);
3225 Object.keys(originalParams).forEach(function (paramKey) {
3226 Utils.extend(instanceParams[paramKey], originalParams[paramKey]);
3231 Framework7Class.prototype.useModulesParams = function useModulesParams (instanceParams) {
3232 var instance = this;
3233 if (!instance.modules) { return; }
3234 Object.keys(instance.modules).forEach(function (moduleName) {
3235 var module = instance.modules[moduleName];
3237 if (module.params) {
3238 Utils.extend(instanceParams, module.params);
3243 Framework7Class.prototype.useModule = function useModule (moduleName, moduleParams) {
3244 if ( moduleName === void 0 ) moduleName = '';
3245 if ( moduleParams === void 0 ) moduleParams = {};
3247 var instance = this;
3248 if (!instance.modules) { return; }
3249 var module = typeof moduleName === 'string' ? instance.modules[moduleName] : moduleName;
3250 if (!module) { return; }
3252 // Extend instance methods and props
3253 if (module.instance) {
3254 Object.keys(module.instance).forEach(function (modulePropName) {
3255 var moduleProp = module.instance[modulePropName];
3256 if (typeof moduleProp === 'function') {
3257 instance[modulePropName] = moduleProp.bind(instance);
3259 instance[modulePropName] = moduleProp;
3263 // Add event listeners
3264 if (module.on && instance.on) {
3265 Object.keys(module.on).forEach(function (moduleEventName) {
3266 instance.on(moduleEventName, module.on[moduleEventName]);
3271 if (!instance.vnodeHooks) { instance.vnodeHooks = {}; }
3272 Object.keys(module.vnode).forEach(function (vnodeId) {
3273 Object.keys(module.vnode[vnodeId]).forEach(function (hookName) {
3274 var handler = module.vnode[vnodeId][hookName];
3275 if (!instance.vnodeHooks[hookName]) { instance.vnodeHooks[hookName] = {}; }
3276 if (!instance.vnodeHooks[hookName][vnodeId]) { instance.vnodeHooks[hookName][vnodeId] = []; }
3277 instance.vnodeHooks[hookName][vnodeId].push(handler.bind(instance));
3281 // Module create callback
3282 if (module.create) {
3283 module.create.bind(instance)(moduleParams);
3287 Framework7Class.prototype.useModules = function useModules (modulesParams) {
3288 if ( modulesParams === void 0 ) modulesParams = {};
3290 var instance = this;
3291 if (!instance.modules) { return; }
3292 Object.keys(instance.modules).forEach(function (moduleName) {
3293 var moduleParams = modulesParams[moduleName] || {};
3294 instance.useModule(moduleName, moduleParams);
3298 staticAccessors.components.set = function (components) {
3300 if (!Class.use) { return; }
3301 Class.use(components);
3304 Framework7Class.installModule = function installModule (module) {
3305 var params = [], len = arguments.length - 1;
3306 while ( len-- > 0 ) params[ len ] = arguments[ len + 1 ];
3309 if (!Class.prototype.modules) { Class.prototype.modules = {}; }
3310 var name = module.name || (((Object.keys(Class.prototype.modules).length) + "_
" + (Utils.now())));
3311 Class.prototype.modules[name] = module;
3314 Object.keys(module.proto).forEach(function (key) {
3315 Class.prototype[key] = module.proto[key];
3319 if (module.static) {
3320 Object.keys(module.static).forEach(function (key) {
3321 Class[key] = module.static[key];
3325 if (module.install) {
3326 module.install.apply(Class, params);
3331 Framework7Class.use = function use (module) {
3332 var params = [], len = arguments.length - 1;
3333 while ( len-- > 0 ) params[ len ] = arguments[ len + 1 ];
3336 if (Array.isArray(module)) {
3337 module.forEach(function (m) { return Class.installModule(m); });
3340 return Class.installModule.apply(Class, [ module ].concat( params ));
3343 Object.defineProperties( Framework7Class, staticAccessors );
3345 return Framework7Class;
3348 function ConstructorMethods (parameters) {
3349 if ( parameters === void 0 ) parameters = {};
3351 var defaultSelector = parameters.defaultSelector;
3352 var constructor = parameters.constructor;
3353 var domProp = parameters.domProp;
3354 var app = parameters.app;
3355 var addMethods = parameters.addMethods;
3357 create: function create() {
3358 var args = [], len = arguments.length;
3359 while ( len-- ) args[ len ] = arguments[ len ];
3361 if (app) { return new (Function.prototype.bind.apply( constructor, [ null ].concat( [app], args) )); }
3362 return new (Function.prototype.bind.apply( constructor, [ null ].concat( args) ));
3364 get: function get(el) {
3365 if ( el === void 0 ) el = defaultSelector;
3367 if (el instanceof constructor) { return el; }
3369 if ($el.length === 0) { return undefined; }
3370 return $el[0][domProp];
3372 destroy: function destroy(el) {
3373 var instance = methods.get(el);
3374 if (instance && instance.destroy) { return instance.destroy(); }
3378 if (addMethods && Array.isArray(addMethods)) {
3379 addMethods.forEach(function (methodName) {
3380 methods[methodName] = function (el) {
3381 if ( el === void 0 ) el = defaultSelector;
3382 var args = [], len = arguments.length - 1;
3383 while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
3385 var instance = methods.get(el);
3386 if (instance && instance[methodName]) { return instance[methodName].apply(instance, args); }
3394 function ModalMethods (parameters) {
3395 if ( parameters === void 0 ) parameters = {};
3397 var defaultSelector = parameters.defaultSelector;
3398 var constructor = parameters.constructor;
3399 var app = parameters.app;
3400 var methods = Utils.extend(
3401 ConstructorMethods({
3402 defaultSelector: defaultSelector,
3403 constructor: constructor,
3408 open: function open(el, animate) {
3410 var instance = $el[0].f7Modal;
3411 if (!instance) { instance = new constructor(app, { el: $el }); }
3412 return instance.open(animate);
3414 close: function close(el, animate) {
3415 if ( el === void 0 ) el = defaultSelector;
3418 if ($el.length === 0) { return undefined; }
3419 var instance = $el[0].f7Modal;
3420 if (!instance) { instance = new constructor(app, { el: $el }); }
3421 return instance.close(animate);
3428 var fetchedModules = [];
3429 function loadModule(moduleToLoad) {
3430 var Framework7 = this;
3431 return new Promise(function (resolve, reject) {
3432 var app = Framework7.instance;
3436 if (!moduleToLoad) {
3437 reject(new Error('Framework7: Lazy module must be specified'));
3441 function install(module) {
3442 Framework7.use(module);
3445 app.useModuleParams(module, app.params);
3446 app.useModule(module);
3450 if (typeof moduleToLoad === 'string') {
3451 var matchNamePattern = moduleToLoad.match(/([a-z0-9-]*)/i);
3452 if (moduleToLoad.indexOf('.') < 0 && matchNamePattern && matchNamePattern[0].length === moduleToLoad.length) {
3453 if (!app || (app && !app.params.lazyModulesPath)) {
3454 reject(new Error('Framework7: "lazyModulesPath
" app parameter must be specified to fetch module by name'));
3457 modulePath = (app.params.lazyModulesPath) + "/" + moduleToLoad + ".js
";
3459 modulePath = moduleToLoad;
3461 } else if (typeof moduleToLoad === 'function') {
3462 moduleFunc = moduleToLoad;
3464 // considering F7-Plugin object
3465 moduleObj = moduleToLoad;
3469 var module = moduleFunc(Framework7, false);
3471 reject(new Error('Framework7: Can\'t find Framework7 component in specified component function'));
3474 // Check if it was added
3475 if (Framework7.prototype.modules && Framework7.prototype.modules[module.name]) {
3485 var module$1 = moduleObj;
3487 reject(new Error('Framework7: Can\'t find Framework7 component in specified component'));
3490 // Check if it was added
3491 if (Framework7.prototype.modules && Framework7.prototype.modules[module$1.name]) {
3501 if (fetchedModules.indexOf(modulePath) >= 0) {
3505 fetchedModules.push(modulePath);
3506 var scriptLoad = new Promise(function (resolveScript, rejectScript) {
3507 Framework7.request.get(
3509 function (scriptContent) {
3510 var id = Utils.id();
3511 var callbackLoadName = "f7_component_loader_callback_
" + id;
3513 var scriptEl = document.createElement('script');
3514 scriptEl.innerHTML = "window
." + callbackLoadName + " = function (Framework7
, Framework7AutoInstallComponent
) {return " + (scriptContent.trim()) + "}";
3515 $('head').append(scriptEl);
3517 var componentLoader = window[callbackLoadName];
3518 delete window[callbackLoadName];
3519 $(scriptEl).remove();
3521 var module = componentLoader(Framework7, false);
3524 rejectScript(new Error(("Framework7
: Can
't find Framework7 component in " + modulePath + " file")));
3528 // Check if it was added
3529 if (Framework7.prototype.modules && Framework7.prototype.modules[module.name]) {
3539 function (xhr, status) {
3540 rejectScript(xhr, status);
3544 var styleLoad = new Promise(function (resolveStyle) {
3545 Framework7.request.get(
3546 modulePath.replace('.js
', app.rtl ? '.rtl
.css
' : '.css
'),
3547 function (styleContent) {
3548 var styleEl = document.createElement('style
');
3549 styleEl.innerHTML = styleContent;
3550 $('head
').append(styleEl);
3560 Promise.all([scriptLoad, styleLoad]).then(function () {
3562 }).catch(function (err) {
3569 var Framework7 = /*@__PURE__*/(function (Framework7Class) {
3570 function Framework7(params) {
3571 Framework7Class.call(this, params);
3572 if (Framework7.instance) {
3573 throw new Error('Framework7 is already initialized and can
\'t be initialized more than once
');
3576 var passedParams = Utils.extend({}, params);
3581 Framework7.instance = app;
3586 id: 'io
.framework7
.testapp
',
3589 language: win.navigator.language,
3592 lazyModulesPath: null,
3593 initOnDeviceReady: true,
3595 autoDarkTheme: false,
3598 // Extend defaults with modules params
3599 app.useModulesParams(defaults);
3601 // Extend defaults with passed params
3602 app.params = Utils.extend(defaults, params);
3604 var $rootEl = $(app.params.root);
3610 name: app.params.name,
3612 version: app.params.version,
3614 routes: app.params.routes,
3616 language: app.params.language,
3620 rtl: $rootEl.css('direction
') === 'rtl
',
3622 theme: (function getTheme() {
3623 if (app.params.theme === 'auto
') {
3624 if (Device.ios) { return 'ios
'; }
3625 if (Device.desktop && Device.electron) { return 'aurora
'; }
3628 return app.params.theme;
3630 // Initially passed parameters
3631 passedParams: passedParams,
3635 if (app.root && app.root[0]) {
3636 app.root[0].f7 = app;
3642 // Init Data & Methods
3646 var DARK = '(prefers
-color
-scheme
: dark
)';
3647 var LIGHT = '(prefers
-color
-scheme
: light
)';
3649 if (win.matchMedia) {
3650 app.mq.dark = win.matchMedia(DARK);
3651 app.mq.light = win.matchMedia(LIGHT);
3653 app.colorSchemeListener = function colorSchemeListener(ref) {
3654 var matches = ref.matches;
3655 var media = ref.media;
3660 var html = doc.querySelector('html
');
3661 if (media === DARK) {
3662 html.classList.add('theme
-dark
');
3663 } else if (media === LIGHT) {
3664 html.classList.remove('theme
-dark
');
3668 if (app.params.init) {
3669 if (Device.cordova && app.params.initOnDeviceReady) {
3670 $(doc).on('deviceready
', function () {
3677 // Return app instance
3681 if ( Framework7Class ) Framework7.__proto__ = Framework7Class;
3682 Framework7.prototype = Object.create( Framework7Class && Framework7Class.prototype );
3683 Framework7.prototype.constructor = Framework7;
3685 var prototypeAccessors = { $: { configurable: true },t7: { configurable: true } };
3686 var staticAccessors = { Dom7: { configurable: true },$: { configurable: true },Template7: { configurable: true },Class: { configurable: true },Events: { configurable: true } };
3688 Framework7.prototype.initData = function initData () {
3693 if (app.params.data && typeof app.params.data === 'function') {
3694 Utils.extend(app.data, app.params.data.bind(app)());
3695 } else if (app.params.data) {
3696 Utils.extend(app.data, app.params.data);
3700 if (app.params.methods) {
3701 Object.keys(app.params.methods).forEach(function (methodName) {
3702 if (typeof app.params.methods[methodName] === 'function') {
3703 app.methods[methodName] = app.params.methods[methodName].bind(app);
3705 app.methods[methodName] = app.params.methods[methodName];
3711 Framework7.prototype.enableAutoDarkTheme = function enableAutoDarkTheme () {
3712 if (!win.matchMedia) { return; }
3714 var html = doc.querySelector('html
');
3715 if (app.mq.dark && app.mq.light) {
3716 app.mq.dark.addListener(app.colorSchemeListener);
3717 app.mq.light.addListener(app.colorSchemeListener);
3719 if (app.mq.dark && app.mq.dark.matches) {
3720 html.classList.add('theme
-dark
');
3721 } else if (app.mq.light && app.mq.light.matches) {
3722 html.classList.remove('theme
-dark
');
3726 Framework7.prototype.disableAutoDarkTheme = function disableAutoDarkTheme () {
3727 if (!win.matchMedia) { return; }
3729 if (app.mq.dark) { app.mq.dark.removeListener(app.colorSchemeListener); }
3730 if (app.mq.light) { app.mq.light.removeListener(app.colorSchemeListener); }
3733 Framework7.prototype.init = function init () {
3735 if (app.initialized) { return app; }
3737 app.root.addClass('framework7
-initializing
');
3741 $('html
').attr('dir
', 'rtl
');
3745 if (app.params.autoDarkTheme) {
3746 app.enableAutoDarkTheme();
3750 app.root.addClass('framework7
-root
');
3753 $('html
').removeClass('ios md
').addClass(app.theme);
3756 Utils.nextFrame(function () {
3757 app.root.removeClass('framework7
-initializing
');
3759 // Emit, init other modules
3760 app.initialized = true;
3766 // eslint-disable-next-line
3767 Framework7.prototype.loadModule = function loadModule () {
3768 var args = [], len = arguments.length;
3769 while ( len-- ) args[ len ] = arguments[ len ];
3771 return Framework7.loadModule.apply(Framework7, args);
3774 // eslint-disable-next-line
3775 Framework7.prototype.loadModules = function loadModules () {
3776 var args = [], len = arguments.length;
3777 while ( len-- ) args[ len ] = arguments[ len ];
3779 return Framework7.loadModules.apply(Framework7, args);
3782 Framework7.prototype.getVnodeHooks = function getVnodeHooks (hook, id) {
3784 if (!app.vnodeHooks || !app.vnodeHooks[hook]) { return []; }
3785 return app.vnodeHooks[hook][id] || [];
3788 // eslint-disable-next-line
3789 prototypeAccessors.$.get = function () {
3792 // eslint-disable-next-line
3793 prototypeAccessors.t7.get = function () {
3797 staticAccessors.Dom7.get = function () {
3801 staticAccessors.$.get = function () {
3805 staticAccessors.Template7.get = function () {
3809 staticAccessors.Class.get = function () {
3810 return Framework7Class;
3813 staticAccessors.Events.get = function () {
3817 Object.defineProperties( Framework7.prototype, prototypeAccessors );
3818 Object.defineProperties( Framework7, staticAccessors );
3821 }(Framework7Class));
3823 Framework7.ModalMethods = ModalMethods;
3824 Framework7.ConstructorMethods = ConstructorMethods;
3826 Framework7.loadModule = loadModule;
3827 Framework7.loadModules = function loadModules(modules) {
3828 return Promise.all(modules.map(function (module) { return Framework7.loadModule(module); }));
3831 var DeviceModule = {
3840 init: function init() {
3841 var classNames = [];
3842 var html = doc.querySelector('html
');
3843 var metaStatusbar = doc.querySelector('meta
[name
="apple-mobile-web-app-status-bar-style"]');
3844 if (!html) { return; }
3845 if (Device.standalone && Device.ios && metaStatusbar && metaStatusbar.content === 'black
-translucent
') {
3846 classNames.push('device
-full
-viewport
');
3850 classNames.push(("device-pixel-ratio-" + (Math.floor(Device.pixelRatio))));
3851 if (Device.pixelRatio >= 2) {
3852 classNames.push('device
-retina
');
3857 ("device-" + (Device.os)),
3858 ("device-" + (Device.os) + "-" + (Device.osVersion.split('.')[0])),
3859 ("device-" + (Device.os) + "-" + (Device.osVersion.replace(/\./g, '-')))
3861 if (Device.os === 'ios
') {
3862 var major = parseInt(Device.osVersion.split('.')[0], 10);
3863 for (var i = major - 1; i >= 6; i -= 1) {
3864 classNames.push(("device-ios-gt-" + i));
3866 if (Device.iphoneX) {
3867 classNames.push('device
-iphone
-x
');
3870 } else if (Device.desktop) {
3871 classNames.push('device
-desktop
');
3872 if (Device.macos) { classNames.push('device
-macos
'); }
3873 else if (Device.windows) { classNames.push('device
-windows
'); }
3875 if (Device.cordova || Device.phonegap) {
3876 classNames.push('device
-cordova
');
3880 classNames.forEach(function (className) {
3881 html.classList.add(className);
3887 var SupportModule = {
3896 init: function init() {
3897 var html = doc.querySelector('html
');
3898 if (!html) { return; }
3899 var classNames = [];
3901 classNames.forEach(function (className) {
3902 html.classList.add(className);
3918 var ResizeModule = {
3921 getSize: function getSize() {
3923 if (!app.root[0]) { return { width: 0, height: 0, left: 0, top: 0 }; }
3924 var offset = app.root.offset();
3925 var ref = [app.root[0].offsetWidth, app.root[0].offsetHeight, offset.left, offset.top];
3927 var height = ref[1];
3931 app.height = height;
3934 return { width: width, height: height, left: left, top: top };
3938 init: function init() {
3945 win.addEventListener('resize
', function () {
3949 // Emit orientationchange
3950 win.addEventListener('orientationchange
', function () {
3951 app.emit('orientationchange
');
3954 orientationchange: function orientationchange() {
3956 // Fix iPad weird body scroll
3957 if (app.device.ipad) {
3958 doc.body.scrollLeft = 0;
3959 setTimeout(function () {
3960 doc.body.scrollLeft = 0;
3964 resize: function resize() {
3972 var jsonpRequests = 0;
3974 function Request(requestOptions) {
3975 var globalsNoCallbacks = Utils.extend({}, globals);
3976 ('beforeCreate beforeOpen beforeSend error complete success statusCode
').split(' ').forEach(function (callbackName) {
3977 delete globalsNoCallbacks[callbackName];
3979 var defaults = Utils.extend({
3980 url: win.location.toString(),
3992 contentType: 'application
/x
-www
-form
-urlencoded
',
3994 }, globalsNoCallbacks);
3996 var options = Utils.extend({}, defaults, requestOptions);
3999 // Function to run XHR callbacks and events
4000 function fireCallback(callbackName) {
4001 var data = [], len = arguments.length - 1;
4002 while ( len-- > 0 ) data[ len ] = arguments[ len + 1 ];
4006 beforeCreate (options),
4007 beforeOpen (xhr, options),
4008 beforeSend (xhr, options),
4009 error (xhr, status),
4010 complete (xhr, stautus),
4011 success (response, status, xhr),
4014 var globalCallbackValue;
4015 var optionCallbackValue;
4016 if (globals[callbackName]) {
4017 globalCallbackValue = globals[callbackName].apply(globals, data);
4019 if (options[callbackName]) {
4020 optionCallbackValue = options[callbackName].apply(options, data);
4022 if (typeof globalCallbackValue !== 'boolean') { globalCallbackValue = true; }
4023 if (typeof optionCallbackValue !== 'boolean') { optionCallbackValue = true; }
4024 return (globalCallbackValue && optionCallbackValue);
4027 // Before create callback
4028 proceedRequest = fireCallback('beforeCreate
', options);
4029 if (proceedRequest === false) { return undefined; }
4032 if (options.type) { options.method = options.type; }
4034 // Parameters Prefix
4035 var paramsPrefix = options.url.indexOf('?') >= 0 ? '&' : '?';
4038 var method = options.method.toUpperCase();
4040 // Data to modify GET URL
4041 if ((method === 'GET
' || method === 'HEAD
' || method === 'OPTIONS
' || method === 'DELETE
') && options.data) {
4043 if (typeof options.data === 'string
') {
4044 // Should be key=value string
4045 if (options.data.indexOf('?') >= 0) { stringData = options.data.split('?')[1]; }
4046 else { stringData = options.data; }
4048 // Should be key=value object
4049 stringData = Utils.serializeObject(options.data);
4051 if (stringData.length) {
4052 options.url += paramsPrefix + stringData;
4053 if (paramsPrefix === '?') { paramsPrefix = '&'; }
4058 if (options.dataType === 'json
' && options.url.indexOf('callback
=') >= 0) {
4059 var callbackName = "f7jsonp_" + (Date.now() + ((jsonpRequests += 1)));
4061 var callbackSplit = options.url.split('callback
=');
4062 var requestUrl = (callbackSplit[0]) + "callback=" + callbackName;
4063 if (callbackSplit[1].indexOf('&') >= 0) {
4064 var addVars = callbackSplit[1].split('&').filter(function (el) { return el.indexOf('=') > 0; }).join('&');
4065 if (addVars.length > 0) { requestUrl += "&" + addVars; }
4069 var script = doc.createElement('script
');
4070 script.type = 'text
/javascript
';
4071 script.onerror = function onerror() {
4072 clearTimeout(abortTimeout);
4073 fireCallback('error
', null, 'scripterror
');
4074 fireCallback('complete
', null, 'scripterror
');
4076 script.src = requestUrl;
4079 win[callbackName] = function jsonpCallback(data) {
4080 clearTimeout(abortTimeout);
4081 fireCallback('success
', data);
4082 script.parentNode.removeChild(script);
4084 delete win[callbackName];
4086 doc.querySelector('head
').appendChild(script);
4088 if (options.timeout > 0) {
4089 abortTimeout = setTimeout(function () {
4090 script.parentNode.removeChild(script);
4092 fireCallback('error
', null, 'timeout
');
4093 }, options.timeout);
4099 // Cache for GET/HEAD requests
4100 if (method === 'GET
' || method === 'HEAD
' || method === 'OPTIONS
' || method === 'DELETE
') {
4101 if (options.cache === false) {
4102 options.url += paramsPrefix + "_nocache" + (Date.now());
4107 var xhr = new XMLHttpRequest();
4110 xhr.requestUrl = options.url;
4111 xhr.requestParameters = options;
4113 // Before open callback
4114 proceedRequest = fireCallback('beforeOpen
', xhr, options);
4115 if (proceedRequest === false) { return xhr; }
4118 xhr.open(method, options.url, options.async, options.user, options.password);
4121 var postData = null;
4123 if ((method === 'POST
' || method === 'PUT
' || method === 'PATCH
') && options.data) {
4124 if (options.processData) {
4125 var postDataInstances = [ArrayBuffer, Blob, Document, FormData];
4127 if (postDataInstances.indexOf(options.data.constructor) >= 0) {
4128 postData = options.data;
4131 var boundary = "---------------------------" + (Date.now().toString(16));
4133 if (options.contentType === 'multipart
/form
-data
') {
4134 xhr.setRequestHeader('Content
-Type
', ("multipart/form-data; boundary=" + boundary));
4136 xhr.setRequestHeader('Content
-Type
', options.contentType);
4139 var data$1 = Utils.serializeObject(options.data);
4140 if (options.contentType === 'multipart
/form
-data
') {
4141 data$1 = data$1.split('&');
4143 for (var i = 0; i < data$1.length; i += 1) {
4144 newData.push(("Content-Disposition: form-data; name=\"" + (data$1[i].split('=')[0]) + "\"\r\n\r\n" + (data$1[i].split('=')[1]) + "\r\n"));
4146 postData = "--" + boundary + "\r\n" + (newData.join(("--" + boundary + "\r\n"))) + "--" + boundary + "--\r\n";
4147 } else if (options.contentType === 'application
/json
') {
4148 postData = JSON.stringify(options.data);
4154 postData = options.data;
4155 xhr.setRequestHeader('Content
-Type
', options.contentType);
4158 if (options.dataType === 'json
' && (!options.headers || !options.headers.Accept)) {
4159 xhr.setRequestHeader('Accept
', 'application
/json
');
4162 // Additional headers
4163 if (options.headers) {
4164 Object.keys(options.headers).forEach(function (headerName) {
4165 xhr.setRequestHeader(headerName, options.headers[headerName]);
4169 // Check for crossDomain
4170 if (typeof options.crossDomain === 'undefined') {
4171 // eslint-disable-next-line
4172 options.crossDomain = /^([\w-]+:)?\/\/([^\/]+)/.test(options.url) && RegExp.$2 !== win.location.host;
4175 if (!options.crossDomain) {
4176 xhr.setRequestHeader('X
-Requested
-With
', 'XMLHttpRequest
');
4179 if (options.xhrFields) {
4180 Utils.extend(xhr, options.xhrFields);
4186 xhr.onload = function onload() {
4187 if (xhrTimeout) { clearTimeout(xhrTimeout); }
4188 if ((xhr.status >= 200 && xhr.status < 300) || xhr.status === 0) {
4190 if (options.dataType === 'json
') {
4193 responseData = JSON.parse(xhr.responseText);
4198 fireCallback('success
', responseData, xhr.status, xhr);
4200 fireCallback('error
', xhr, 'parseerror
');
4203 responseData = xhr.responseType === 'text
' || xhr.responseType === '' ? xhr.responseText : xhr.response;
4204 fireCallback('success
', responseData, xhr.status, xhr);
4207 fireCallback('error
', xhr, xhr.status);
4209 if (options.statusCode) {
4210 if (globals.statusCode && globals.statusCode[xhr.status]) { globals.statusCode[xhr.status](xhr); }
4211 if (options.statusCode[xhr.status]) { options.statusCode[xhr.status](xhr); }
4213 fireCallback('complete
', xhr, xhr.status);
4216 xhr.onerror = function onerror() {
4217 if (xhrTimeout) { clearTimeout(xhrTimeout); }
4218 fireCallback('error
', xhr, xhr.status);
4219 fireCallback('complete
', xhr, 'error
');
4223 if (options.timeout > 0) {
4224 xhr.onabort = function onabort() {
4225 if (xhrTimeout) { clearTimeout(xhrTimeout); }
4227 xhrTimeout = setTimeout(function () {
4229 fireCallback('error
', xhr, 'timeout
');
4230 fireCallback('complete
', xhr, 'timeout
');
4231 }, options.timeout);
4234 // Ajax start callback
4235 proceedRequest = fireCallback('beforeSend
', xhr, options);
4236 if (proceedRequest === false) { return xhr; }
4241 // Return XHR object
4244 function RequestShortcut(method) {
4245 var assign, assign$1;
4247 var args = [], len = arguments.length - 1;
4248 while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
4252 var success = ref[2];
4254 var dataType = ref[4];
4255 if (typeof args[1] === 'function') {
4256 (assign = args, url = assign[0], success = assign[1], error = assign[2], dataType = assign[3]);
4258 (assign$1 = args, url = assign$1[0], data = assign$1[1], success = assign$1[2], error = assign$1[3], dataType = assign$1[4]);
4260 [success, error].forEach(function (callback) {
4261 if (typeof callback === 'string
') {
4262 dataType = callback;
4263 if (callback === success) { success = undefined; }
4264 else { error = undefined; }
4267 dataType = dataType || (method === 'json
' || method === 'postJSON
' ? 'json
' : undefined);
4268 var requestOptions = {
4270 method: method === 'post
' || method === 'postJSON
' ? 'POST
' : 'GET
',
4276 if (method === 'postJSON
') {
4277 Utils.extend(requestOptions, {
4278 contentType: 'application
/json
',
4281 data: typeof data === 'string
' ? data : JSON.stringify(data),
4284 return Request(requestOptions);
4286 function RequestShortcutPromise(method) {
4287 var args = [], len = arguments.length - 1;
4288 while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
4292 var dataType = args[2];
4293 return new Promise(function (resolve, reject) {
4298 function (response) {
4301 function (xhr, status) {
4308 Object.assign(Request, {
4310 var args = [], len = arguments.length;
4311 while ( len-- ) args[ len ] = arguments[ len ];
4313 return RequestShortcut.apply(void 0, [ 'get' ].concat( args ));
4316 var args = [], len = arguments.length;
4317 while ( len-- ) args[ len ] = arguments[ len ];
4319 return RequestShortcut.apply(void 0, [ 'post
' ].concat( args ));
4322 var args = [], len = arguments.length;
4323 while ( len-- ) args[ len ] = arguments[ len ];
4325 return RequestShortcut.apply(void 0, [ 'json
' ].concat( args ));
4327 getJSON: function () {
4328 var args = [], len = arguments.length;
4329 while ( len-- ) args[ len ] = arguments[ len ];
4331 return RequestShortcut.apply(void 0, [ 'json
' ].concat( args ));
4333 postJSON: function () {
4334 var args = [], len = arguments.length;
4335 while ( len-- ) args[ len ] = arguments[ len ];
4337 return RequestShortcut.apply(void 0, [ 'postJSON
' ].concat( args ));
4341 Request.promise = function requestPromise(requestOptions) {
4342 return new Promise(function (resolve, reject) {
4343 Request(Object.assign(requestOptions, {
4344 success: function success(data) {
4347 error: function error(xhr, status) {
4353 Object.assign(Request.promise, {
4355 var args = [], len = arguments.length;
4356 while ( len-- ) args[ len ] = arguments[ len ];
4358 return RequestShortcutPromise.apply(void 0, [ 'get' ].concat( args ));
4361 var args = [], len = arguments.length;
4362 while ( len-- ) args[ len ] = arguments[ len ];
4364 return RequestShortcutPromise.apply(void 0, [ 'post
' ].concat( args ));
4367 var args = [], len = arguments.length;
4368 while ( len-- ) args[ len ] = arguments[ len ];
4370 return RequestShortcutPromise.apply(void 0, [ 'json
' ].concat( args ));
4372 getJSON: function () {
4373 var args = [], len = arguments.length;
4374 while ( len-- ) args[ len ] = arguments[ len ];
4376 return RequestShortcutPromise.apply(void 0, [ 'json
' ].concat( args ));
4378 postJSON: function () {
4379 var args = [], len = arguments.length;
4380 while ( len-- ) args[ len ] = arguments[ len ];
4382 return RequestShortcutPromise.apply(void 0, [ 'postJSON
' ].concat( args ));
4386 Request.setup = function setup(options) {
4387 if (options.type && !options.method) {
4388 Utils.extend(options, { method: options.type });
4390 Utils.extend(globals, options);
4393 /* eslint no-param-reassign: "off" */
4395 var RequestModule = {
4405 function initTouch() {
4407 var params = app.params.touch;
4408 var useRipple = params[((app.theme) + "TouchRipple")];
4410 if (Device.ios && Device.webView) {
4411 // Strange hack required for iOS 8 webview to work on inputs
4412 win.addEventListener('touchstart
', function () {});
4420 var activeSelection;
4428 var activableElement;
4432 var needsFastClickTimeOut;
4438 function findActivableElement(el) {
4440 var parents = target.parents(params.activeStateElements);
4442 if (target.is(params.activeStateElements)) {
4445 if (parents.length > 0) {
4446 activable = activable ? activable.add(parents) : parents;
4448 if (activable && activable.length > 1) {
4449 var newActivable = [];
4450 var preventPropagation;
4451 for (var i = 0; i < activable.length; i += 1) {
4452 if (!preventPropagation) {
4453 newActivable.push(activable[i]);
4454 if (activable.eq(i).hasClass('prevent
-active
-state
-propagation
')
4455 || activable.eq(i).hasClass('no
-active
-state
-propagation
')
4457 preventPropagation = true;
4461 activable = $(newActivable);
4463 return activable || target;
4466 function isInsideScrollableViewLight(el) {
4467 var pageContent = el.parents('.page
-content
');
4468 return pageContent.length > 0;
4470 function isInsideScrollableView(el) {
4471 var pageContent = el.parents('.page
-content
');
4473 if (pageContent.length === 0) {
4477 // This event handler covers the "tap to stop scrolling".
4478 if (pageContent.prop('scrollHandlerSet
') !== 'yes
') {
4479 pageContent.on('scroll
', function () {
4480 clearTimeout(activeTimeout);
4481 clearTimeout(rippleTimeout);
4483 pageContent.prop('scrollHandlerSet
', 'yes
');
4488 function addActive() {
4489 if (!activableElement) { return; }
4490 activableElement.addClass('active
-state
');
4492 function removeActive() {
4493 if (!activableElement) { return; }
4494 activableElement.removeClass('active
-state
');
4495 activableElement = null;
4497 function isFormElement(el) {
4498 var nodes = ('input select textarea label
').split(' ');
4499 if (el.nodeName && nodes.indexOf(el.nodeName.toLowerCase()) >= 0) { return true; }
4502 function androidNeedsBlur(el) {
4503 var noBlur = ('button input textarea select
').split(' ');
4504 if (doc.activeElement && el !== doc.activeElement && doc.activeElement !== doc.body) {
4505 if (noBlur.indexOf(el.nodeName.toLowerCase()) >= 0) {
4512 function targetNeedsFastClick(el) {
4518 Device.osVersion.split('.')[0] > 9
4520 (Device.osVersion.split('.')[0] * 1 === 9 && Device.osVersion.split('.')[1] >= 1)
4527 if (el.nodeName.toLowerCase() === 'input
' && (el.type === 'file
' || el.type === 'range
')) { return false; }
4528 if (el.nodeName.toLowerCase() === 'select
' && Device.android) { return false; }
4529 if ($el.hasClass('no
-fastclick
') || $el.parents('.no
-fastclick
').length > 0) { return false; }
4530 if (params.fastClicksExclude && $el.closest(params.fastClicksExclude).length > 0) { return false; }
4534 function targetNeedsFocus(el) {
4535 if (doc.activeElement === el) {
4538 var tag = el.nodeName.toLowerCase();
4539 var skipInputs = ('button checkbox file image radio submit
').split(' ');
4540 if (el.disabled || el.readOnly) { return false; }
4541 if (tag === 'textarea
') { return true; }
4542 if (tag === 'select
') {
4543 if (Device.android) { return false; }
4546 if (tag === 'input
' && skipInputs.indexOf(el.type) < 0) { return true; }
4549 function targetNeedsPrevent(el) {
4552 if ($el.is('label
') || $el.parents('label
').length > 0) {
4553 if (Device.android) {
4555 } else if (Device.ios && $el.is('input
')) {
4557 } else { prevent = false; }
4563 function findRippleElement(el) {
4564 var rippleElements = params.touchRippleElements;
4566 if ($el.is(rippleElements)) {
4567 if ($el.hasClass('no
-ripple
')) {
4572 if ($el.parents(rippleElements).length > 0) {
4573 var rippleParent = $el.parents(rippleElements).eq(0);
4574 if (rippleParent.hasClass('no
-ripple
')) {
4577 return rippleParent;
4581 function createRipple($el, x, y) {
4582 if (!$el) { return; }
4583 rippleWave = app.touchRipple.create($el, x, y);
4586 function removeRipple() {
4587 if (!rippleWave) { return; }
4588 rippleWave.remove();
4589 rippleWave = undefined;
4590 rippleTarget = undefined;
4592 function rippleTouchStart(el) {
4593 rippleTarget = findRippleElement(el);
4594 if (!rippleTarget || rippleTarget.length === 0) {
4595 rippleTarget = undefined;
4598 var inScrollable = params.fastClicks
4599 ? isInsideScrollableView(rippleTarget)
4600 : isInsideScrollableViewLight(rippleTarget);
4602 if (!inScrollable) {
4604 createRipple(rippleTarget, touchStartX, touchStartY);
4606 clearTimeout(rippleTimeout);
4607 rippleTimeout = setTimeout(function () {
4609 createRipple(rippleTarget, touchStartX, touchStartY);
4613 function rippleTouchMove() {
4614 clearTimeout(rippleTimeout);
4617 function rippleTouchEnd() {
4618 if (!rippleWave && rippleTarget && !isMoved) {
4619 clearTimeout(rippleTimeout);
4620 createRipple(rippleTarget, touchStartX, touchStartY);
4621 setTimeout(removeRipple, 0);
4628 function handleMouseDown(e) {
4629 findActivableElement(e.target).addClass('active
-state
');
4630 if ('which
' in e && e.which === 3) {
4631 setTimeout(function () {
4632 $('.active
-state
').removeClass('active
-state
');
4636 touchStartX = e.pageX;
4637 touchStartY = e.pageY;
4638 rippleTouchStart(e.target, e.pageX, e.pageY);
4641 function handleMouseMove() {
4642 $('.active
-state
').removeClass('active
-state
');
4647 function handleMouseUp() {
4648 $('.active
-state
').removeClass('active
-state
');
4655 function sendClick(e) {
4656 var touch = e.changedTouches[0];
4657 var evt = doc.createEvent('MouseEvents
');
4658 var eventType = 'click
';
4659 if (Device.android && targetElement.nodeName.toLowerCase() === 'select
') {
4660 eventType = 'mousedown
';
4662 evt.initMouseEvent(eventType, true, true, win, 1, touch.screenX, touch.screenY, touch.clientX, touch.clientY, false, false, false, false, 0, null);
4663 evt.forwardedTouchEvent = true;
4665 if (app.device.ios && win.navigator.standalone) {
4666 // Fix the issue happens in iOS home screen apps where the wrong element is selected during a momentum scroll.
4667 // Upon tapping, we give the scrolling time to stop, then we grab the element based where the user tapped.
4668 setTimeout(function () {
4669 targetElement = doc.elementFromPoint(e.changedTouches[0].clientX, e.changedTouches[0].clientY);
4670 if (targetElement) {
4671 targetElement.dispatchEvent(evt);
4675 targetElement.dispatchEvent(evt);
4680 function handleTouchStart(e) {
4684 tapHoldFired = false;
4685 if (e.targetTouches.length > 1) {
4686 if (activableElement) { removeActive(); }
4689 if (e.touches.length > 1 && activableElement) {
4692 if (params.tapHold) {
4693 if (tapHoldTimeout) { clearTimeout(tapHoldTimeout); }
4694 tapHoldTimeout = setTimeout(function () {
4695 if (e && e.touches && e.touches.length > 1) { return; }
4696 tapHoldFired = true;
4698 $(e.target).trigger('taphold
');
4699 }, params.tapHoldDelay);
4701 if (needsFastClickTimeOut) { clearTimeout(needsFastClickTimeOut); }
4702 needsFastClick = targetNeedsFastClick(e.target);
4704 if (!needsFastClick) {
4708 if (Device.ios || (Device.android && 'getSelection
' in win)) {
4709 var selection = win.getSelection();
4711 selection.rangeCount
4712 && selection.focusNode !== doc.body
4713 && (!selection.isCollapsed || doc.activeElement === selection.focusNode)
4715 activeSelection = true;
4719 activeSelection = false;
4721 if (Device.android) {
4722 if (androidNeedsBlur(e.target)) {
4723 doc.activeElement.blur();
4728 targetElement = e.target;
4729 touchStartTime = (new Date()).getTime();
4730 touchStartX = e.targetTouches[0].pageX;
4731 touchStartY = e.targetTouches[0].pageY;
4733 // Detect scroll parent
4735 scrollParent = undefined;
4736 $(targetElement).parents().each(function () {
4737 var parent = this$1;
4738 if (parent.scrollHeight > parent.offsetHeight && !scrollParent) {
4739 scrollParent = parent;
4740 scrollParent.f7ScrollTop = scrollParent.scrollTop;
4744 if ((touchStartTime - lastClickTime) < params.fastClicksDelayBetweenClicks) {
4748 if (params.activeState) {
4749 activableElement = findActivableElement(targetElement);
4750 activeTimeout = setTimeout(addActive, 0);
4753 rippleTouchStart(targetElement);
4757 function handleTouchMove(e) {
4758 if (!trackClick) { return; }
4759 var distance = params.fastClicksDistanceThreshold;
4761 var pageX = e.targetTouches[0].pageX;
4762 var pageY = e.targetTouches[0].pageY;
4763 if (Math.abs(pageX - touchStartX) > distance || Math.abs(pageY - touchStartY) > distance) {
4771 targetElement = null;
4773 if (params.tapHold) {
4774 clearTimeout(tapHoldTimeout);
4776 if (params.activeState) {
4777 clearTimeout(activeTimeout);
4785 function handleTouchEnd(e) {
4786 clearTimeout(activeTimeout);
4787 clearTimeout(tapHoldTimeout);
4789 var touchEndTime = (new Date()).getTime();
4792 if (!activeSelection && needsFastClick) {
4793 if (!(Device.android && !e.cancelable) && e.cancelable) {
4797 if (params.activeState) { removeActive(); }
4804 if (doc.activeElement === e.target) {
4805 if (params.activeState) { removeActive(); }
4812 if (!activeSelection) {
4816 if ((touchEndTime - lastClickTime) < params.fastClicksDelayBetweenClicks) {
4817 setTimeout(removeActive, 0);
4824 lastClickTime = touchEndTime;
4828 if (Device.ios && scrollParent) {
4829 if (scrollParent.scrollTop !== scrollParent.f7ScrollTop) {
4834 // Add active-state here because, in a very fast tap, the timeout didn't
4835 // have the chance to execute. Removing active-state in a timeout gives
4836 // the chance to the animation execute.
4837 if (params
.activeState
) {
4839 setTimeout(removeActive
, 0);
4846 // Trigger focus when required
4847 if (targetNeedsFocus(targetElement
)) {
4848 if (Device
.ios
&& Device
.webView
) {
4849 targetElement
.focus();
4853 targetElement
.focus();
4856 // Blur active elements
4857 if (doc
.activeElement
&& targetElement
!== doc
.activeElement
&& doc
.activeElement
!== doc
.body
&& targetElement
.nodeName
.toLowerCase() !== 'label') {
4858 doc
.activeElement
.blur();
4863 if (params
.tapHoldPreventClicks
&& tapHoldFired
) {
4869 function handleTouchCancel() {
4871 targetElement
= null;
4873 // Remove Active State
4874 clearTimeout(activeTimeout
);
4875 clearTimeout(tapHoldTimeout
);
4876 if (params
.activeState
) {
4886 function handleClick(e
) {
4887 var allowClick
= false;
4889 targetElement
= null;
4893 if ((e
.target
.type
=== 'submit' && e
.detail
=== 0) || e
.target
.type
=== 'file') {
4896 if (!targetElement
) {
4897 if (!isFormElement(e
.target
)) {
4901 if (!needsFastClick
) {
4904 if (doc
.activeElement
=== targetElement
) {
4907 if (e
.forwardedTouchEvent
) {
4910 if (!e
.cancelable
) {
4913 if (params
.tapHold
&& params
.tapHoldPreventClicks
&& tapHoldFired
) {
4917 e
.stopImmediatePropagation();
4918 e
.stopPropagation();
4919 if (targetElement
) {
4920 if (targetNeedsPrevent(targetElement
) || isMoved
) {
4926 targetElement
= null;
4928 needsFastClickTimeOut
= setTimeout(function () {
4929 needsFastClick
= false;
4930 }, (Device
.ios
|| Device
.androidChrome
? 100 : 400));
4932 if (params
.tapHold
) {
4933 tapHoldTimeout
= setTimeout(function () {
4934 tapHoldFired
= false;
4935 }, (Device
.ios
|| Device
.androidChrome
? 100 : 400));
4941 function handleTouchStartLight(e
) {
4943 tapHoldFired
= false;
4944 preventClick
= false;
4945 if (e
.targetTouches
.length
> 1) {
4946 if (activableElement
) { removeActive(); }
4949 if (e
.touches
.length
> 1 && activableElement
) {
4952 if (params
.tapHold
) {
4953 if (tapHoldTimeout
) { clearTimeout(tapHoldTimeout
); }
4954 tapHoldTimeout
= setTimeout(function () {
4955 if (e
&& e
.touches
&& e
.touches
.length
> 1) { return; }
4956 tapHoldFired
= true;
4958 preventClick
= true;
4959 $(e
.target
).trigger('taphold');
4960 }, params
.tapHoldDelay
);
4962 targetElement
= e
.target
;
4963 touchStartX
= e
.targetTouches
[0].pageX
;
4964 touchStartY
= e
.targetTouches
[0].pageY
;
4966 if (params
.activeState
) {
4967 activableElement
= findActivableElement(targetElement
);
4968 if (!isInsideScrollableViewLight(activableElement
)) {
4971 activeTimeout
= setTimeout(addActive
, 80);
4975 rippleTouchStart(targetElement
);
4979 function handleTouchMoveLight(e
) {
4982 if (e
.type
=== 'touchmove') {
4983 touch
= e
.targetTouches
[0];
4984 distance
= params
.touchClicksDistanceThreshold
;
4985 // if (touch && touch.touchType === 'stylus') {
4992 if (distance
&& touch
) {
4993 var pageX
= touch
.pageX
;
4994 var pageY
= touch
.pageY
;
4995 if (Math
.abs(pageX
- touchStartX
) > distance
|| Math
.abs(pageY
- touchStartY
) > distance
) {
5002 preventClick
= true;
5003 if (params
.tapHold
) {
5004 clearTimeout(tapHoldTimeout
);
5006 if (params
.activeState
) {
5007 clearTimeout(activeTimeout
);
5015 function handleTouchEndLight(e
) {
5016 clearTimeout(activeTimeout
);
5017 clearTimeout(tapHoldTimeout
);
5018 if (doc
.activeElement
=== e
.target
) {
5019 if (params
.activeState
) { removeActive(); }
5025 if (params
.activeState
) {
5027 setTimeout(removeActive
, 0);
5032 if ((params
.tapHoldPreventClicks
&& tapHoldFired
) || preventClick
) {
5033 if (e
.cancelable
) { e
.preventDefault(); }
5034 preventClick
= true;
5039 function handleClickLight(e
) {
5040 var localPreventClick
= preventClick
;
5041 if (targetElement
&& e
.target
!== targetElement
) {
5042 localPreventClick
= true;
5044 if (params
.tapHold
&& params
.tapHoldPreventClicks
&& tapHoldFired
) {
5045 localPreventClick
= true;
5047 if (localPreventClick
) {
5048 e
.stopImmediatePropagation();
5049 e
.stopPropagation();
5053 if (params
.tapHold
) {
5054 tapHoldTimeout
= setTimeout(
5056 tapHoldFired
= false;
5058 (Device
.ios
|| Device
.androidChrome
? 100 : 400)
5061 preventClick
= false;
5062 targetElement
= null;
5064 return !localPreventClick
;
5067 function emitAppTouchEvent(name
, e
) {
5073 function appClick(e
) {
5074 emitAppTouchEvent('click', e
);
5076 function appTouchStartActive(e
) {
5077 emitAppTouchEvent('touchstart touchstart:active', e
);
5079 function appTouchMoveActive(e
) {
5080 emitAppTouchEvent('touchmove touchmove:active', e
);
5082 function appTouchEndActive(e
) {
5083 emitAppTouchEvent('touchend touchend:active', e
);
5085 function appTouchStartPassive(e
) {
5086 emitAppTouchEvent('touchstart:passive', e
);
5088 function appTouchMovePassive(e
) {
5089 emitAppTouchEvent('touchmove:passive', e
);
5091 function appTouchEndPassive(e
) {
5092 emitAppTouchEvent('touchend:passive', e
);
5095 var passiveListener
= Support
.passiveListener
? { passive
: true } : false;
5096 var activeListener
= Support
.passiveListener
? { passive
: false } : false;
5098 doc
.addEventListener('click', appClick
, true);
5100 if (Support
.passiveListener
) {
5101 doc
.addEventListener(app
.touchEvents
.start
, appTouchStartActive
, activeListener
);
5102 doc
.addEventListener(app
.touchEvents
.move, appTouchMoveActive
, activeListener
);
5103 doc
.addEventListener(app
.touchEvents
.end
, appTouchEndActive
, activeListener
);
5105 doc
.addEventListener(app
.touchEvents
.start
, appTouchStartPassive
, passiveListener
);
5106 doc
.addEventListener(app
.touchEvents
.move, appTouchMovePassive
, passiveListener
);
5107 doc
.addEventListener(app
.touchEvents
.end
, appTouchEndPassive
, passiveListener
);
5109 doc
.addEventListener(app
.touchEvents
.start
, function (e
) {
5110 appTouchStartActive(e
);
5111 appTouchStartPassive(e
);
5113 doc
.addEventListener(app
.touchEvents
.move, function (e
) {
5114 appTouchMoveActive(e
);
5115 appTouchMovePassive(e
);
5117 doc
.addEventListener(app
.touchEvents
.end
, function (e
) {
5118 appTouchEndActive(e
);
5119 appTouchEndPassive(e
);
5123 if (Support
.touch
) {
5124 if (params
.fastClicks
) {
5125 app
.on('click', handleClick
);
5126 app
.on('touchstart', handleTouchStart
);
5127 app
.on('touchmove', handleTouchMove
);
5128 app
.on('touchend', handleTouchEnd
);
5130 app
.on('click', handleClickLight
);
5131 app
.on('touchstart', handleTouchStartLight
);
5132 app
.on('touchmove', handleTouchMoveLight
);
5133 app
.on('touchend', handleTouchEndLight
);
5136 doc
.addEventListener('touchcancel', handleTouchCancel
, { passive
: true });
5137 } else if (params
.activeState
) {
5138 app
.on('touchstart', handleMouseDown
);
5139 app
.on('touchmove', handleMouseMove
);
5140 app
.on('touchend', handleMouseUp
);
5142 doc
.addEventListener('contextmenu', function (e
) {
5143 if (params
.disableContextMenu
&& (Device
.ios
|| Device
.android
|| Device
.cordova
)) {
5147 if (activableElement
) { removeActive(); }
5159 fastClicksDistanceThreshold
: 10,
5160 fastClicksDelayBetweenClicks
: 50,
5161 fastClicksExclude
: '', // CSS selector
5163 touchClicksDistanceThreshold
: 5,
5165 disableContextMenu
: false,
5169 tapHoldPreventClicks
: true,
5172 activeStateElements
: 'a, button, label, span, .actions-button, .stepper-button, .stepper-button-plus, .stepper-button-minus, .card-expandable, .menu-item, .link, .item-link',
5173 mdTouchRipple
: true,
5174 iosTouchRipple
: false,
5175 auroraTouchRipple
: false,
5176 touchRippleElements
: '.ripple, .link, .item-link, .list-button, .links-list a, .button, button, .input-clear-button, .dialog-button, .tab-link, .item-radio, .item-checkbox, .actions-button, .searchbar-disable-button, .fab a, .checkbox, .radio, .data-table .sortable-cell:not(.input-cell), .notification-close-button, .stepper-button, .stepper-button-minus, .stepper-button-plus, .menu-item-content',
5181 start
: Support
.touch
? 'touchstart' : 'mousedown',
5182 move: Support
.touch
? 'touchmove' : 'mousemove',
5183 end
: Support
.touch
? 'touchend' : 'mouseup',
5192 * Expose `pathToRegexp`.
5194 var pathToRegexp_1
= pathToRegexp
;
5195 var parse_1
= parse
;
5196 var compile_1
= compile
;
5197 var tokensToFunction_1
= tokensToFunction
;
5198 var tokensToRegExp_1
= tokensToRegExp
;
5203 var DEFAULT_DELIMITER
= '/';
5206 * The main path matching regexp utility.
5210 var PATH_REGEXP
= new RegExp([
5211 // Match escaped characters that would otherwise appear in future matches.
5212 // This allows the user to escape special characters that won't transform.
5214 // Match Express-style parameters and un-named parameters with a prefix
5215 // and optional suffixes. Matches appear as:
5217 // ":test(\\d+)?" => ["test", "\d+", undefined, "?"]
5218 // "(\\d+)" => [undefined, undefined, "\d+", undefined]
5219 '(?:\\:(\\w+)(?:\\(((?:\\\\.|[^\\\\()])+)\\))?|\\(((?:\\\\.|[^\\\\()])+)\\))([+*?])?'
5223 * Parse a string for the raw tokens.
5225 * @param {string} str
5226 * @param {Object=} options
5229 function parse (str
, options
) {
5234 var defaultDelimiter
= (options
&& options
.delimiter
) || DEFAULT_DELIMITER
;
5235 var whitelist
= (options
&& options
.whitelist
) || undefined;
5236 var pathEscaped
= false;
5239 while ((res
= PATH_REGEXP
.exec(str
)) !== null) {
5241 var escaped
= res
[1];
5242 var offset
= res
.index
;
5243 path
+= str
.slice(index
, offset
);
5244 index
= offset
+ m
.length
;
5246 // Ignore already escaped sequences.
5255 var capture
= res
[3];
5257 var modifier
= res
[5];
5259 if (!pathEscaped
&& path
.length
) {
5260 var k
= path
.length
- 1;
5262 var matches
= whitelist
? whitelist
.indexOf(c
) > -1 : true;
5266 path
= path
.slice(0, k
);
5270 // Push the current path onto the tokens.
5274 pathEscaped
= false;
5277 var repeat
= modifier
=== '+' || modifier
=== '*';
5278 var optional
= modifier
=== '?' || modifier
=== '*';
5279 var pattern
= capture
|| group
;
5280 var delimiter
= prev
|| defaultDelimiter
;
5283 name
: name
|| key
++,
5285 delimiter
: delimiter
,
5289 ? escapeGroup(pattern
)
5290 : '[^' + escapeString(delimiter
=== defaultDelimiter
? delimiter
: (delimiter
+ defaultDelimiter
)) + ']+?'
5294 // Push any remaining characters.
5295 if (path
|| index
< str
.length
) {
5296 tokens
.push(path
+ str
.substr(index
));
5303 * Compile a string to a template function for the path.
5305 * @param {string} str
5306 * @param {Object=} options
5307 * @return {!function(Object=, Object=)}
5309 function compile (str
, options
) {
5310 return tokensToFunction(parse(str
, options
))
5314 * Expose a method for transforming tokens into the path function.
5316 function tokensToFunction (tokens
) {
5317 // Compile all the tokens into regexps.
5318 var matches
= new Array(tokens
.length
);
5320 // Compile all the patterns before compilation.
5321 for (var i
= 0; i
< tokens
.length
; i
++) {
5322 if (typeof tokens
[i
] === 'object') {
5323 matches
[i
] = new RegExp('^(?:' + tokens
[i
].pattern
+ ')$');
5327 return function (data
, options
) {
5329 var encode
= (options
&& options
.encode
) || encodeURIComponent
;
5331 for (var i
= 0; i
< tokens
.length
; i
++) {
5332 var token
= tokens
[i
];
5334 if (typeof token
=== 'string') {
5339 var value
= data
? data
[token
.name
] : undefined;
5342 if (Array
.isArray(value
)) {
5343 if (!token
.repeat
) {
5344 throw new TypeError('Expected "' + token
.name
+ '" to not repeat, but got array')
5347 if (value
.length
=== 0) {
5348 if (token
.optional
) { continue }
5350 throw new TypeError('Expected "' + token
.name
+ '" to not be empty')
5353 for (var j
= 0; j
< value
.length
; j
++) {
5354 segment
= encode(value
[j
], token
);
5356 if (!matches
[i
].test(segment
)) {
5357 throw new TypeError('Expected all "' + token
.name
+ '" to match "' + token
.pattern
+ '"')
5360 path
+= (j
=== 0 ? token
.prefix
: token
.delimiter
) + segment
;
5366 if (typeof value
=== 'string' || typeof value
=== 'number' || typeof value
=== 'boolean') {
5367 segment
= encode(String(value
), token
);
5369 if (!matches
[i
].test(segment
)) {
5370 throw new TypeError('Expected "' + token
.name
+ '" to match "' + token
.pattern
+ '", but got "' + segment
+ '"')
5373 path
+= token
.prefix
+ segment
;
5377 if (token
.optional
) { continue }
5379 throw new TypeError('Expected "' + token
.name
+ '" to be ' + (token
.repeat
? 'an array' : 'a string'))
5387 * Escape a regular expression string.
5389 * @param {string} str
5392 function escapeString (str
) {
5393 return str
.replace(/([.+*?=^!:${}()[\]|/\\])/g
, '\\$1')
5397 * Escape the capturing group by escaping special characters and meaning.
5399 * @param {string} group
5402 function escapeGroup (group
) {
5403 return group
.replace(/([=!:$/()])/g
, '\\$1')
5407 * Get the flags for a regexp from the options.
5409 * @param {Object} options
5412 function flags (options
) {
5413 return options
&& options
.sensitive
? '' : 'i'
5417 * Pull out keys from a regexp.
5419 * @param {!RegExp} path
5420 * @param {Array=} keys
5423 function regexpToRegexp (path
, keys
) {
5424 if (!keys
) { return path
}
5426 // Use a negative lookahead to match only capturing groups.
5427 var groups
= path
.source
.match(/\((?!\?)/g);
5430 for (var i
= 0; i
< groups
.length
; i
++) {
5446 * Transform an array into a regexp.
5448 * @param {!Array} path
5449 * @param {Array=} keys
5450 * @param {Object=} options
5453 function arrayToRegexp (path
, keys
, options
) {
5456 for (var i
= 0; i
< path
.length
; i
++) {
5457 parts
.push(pathToRegexp(path
[i
], keys
, options
).source
);
5460 return new RegExp('(?:' + parts
.join('|') + ')', flags(options
))
5464 * Create a path regexp from string input.
5466 * @param {string} path
5467 * @param {Array=} keys
5468 * @param {Object=} options
5471 function stringToRegexp (path
, keys
, options
) {
5472 return tokensToRegExp(parse(path
, options
), keys
, options
)
5476 * Expose a function for taking tokens and returning a RegExp.
5478 * @param {!Array} tokens
5479 * @param {Array=} keys
5480 * @param {Object=} options
5483 function tokensToRegExp (tokens
, keys
, options
) {
5484 options
= options
|| {};
5486 var strict
= options
.strict
;
5487 var start
= options
.start
!== false;
5488 var end
= options
.end
!== false;
5489 var delimiter
= options
.delimiter
|| DEFAULT_DELIMITER
;
5490 var endsWith
= [].concat(options
.endsWith
|| []).map(escapeString
).concat('$').join('|');
5491 var route
= start
? '^' : '';
5493 // Iterate over the tokens and create our regexp string.
5494 for (var i
= 0; i
< tokens
.length
; i
++) {
5495 var token
= tokens
[i
];
5497 if (typeof token
=== 'string') {
5498 route
+= escapeString(token
);
5500 var capture
= token
.repeat
5501 ? '(?:' + token
.pattern
+ ')(?:' + escapeString(token
.delimiter
) + '(?:' + token
.pattern
+ '))*'
5504 if (keys
) { keys
.push(token
); }
5506 if (token
.optional
) {
5507 if (!token
.prefix
) {
5508 route
+= '(' + capture
+ ')?';
5510 route
+= '(?:' + escapeString(token
.prefix
) + '(' + capture
+ '))?';
5513 route
+= escapeString(token
.prefix
) + '(' + capture
+ ')';
5519 if (!strict
) { route
+= '(?:' + escapeString(delimiter
) + ')?'; }
5521 route
+= endsWith
=== '$' ? '$' : '(?=' + endsWith
+ ')';
5523 var endToken
= tokens
[tokens
.length
- 1];
5524 var isEndDelimited
= typeof endToken
=== 'string'
5525 ? endToken
[endToken
.length
- 1] === delimiter
5526 : endToken
=== undefined;
5528 if (!strict
) { route
+= '(?:' + escapeString(delimiter
) + '(?=' + endsWith
+ '))?'; }
5529 if (!isEndDelimited
) { route
+= '(?=' + escapeString(delimiter
) + '|' + endsWith
+ ')'; }
5532 return new RegExp(route
, flags(options
))
5536 * Normalize the given path string, returning a regular expression.
5538 * An empty array can be passed in for the keys, which will hold the
5539 * placeholder key descriptions. For example, using `/user/:id`, `keys` will
5540 * contain `[{ name: 'id', delimiter: '/', optional: false, repeat: false }]`.
5542 * @param {(string|RegExp|Array)} path
5543 * @param {Array=} keys
5544 * @param {Object=} options
5547 function pathToRegexp (path
, keys
, options
) {
5548 if (path
instanceof RegExp
) {
5549 return regexpToRegexp(path
, keys
)
5552 if (Array
.isArray(path
)) {
5553 return arrayToRegexp(/** @type {!Array} */ (path
), keys
, options
)
5556 return stringToRegexp(/** @type {string} */ (path
), keys
, options
)
5558 pathToRegexp_1
.parse
= parse_1
;
5559 pathToRegexp_1
.compile
= compile_1
;
5560 pathToRegexp_1
.tokensToFunction
= tokensToFunction_1
;
5561 pathToRegexp_1
.tokensToRegExp
= tokensToRegExp_1
;
5565 clearQueue
: function clearQueue() {
5566 if (History
.queue
.length
=== 0) { return; }
5567 var currentQueue
= History
.queue
.shift();
5571 clearRouterQueue
: function clearRouterQueue() {
5572 if (History
.routerQueue
.length
=== 0) { return; }
5573 var currentQueue
= History
.routerQueue
.pop();
5574 var router
= currentQueue
.router
;
5575 var stateUrl
= currentQueue
.stateUrl
;
5576 var action
= currentQueue
.action
;
5578 var animate
= router
.params
.animate
;
5579 if (router
.params
.pushStateAnimate
=== false) { animate
= false; }
5581 if (action
=== 'back') {
5582 router
.back({ animate
: animate
, pushState
: false });
5584 if (action
=== 'load') {
5585 router
.navigate(stateUrl
, { animate
: animate
, pushState
: false });
5588 handle
: function handle(e
) {
5589 if (History
.blockPopstate
) { return; }
5591 // const mainView = app.views.main;
5592 var state
= e
.state
;
5593 History
.previousState
= History
.state
;
5594 History
.state
= state
;
5596 History
.allowChange
= true;
5597 History
.clearQueue();
5599 state
= History
.state
;
5600 if (!state
) { state
= {}; }
5602 app
.views
.forEach(function (view
) {
5603 var router
= view
.router
;
5604 var viewState
= state
[view
.id
];
5605 if (!viewState
&& view
.params
.pushState
) {
5607 url
: view
.router
.history
[0],
5610 if (!viewState
) { return; }
5611 var stateUrl
= viewState
.url
|| undefined;
5613 var animate
= router
.params
.animate
;
5614 if (router
.params
.pushStateAnimate
=== false) { animate
= false; }
5616 if (stateUrl
!== router
.url
) {
5617 if (router
.history
.indexOf(stateUrl
) >= 0) {
5619 if (router
.allowPageChange
) {
5620 router
.back({ animate
: animate
, pushState
: false });
5622 History
.routerQueue
.push({
5627 } else if (router
.allowPageChange
) {
5629 router
.navigate(stateUrl
, { animate
: animate
, pushState
: false });
5631 History
.routerQueue
.unshift({
5640 initViewState
: function initViewState(viewId
, viewState
) {
5643 var newState
= Utils
.extend({}, (History
.state
|| {}), ( obj
= {}, obj
[viewId
] = viewState
, obj
));
5644 History
.state
= newState
;
5645 win
.history
.replaceState(newState
, '');
5647 push
: function push(viewId
, viewState
, url
) {
5650 if (!History
.allowChange
) {
5651 History
.queue
.push(function () {
5652 History
.push(viewId
, viewState
, url
);
5656 History
.previousState
= History
.state
;
5657 var newState
= Utils
.extend({}, (History
.previousState
|| {}), ( obj
= {}, obj
[viewId
] = viewState
, obj
));
5658 History
.state
= newState
;
5659 win
.history
.pushState(newState
, '', url
);
5661 replace
: function replace(viewId
, viewState
, url
) {
5664 if (!History
.allowChange
) {
5665 History
.queue
.push(function () {
5666 History
.replace(viewId
, viewState
, url
);
5670 History
.previousState
= History
.state
;
5671 var newState
= Utils
.extend({}, (History
.previousState
|| {}), ( obj
= {}, obj
[viewId
] = viewState
, obj
));
5672 History
.state
= newState
;
5673 win
.history
.replaceState(newState
, '', url
);
5675 go
: function go(index
) {
5676 History
.allowChange
= false;
5677 win
.history
.go(index
);
5679 back
: function back() {
5680 History
.allowChange
= false;
5685 state
: win
.history
.state
,
5686 blockPopstate
: true,
5687 init
: function init(app
) {
5688 $(win
).on('load', function () {
5689 setTimeout(function () {
5690 History
.blockPopstate
= false;
5694 if (doc
.readyState
&& doc
.readyState
=== 'complete') {
5695 History
.blockPopstate
= false;
5698 $(win
).on('popstate', History
.handle
.bind(app
));
5702 function SwipeBack(r
) {
5704 var $el
= router
.$el
;
5705 var $navbarEl
= router
.$navbarEl
;
5706 var app
= router
.app
;
5707 var params
= router
.params
;
5708 var isTouched
= false;
5709 var isMoved
= false;
5710 var touchesStart
= {};
5712 var $currentPageEl
= [];
5713 var $previousPageEl
= [];
5714 var viewContainerWidth
;
5716 var allowViewTouchMove
= true;
5718 var $currentNavbarInnerEl
= [];
5719 var $previousNavbarInnerEl
= [];
5725 var animatableNavEls
;
5727 var paramsSwipeBackAnimateShadow
= params
[((app
.theme
) + "SwipeBackAnimateShadow")];
5728 var paramsSwipeBackAnimateOpacity
= params
[((app
.theme
) + "SwipeBackAnimateOpacity")];
5729 var paramsSwipeBackActiveArea
= params
[((app
.theme
) + "SwipeBackActiveArea")];
5730 var paramsSwipeBackThreshold
= params
[((app
.theme
) + "SwipeBackThreshold")];
5732 var transformOrigin
= app
.rtl
? 'right center' : 'left center';
5734 function animatableNavElements() {
5736 var inverter
= app
.rtl
? -1 : 1;
5737 var currentNavIsLarge
= $currentNavbarInnerEl
.hasClass('navbar-inner-large');
5738 var previousNavIsLarge
= $previousNavbarInnerEl
.hasClass('navbar-inner-large');
5739 var fromLarge
= currentNavIsLarge
&& !$currentNavbarInnerEl
.hasClass('navbar-inner-large-collapsed');
5740 var toLarge
= previousNavIsLarge
&& !$previousNavbarInnerEl
.hasClass('navbar-inner-large-collapsed');
5741 var $currentNavElements
= $currentNavbarInnerEl
.children('.left, .title, .right, .subnavbar, .fading, .title-large');
5742 var $previousNavElements
= $previousNavbarInnerEl
.children('.left, .title, .right, .subnavbar, .fading, .title-large');
5743 var activeNavBackIconText
;
5744 var previousNavBackIconText
;
5746 if (params
.iosAnimateNavbarBackIcon
) {
5747 if ($currentNavbarInnerEl
.hasClass('sliding')) {
5748 activeNavBackIconText
= $currentNavbarInnerEl
.children('.left').find('.back .icon + span').eq(0);
5750 activeNavBackIconText
= $currentNavbarInnerEl
.children('.left.sliding').find('.back .icon + span').eq(0);
5752 if ($previousNavbarInnerEl
.hasClass('sliding')) {
5753 previousNavBackIconText
= $previousNavbarInnerEl
.children('.left').find('.back .icon + span').eq(0);
5755 previousNavBackIconText
= $previousNavbarInnerEl
.children('.left.sliding').find('.back .icon + span').eq(0);
5757 if (activeNavBackIconText
.length
) {
5758 $previousNavElements
.each(function (index
, el
) {
5759 if (!$(el
).hasClass('title')) { return; }
5760 el
.f7NavbarLeftOffset
+= activeNavBackIconText
.prev('.icon')[0].offsetWidth
;
5765 .each(function (index
, navEl
) {
5766 var $navEl
= $(navEl
);
5767 var isSubnavbar
= $navEl
.hasClass('subnavbar');
5768 var isLeft
= $navEl
.hasClass('left');
5769 var isTitle
= $navEl
.hasClass('title');
5770 if (!fromLarge
&& $navEl
.hasClass('.title-large')) { return; }
5775 if (isTitle
) { return; }
5776 if ($navEl
.hasClass('title-large')) {
5777 if (!separateNavbar
) { return; }
5779 if (els
.indexOf(el
) < 0) { els
.push(el
); }
5780 el
.overflow
= 'visible';
5781 el
.transform
= 'translateX(100%)';
5782 $navEl
.find('.title-large-text, .title-large-inner').each(function (subIndex
, subNavEl
) {
5785 transform: function (progress
) { return ("translateX(" + (-100 + progress
* 100 * inverter
) + "%)"); },
5789 if (els
.indexOf(el
) < 0) { els
.push(el
); }
5790 el
.overflow
= 'hidden';
5791 el
.transform = function (progress
) { return ("translateY(calc(" + (-progress
) + " * var(--f7-navbar-large-title-height)))"); };
5792 $navEl
.find('.title-large-text, .title-large-inner').each(function (subIndex
, subNavEl
) {
5795 transform: function (progress
) { return ("translateX(" + (progress
* 100 * inverter
) + "%) translateY(calc(" + progress
+ " * var(--f7-navbar-large-title-height)))"); },
5804 if ($navEl
.hasClass('title-large')) {
5805 if (!separateNavbar
) { return; }
5806 if (els
.indexOf(el
) < 0) { els
.push(el
); }
5810 if (isLeft
&& separateNavbar
) {
5811 if (els
.indexOf(el
) < 0) { els
.push(el
); }
5812 el
.opacity = function (progress
) { return (1 - (Math
.pow( progress
, 0.33 ))); };
5813 $navEl
.find('.back span').each(function (subIndex
, subNavEl
) {
5816 'transform-origin': transformOrigin
,
5817 transform: function (progress
) { return ("translateY(calc(var(--f7-navbar-height) * " + progress
+ ")) scale(" + (1 + (1 * progress
)) + ")"); },
5823 if ($navEl
.hasClass('title-large')) { return; }
5824 var isSliding
= $navEl
.hasClass('sliding') || $currentNavbarInnerEl
.hasClass('sliding');
5825 if (els
.indexOf(el
) < 0) { els
.push(el
); }
5826 if (!isSubnavbar
|| (isSubnavbar
&& !isSliding
)) {
5827 el
.opacity = function (progress
) { return (1 - (Math
.pow( progress
, 0.33 ))); };
5830 var transformTarget
= el
;
5831 if (isLeft
&& activeNavBackIconText
.length
&& params
.iosAnimateNavbarBackIcon
) {
5832 var textEl
= { el
: activeNavBackIconText
[0] };
5833 transformTarget
= textEl
;
5836 transformTarget
.transform = function (progress
) {
5837 var activeNavTranslate
= progress
* transformTarget
.el
.f7NavbarRightOffset
;
5838 if (Device
.pixelRatio
=== 1) { activeNavTranslate
= Math
.round(activeNavTranslate
); }
5839 if (isSubnavbar
&& currentNavIsLarge
&& separateNavbar
) {
5840 return ("translate3d(" + activeNavTranslate
+ "px, calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0)");
5842 return ("translate3d(" + activeNavTranslate
+ "px,0,0)");
5846 $previousNavElements
5847 .each(function (index
, navEl
) {
5848 var $navEl
= $(navEl
);
5849 var isSubnavbar
= $navEl
.hasClass('subnavbar');
5850 var isLeft
= $navEl
.hasClass('left');
5851 var isTitle
= $navEl
.hasClass('title');
5856 if (isTitle
) { return; }
5857 if (els
.indexOf(el
) < 0) { els
.push(el
); }
5859 if ($navEl
.hasClass('title-large')) {
5860 if (!separateNavbar
) { return; }
5863 el
.overflow
= 'visible';
5864 el
.transform
= 'translateY(0)';
5865 $navEl
.find('.title-large-text').each(function (subIndex
, subNavEl
) {
5868 'transform-origin': transformOrigin
,
5869 opacity: function (progress
) { return (Math
.pow( progress
, 3 )); },
5870 transform: function (progress
) { return ("translateY(calc(" + (-1 + progress
* 1) + " * var(--f7-navbar-large-title-height))) scale(" + (0.5 + progress
* 0.5) + ")"); },
5874 el
.transform = function (progress
) { return ("translateY(calc(" + (progress
- 1) + " * var(--f7-navbar-large-title-height)))"); };
5876 el
.overflow
= 'hidden';
5877 $navEl
.find('.title-large-text').each(function (subIndex
, subNavEl
) {
5880 'transform-origin': transformOrigin
,
5881 opacity: function (progress
) { return (Math
.pow( progress
, 3 )); },
5882 transform: function (progress
) { return ("scale(" + (0.5 + progress
* 0.5) + ")"); },
5886 $navEl
.find('.title-large-inner').each(function (subIndex
, subNavEl
) {
5889 'transform-origin': transformOrigin
,
5890 opacity: function (progress
) { return (Math
.pow( progress
, 3 )); },
5891 transform: function (progress
) { return ("translateX(" + (-100 * (1 - progress
) * inverter
) + "%)"); },
5897 if ($navEl
.hasClass('title-large')) { return; }
5898 var isSliding
= $navEl
.hasClass('sliding') || $previousNavbarInnerEl
.hasClass('sliding');
5899 if (els
.indexOf(el
) < 0) { els
.push(el
); }
5900 if (!isSubnavbar
|| (isSubnavbar
&& !isSliding
)) {
5901 el
.opacity = function (progress
) { return (Math
.pow( progress
, 3 )); };
5904 var transformTarget
= el
;
5905 if (isLeft
&& previousNavBackIconText
.length
&& params
.iosAnimateNavbarBackIcon
) {
5906 var textEl
= { el
: previousNavBackIconText
[0] };
5907 transformTarget
= textEl
;
5910 transformTarget
.transform = function (progress
) {
5911 var previousNavTranslate
= transformTarget
.el
.f7NavbarLeftOffset
* (1 - progress
);
5912 if (Device
.pixelRatio
=== 1) { previousNavTranslate
= Math
.round(previousNavTranslate
); }
5913 if (isSubnavbar
&& previousNavIsLarge
&& separateNavbar
) {
5914 return ("translate3d(" + previousNavTranslate
+ "px, calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0)");
5916 return ("translate3d(" + previousNavTranslate
+ "px,0,0)");
5923 function setAnimatableNavElements(ref
) {
5924 if ( ref
=== void 0 ) ref
= {};
5925 var progress
= ref
.progress
;
5926 var reset
= ref
.reset
;
5927 var transition
= ref
.transition
;
5929 var styles
= ['overflow', 'transform', 'transform-origin', 'opacity'];
5930 for (var i
= 0; i
< animatableNavEls
.length
; i
+= 1) {
5931 var el
= animatableNavEls
[i
];
5933 if (transition
=== true) { el
.el
.classList
.add('navbar-page-transitioning'); }
5934 if (transition
=== false) { el
.el
.classList
.remove('navbar-page-transitioning'); }
5935 for (var j
= 0; j
< styles
.length
; j
+= 1) {
5936 var styleProp
= styles
[j
];
5937 if (el
[styleProp
]) {
5939 el
.el
.style
[styleProp
] = '';
5940 } else if (typeof el
[styleProp
] === 'function') {
5941 el
.el
.style
[styleProp
] = el
[styleProp
](progress
);
5943 el
.el
.style
[styleProp
] = el
[styleProp
];
5951 function handleTouchStart(e
) {
5952 var swipeBackEnabled
= params
[((app
.theme
) + "SwipeBack")];
5953 if (!allowViewTouchMove
|| !swipeBackEnabled
|| isTouched
|| (app
.swipeout
&& app
.swipeout
.el
) || !router
.allowPageChange
) { return; }
5954 if ($(e
.target
).closest('.range-slider, .calendar-months').length
> 0) { return; }
5955 if ($(e
.target
).closest('.page-master, .page-master-detail').length
> 0 && params
.masterDetailBreakpoint
> 0 && app
.width
>= params
.masterDetailBreakpoint
) { return; }
5958 isScrolling
= undefined;
5959 touchesStart
.x
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageX
: e
.pageX
;
5960 touchesStart
.y
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageY
: e
.pageY
;
5961 touchStartTime
= Utils
.now();
5962 dynamicNavbar
= router
.dynamicNavbar
;
5963 separateNavbar
= router
.separateNavbar
;
5965 function handleTouchMove(e
) {
5966 if (!isTouched
) { return; }
5967 var pageX
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageX
: e
.pageX
;
5968 var pageY
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageY
: e
.pageY
;
5969 if (typeof isScrolling
=== 'undefined') {
5970 isScrolling
= !!(isScrolling
|| Math
.abs(pageY
- touchesStart
.y
) > Math
.abs(pageX
- touchesStart
.x
)) || (pageX
< touchesStart
.x
&& !app
.rtl
) || (pageX
> touchesStart
.x
&& app
.rtl
);
5972 if (isScrolling
|| e
.f7PreventSwipeBack
|| app
.preventSwipeBack
) {
5977 // Calc values during first move fired
5979 var target
= $(e
.target
);
5981 var swipeout
= target
.closest('.swipeout');
5982 if (swipeout
.length
> 0) {
5983 if (!app
.rtl
&& swipeout
.find('.swipeout-actions-left').length
> 0) { cancel
= true; }
5984 if (app
.rtl
&& swipeout
.find('.swipeout-actions-right').length
> 0) { cancel
= true; }
5987 $currentPageEl
= target
.closest('.page');
5988 if ($currentPageEl
.hasClass('no-swipeback') || target
.closest('.no-swipeback, .card-opened').length
> 0) { cancel
= true; }
5989 $previousPageEl
= $el
.find('.page-previous:not(.stacked)');
5990 if ($previousPageEl
.length
> 1) {
5991 $previousPageEl
= $previousPageEl
.eq($previousPageEl
.length
- 1);
5993 var notFromBorder
= touchesStart
.x
- $el
.offset().left
> paramsSwipeBackActiveArea
;
5994 viewContainerWidth
= $el
.width();
5996 notFromBorder
= touchesStart
.x
< ($el
.offset().left
- $el
[0].scrollLeft
) + (viewContainerWidth
- paramsSwipeBackActiveArea
);
5998 notFromBorder
= touchesStart
.x
- $el
.offset().left
> paramsSwipeBackActiveArea
;
6000 if (notFromBorder
) { cancel
= true; }
6001 if ($previousPageEl
.length
=== 0 || $currentPageEl
.length
=== 0) { cancel
= true; }
6007 if (paramsSwipeBackAnimateShadow
) {
6008 $pageShadowEl
= $currentPageEl
.find('.page-shadow-effect');
6009 if ($pageShadowEl
.length
=== 0) {
6010 $pageShadowEl
= $('<div class="page-shadow-effect"></div>');
6011 $currentPageEl
.append($pageShadowEl
);
6014 if (paramsSwipeBackAnimateOpacity
) {
6015 $pageOpacityEl
= $previousPageEl
.find('.page-opacity-effect');
6016 if ($pageOpacityEl
.length
=== 0) {
6017 $pageOpacityEl
= $('<div class="page-opacity-effect"></div>');
6018 $previousPageEl
.append($pageOpacityEl
);
6022 if (dynamicNavbar
) {
6023 if (separateNavbar
) {
6024 $currentNavbarInnerEl
= $navbarEl
.find('.navbar-current:not(.stacked)');
6025 $previousNavbarInnerEl
= $navbarEl
.find('.navbar-previous:not(.stacked)');
6027 $currentNavbarInnerEl
= $currentPageEl
.children('.navbar').children('.navbar-inner');
6028 $previousNavbarInnerEl
= $previousPageEl
.children('.navbar').children('.navbar-inner');
6030 if ($previousNavbarInnerEl
.length
> 1) {
6031 $previousNavbarInnerEl
= $previousNavbarInnerEl
.eq($previousNavbarInnerEl
.length
- 1);
6034 animatableNavEls
= animatableNavElements();
6037 // Close/Hide Any Picker
6038 if ($('.sheet.modal-in').length
> 0 && app
.sheet
) {
6039 app
.sheet
.close($('.sheet.modal-in'));
6042 e
.f7PreventPanelSwipe
= true;
6044 app
.preventSwipePanelBySwipeBack
= true;
6048 var inverter
= app
.rtl
? -1 : 1;
6051 touchesDiff
= (pageX
- touchesStart
.x
- paramsSwipeBackThreshold
) * inverter
;
6052 if (touchesDiff
< 0) { touchesDiff
= 0; }
6053 var percentage
= Math
.min(Math
.max(touchesDiff
/ viewContainerWidth
, 0), 1);
6055 // Swipe Back Callback
6056 var callbackData
= {
6057 percentage
: percentage
,
6058 progress
: percentage
,
6059 currentPageEl
: $currentPageEl
[0],
6060 previousPageEl
: $previousPageEl
[0],
6061 currentNavbarEl
: $currentNavbarInnerEl
[0],
6062 previousNavbarEl
: $previousNavbarInnerEl
[0],
6064 $el
.trigger('swipeback:move', callbackData
);
6065 router
.emit('swipebackMove', callbackData
);
6068 var currentPageTranslate
= touchesDiff
* inverter
;
6069 var previousPageTranslate
= ((touchesDiff
/ 5) - (viewContainerWidth
/ 5)) * inverter
;
6071 currentPageTranslate
= Math
.min(currentPageTranslate
, viewContainerWidth
);
6072 previousPageTranslate
= Math
.min(previousPageTranslate
, 0);
6074 currentPageTranslate
= Math
.max(currentPageTranslate
, -viewContainerWidth
);
6075 previousPageTranslate
= Math
.max(previousPageTranslate
, 0);
6077 if (Device
.pixelRatio
=== 1) {
6078 currentPageTranslate
= Math
.round(currentPageTranslate
);
6079 previousPageTranslate
= Math
.round(previousPageTranslate
);
6082 router
.swipeBackActive
= true;
6083 $([$currentPageEl
[0], $previousPageEl
[0]]).addClass('page-swipeback-active');
6085 $currentPageEl
.transform(("translate3d(" + currentPageTranslate
+ "px,0,0)"));
6086 if (paramsSwipeBackAnimateShadow
) { $pageShadowEl
[0].style
.opacity
= 1 - (1 * percentage
); }
6088 if (app
.theme
=== 'ios') {
6089 $previousPageEl
.transform(("translate3d(" + previousPageTranslate
+ "px,0,0)"));
6091 if (paramsSwipeBackAnimateOpacity
) { $pageShadowEl
[0].style
.opacity
= 1 - (1 * percentage
); }
6093 // Dynamic Navbars Animation
6094 if (!dynamicNavbar
) { return; }
6096 setAnimatableNavElements({ progress
: percentage
});
6098 function handleTouchEnd() {
6099 app
.preventSwipePanelBySwipeBack
= false;
6100 if (!isTouched
|| !isMoved
) {
6107 router
.swipeBackActive
= false;
6108 $([$currentPageEl
[0], $previousPageEl
[0]]).removeClass('page-swipeback-active');
6109 if (touchesDiff
=== 0) {
6110 $([$currentPageEl
[0], $previousPageEl
[0]]).transform('');
6111 if ($pageShadowEl
&& $pageShadowEl
.length
> 0) { $pageShadowEl
.remove(); }
6112 if ($pageOpacityEl
&& $pageOpacityEl
.length
> 0) { $pageOpacityEl
.remove(); }
6113 if (dynamicNavbar
) {
6114 setAnimatableNavElements({ reset
: true });
6118 var timeDiff
= Utils
.now() - touchStartTime
;
6119 var pageChanged
= false;
6120 // Swipe back to previous page
6122 (timeDiff
< 300 && touchesDiff
> 10)
6123 || (timeDiff
>= 300 && touchesDiff
> viewContainerWidth
/ 2)
6125 $currentPageEl
.removeClass('page-current').addClass(("page-next" + (app
.theme
!== 'ios' ? ' page-next-on-right' : '')));
6126 $previousPageEl
.removeClass('page-previous').addClass('page-current').removeAttr('aria-hidden');
6127 if ($pageShadowEl
) { $pageShadowEl
[0].style
.opacity
= ''; }
6128 if ($pageOpacityEl
) { $pageOpacityEl
[0].style
.opacity
= ''; }
6129 if (dynamicNavbar
) {
6130 $currentNavbarInnerEl
.removeClass('navbar-current').addClass('navbar-next');
6131 $previousNavbarInnerEl
.removeClass('navbar-previous').addClass('navbar-current').removeAttr('aria-hidden');
6135 // Reset custom styles
6136 // Add transitioning class for transition-duration
6137 $([$currentPageEl
[0], $previousPageEl
[0]]).addClass('page-transitioning page-transitioning-swipeback').transform('');
6139 if (dynamicNavbar
) {
6140 setAnimatableNavElements({ progress
: pageChanged
? 1 : 0, transition
: true });
6142 allowViewTouchMove
= false;
6143 router
.allowPageChange
= false;
6145 // Swipe Back Callback
6146 var callbackData
= {
6147 currentPageEl
: $currentPageEl
[0],
6148 previousPageEl
: $previousPageEl
[0],
6149 currentNavbarEl
: $currentNavbarInnerEl
[0],
6150 previousNavbarEl
: $previousNavbarInnerEl
[0],
6155 router
.currentRoute
= $previousPageEl
[0].f7Page
.route
;
6156 router
.currentPage
= $previousPageEl
[0];
6158 // Page before animation callback
6159 router
.pageCallback('beforeOut', $currentPageEl
, $currentNavbarInnerEl
, 'current', 'next', { route
: $currentPageEl
[0].f7Page
.route
, swipeBack
: true });
6160 router
.pageCallback('beforeIn', $previousPageEl
, $previousNavbarInnerEl
, 'previous', 'current', { route
: $previousPageEl
[0].f7Page
.route
, swipeBack
: true }, $currentPageEl
[0]);
6162 $el
.trigger('swipeback:beforechange', callbackData
);
6163 router
.emit('swipebackBeforeChange', callbackData
);
6165 $el
.trigger('swipeback:beforereset', callbackData
);
6166 router
.emit('swipebackBeforeReset', callbackData
);
6169 $currentPageEl
.transitionEnd(function () {
6170 $([$currentPageEl
[0], $previousPageEl
[0]]).removeClass('page-transitioning page-transitioning-swipeback');
6171 if (dynamicNavbar
) {
6172 setAnimatableNavElements({ reset
: true, transition
: false });
6174 allowViewTouchMove
= true;
6175 router
.allowPageChange
= true;
6178 if (router
.history
.length
=== 1) {
6179 router
.history
.unshift(router
.url
);
6181 router
.history
.pop();
6182 router
.saveHistory();
6184 // Update push state
6185 if (params
.pushState
) {
6189 // Page after animation callback
6190 router
.pageCallback('afterOut', $currentPageEl
, $currentNavbarInnerEl
, 'current', 'next', { route
: $currentPageEl
[0].f7Page
.route
, swipeBack
: true });
6191 router
.pageCallback('afterIn', $previousPageEl
, $previousNavbarInnerEl
, 'previous', 'current', { route
: $previousPageEl
[0].f7Page
.route
, swipeBack
: true });
6194 if (params
.stackPages
&& router
.initialPages
.indexOf($currentPageEl
[0]) >= 0) {
6195 $currentPageEl
.addClass('stacked');
6196 if (separateNavbar
) {
6197 $currentNavbarInnerEl
.addClass('stacked');
6200 router
.pageCallback('beforeRemove', $currentPageEl
, $currentNavbarInnerEl
, 'next', { swipeBack
: true });
6201 router
.removePage($currentPageEl
);
6202 if (separateNavbar
) {
6203 router
.removeNavbar($currentNavbarInnerEl
);
6207 $el
.trigger('swipeback:afterchange', callbackData
);
6208 router
.emit('swipebackAfterChange', callbackData
);
6210 router
.emit('routeChanged', router
.currentRoute
, router
.previousRoute
, router
);
6212 if (params
.preloadPreviousPage
) {
6213 router
.back(router
.history
[router
.history
.length
- 2], { preload
: true });
6216 $el
.trigger('swipeback:afterreset', callbackData
);
6217 router
.emit('swipebackAfterReset', callbackData
);
6219 if ($pageShadowEl
&& $pageShadowEl
.length
> 0) { $pageShadowEl
.remove(); }
6220 if ($pageOpacityEl
&& $pageOpacityEl
.length
> 0) { $pageOpacityEl
.remove(); }
6224 function attachEvents() {
6225 var passiveListener
= (app
.touchEvents
.start
=== 'touchstart' && Support
.passiveListener
) ? { passive
: true, capture
: false } : false;
6226 $el
.on(app
.touchEvents
.start
, handleTouchStart
, passiveListener
);
6227 app
.on('touchmove:active', handleTouchMove
);
6228 app
.on('touchend:passive', handleTouchEnd
);
6230 function detachEvents() {
6231 var passiveListener
= (app
.touchEvents
.start
=== 'touchstart' && Support
.passiveListener
) ? { passive
: true, capture
: false } : false;
6232 $el
.off(app
.touchEvents
.start
, handleTouchStart
, passiveListener
);
6233 app
.off('touchmove:active', handleTouchMove
);
6234 app
.off('touchend:passive', handleTouchEnd
);
6239 router
.on('routerDestroy', detachEvents
);
6242 function redirect (direction
, route
, options
) {
6244 var redirect
= route
.route
.redirect
;
6245 if (options
.initial
&& router
.params
.pushState
) {
6246 options
.replaceState
= true; // eslint-disable-line
6247 options
.history
= true; // eslint-disable-line
6249 function redirectResolve(redirectUrl
, redirectOptions
) {
6250 if ( redirectOptions
=== void 0 ) redirectOptions
= {};
6252 router
.allowPageChange
= true;
6253 router
[direction
](redirectUrl
, Utils
.extend({}, options
, redirectOptions
));
6255 function redirectReject() {
6256 router
.allowPageChange
= true;
6258 if (typeof redirect
=== 'function') {
6259 router
.allowPageChange
= false;
6260 var redirectUrl
= redirect
.call(router
, route
, redirectResolve
, redirectReject
);
6261 if (redirectUrl
&& typeof redirectUrl
=== 'string') {
6262 router
.allowPageChange
= true;
6263 return router
[direction
](redirectUrl
, options
);
6267 return router
[direction
](redirect
, options
);
6270 function processQueue(router
, routerQueue
, routeQueue
, to
, from, resolve
, reject
) {
6273 if (Array
.isArray(routeQueue
)) {
6274 queue
.push
.apply(queue
, routeQueue
);
6275 } else if (routeQueue
&& typeof routeQueue
=== 'function') {
6276 queue
.push(routeQueue
);
6279 if (Array
.isArray(routerQueue
)) {
6280 queue
.push
.apply(queue
, routerQueue
);
6282 queue
.push(routerQueue
);
6287 if (queue
.length
=== 0) {
6291 var queueItem
= queue
.shift();
6308 function processRouteQueue (to
, from, resolve
, reject
) {
6310 function enterNextRoute() {
6311 if (to
&& to
.route
&& (router
.params
.routesBeforeEnter
|| to
.route
.beforeEnter
)) {
6312 router
.allowPageChange
= false;
6315 router
.params
.routesBeforeEnter
,
6316 to
.route
.beforeEnter
,
6320 router
.allowPageChange
= true;
6331 function leaveCurrentRoute() {
6332 if (from && from.route
&& (router
.params
.routesBeforeLeave
|| from.route
.beforeLeave
)) {
6333 router
.allowPageChange
= false;
6336 router
.params
.routesBeforeLeave
,
6337 from.route
.beforeLeave
,
6341 router
.allowPageChange
= true;
6352 leaveCurrentRoute();
6355 function appRouterCheck (router
, method
) {
6357 throw new Error(("Framework7: it is not allowed to use router methods on global app router. Use router methods only on related View, e.g. app.views.main.router." + method
+ "(...)"));
6361 function refreshPage() {
6363 appRouterCheck(router
, 'refreshPage');
6364 return router
.navigate(router
.currentRoute
.url
, {
6366 reloadCurrent
: true,
6370 function forward(el
, forwardOptions
) {
6371 if ( forwardOptions
=== void 0 ) forwardOptions
= {};
6375 var app
= router
.app
;
6376 var view
= router
.view
;
6377 var options
= Utils
.extend(false, {
6378 animate
: router
.params
.animate
,
6380 replaceState
: false,
6382 reloadCurrent
: router
.params
.reloadPages
,
6383 reloadPrevious
: false,
6385 clearPreviousHistory
: false,
6386 reloadDetail
: router
.params
.reloadDetail
,
6390 var masterDetailEnabled
= router
.params
.masterDetailBreakpoint
> 0;
6391 var isMaster
= masterDetailEnabled
&& options
.route
&& options
.route
.route
&& options
.route
.route
.master
=== true;
6393 var otherDetailPageEl
;
6395 var currentRouteIsModal
= router
.currentRoute
.modal
;
6397 if (!currentRouteIsModal
) {
6398 ('popup popover sheet loginScreen actions customModal panel').split(' ').forEach(function (modalLoadProp
) {
6399 if (router
.currentRoute
&& router
.currentRoute
.route
&& router
.currentRoute
.route
[modalLoadProp
]) {
6400 currentRouteIsModal
= true;
6401 modalType
= modalLoadProp
;
6406 if (currentRouteIsModal
) {
6407 var modalToClose
= router
.currentRoute
.modal
6408 || router
.currentRoute
.route
.modalInstance
6409 || app
[modalType
].get();
6410 var previousUrl
= router
.history
[router
.history
.length
- 2];
6411 var previousRoute
= router
.findMatchingRoute(previousUrl
);
6412 if (!previousRoute
&& previousUrl
) {
6415 path
: previousUrl
.split('?')[0],
6416 query
: Utils
.parseUrlQuery(previousUrl
),
6418 path
: previousUrl
.split('?')[0],
6424 router
.modalRemove(modalToClose
);
6427 var dynamicNavbar
= router
.dynamicNavbar
;
6428 var separateNavbar
= router
.separateNavbar
;
6430 var $viewEl
= router
.$el
;
6432 var reload
= options
.reloadPrevious
|| options
.reloadCurrent
|| options
.reloadAll
;
6436 var $newNavbarInner
;
6437 var $oldNavbarInner
;
6439 router
.allowPageChange
= false;
6440 if ($newPage
.length
=== 0) {
6441 router
.allowPageChange
= true;
6445 if ($newPage
.length
) {
6446 // Remove theme elements
6447 router
.removeThemeElements($newPage
);
6450 if (dynamicNavbar
) {
6451 $newNavbarInner
= $newPage
.children('.navbar').children('.navbar-inner');
6452 if (separateNavbar
) {
6453 $navbarEl
= router
.$navbarEl
;
6454 if ($newNavbarInner
.length
> 0) {
6455 $newPage
.children('.navbar').remove();
6457 if ($newNavbarInner
.length
=== 0 && $newPage
[0] && $newPage
[0].f7Page
) {
6458 // Try from pageData
6459 $newNavbarInner
= $newPage
[0].f7Page
.$navbarEl
;
6464 // Save Keep Alive Cache
6465 if (options
.route
&& options
.route
.route
&& options
.route
.route
.keepAlive
&& !options
.route
.route
.keepAliveData
) {
6466 options
.route
.route
.keepAliveData
= {
6472 var $pagesInView
= $viewEl
6473 .children('.page:not(.stacked)')
6474 .filter(function (index
, pageInView
) { return pageInView
!== $newPage
[0]; });
6478 if (separateNavbar
) {
6479 $navbarsInView
= $navbarEl
6480 .children('.navbar-inner:not(.stacked)')
6481 .filter(function (index
, navbarInView
) { return navbarInView
!== $newNavbarInner
[0]; });
6484 // Exit when reload previous and only 1 page in view so nothing ro reload
6485 if (options
.reloadPrevious
&& $pagesInView
.length
< 2) {
6486 router
.allowPageChange
= true;
6490 // Find Detail' master page
6493 if (masterDetailEnabled
&& !options
.reloadAll
) {
6494 for (var i
= 0; i
< $pagesInView
.length
; i
+= 1) {
6496 && $pagesInView
[i
].classList
.contains('page-master')
6498 masterPageEl
= $pagesInView
[i
];
6499 continue; // eslint-disable-line
6502 isDetail
= !isMaster
&& masterPageEl
;
6505 // Find Other Detail
6507 for (var i
$1 = 0; i
$1 < $pagesInView
.length
; i
$1 += 1) {
6508 if ($pagesInView
[i
$1].classList
.contains('page-master-detail')
6510 otherDetailPageEl
= $pagesInView
[i
$1];
6511 continue; // eslint-disable-line
6516 reloadDetail
= isDetail
&& options
.reloadDetail
&& app
.width
>= router
.params
.masterDetailBreakpoint
&& masterPageEl
;
6520 var newPagePosition
= 'next';
6521 if (options
.reloadCurrent
|| options
.reloadAll
|| reloadDetail
) {
6522 newPagePosition
= 'current';
6523 } else if (options
.reloadPrevious
) {
6524 newPagePosition
= 'previous';
6527 .removeClass('page-previous page-current page-next')
6528 .addClass(("page-" + newPagePosition
+ (isMaster
? ' page-master' : '') + (isDetail
? ' page-master-detail' : '')))
6529 .removeClass('stacked')
6530 .trigger('page:unstack')
6531 .trigger('page:position', { position
: newPagePosition
});
6532 router
.emit('pageUnstack', $newPage
[0]);
6533 router
.emit('pagePosition', $newPage
[0], newPagePosition
);
6535 if (isMaster
|| isDetail
) {
6536 $newPage
.trigger('page:role', { role
: isMaster
? 'master' : 'detail' });
6540 if (dynamicNavbar
&& $newNavbarInner
.length
) {
6542 .removeClass('navbar-previous navbar-current navbar-next')
6543 .addClass(("navbar-" + newPagePosition
+ (isMaster
? ' navbar-master' : '') + (isDetail
? ' navbar-master-detail' : '')))
6544 .removeClass('stacked');
6548 if (options
.reloadCurrent
|| reloadDetail
) {
6549 $oldPage
= $pagesInView
.eq($pagesInView
.length
- 1);
6550 if (separateNavbar
) {
6551 // $oldNavbarInner = $navbarsInView.eq($pagesInView.length - 1);
6552 $oldNavbarInner
= $(app
.navbar
.getElByPage($oldPage
));
6554 } else if (options
.reloadPrevious
) {
6555 $oldPage
= $pagesInView
.eq($pagesInView
.length
- 2);
6556 if (separateNavbar
) {
6557 // $oldNavbarInner = $navbarsInView.eq($pagesInView.length - 2);
6558 $oldNavbarInner
= $(app
.navbar
.getElByPage($oldPage
));
6560 } else if (options
.reloadAll
) {
6561 $oldPage
= $pagesInView
.filter(function (index
, pageEl
) { return pageEl
!== $newPage
[0]; });
6562 if (separateNavbar
) {
6563 $oldNavbarInner
= $navbarsInView
.filter(function (index
, navbarEl
) { return navbarEl
!== $newNavbarInner
[0]; });
6566 if ($pagesInView
.length
> 1) {
6568 for (i
$2 = 0; i
$2 < $pagesInView
.length
- 1; i
$2 += 1) {
6570 && $pagesInView
[i
$2] === masterPageEl
6572 $pagesInView
.eq(i
$2).addClass('page-master-stacked');
6573 $pagesInView
.eq(i
$2).trigger('page:masterstack');
6574 router
.emit('pageMasterStack', $pagesInView
[i
$2]);
6575 if (separateNavbar
) {
6576 $(app
.navbar
.getElByPage(masterPageEl
)).addClass('navbar-master-stacked');
6578 continue; // eslint-disable-line
6580 var oldNavbarInnerEl
= app
.navbar
.getElByPage($pagesInView
.eq(i
$2));
6581 if (router
.params
.stackPages
) {
6582 $pagesInView
.eq(i
$2).addClass('stacked');
6583 $pagesInView
.eq(i
$2).trigger('page:stack');
6584 router
.emit('pageStack', $pagesInView
[i
$2]);
6585 if (separateNavbar
) {
6586 $(oldNavbarInnerEl
).addClass('stacked');
6589 // Page remove event
6590 router
.pageCallback('beforeRemove', $pagesInView
[i
$2], $navbarsInView
&& $navbarsInView
[i
$2], 'previous', undefined, options
);
6591 router
.removePage($pagesInView
[i
$2]);
6592 if (separateNavbar
&& oldNavbarInnerEl
) {
6593 router
.removeNavbar(oldNavbarInnerEl
);
6599 .children('.page:not(.stacked)')
6600 .filter(function (index
, page
) { return page
!== $newPage
[0]; });
6601 if (separateNavbar
) {
6602 $oldNavbarInner
= $navbarEl
6603 .children('.navbar-inner:not(.stacked)')
6604 .filter(function (index
, navbarInner
) { return navbarInner
!== $newNavbarInner
[0]; });
6608 if (dynamicNavbar
&& !separateNavbar
) {
6609 $oldNavbarInner
= $oldPage
.children('.navbar').children('.navbar-inner');
6611 if (isDetail
&& !options
.reloadAll
) {
6612 if ($oldPage
.length
> 1 || reloadDetail
) {
6613 $oldPage
= $oldPage
.filter(function (pageIndex
, pageEl
) { return !pageEl
.classList
.contains('page-master'); });
6615 if ($oldNavbarInner
&& ($oldNavbarInner
.length
> 1 || reloadDetail
)) {
6616 $oldNavbarInner
= $oldNavbarInner
.filter(function (navbarIndex
, navbarEl
) { return !navbarEl
.classList
.contains('navbar-master'); });
6621 if (router
.params
.pushState
&& (options
.pushState
|| options
.replaceState
) && !options
.reloadPrevious
) {
6622 var pushStateRoot
= router
.params
.pushStateRoot
|| '';
6623 History
[options
.reloadCurrent
|| (reloadDetail
&& otherDetailPageEl
) || options
.reloadAll
|| options
.replaceState
? 'replace' : 'push'](
6626 url
: options
.route
.url
,
6628 pushStateRoot
+ router
.params
.pushStateSeparator
+ options
.route
.url
6632 if (!options
.reloadPrevious
) {
6633 // Current Page & Navbar
6634 router
.currentPageEl
= $newPage
[0];
6635 if (dynamicNavbar
&& $newNavbarInner
.length
) {
6636 router
.currentNavbarEl
= $newNavbarInner
[0];
6638 delete router
.currentNavbarEl
;
6642 router
.currentRoute
= options
.route
;
6645 // Update router history
6646 var url
= options
.route
.url
;
6648 if (options
.history
) {
6649 if (((options
.reloadCurrent
|| (reloadDetail
&& otherDetailPageEl
)) && router
.history
.length
) > 0 || options
.replaceState
) {
6650 router
.history
[router
.history
.length
- (options
.reloadPrevious
? 2 : 1)] = url
;
6651 } else if (options
.reloadPrevious
) {
6652 router
.history
[router
.history
.length
- 2] = url
;
6653 } else if (options
.reloadAll
) {
6654 router
.history
= [url
];
6656 router
.history
.push(url
);
6659 router
.saveHistory();
6661 // Insert new page and navbar
6662 var newPageInDom
= $newPage
.parents(doc
).length
> 0;
6663 var f7Component
= $newPage
[0].f7Component
;
6664 if (options
.reloadPrevious
) {
6665 if (f7Component
&& !newPageInDom
) {
6666 f7Component
.$mount(function (componentEl
) {
6667 $(componentEl
).insertBefore($oldPage
);
6670 $newPage
.insertBefore($oldPage
);
6672 if (separateNavbar
&& $newNavbarInner
.length
) {
6673 if ($newNavbarInner
.children('.title-large').length
) {
6674 $newNavbarInner
.addClass('navbar-inner-large');
6676 if ($oldNavbarInner
.length
) {
6677 $newNavbarInner
.insertBefore($oldNavbarInner
);
6679 if (!router
.$navbarEl
.parents(doc
).length
) {
6680 router
.$el
.prepend(router
.$navbarEl
);
6682 $navbarEl
.append($newNavbarInner
);
6686 if ($oldPage
.next('.page')[0] !== $newPage
[0]) {
6687 if (f7Component
&& !newPageInDom
) {
6688 f7Component
.$mount(function (componentEl
) {
6689 $viewEl
.append(componentEl
);
6692 $viewEl
.append($newPage
[0]);
6695 if (separateNavbar
&& $newNavbarInner
.length
) {
6696 if ($newNavbarInner
.children('.title-large').length
) {
6697 $newNavbarInner
.addClass('navbar-inner-large');
6699 if (!router
.$navbarEl
.parents(doc
).length
) {
6700 router
.$el
.prepend(router
.$navbarEl
);
6702 $navbarEl
.append($newNavbarInner
[0]);
6705 if (!newPageInDom
) {
6706 router
.pageCallback('mounted', $newPage
, $newNavbarInner
, newPagePosition
, reload
? newPagePosition
: 'current', options
, $oldPage
);
6707 } else if (options
.route
&& options
.route
.route
&& options
.route
.route
.keepAlive
&& !$newPage
[0].f7PageMounted
) {
6708 $newPage
[0].f7PageMounted
= true;
6709 router
.pageCallback('mounted', $newPage
, $newNavbarInner
, newPagePosition
, reload
? newPagePosition
: 'current', options
, $oldPage
);
6713 if ((options
.reloadCurrent
|| reloadDetail
) && $oldPage
.length
> 0) {
6714 if (router
.params
.stackPages
&& router
.initialPages
.indexOf($oldPage
[0]) >= 0) {
6715 $oldPage
.addClass('stacked');
6716 $oldPage
.trigger('page:stack');
6717 router
.emit('pageStack', $oldPage
[0]);
6718 if (separateNavbar
) {
6719 $oldNavbarInner
.addClass('stacked');
6722 // Page remove event
6723 router
.pageCallback('beforeOut', $oldPage
, $oldNavbarInner
, 'current', undefined, options
);
6724 router
.pageCallback('afterOut', $oldPage
, $oldNavbarInner
, 'current', undefined, options
);
6725 router
.pageCallback('beforeRemove', $oldPage
, $oldNavbarInner
, 'current', undefined, options
);
6726 router
.removePage($oldPage
);
6727 if (separateNavbar
&& $oldNavbarInner
&& $oldNavbarInner
.length
) {
6728 router
.removeNavbar($oldNavbarInner
);
6731 } else if (options
.reloadAll
) {
6732 $oldPage
.each(function (index
, pageEl
) {
6733 var $oldPageEl
= $(pageEl
);
6734 var $oldNavbarInnerEl
= $(app
.navbar
.getElByPage($oldPageEl
));
6735 if (router
.params
.stackPages
&& router
.initialPages
.indexOf($oldPageEl
[0]) >= 0) {
6736 $oldPageEl
.addClass('stacked');
6737 $oldPageEl
.trigger('page:stack');
6738 router
.emit('pageStack', $oldPageEl
[0]);
6739 if (separateNavbar
) {
6740 $oldNavbarInnerEl
.addClass('stacked');
6743 // Page remove event
6744 if ($oldPageEl
.hasClass('page-current')) {
6745 router
.pageCallback('beforeOut', $oldPage
, $oldNavbarInner
, 'current', undefined, options
);
6746 router
.pageCallback('afterOut', $oldPage
, $oldNavbarInner
, 'current', undefined, options
);
6748 router
.pageCallback('beforeRemove', $oldPageEl
, $oldNavbarInner
&& $oldNavbarInner
.eq(index
), 'previous', undefined, options
);
6749 router
.removePage($oldPageEl
);
6750 if (separateNavbar
&& $oldNavbarInnerEl
.length
) {
6751 router
.removeNavbar($oldNavbarInnerEl
);
6755 } else if (options
.reloadPrevious
) {
6756 if (router
.params
.stackPages
&& router
.initialPages
.indexOf($oldPage
[0]) >= 0) {
6757 $oldPage
.addClass('stacked');
6758 $oldPage
.trigger('page:stack');
6759 router
.emit('pageStack', $oldPage
[0]);
6760 if (separateNavbar
) {
6761 $oldNavbarInner
.addClass('stacked');
6764 // Page remove event
6765 router
.pageCallback('beforeRemove', $oldPage
, $oldNavbarInner
, 'previous', undefined, options
);
6766 router
.removePage($oldPage
);
6767 if (separateNavbar
&& $oldNavbarInner
&& $oldNavbarInner
.length
) {
6768 router
.removeNavbar($oldNavbarInner
);
6774 if (options
.route
.route
.tab
) {
6775 router
.tabLoad(options
.route
.route
.tab
, Utils
.extend({}, options
, {
6781 // Page init and before init events
6782 router
.pageCallback('init', $newPage
, $newNavbarInner
, newPagePosition
, reload
? newPagePosition
: 'current', options
, $oldPage
);
6784 if (options
.reloadCurrent
|| options
.reloadAll
|| reloadDetail
) {
6785 router
.allowPageChange
= true;
6786 router
.pageCallback('beforeIn', $newPage
, $newNavbarInner
, newPagePosition
, 'current', options
);
6787 $newPage
.removeAttr('aria-hidden');
6788 if (dynamicNavbar
&& $newNavbarInner
) {
6789 $newNavbarInner
.removeAttr('aria-hidden');
6791 router
.pageCallback('afterIn', $newPage
, $newNavbarInner
, newPagePosition
, 'current', options
);
6792 if (options
.reloadCurrent
&& options
.clearPreviousHistory
) { router
.clearPreviousHistory(); }
6794 masterPageEl
.classList
.add('page-previous');
6795 masterPageEl
.classList
.remove('page-current');
6796 $(masterPageEl
).trigger('page:position', { position
: 'previous' });
6797 router
.emit('pagePosition', masterPageEl
, 'previous');
6799 if (masterPageEl
.f7Page
&& masterPageEl
.f7Page
.navbarEl
) {
6800 masterPageEl
.f7Page
.navbarEl
.classList
.add('navbar-previous');
6801 masterPageEl
.f7Page
.navbarEl
.classList
.remove('navbar-current');
6806 if (options
.reloadPrevious
) {
6807 router
.allowPageChange
= true;
6811 // Before animation event
6812 router
.pageCallback('beforeOut', $oldPage
, $oldNavbarInner
, 'current', 'previous', options
);
6813 router
.pageCallback('beforeIn', $newPage
, $newNavbarInner
, 'next', 'current', options
);
6816 function afterAnimation() {
6817 var pageClasses
= 'page-previous page-current page-next';
6818 var navbarClasses
= 'navbar-previous navbar-current navbar-next';
6819 $newPage
.removeClass(pageClasses
).addClass('page-current').removeAttr('aria-hidden').trigger('page:position', { position
: 'current' });
6820 router
.emit('pagePosition', $newPage
[0], 'current');
6821 $oldPage
.removeClass(pageClasses
).addClass('page-previous').trigger('page:position', { position
: 'previous' });
6822 router
.emit('pagePosition', $oldPage
[0], 'previous');
6824 if (!$oldPage
.hasClass('page-master')) {
6825 $oldPage
.attr('aria-hidden', 'true');
6827 if (dynamicNavbar
) {
6828 $newNavbarInner
.removeClass(navbarClasses
).addClass('navbar-current').removeAttr('aria-hidden');
6829 $oldNavbarInner
.removeClass(navbarClasses
).addClass('navbar-previous');
6830 if (!$oldNavbarInner
.hasClass('navbar-master')) {
6831 $oldNavbarInner
.attr('aria-hidden', 'true');
6834 // After animation event
6835 router
.allowPageChange
= true;
6836 router
.pageCallback('afterOut', $oldPage
, $oldNavbarInner
, 'current', 'previous', options
);
6837 router
.pageCallback('afterIn', $newPage
, $newNavbarInner
, 'next', 'current', options
);
6839 var keepOldPage
= (router
.params
.preloadPreviousPage
|| router
.params
[((app
.theme
) + "SwipeBack")]) && !isMaster
;
6841 if ($newPage
.hasClass('smart-select-page') || $newPage
.hasClass('photo-browser-page') || $newPage
.hasClass('autocomplete-page') || $newPage
.hasClass('color-picker-page')) {
6846 if (router
.params
.stackPages
) {
6847 $oldPage
.addClass('stacked');
6848 $oldPage
.trigger('page:stack');
6849 router
.emit('pageStack', $oldPage
[0]);
6850 if (separateNavbar
) {
6851 $oldNavbarInner
.addClass('stacked');
6853 } else if (!($newPage
.attr('data-name') && $newPage
.attr('data-name') === 'smart-select-page')) {
6855 router
.pageCallback('beforeRemove', $oldPage
, $oldNavbarInner
, 'previous', undefined, options
);
6856 router
.removePage($oldPage
);
6857 if (separateNavbar
&& $oldNavbarInner
.length
) {
6858 router
.removeNavbar($oldNavbarInner
);
6862 if (options
.clearPreviousHistory
) { router
.clearPreviousHistory(); }
6863 router
.emit('routeChanged', router
.currentRoute
, router
.previousRoute
, router
);
6865 if (router
.params
.pushState
) {
6866 History
.clearRouterQueue();
6869 function setPositionClasses() {
6870 var pageClasses
= 'page-previous page-current page-next';
6871 var navbarClasses
= 'navbar-previous navbar-current navbar-next';
6872 $oldPage
.removeClass(pageClasses
).addClass('page-current').removeAttr('aria-hidden').trigger('page:position', { position
: 'current' });
6873 router
.emit('pagePosition', $oldPage
[0], 'current');
6874 $newPage
.removeClass(pageClasses
).addClass('page-next').removeAttr('aria-hidden').trigger('page:position', { position
: 'next' });
6875 router
.emit('pagePosition', $newPage
[0], 'next');
6876 if (dynamicNavbar
) {
6877 $oldNavbarInner
.removeClass(navbarClasses
).addClass('navbar-current').removeAttr('aria-hidden');
6878 $newNavbarInner
.removeClass(navbarClasses
).addClass('navbar-next').removeAttr('aria-hidden');
6881 if (options
.animate
&& !(isMaster
&& app
.width
>= router
.params
.masterDetailBreakpoint
)) {
6882 var delay
= router
.params
[((router
.app
.theme
) + "PageLoadDelay")];
6884 setTimeout(function () {
6885 setPositionClasses();
6886 router
.animate($oldPage
, $newPage
, $oldNavbarInner
, $newNavbarInner
, 'forward', function () {
6891 setPositionClasses();
6892 router
.animate($oldPage
, $newPage
, $oldNavbarInner
, $newNavbarInner
, 'forward', function () {
6901 function load(loadParams
, loadOptions
, ignorePageChange
) {
6902 if ( loadParams
=== void 0 ) loadParams
= {};
6903 if ( loadOptions
=== void 0 ) loadOptions
= {};
6906 if (!router
.allowPageChange
&& !ignorePageChange
) { return router
; }
6907 var params
= loadParams
;
6908 var options
= loadOptions
;
6909 var url
= params
.url
;
6910 var content
= params
.content
;
6912 var pageName
= params
.pageName
;
6913 var template
= params
.template
;
6914 var templateUrl
= params
.templateUrl
;
6915 var component
= params
.component
;
6916 var componentUrl
= params
.componentUrl
;
6918 if (!options
.reloadCurrent
6920 && options
.route
.route
6921 && options
.route
.route
.parentPath
6922 && router
.currentRoute
.route
6923 && router
.currentRoute
.route
.parentPath
=== options
.route
.route
.parentPath
) {
6924 // Do something nested
6925 if (options
.route
.url
=== router
.url
) {
6926 router
.allowPageChange
= true;
6929 // Check for same params
6930 var sameParams
= Object
.keys(options
.route
.params
).length
=== Object
.keys(router
.currentRoute
.params
).length
;
6932 // Check for equal params name
6933 Object
.keys(options
.route
.params
).forEach(function (paramName
) {
6935 !(paramName
in router
.currentRoute
.params
)
6936 || (router
.currentRoute
.params
[paramName
] !== options
.route
.params
[paramName
])
6943 if (options
.route
.route
.tab
) {
6944 return router
.tabLoad(options
.route
.route
.tab
, options
);
6949 && options
.route
.route
.tab
6950 && router
.currentRoute
.route
.tab
6951 && router
.currentRoute
.parentPath
=== options
.route
.parentPath
6953 return router
.tabLoad(options
.route
.route
.tab
, options
);
6959 && options
.route
.url
6960 && router
.url
=== options
.route
.url
6961 && !(options
.reloadCurrent
|| options
.reloadPrevious
)
6962 && !router
.params
.allowDuplicateUrls
6964 router
.allowPageChange
= true;
6968 if (!options
.route
&& url
) {
6969 options
.route
= router
.parseRouteUrl(url
);
6970 Utils
.extend(options
.route
, { route
: { url
: url
, path
: url
} });
6973 // Component Callbacks
6974 function resolve(pageEl
, newOptions
) {
6975 return router
.forward(pageEl
, Utils
.extend(options
, newOptions
));
6978 router
.allowPageChange
= true;
6982 if (url
|| templateUrl
|| componentUrl
) {
6983 router
.allowPageChange
= false;
6988 router
.forward(router
.getPageEl(content
), options
);
6989 } else if (template
|| templateUrl
) {
6990 // Parse template and send page element
6992 router
.pageTemplateLoader(template
, templateUrl
, options
, resolve
, reject
);
6994 router
.allowPageChange
= true;
6998 // Load page from specified HTMLElement or by page name in pages container
6999 router
.forward(router
.getPageEl(el
), options
);
7000 } else if (pageName
) {
7001 // Load page by page name in pages container
7002 router
.forward(router
.$el
.children((".page[data-name=\"" + pageName
+ "\"]")).eq(0), options
);
7003 } else if (component
|| componentUrl
) {
7004 // Load from component (F7/Vue/React/...)
7006 router
.pageComponentLoader(router
.el
, component
, componentUrl
, options
, resolve
, reject
);
7008 router
.allowPageChange
= true;
7017 router
.xhrRequest(url
, options
)
7018 .then(function (pageContent
) {
7019 router
.forward(router
.getPageEl(pageContent
), options
);
7021 .catch(function () {
7022 router
.allowPageChange
= true;
7027 function navigate(navigateParams
, navigateOptions
) {
7028 if ( navigateOptions
=== void 0 ) navigateOptions
= {};
7031 if (router
.swipeBackActive
) { return router
; }
7038 if (typeof navigateParams
=== 'string') {
7039 url
= navigateParams
;
7041 url
= navigateParams
.url
;
7042 createRoute
= navigateParams
.route
;
7043 name
= navigateParams
.name
;
7044 query
= navigateParams
.query
;
7045 params
= navigateParams
.params
;
7048 // find route by name
7049 route
= router
.findRouteByKey('name', name
);
7051 throw new Error(("Framework7: route with name \"" + name
+ "\" not found"));
7053 url
= router
.constructRouteUrl(route
, { params
: params
, query
: query
});
7055 return router
.navigate(url
, navigateOptions
);
7057 throw new Error(("Framework7: can't construct URL for route with name \"" + name
+ "\""));
7059 var app
= router
.app
;
7060 appRouterCheck(router
, 'navigate');
7061 if (url
=== '#' || url
=== '') {
7065 var navigateUrl
= url
.replace('./', '');
7066 if (navigateUrl
[0] !== '/' && navigateUrl
.indexOf('#') !== 0) {
7067 var currentPath
= router
.currentRoute
.parentPath
|| router
.currentRoute
.path
;
7068 navigateUrl
= ((currentPath
? (currentPath
+ "/") : '/') + navigateUrl
)
7069 .replace('///', '/')
7070 .replace('//', '/');
7073 route
= Utils
.extend(router
.parseRouteUrl(navigateUrl
), {
7074 route
: Utils
.extend({}, createRoute
),
7077 route
= router
.findMatchingRoute(navigateUrl
);
7084 if (route
.route
.redirect
) {
7085 return redirect
.call(router
, 'navigate', route
, navigateOptions
);
7090 if (route
.route
.options
) {
7091 Utils
.extend(options
, route
.route
.options
, navigateOptions
);
7093 Utils
.extend(options
, navigateOptions
);
7095 options
.route
= route
;
7097 if (options
&& options
.context
) {
7098 route
.context
= options
.context
;
7099 options
.route
.context
= options
.context
;
7102 function resolve() {
7103 var routerLoaded
= false;
7104 ('popup popover sheet loginScreen actions customModal panel').split(' ').forEach(function (modalLoadProp
) {
7105 if (route
.route
[modalLoadProp
] && !routerLoaded
) {
7106 routerLoaded
= true;
7107 router
.modalLoad(modalLoadProp
, route
, options
);
7110 if (route
.route
.keepAlive
&& route
.route
.keepAliveData
) {
7111 router
.load({ el
: route
.route
.keepAliveData
.pageEl
}, options
, false);
7112 routerLoaded
= true;
7114 ('url content component pageName el componentUrl template templateUrl').split(' ').forEach(function (pageLoadProp
) {
7117 if (route
.route
[pageLoadProp
] && !routerLoaded
) {
7118 routerLoaded
= true;
7119 router
.load(( obj
= {}, obj
[pageLoadProp
] = route
.route
[pageLoadProp
], obj
), options
, false);
7122 if (routerLoaded
) { return; }
7124 function asyncResolve(resolveParams
, resolveOptions
) {
7125 router
.allowPageChange
= false;
7126 var resolvedAsModal
= false;
7127 if (resolveOptions
&& resolveOptions
.context
) {
7128 if (!route
.context
) { route
.context
= resolveOptions
.context
; }
7129 else { route
.context
= Utils
.extend({}, route
.context
, resolveOptions
.context
); }
7130 options
.route
.context
= route
.context
;
7132 ('popup popover sheet loginScreen actions customModal panel').split(' ').forEach(function (modalLoadProp
) {
7133 if (resolveParams
[modalLoadProp
]) {
7134 resolvedAsModal
= true;
7135 var modalRoute
= Utils
.extend({}, route
, { route
: resolveParams
});
7136 router
.allowPageChange
= true;
7137 router
.modalLoad(modalLoadProp
, modalRoute
, Utils
.extend(options
, resolveOptions
));
7140 if (resolvedAsModal
) { return; }
7141 router
.load(resolveParams
, Utils
.extend(options
, resolveOptions
), true);
7143 function asyncReject() {
7144 router
.allowPageChange
= true;
7146 if (route
.route
.async
) {
7147 router
.allowPageChange
= false;
7149 route
.route
.async
.call(router
, options
.route
, router
.currentRoute
, asyncResolve
, asyncReject
);
7153 router
.allowPageChange
= true;
7156 if (router
.params
.masterDetailBreakpoint
> 0 && route
.route
.masterRoute
) {
7157 // load detail route
7158 var preloadMaster
= true;
7159 var masterLoaded
= false;
7160 if (router
.currentRoute
&& router
.currentRoute
.route
) {
7162 router
.currentRoute
.route
.master
7164 router
.currentRoute
.route
=== route
.route
.masterRoute
7165 || router
.currentRoute
.route
.path
=== route
.route
.masterRoute
.path
7168 preloadMaster
= false;
7171 router
.currentRoute
.route
.masterRoute
7172 && (router
.currentRoute
.route
.masterRoute
=== route
.route
.masterRoute
7173 || router
.currentRoute
.route
.masterRoute
.path
=== route
.route
.masterRoute
.path
7176 preloadMaster
= false;
7177 masterLoaded
= true;
7180 if (preloadMaster
|| (masterLoaded
&& navigateOptions
.reloadAll
)) {
7181 router
.navigate(route
.route
.masterRoute
.path
, {
7183 reloadAll
: navigateOptions
.reloadAll
,
7184 reloadCurrent
: navigateOptions
.reloadCurrent
,
7185 reloadPrevious
: navigateOptions
.reloadPrevious
,
7186 pushState
: !navigateOptions
.initial
,
7187 history
: !navigateOptions
.initial
,
7189 pageAfterIn
: function pageAfterIn() {
7190 router
.navigate(navigateParams
, Utils
.extend({}, navigateOptions
, {
7193 reloadCurrent
: false,
7194 reloadPrevious
: false,
7195 history
: !navigateOptions
.initial
,
7196 pushState
: !navigateOptions
.initial
,
7205 processRouteQueue
.call(
7208 router
.currentRoute
,
7210 if (route
.route
.modules
) {
7212 .loadModules(Array
.isArray(route
.route
.modules
) ? route
.route
.modules
: [route
.route
.modules
])
7216 .catch(function () {
7232 function tabLoad(tabRoute
, loadOptions
) {
7233 if ( loadOptions
=== void 0 ) loadOptions
= {};
7236 var options
= Utils
.extend({
7237 animate
: router
.params
.animate
,
7247 if (options
.route
) {
7249 if (!options
.preload
&& options
.route
!== router
.currentRoute
) {
7250 previousRoute
= router
.previousRoute
;
7251 router
.currentRoute
= options
.route
;
7253 if (options
.preload
) {
7254 currentRoute
= options
.route
;
7255 previousRoute
= router
.currentRoute
;
7257 currentRoute
= router
.currentRoute
;
7258 if (!previousRoute
) { previousRoute
= router
.previousRoute
; }
7261 // Update Browser History
7262 if (router
.params
.pushState
&& options
.pushState
&& !options
.reloadPrevious
) {
7266 url
: options
.route
.url
,
7268 (router
.params
.pushStateRoot
|| '') + router
.params
.pushStateSeparator
+ options
.route
.url
7272 // Update Router History
7273 if (options
.history
) {
7274 router
.history
[Math
.max(router
.history
.length
- 1, 0)] = options
.route
.url
;
7275 router
.saveHistory();
7280 var $parentPageEl
= $(options
.parentPageEl
|| router
.currentPageEl
);
7282 if ($parentPageEl
.length
&& $parentPageEl
.find(("#" + (tabRoute
.id
))).length
) {
7283 tabEl
= $parentPageEl
.find(("#" + (tabRoute
.id
))).eq(0);
7284 } else if (router
.view
.selector
) {
7285 tabEl
= (router
.view
.selector
) + " #" + (tabRoute
.id
);
7287 tabEl
= "#" + (tabRoute
.id
);
7289 var tabShowResult
= router
.app
.tab
.show({
7291 animate
: options
.animate
,
7292 tabRoute
: options
.route
,
7295 var $newTabEl
= tabShowResult
.$newTabEl
;
7296 var $oldTabEl
= tabShowResult
.$oldTabEl
;
7297 var animated
= tabShowResult
.animated
;
7298 var onTabsChanged
= tabShowResult
.onTabsChanged
;
7300 if ($newTabEl
&& $newTabEl
.parents('.page').length
> 0 && options
.route
) {
7301 var tabParentPageData
= $newTabEl
.parents('.page')[0].f7Page
;
7302 if (tabParentPageData
&& options
.route
) {
7303 tabParentPageData
.route
= options
.route
;
7307 // Tab Content Loaded
7308 function onTabLoaded(contentEl
) {
7309 // Remove theme elements
7310 router
.removeThemeElements($newTabEl
);
7312 var tabEventTarget
= $newTabEl
;
7313 if (typeof contentEl
!== 'string') { tabEventTarget
= $(contentEl
); }
7315 tabEventTarget
.trigger('tab:init tab:mounted', tabRoute
);
7316 router
.emit('tabInit tabMounted', $newTabEl
[0], tabRoute
);
7318 if ($oldTabEl
&& $oldTabEl
.length
) {
7320 onTabsChanged(function () {
7321 router
.emit('routeChanged', router
.currentRoute
, router
.previousRoute
, router
);
7322 if (router
.params
.unloadTabContent
) {
7323 router
.tabRemove($oldTabEl
, $newTabEl
, tabRoute
);
7327 router
.emit('routeChanged', router
.currentRoute
, router
.previousRoute
, router
);
7328 if (router
.params
.unloadTabContent
) {
7329 router
.tabRemove($oldTabEl
, $newTabEl
, tabRoute
);
7335 if ($newTabEl
[0].f7RouterTabLoaded
) {
7336 if (!$oldTabEl
|| !$oldTabEl
.length
) { return router
; }
7338 onTabsChanged(function () {
7339 router
.emit('routeChanged', router
.currentRoute
, router
.previousRoute
, router
);
7342 router
.emit('routeChanged', router
.currentRoute
, router
.previousRoute
, router
);
7348 function loadTab(loadTabParams
, loadTabOptions
) {
7350 var url
= loadTabParams
.url
;
7351 var content
= loadTabParams
.content
;
7352 var el
= loadTabParams
.el
;
7353 var template
= loadTabParams
.template
;
7354 var templateUrl
= loadTabParams
.templateUrl
;
7355 var component
= loadTabParams
.component
;
7356 var componentUrl
= loadTabParams
.componentUrl
;
7357 // Component/Template Callbacks
7358 function resolve(contentEl
) {
7359 router
.allowPageChange
= true;
7360 if (!contentEl
) { return; }
7361 if (typeof contentEl
=== 'string') {
7362 $newTabEl
.html(contentEl
);
7365 if (contentEl
.f7Component
) {
7366 contentEl
.f7Component
.$mount(function (componentEl
) {
7367 $newTabEl
.append(componentEl
);
7370 $newTabEl
.append(contentEl
);
7373 $newTabEl
[0].f7RouterTabLoaded
= true;
7374 onTabLoaded(contentEl
);
7377 router
.allowPageChange
= true;
7383 } else if (template
|| templateUrl
) {
7385 router
.tabTemplateLoader(template
, templateUrl
, loadTabOptions
, resolve
, reject
);
7387 router
.allowPageChange
= true;
7392 } else if (component
|| componentUrl
) {
7393 // Load from component (F7/Vue/React/...)
7395 router
.tabComponentLoader($newTabEl
[0], component
, componentUrl
, loadTabOptions
, resolve
, reject
);
7397 router
.allowPageChange
= true;
7406 router
.xhrRequest(url
, loadTabOptions
)
7407 .then(function (tabContent
) {
7408 resolve(tabContent
);
7410 .catch(function () {
7411 router
.allowPageChange
= true;
7416 var hasContentLoadProp
;
7417 ('url content component el componentUrl template templateUrl').split(' ').forEach(function (tabLoadProp
) {
7420 if (tabRoute
[tabLoadProp
]) {
7421 hasContentLoadProp
= true;
7422 loadTab(( obj
= {}, obj
[tabLoadProp
] = tabRoute
[tabLoadProp
], obj
), options
);
7427 function asyncResolve(resolveParams
, resolveOptions
) {
7428 loadTab(resolveParams
, Utils
.extend(options
, resolveOptions
));
7430 function asyncReject() {
7431 router
.allowPageChange
= true;
7433 if (tabRoute
.async
) {
7434 tabRoute
.async
.call(router
, currentRoute
, previousRoute
, asyncResolve
, asyncReject
);
7435 } else if (!hasContentLoadProp
) {
7436 router
.allowPageChange
= true;
7441 function tabRemove($oldTabEl
, $newTabEl
, tabRoute
) {
7444 var hasTabComponentChild
;
7446 $oldTabEl
[0].f7RouterTabLoaded
= false;
7447 delete $oldTabEl
[0].f7RouterTabLoaded
;
7449 $oldTabEl
.children().each(function (index
, tabChild
) {
7450 if (tabChild
.f7Component
) {
7451 hasTabComponentChild
= true;
7452 $(tabChild
).trigger('tab:beforeremove', tabRoute
);
7453 tabChild
.f7Component
.$destroy();
7456 if (!hasTabComponentChild
) {
7457 $oldTabEl
.trigger('tab:beforeremove', tabRoute
);
7459 router
.emit('tabBeforeRemove', $oldTabEl
[0], $newTabEl
[0], tabRoute
);
7460 router
.removeTabContent($oldTabEl
[0], tabRoute
);
7463 function modalLoad(modalType
, route
, loadOptions
) {
7464 if ( loadOptions
=== void 0 ) loadOptions
= {};
7467 var app
= router
.app
;
7468 var isPanel
= modalType
=== 'panel';
7469 var modalOrPanel
= isPanel
? 'panel' : 'modal';
7471 var options
= Utils
.extend({
7472 animate
: router
.params
.animate
,
7478 var modalParams
= Utils
.extend({}, route
.route
[modalType
]);
7479 var modalRoute
= route
.route
;
7481 function onModalLoaded() {
7483 var modal
= app
[modalType
].create(modalParams
);
7484 modalRoute
.modalInstance
= modal
;
7486 var hasEl
= modal
.el
;
7488 function closeOnSwipeBack() {
7491 modal
.on((modalOrPanel
+ "Open"), function () {
7493 // Remove theme elements
7494 router
.removeThemeElements(modal
.el
);
7497 modal
.$el
.trigger(((modalType
.toLowerCase()) + ":init " + (modalType
.toLowerCase()) + ":mounted"), route
, modal
);
7498 router
.emit(((!isPanel
? 'modalInit' : '') + " " + modalType
+ "Init " + modalType
+ "Mounted"), modal
.el
, route
, modal
);
7500 router
.once('swipeBackMove', closeOnSwipeBack
);
7502 modal
.on((modalOrPanel
+ "Close"), function () {
7503 router
.off('swipeBackMove', closeOnSwipeBack
);
7504 if (!modal
.closeByRouter
) {
7509 modal
.on((modalOrPanel
+ "Closed"), function () {
7510 modal
.$el
.trigger(((modalType
.toLowerCase()) + ":beforeremove"), route
, modal
);
7511 modal
.emit(("" + (!isPanel
? 'modalBeforeRemove ' : '') + modalType
+ "BeforeRemove"), modal
.el
, route
, modal
);
7512 var modalComponent
= modal
.el
.f7Component
;
7513 if (modalComponent
) {
7514 modalComponent
.$destroy();
7516 Utils
.nextTick(function () {
7517 if (modalComponent
|| modalParams
.component
) {
7518 router
.removeModal(modal
.el
);
7522 delete modalRoute
.modalInstance
;
7526 if (options
.route
) {
7527 // Update Browser History
7528 if (router
.params
.pushState
&& options
.pushState
) {
7532 url
: options
.route
.url
,
7535 (router
.params
.pushStateRoot
|| '') + router
.params
.pushStateSeparator
+ options
.route
.url
7540 if (options
.route
!== router
.currentRoute
) {
7541 modal
.route
= Utils
.extend(options
.route
, { modal
: modal
});
7542 router
.currentRoute
= modal
.route
;
7545 // Update Router History
7546 if (options
.history
) {
7547 router
.history
.push(options
.route
.url
);
7548 router
.saveHistory();
7553 // Remove theme elements
7554 router
.removeThemeElements(modal
.el
);
7557 modal
.$el
.trigger(((modalType
.toLowerCase()) + ":init " + (modalType
.toLowerCase()) + ":mounted"), route
, modal
);
7558 router
.emit((modalOrPanel
+ "Init " + modalType
+ "Init " + modalType
+ "Mounted"), modal
.el
, route
, modal
);
7565 // Load Modal Content
7566 function loadModal(loadModalParams
, loadModalOptions
) {
7568 var url
= loadModalParams
.url
;
7569 var content
= loadModalParams
.content
;
7570 var template
= loadModalParams
.template
;
7571 var templateUrl
= loadModalParams
.templateUrl
;
7572 var component
= loadModalParams
.component
;
7573 var componentUrl
= loadModalParams
.componentUrl
;
7575 // Component/Template Callbacks
7576 function resolve(contentEl
) {
7578 if (typeof contentEl
=== 'string') {
7579 modalParams
.content
= contentEl
;
7580 } else if (contentEl
.f7Component
) {
7581 contentEl
.f7Component
.$mount(function (componentEl
) {
7582 modalParams
.el
= componentEl
;
7583 app
.root
.append(componentEl
);
7586 modalParams
.el
= contentEl
;
7592 router
.allowPageChange
= true;
7598 } else if (template
|| templateUrl
) {
7600 router
.modalTemplateLoader(template
, templateUrl
, loadModalOptions
, resolve
, reject
);
7602 router
.allowPageChange
= true;
7605 } else if (component
|| componentUrl
) {
7606 // Load from component (F7/Vue/React/...)
7608 router
.modalComponentLoader(app
.root
[0], component
, componentUrl
, loadModalOptions
, resolve
, reject
);
7610 router
.allowPageChange
= true;
7619 router
.xhrRequest(url
, loadModalOptions
)
7620 .then(function (modalContent
) {
7621 modalParams
.content
= modalContent
;
7624 .catch(function () {
7625 router
.allowPageChange
= true;
7633 ('url content component el componentUrl template templateUrl').split(' ').forEach(function (modalLoadProp
) {
7636 if (modalParams
[modalLoadProp
] && !foundLoadProp
) {
7637 foundLoadProp
= true;
7638 loadModal(( obj
= {}, obj
[modalLoadProp
] = modalParams
[modalLoadProp
], obj
), options
);
7641 if (!foundLoadProp
&& modalType
=== 'actions') {
7646 function asyncResolve(resolveParams
, resolveOptions
) {
7647 loadModal(resolveParams
, Utils
.extend(options
, resolveOptions
));
7649 function asyncReject() {
7650 router
.allowPageChange
= true;
7652 if (modalParams
.async
) {
7653 modalParams
.async
.call(router
, options
.route
, router
.currentRoute
, asyncResolve
, asyncReject
);
7657 function modalRemove(modal
) {
7658 Utils
.extend(modal
, { closeByRouter
: true });
7662 function backward(el
, backwardOptions
) {
7665 var app
= router
.app
;
7666 var view
= router
.view
;
7668 var options
= Utils
.extend({
7669 animate
: router
.params
.animate
,
7671 replaceState
: false,
7672 }, backwardOptions
);
7674 var masterDetailEnabled
= router
.params
.masterDetailBreakpoint
> 0;
7675 var isMaster
= masterDetailEnabled
&& options
.route
&& options
.route
.route
&& options
.route
.route
.master
=== true;
7678 var dynamicNavbar
= router
.dynamicNavbar
;
7679 var separateNavbar
= router
.separateNavbar
;
7682 var $oldPage
= router
.$el
.children('.page-current');
7683 var currentIsMaster
= masterDetailEnabled
&& $oldPage
.hasClass('page-master');
7685 if ($newPage
.length
) {
7686 // Remove theme elements
7687 router
.removeThemeElements($newPage
);
7691 var $newNavbarInner
;
7692 var $oldNavbarInner
;
7694 if (dynamicNavbar
) {
7695 $newNavbarInner
= $newPage
.children('.navbar').children('.navbar-inner');
7696 if (separateNavbar
) {
7697 $navbarEl
= router
.$navbarEl
;
7698 if ($newNavbarInner
.length
> 0) {
7699 $newPage
.children('.navbar').remove();
7701 if ($newNavbarInner
.length
=== 0 && $newPage
[0] && $newPage
[0].f7Page
) {
7702 // Try from pageData
7703 $newNavbarInner
= $newPage
[0].f7Page
.$navbarEl
;
7705 $oldNavbarInner
= $navbarEl
.find('.navbar-current');
7707 $oldNavbarInner
= $oldPage
.children('.navbar').children('.navbar-inner');
7711 router
.allowPageChange
= false;
7712 if ($newPage
.length
=== 0 || $oldPage
.length
=== 0) {
7713 router
.allowPageChange
= true;
7717 // Remove theme elements
7718 router
.removeThemeElements($newPage
);
7720 // Save Keep Alive Cache
7721 if (options
.route
&& options
.route
.route
&& options
.route
.route
.keepAlive
&& !options
.route
.route
.keepAliveData
) {
7722 options
.route
.route
.keepAliveData
= {
7729 if (masterDetailEnabled
) {
7730 var $pagesInView
= router
.$el
7731 .children('.page:not(.stacked)')
7732 .filter(function (index
, pageInView
) { return pageInView
!== $newPage
[0]; });
7734 // Find Detail' master page
7735 for (var i
= 0; i
< $pagesInView
.length
; i
+= 1) {
7737 && $pagesInView
[i
].classList
.contains('page-master')
7739 masterPageEl
= $pagesInView
[i
];
7740 continue; // eslint-disable-line
7744 isDetail
= !isMaster
7746 && (router
.history
.indexOf(options
.route
.url
) > router
.history
.indexOf(masterPageEl
.f7Page
.route
.url
));
7748 if (!isDetail
&& !isMaster
&& masterPageEl
&& masterPageEl
.f7Page
&& options
.route
.route
.masterRoute
) {
7749 isDetail
= options
.route
.route
.masterRoute
.path
=== masterPageEl
.f7Page
.route
.route
.path
;
7756 .addClass(("page-previous" + (isMaster
? ' page-master' : '') + (isDetail
? ' page-master-detail' : '')))
7757 .removeClass('stacked')
7758 .removeAttr('aria-hidden')
7759 .trigger('page:unstack')
7760 .trigger('page:position', { position
: 'previous' });
7761 router
.emit('pageUnstack', $newPage
[0]);
7762 router
.emit('pagePosition', $newPage
[0], 'previous');
7763 if (isMaster
|| isDetail
) {
7764 $newPage
.trigger('page:role', { role
: isMaster
? 'master' : 'detail' });
7767 if (dynamicNavbar
&& $newNavbarInner
.length
> 0) {
7769 .addClass(("navbar-previous" + (isMaster
? ' navbar-master' : '') + (isDetail
? ' navbar-master-detail' : '')))
7770 .removeClass('stacked')
7771 .removeAttr('aria-hidden');
7774 // Remove previous page in case of "forced"
7776 if (options
.force
) {
7777 if ($oldPage
.prev('.page-previous:not(.stacked)').length
> 0 || $oldPage
.prev('.page-previous').length
=== 0) {
7778 if (router
.history
.indexOf(options
.route
.url
) >= 0) {
7779 backIndex
= router
.history
.length
- router
.history
.indexOf(options
.route
.url
) - 1;
7780 router
.history
= router
.history
.slice(0, router
.history
.indexOf(options
.route
.url
) + 2);
7781 view
.history
= router
.history
;
7782 } else if (router
.history
[[router
.history
.length
- 2]]) {
7783 router
.history
[router
.history
.length
- 2] = options
.route
.url
;
7785 router
.history
.unshift(router
.url
);
7788 if (backIndex
&& router
.params
.stackPages
) {
7789 $oldPage
.prevAll('.page-previous').each(function (index
, pageToRemove
) {
7790 var $pageToRemove
= $(pageToRemove
);
7791 var $navbarToRemove
;
7792 if (separateNavbar
) {
7793 // $navbarToRemove = $oldNavbarInner.prevAll('.navbar-previous').eq(index);
7794 $navbarToRemove
= $(app
.navbar
.getElByPage($pageToRemove
));
7796 if ($pageToRemove
[0] !== $newPage
[0] && $pageToRemove
.index() > $newPage
.index()) {
7797 if (router
.initialPages
.indexOf($pageToRemove
[0]) >= 0) {
7798 $pageToRemove
.addClass('stacked');
7799 $pageToRemove
.trigger('page:stack');
7800 router
.emit('pageStack', $pageToRemove
[0]);
7801 if (separateNavbar
) {
7802 $navbarToRemove
.addClass('stacked');
7805 router
.pageCallback('beforeRemove', $pageToRemove
, $navbarToRemove
, 'previous', undefined, options
);
7806 router
.removePage($pageToRemove
);
7807 if (separateNavbar
&& $navbarToRemove
.length
> 0) {
7808 router
.removeNavbar($navbarToRemove
);
7814 var $pageToRemove
= $oldPage
.prev('.page-previous:not(.stacked)');
7815 var $navbarToRemove
;
7816 if (separateNavbar
) {
7817 // $navbarToRemove = $oldNavbarInner.prev('.navbar-inner:not(.stacked)');
7818 $navbarToRemove
= $(app
.navbar
.getElByPage($pageToRemove
));
7820 if (router
.params
.stackPages
&& router
.initialPages
.indexOf($pageToRemove
[0]) >= 0) {
7821 $pageToRemove
.addClass('stacked');
7822 $pageToRemove
.trigger('page:stack');
7823 router
.emit('pageStack', $pageToRemove
[0]);
7824 $navbarToRemove
.addClass('stacked');
7825 } else if ($pageToRemove
.length
> 0) {
7826 router
.pageCallback('beforeRemove', $pageToRemove
, $navbarToRemove
, 'previous', undefined, options
);
7827 router
.removePage($pageToRemove
);
7828 if (separateNavbar
&& $navbarToRemove
.length
) {
7829 router
.removeNavbar($navbarToRemove
);
7837 var newPageInDom
= $newPage
.parents(doc
).length
> 0;
7838 var f7Component
= $newPage
[0].f7Component
;
7840 function insertPage() {
7841 if ($newPage
.next($oldPage
).length
=== 0) {
7842 if (!newPageInDom
&& f7Component
) {
7843 f7Component
.$mount(function (componentEl
) {
7844 $(componentEl
).insertBefore($oldPage
);
7847 $newPage
.insertBefore($oldPage
);
7850 if (separateNavbar
&& $newNavbarInner
.length
) {
7851 if ($newNavbarInner
.children('.title-large').length
) {
7852 $newNavbarInner
.addClass('navbar-inner-large');
7854 $newNavbarInner
.insertBefore($oldNavbarInner
);
7855 if ($oldNavbarInner
.length
> 0) {
7856 $newNavbarInner
.insertBefore($oldNavbarInner
);
7858 if (!router
.$navbarEl
.parents(doc
).length
) {
7859 router
.$el
.prepend(router
.$navbarEl
);
7861 $navbarEl
.append($newNavbarInner
);
7864 if (!newPageInDom
) {
7865 router
.pageCallback('mounted', $newPage
, $newNavbarInner
, 'previous', 'current', options
, $oldPage
);
7866 } else if (options
.route
&& options
.route
.route
&& options
.route
.route
.keepAlive
&& !$newPage
[0].f7PageMounted
) {
7867 $newPage
[0].f7PageMounted
= true;
7868 router
.pageCallback('mounted', $newPage
, $newNavbarInner
, 'previous', 'current', options
, $oldPage
);
7872 if (options
.preload
) {
7876 if (options
.route
.route
.tab
) {
7877 router
.tabLoad(options
.route
.route
.tab
, Utils
.extend({}, options
, {
7885 .removeClass('page-master-stacked')
7886 .trigger('page:masterunstack');
7887 router
.emit('pageMasterUnstack', $newPage
[0]);
7888 if (separateNavbar
) {
7889 $(app
.navbar
.getElByPage($newPage
)).removeClass('navbar-master-stacked');
7892 // Page init and before init events
7893 router
.pageCallback('init', $newPage
, $newNavbarInner
, 'previous', 'current', options
, $oldPage
);
7894 var $previousPages
= $newPage
.prevAll('.page-previous:not(.stacked):not(.page-master)');
7895 if ($previousPages
.length
> 0) {
7896 $previousPages
.each(function (index
, pageToRemove
) {
7897 var $pageToRemove
= $(pageToRemove
);
7898 var $navbarToRemove
;
7899 if (separateNavbar
) {
7900 // $navbarToRemove = $newNavbarInner.prevAll('.navbar-previous:not(.stacked)').eq(index);
7901 $navbarToRemove
= $(app
.navbar
.getElByPage($pageToRemove
));
7903 if (router
.params
.stackPages
&& router
.initialPages
.indexOf(pageToRemove
) >= 0) {
7904 $pageToRemove
.addClass('stacked');
7905 $pageToRemove
.trigger('page:stack');
7906 router
.emit('pageStack', $pageToRemove
[0]);
7907 if (separateNavbar
) {
7908 $navbarToRemove
.addClass('stacked');
7911 router
.pageCallback('beforeRemove', $pageToRemove
, $navbarToRemove
, 'previous', undefined);
7912 router
.removePage($pageToRemove
);
7913 if (separateNavbar
&& $navbarToRemove
.length
) {
7914 router
.removeNavbar($navbarToRemove
);
7919 router
.allowPageChange
= true;
7924 if (!(Device
.ie
|| Device
.edge
|| (Device
.firefox
&& !Device
.ios
))) {
7925 if (router
.params
.pushState
&& options
.pushState
) {
7926 if (options
.replaceState
) {
7927 var pushStateRoot
= router
.params
.pushStateRoot
|| '';
7931 url
: options
.route
.url
,
7933 pushStateRoot
+ router
.params
.pushStateSeparator
+ options
.route
.url
7935 } else if (backIndex
) {
7936 History
.go(-backIndex
);
7944 if (options
.replaceState
) {
7945 router
.history
[router
.history
.length
- 1] = options
.route
.url
;
7947 if (router
.history
.length
=== 1) {
7948 router
.history
.unshift(router
.url
);
7950 router
.history
.pop();
7952 router
.saveHistory();
7954 // Current Page & Navbar
7955 router
.currentPageEl
= $newPage
[0];
7956 if (dynamicNavbar
&& $newNavbarInner
.length
) {
7957 router
.currentNavbarEl
= $newNavbarInner
[0];
7959 delete router
.currentNavbarEl
;
7963 router
.currentRoute
= options
.route
;
7966 if (Device
.ie
|| Device
.edge
|| (Device
.firefox
&& !Device
.ios
)) {
7967 if (router
.params
.pushState
&& options
.pushState
) {
7968 if (options
.replaceState
) {
7969 var pushStateRoot
$1 = router
.params
.pushStateRoot
|| '';
7973 url
: options
.route
.url
,
7975 pushStateRoot
$1 + router
.params
.pushStateSeparator
+ options
.route
.url
7977 } else if (backIndex
) {
7978 History
.go(-backIndex
);
7989 if (options
.route
.route
.tab
) {
7990 router
.tabLoad(options
.route
.route
.tab
, Utils
.extend({}, options
, {
7996 // Page init and before init events
7997 router
.pageCallback('init', $newPage
, $newNavbarInner
, 'previous', 'current', options
, $oldPage
);
7999 // Before animation callback
8000 router
.pageCallback('beforeOut', $oldPage
, $oldNavbarInner
, 'current', 'next', options
);
8001 router
.pageCallback('beforeIn', $newPage
, $newNavbarInner
, 'previous', 'current', options
);
8004 function afterAnimation() {
8006 var pageClasses
= 'page-previous page-current page-next';
8007 var navbarClasses
= 'navbar-previous navbar-current navbar-next';
8008 $newPage
.removeClass(pageClasses
).addClass('page-current').removeAttr('aria-hidden').trigger('page:position', { position
: 'current' });
8009 router
.emit('pagePosition', $newPage
[0], 'current');
8010 $oldPage
.removeClass(pageClasses
).addClass('page-next').attr('aria-hidden', 'true').trigger('page:position', { position
: 'next' });
8011 router
.emit('pagePosition', $oldPage
[0], 'next');
8012 if (dynamicNavbar
) {
8013 $newNavbarInner
.removeClass(navbarClasses
).addClass('navbar-current').removeAttr('aria-hidden');
8014 $oldNavbarInner
.removeClass(navbarClasses
).addClass('navbar-next').attr('aria-hidden', 'true');
8017 // After animation event
8018 router
.pageCallback('afterOut', $oldPage
, $oldNavbarInner
, 'current', 'next', options
);
8019 router
.pageCallback('afterIn', $newPage
, $newNavbarInner
, 'previous', 'current', options
);
8022 if (router
.params
.stackPages
&& router
.initialPages
.indexOf($oldPage
[0]) >= 0) {
8023 $oldPage
.addClass('stacked');
8024 $oldPage
.trigger('page:stack');
8025 router
.emit('pageStack', $oldPage
[0]);
8026 if (separateNavbar
) {
8027 $oldNavbarInner
.addClass('stacked');
8030 router
.pageCallback('beforeRemove', $oldPage
, $oldNavbarInner
, 'next', undefined, options
);
8031 router
.removePage($oldPage
);
8032 if (separateNavbar
&& $oldNavbarInner
.length
) {
8033 router
.removeNavbar($oldNavbarInner
);
8037 router
.allowPageChange
= true;
8038 router
.emit('routeChanged', router
.currentRoute
, router
.previousRoute
, router
);
8040 // Preload previous page
8041 var preloadPreviousPage
= router
.params
.preloadPreviousPage
|| router
.params
[((app
.theme
) + "SwipeBack")];
8042 if (preloadPreviousPage
&& router
.history
[router
.history
.length
- 2] && !isMaster
) {
8043 router
.back(router
.history
[router
.history
.length
- 2], { preload
: true });
8045 if (router
.params
.pushState
) {
8046 History
.clearRouterQueue();
8050 function setPositionClasses() {
8051 var pageClasses
= 'page-previous page-current page-next';
8052 var navbarClasses
= 'navbar-previous navbar-current navbar-next';
8053 $oldPage
.removeClass(pageClasses
).addClass('page-current').trigger('page:position', { position
: 'current' });
8054 router
.emit('pagePosition', $oldPage
[0], 'current');
8055 $newPage
.removeClass(pageClasses
).addClass('page-previous').removeAttr('aria-hidden').trigger('page:position', { position
: 'previous' });
8056 router
.emit('pagePosition', $newPage
[0], 'previous');
8057 if (dynamicNavbar
) {
8058 $oldNavbarInner
.removeClass(navbarClasses
).addClass('navbar-current');
8059 $newNavbarInner
.removeClass(navbarClasses
).addClass('navbar-previous').removeAttr('aria-hidden');
8063 if (options
.animate
&& !(currentIsMaster
&& app
.width
>= router
.params
.masterDetailBreakpoint
)) {
8064 setPositionClasses();
8065 router
.animate($oldPage
, $newPage
, $oldNavbarInner
, $newNavbarInner
, 'backward', function () {
8074 function loadBack(backParams
, backOptions
, ignorePageChange
) {
8077 if (!router
.allowPageChange
&& !ignorePageChange
) { return router
; }
8078 var params
= backParams
;
8079 var options
= backOptions
;
8080 var url
= params
.url
;
8081 var content
= params
.content
;
8083 var pageName
= params
.pageName
;
8084 var template
= params
.template
;
8085 var templateUrl
= params
.templateUrl
;
8086 var component
= params
.component
;
8087 var componentUrl
= params
.componentUrl
;
8091 && router
.url
=== options
.route
.url
8092 && !(options
.reloadCurrent
|| options
.reloadPrevious
)
8093 && !router
.params
.allowDuplicateUrls
8098 if (!options
.route
&& url
) {
8099 options
.route
= router
.parseRouteUrl(url
);
8102 // Component Callbacks
8103 function resolve(pageEl
, newOptions
) {
8104 return router
.backward(pageEl
, Utils
.extend(options
, newOptions
));
8107 router
.allowPageChange
= true;
8111 if (url
|| templateUrl
|| componentUrl
) {
8112 router
.allowPageChange
= false;
8117 router
.backward(router
.getPageEl(content
), options
);
8118 } else if (template
|| templateUrl
) {
8119 // Parse template and send page element
8121 router
.pageTemplateLoader(template
, templateUrl
, options
, resolve
, reject
);
8123 router
.allowPageChange
= true;
8127 // Load page from specified HTMLElement or by page name in pages container
8128 router
.backward(router
.getPageEl(el
), options
);
8129 } else if (pageName
) {
8130 // Load page by page name in pages container
8131 router
.backward(router
.$el
.children((".page[data-name=\"" + pageName
+ "\"]")).eq(0), options
);
8132 } else if (component
|| componentUrl
) {
8133 // Load from component (F7/Vue/React/...)
8135 router
.pageComponentLoader(router
.el
, component
, componentUrl
, options
, resolve
, reject
);
8137 router
.allowPageChange
= true;
8146 router
.xhrRequest(url
, options
)
8147 .then(function (pageContent
) {
8148 router
.backward(router
.getPageEl(pageContent
), options
);
8150 .catch(function () {
8151 router
.allowPageChange
= true;
8157 var args
= [], len
= arguments
.length
;
8158 while ( len
-- ) args
[ len
] = arguments
[ len
];
8161 if (router
.swipeBackActive
) { return router
; }
8163 var navigateOptions
;
8165 if (typeof args
[0] === 'object') {
8166 navigateOptions
= args
[0] || {};
8168 navigateUrl
= args
[0];
8169 navigateOptions
= args
[1] || {};
8172 var name
= navigateOptions
.name
;
8173 var params
= navigateOptions
.params
;
8174 var query
= navigateOptions
.query
;
8176 // find route by name
8177 route
= router
.findRouteByKey('name', name
);
8179 throw new Error(("Framework7: route with name \"" + name
+ "\" not found"));
8181 navigateUrl
= router
.constructRouteUrl(route
, { params
: params
, query
: query
});
8183 return router
.back(navigateUrl
, Utils
.extend({}, navigateOptions
, {
8189 throw new Error(("Framework7: can't construct URL for route with name \"" + name
+ "\""));
8192 var app
= router
.app
;
8193 appRouterCheck(router
, 'back');
8195 var currentRouteIsModal
= router
.currentRoute
.modal
;
8197 if (!currentRouteIsModal
) {
8198 ('popup popover sheet loginScreen actions customModal panel').split(' ').forEach(function (modalLoadProp
) {
8199 if (router
.currentRoute
.route
[modalLoadProp
]) {
8200 currentRouteIsModal
= true;
8201 modalType
= modalLoadProp
;
8205 if (currentRouteIsModal
) {
8206 var modalToClose
= router
.currentRoute
.modal
8207 || router
.currentRoute
.route
.modalInstance
8208 || app
[modalType
].get();
8209 var previousUrl
= router
.history
[router
.history
.length
- 2];
8211 // check if previous route is modal too
8212 if (modalToClose
&& modalToClose
.$el
) {
8213 var prevOpenedModals
= modalToClose
.$el
.prevAll('.modal-in');
8214 if (prevOpenedModals
.length
&& prevOpenedModals
[0].f7Modal
) {
8215 previousRoute
= prevOpenedModals
[0].f7Modal
.route
;
8218 if (!previousRoute
) {
8219 previousRoute
= router
.findMatchingRoute(previousUrl
);
8222 if (!previousRoute
&& previousUrl
) {
8225 path
: previousUrl
.split('?')[0],
8226 query
: Utils
.parseUrlQuery(previousUrl
),
8228 path
: previousUrl
.split('?')[0],
8233 if (!navigateUrl
|| navigateUrl
.replace(/[# ]/g, '').trim().length
=== 0) {
8234 if (!previousRoute
|| !modalToClose
) {
8238 var forceOtherUrl
= navigateOptions
.force
&& previousRoute
&& navigateUrl
;
8239 if (previousRoute
&& modalToClose
) {
8240 if (router
.params
.pushState
&& navigateOptions
.pushState
!== false) {
8243 router
.currentRoute
= previousRoute
;
8244 router
.history
.pop();
8245 router
.saveHistory();
8246 router
.modalRemove(modalToClose
);
8247 if (forceOtherUrl
) {
8248 router
.navigate(navigateUrl
, { reloadCurrent
: true });
8250 } else if (modalToClose
) {
8251 router
.modalRemove(modalToClose
);
8253 router
.navigate(navigateUrl
, { reloadCurrent
: true });
8258 var $previousPage
= router
.$el
.children('.page-current').prevAll('.page-previous:not(.page-master)').eq(0);
8261 if (router
.params
.masterDetailBreakpoint
> 0) {
8262 var $previousMaster
= router
.$el
.children('.page-current').prevAll('.page-master').eq(0);
8263 if ($previousMaster
.length
) {
8264 var expectedPreviousPageUrl
= router
.history
[router
.history
.length
- 2];
8265 var expectedPreviousPageRoute
= router
.findMatchingRoute(expectedPreviousPageUrl
);
8266 if (expectedPreviousPageRoute
&& expectedPreviousPageRoute
.route
=== $previousMaster
[0].f7Page
.route
.route
) {
8267 $previousPage
= $previousMaster
;
8268 if (!navigateOptions
.preload
) {
8269 skipMaster
= app
.width
>= router
.params
.masterDetailBreakpoint
;
8274 if (!navigateOptions
.force
&& $previousPage
.length
&& !skipMaster
) {
8275 if (router
.params
.pushState
8276 && $previousPage
[0].f7Page
8277 && router
.history
[router
.history
.length
- 2] !== $previousPage
[0].f7Page
.route
.url
8280 router
.history
[router
.history
.length
- 2],
8281 Utils
.extend(navigateOptions
, { force
: true })
8285 var previousPageRoute
= $previousPage
[0].f7Page
.route
;
8287 processRouteQueue
.call(
8290 router
.currentRoute
,
8292 router
.loadBack({ el
: $previousPage
}, Utils
.extend(navigateOptions
, {
8293 route
: previousPageRoute
,
8303 if (navigateUrl
=== '#') {
8304 navigateUrl
= undefined;
8306 if (navigateUrl
&& navigateUrl
[0] !== '/' && navigateUrl
.indexOf('#') !== 0) {
8307 navigateUrl
= ((router
.path
|| '/') + navigateUrl
).replace('//', '/');
8309 if (!navigateUrl
&& router
.history
.length
> 1) {
8310 navigateUrl
= router
.history
[router
.history
.length
- 2];
8312 if (skipMaster
&& !navigateOptions
.force
&& router
.history
[router
.history
.length
- 3]) {
8313 return router
.back(router
.history
[router
.history
.length
- 3], Utils
.extend({}, navigateOptions
|| {}, {
8318 if (skipMaster
&& !navigateOptions
.force
) {
8322 // Find route to load
8323 route
= router
.findMatchingRoute(navigateUrl
);
8328 path
: navigateUrl
.split('?')[0],
8329 query
: Utils
.parseUrlQuery(navigateUrl
),
8331 path
: navigateUrl
.split('?')[0],
8341 if (route
.route
.redirect
) {
8342 return redirect
.call(router
, 'back', route
, navigateOptions
);
8346 if (route
.route
.options
) {
8347 Utils
.extend(options
, route
.route
.options
, navigateOptions
);
8349 Utils
.extend(options
, navigateOptions
);
8351 options
.route
= route
;
8353 if (options
&& options
.context
) {
8354 route
.context
= options
.context
;
8355 options
.route
.context
= options
.context
;
8358 var backForceLoaded
;
8359 if (options
.force
&& router
.params
.stackPages
) {
8360 router
.$el
.children('.page-previous.stacked').each(function (index
, pageEl
) {
8361 if (pageEl
.f7Page
&& pageEl
.f7Page
.route
&& pageEl
.f7Page
.route
.url
=== route
.url
) {
8362 backForceLoaded
= true;
8363 router
.loadBack({ el
: pageEl
}, options
);
8366 if (backForceLoaded
) {
8370 function resolve() {
8371 var routerLoaded
= false;
8372 if (route
.route
.keepAlive
&& route
.route
.keepAliveData
) {
8373 router
.loadBack({ el
: route
.route
.keepAliveData
.pageEl
}, options
);
8374 routerLoaded
= true;
8376 ('url content component pageName el componentUrl template templateUrl').split(' ').forEach(function (pageLoadProp
) {
8379 if (route
.route
[pageLoadProp
] && !routerLoaded
) {
8380 routerLoaded
= true;
8381 router
.loadBack(( obj
= {}, obj
[pageLoadProp
] = route
.route
[pageLoadProp
], obj
), options
);
8384 if (routerLoaded
) { return; }
8386 function asyncResolve(resolveParams
, resolveOptions
) {
8387 router
.allowPageChange
= false;
8388 if (resolveOptions
&& resolveOptions
.context
) {
8389 if (!route
.context
) { route
.context
= resolveOptions
.context
; }
8390 else { route
.context
= Utils
.extend({}, route
.context
, resolveOptions
.context
); }
8391 options
.route
.context
= route
.context
;
8393 router
.loadBack(resolveParams
, Utils
.extend(options
, resolveOptions
), true);
8395 function asyncReject() {
8396 router
.allowPageChange
= true;
8398 if (route
.route
.async
) {
8399 router
.allowPageChange
= false;
8401 route
.route
.async
.call(router
, route
, router
.currentRoute
, asyncResolve
, asyncReject
);
8405 router
.allowPageChange
= true;
8408 if (options
.preload
) {
8411 processRouteQueue
.call(
8414 router
.currentRoute
,
8416 if (route
.route
.modules
) {
8418 .loadModules(Array
.isArray(route
.route
.modules
) ? route
.route
.modules
: [route
.route
.modules
])
8422 .catch(function () {
8439 function clearPreviousPages() {
8441 appRouterCheck(router
, 'clearPreviousPages');
8442 var app
= router
.app
;
8443 var separateNavbar
= router
.separateNavbar
;
8445 var $pagesToRemove
= router
.$el
8447 .filter(function (index
, pageInView
) {
8448 if (router
.currentRoute
&& (router
.currentRoute
.modal
|| router
.currentRoute
.panel
)) { return true; }
8449 return pageInView
!== router
.currentPageEl
;
8452 $pagesToRemove
.each(function (index
, pageEl
) {
8453 var $oldPageEl
= $(pageEl
);
8454 var $oldNavbarInnerEl
= $(app
.navbar
.getElByPage($oldPageEl
));
8455 if (router
.params
.stackPages
&& router
.initialPages
.indexOf($oldPageEl
[0]) >= 0) {
8456 $oldPageEl
.addClass('stacked');
8457 if (separateNavbar
) {
8458 $oldNavbarInnerEl
.addClass('stacked');
8461 // Page remove event
8462 router
.pageCallback('beforeRemove', $oldPageEl
, $oldNavbarInnerEl
, 'previous', undefined, {});
8463 router
.removePage($oldPageEl
);
8464 if (separateNavbar
&& $oldNavbarInnerEl
.length
) {
8465 router
.removeNavbar($oldNavbarInnerEl
);
8471 function clearPreviousHistory() {
8473 appRouterCheck(router
, 'clearPreviousHistory');
8474 var url
= router
.history
[router
.history
.length
- 1];
8476 router
.clearPreviousPages();
8478 router
.history
= [url
];
8479 router
.view
.history
= [url
];
8480 router
.saveHistory();
8483 var Router
= /*@__PURE__*/(function (Framework7Class
) {
8484 function Router(app
, view
) {
8485 Framework7Class
.call(this, {}, [typeof view
=== 'undefined' ? app
: view
]);
8489 router
.isAppRouter
= typeof view
=== 'undefined';
8491 if (router
.isAppRouter
) {
8493 Utils
.extend(false, router
, {
8495 params
: app
.params
.view
,
8496 routes
: app
.routes
|| [],
8501 Utils
.extend(false, router
, {
8505 params
: view
.params
,
8506 routes
: view
.routes
,
8509 $navbarEl
: view
.$navbarEl
,
8510 navbarEl
: view
.navbarEl
,
8511 history
: view
.history
,
8512 scrollHistory
: view
.scrollHistory
,
8514 dynamicNavbar
: app
.theme
=== 'ios' && view
.params
.iosDynamicNavbar
,
8515 separateNavbar
: app
.theme
=== 'ios' && view
.params
.iosDynamicNavbar
&& view
.params
.iosSeparateDynamicNavbar
,
8522 router
.useModules();
8525 router
.tempDom
= doc
.createElement('div');
8528 router
.allowPageChange
= true;
8531 var currentRoute
= {};
8532 var previousRoute
= {};
8533 Object
.defineProperty(router
, 'currentRoute', {
8536 set: function set(newRoute
) {
8537 if ( newRoute
=== void 0 ) newRoute
= {};
8539 previousRoute
= Utils
.extend({}, currentRoute
);
8540 currentRoute
= newRoute
;
8541 if (!currentRoute
) { return; }
8542 router
.url
= currentRoute
.url
;
8543 router
.emit('routeChange', newRoute
, previousRoute
, router
);
8545 get: function get() {
8546 return currentRoute
;
8549 Object
.defineProperty(router
, 'previousRoute', {
8552 get: function get() {
8553 return previousRoute
;
8555 set: function set(newRoute
) {
8556 previousRoute
= newRoute
;
8563 if ( Framework7Class
) Router
.__proto__
= Framework7Class
;
8564 Router
.prototype = Object
.create( Framework7Class
&& Framework7Class
.prototype );
8565 Router
.prototype.constructor = Router
;
8567 Router
.prototype.animatableNavElements
= function animatableNavElements (newNavbarInner
, oldNavbarInner
, toLarge
, fromLarge
, direction
) {
8569 var dynamicNavbar
= router
.dynamicNavbar
;
8570 var separateNavbar
= router
.separateNavbar
;
8571 var animateIcon
= router
.params
.iosAnimateNavbarBackIcon
;
8575 function animatableNavEl($el
, navbarInner
) {
8576 var isSliding
= $el
.hasClass('sliding') || navbarInner
.hasClass('sliding');
8577 var isSubnavbar
= $el
.hasClass('subnavbar');
8578 var needsOpacityTransition
= isSliding
? !isSubnavbar
: true;
8579 var $iconEl
= $el
.find('.back .icon');
8581 if (isSliding
&& animateIcon
&& $el
.hasClass('left') && $iconEl
.length
> 0 && $iconEl
.next('span').length
) {
8582 $el
= $iconEl
.next('span'); // eslint-disable-line
8587 isIconLabel
: isIconLabel
,
8588 leftOffset
: $el
[0].f7NavbarLeftOffset
,
8589 rightOffset
: $el
[0].f7NavbarRightOffset
,
8590 isSliding
: isSliding
,
8591 isSubnavbar
: isSubnavbar
,
8592 needsOpacityTransition
: needsOpacityTransition
,
8595 if (dynamicNavbar
) {
8598 newNavbarInner
.children('.left, .right, .title, .subnavbar').each(function (index
, navEl
) {
8599 var $navEl
= $(navEl
);
8600 if ($navEl
.hasClass('left') && fromLarge
&& direction
=== 'forward' && separateNavbar
) { return; }
8601 if ($navEl
.hasClass('title') && toLarge
) { return; }
8602 newNavEls
.push(animatableNavEl($navEl
, newNavbarInner
));
8604 if (!(oldNavbarInner
.hasClass('navbar-master') && router
.params
.masterDetailBreakpoint
> 0 && router
.app
.width
>= router
.params
.masterDetailBreakpoint
)) {
8605 oldNavbarInner
.children('.left, .right, .title, .subnavbar').each(function (index
, navEl
) {
8606 var $navEl
= $(navEl
);
8607 if ($navEl
.hasClass('left') && toLarge
&& !fromLarge
&& direction
=== 'forward' && separateNavbar
) { return; }
8608 if ($navEl
.hasClass('left') && toLarge
&& direction
=== 'backward' && separateNavbar
) { return; }
8609 if ($navEl
.hasClass('title') && fromLarge
) {
8612 oldNavEls
.push(animatableNavEl($navEl
, oldNavbarInner
));
8615 [oldNavEls
, newNavEls
].forEach(function (navEls
) {
8616 navEls
.forEach(function (navEl
) {
8618 var isSliding
= navEl
.isSliding
;
8619 var $el
= navEl
.$el
;
8620 var otherEls
= navEls
=== oldNavEls
? newNavEls
: oldNavEls
;
8621 if (!(isSliding
&& $el
.hasClass('title') && otherEls
)) { return; }
8622 otherEls
.forEach(function (otherNavEl
) {
8623 if (otherNavEl
.isIconLabel
) {
8624 var iconTextEl
= otherNavEl
.$el
[0];
8625 n
.leftOffset
+= iconTextEl
? (iconTextEl
.offsetLeft
|| 0) : 0;
8632 return { newNavEls
: newNavEls
, oldNavEls
: oldNavEls
};
8635 Router
.prototype.animate
= function animate (oldPage
, newPage
, oldNavbarInner
, newNavbarInner
, direction
, callback
) {
8637 if (router
.params
.animateCustom
) {
8638 router
.params
.animateCustom
.apply(router
, [oldPage
, newPage
, oldNavbarInner
, newNavbarInner
, direction
, callback
]);
8641 var dynamicNavbar
= router
.dynamicNavbar
;
8642 var ios
= router
.app
.theme
=== 'ios';
8643 // Router Animation class
8644 var routerTransitionClass
= "router-transition-" + direction
+ " router-transition";
8655 if (ios
&& dynamicNavbar
) {
8656 oldIsLarge
= oldNavbarInner
&& oldNavbarInner
.hasClass('navbar-inner-large');
8657 newIsLarge
= newNavbarInner
&& newNavbarInner
.hasClass('navbar-inner-large');
8658 fromLarge
= oldIsLarge
&& !oldNavbarInner
.hasClass('navbar-inner-large-collapsed');
8659 toLarge
= newIsLarge
&& !newNavbarInner
.hasClass('navbar-inner-large-collapsed');
8660 var navEls
= router
.animatableNavElements(newNavbarInner
, oldNavbarInner
, toLarge
, fromLarge
, direction
);
8661 newNavEls
= navEls
.newNavEls
;
8662 oldNavEls
= navEls
.oldNavEls
;
8665 function animateNavbars(progress
) {
8666 if (!(ios
&& dynamicNavbar
)) { return; }
8667 if (progress
=== 1) {
8669 newNavbarInner
.addClass('router-navbar-transition-to-large');
8670 oldNavbarInner
.addClass('router-navbar-transition-to-large');
8673 newNavbarInner
.addClass('router-navbar-transition-from-large');
8674 oldNavbarInner
.addClass('router-navbar-transition-from-large');
8677 newNavEls
.forEach(function (navEl
) {
8678 var $el
= navEl
.$el
;
8679 var offset
= direction
=== 'forward' ? navEl
.rightOffset
: navEl
.leftOffset
;
8680 if (navEl
.isSliding
) {
8681 if (navEl
.isSubnavbar
&& newIsLarge
) {
8682 $el
[0].style
.setProperty('transform', ("translate3d(" + (offset
* (1 - progress
)) + "px, calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0)"), 'important');
8684 $el
.transform(("translate3d(" + (offset
* (1 - progress
)) + "px,0,0)"));
8688 oldNavEls
.forEach(function (navEl
) {
8689 var $el
= navEl
.$el
;
8690 var offset
= direction
=== 'forward' ? navEl
.leftOffset
: navEl
.rightOffset
;
8691 if (navEl
.isSliding
) {
8692 if (navEl
.isSubnavbar
&& oldIsLarge
) {
8693 $el
.transform(("translate3d(" + (offset
* (progress
)) + "px, calc(-1 * var(--f7-navbar-large-collapse-progress) * var(--f7-navbar-large-title-height)), 0)"));
8695 $el
.transform(("translate3d(" + (offset
* (progress
)) + "px,0,0)"));
8701 // AnimationEnd Callback
8703 if (router
.dynamicNavbar
) {
8704 if (newNavbarInner
) {
8705 newNavbarInner
.removeClass('router-navbar-transition-to-large router-navbar-transition-from-large');
8706 newNavbarInner
.addClass('navbar-no-title-large-transition');
8707 Utils
.nextFrame(function () {
8708 newNavbarInner
.removeClass('navbar-no-title-large-transition');
8711 if (oldNavbarInner
) {
8712 oldNavbarInner
.removeClass('router-navbar-transition-to-large router-navbar-transition-from-large');
8714 if (newNavbarInner
.hasClass('sliding')) {
8715 newNavbarInner
.find('.title, .left, .right, .left .icon, .subnavbar').transform('');
8717 newNavbarInner
.find('.sliding').transform('');
8719 if (oldNavbarInner
.hasClass('sliding')) {
8720 oldNavbarInner
.find('.title, .left, .right, .left .icon, .subnavbar').transform('');
8722 oldNavbarInner
.find('.sliding').transform('');
8725 router
.$el
.removeClass(routerTransitionClass
);
8726 if (callback
) { callback(); }
8729 (direction
=== 'forward' ? newPage
: oldPage
).animationEnd(function () {
8734 if (dynamicNavbar
) {
8737 Utils
.nextFrame(function () {
8738 // Add class, start animation
8740 router
.$el
.addClass(routerTransitionClass
);
8743 // Add class, start animation
8744 router
.$el
.addClass(routerTransitionClass
);
8748 Router
.prototype.removeModal
= function removeModal (modalEl
) {
8750 router
.removeEl(modalEl
);
8752 // eslint-disable-next-line
8753 Router
.prototype.removeTabContent
= function removeTabContent (tabEl
) {
8754 var $tabEl
= $(tabEl
);
8758 Router
.prototype.removeNavbar
= function removeNavbar (el
) {
8760 router
.removeEl(el
);
8763 Router
.prototype.removePage
= function removePage (el
) {
8765 var f7Page
= $el
&& $el
[0] && $el
[0].f7Page
;
8767 if (f7Page
&& f7Page
.route
&& f7Page
.route
.route
&& f7Page
.route
.route
.keepAlive
) {
8771 router
.removeEl(el
);
8774 Router
.prototype.removeEl
= function removeEl (el
) {
8775 if (!el
) { return; }
8778 if ($el
.length
=== 0) { return; }
8779 $el
.find('.tab').each(function (tabIndex
, tabEl
) {
8780 $(tabEl
).children().each(function (index
, tabChild
) {
8781 if (tabChild
.f7Component
) {
8782 $(tabChild
).trigger('tab:beforeremove');
8783 tabChild
.f7Component
.$destroy();
8787 if ($el
[0].f7Component
&& $el
[0].f7Component
.$destroy
) {
8788 $el
[0].f7Component
.$destroy();
8790 if (!router
.params
.removeElements
) {
8793 if (router
.params
.removeElementsWithTimeout
) {
8794 setTimeout(function () {
8796 }, router
.params
.removeElementsTimeout
);
8802 Router
.prototype.getPageEl
= function getPageEl (content
) {
8804 if (typeof content
=== 'string') {
8805 router
.tempDom
.innerHTML
= content
;
8807 if ($(content
).hasClass('page')) {
8810 router
.tempDom
.innerHTML
= '';
8811 $(router
.tempDom
).append(content
);
8814 return router
.findElement('.page', router
.tempDom
);
8817 Router
.prototype.findElement
= function findElement (stringSelector
, container
, notStacked
) {
8819 var view
= router
.view
;
8820 var app
= router
.app
;
8823 var modalsSelector
= '.popup, .dialog, .popover, .actions-modal, .sheet-modal, .login-screen, .page';
8825 var $container
= $(container
);
8826 var selector
= stringSelector
;
8827 if (notStacked
) { selector
+= ':not(.stacked)'; }
8829 var found
= $container
8831 .filter(function (index
, el
) { return $(el
).parents(modalsSelector
).length
=== 0; });
8833 if (found
.length
> 1) {
8834 if (typeof view
.selector
=== 'string') {
8835 // Search in related view
8836 found
= $container
.find(((view
.selector
) + " " + selector
));
8838 if (found
.length
> 1) {
8839 // Search in main view
8840 found
= $container
.find(("." + (app
.params
.viewMainClass
) + " " + selector
));
8843 if (found
.length
=== 1) { return found
; }
8845 // Try to find not stacked
8846 if (!notStacked
) { found
= router
.findElement(selector
, $container
, true); }
8847 if (found
&& found
.length
=== 1) { return found
; }
8848 if (found
&& found
.length
> 1) { return $(found
[0]); }
8852 Router
.prototype.flattenRoutes
= function flattenRoutes (routes
) {
8853 if ( routes
=== void 0 ) routes
= this.routes
;
8856 var flattenedRoutes
= [];
8857 routes
.forEach(function (route
) {
8858 var hasTabRoutes
= false;
8859 if ('tabs' in route
&& route
.tabs
) {
8860 var mergedPathsRoutes
= route
.tabs
.map(function (tabRoute
) {
8861 var tRoute
= Utils
.extend({}, route
, {
8862 path
: (((route
.path
) + "/" + (tabRoute
.path
))).replace('///', '/').replace('//', '/'),
8863 parentPath
: route
.path
,
8867 delete tRoute
.routes
;
8870 hasTabRoutes
= true;
8871 flattenedRoutes
= flattenedRoutes
.concat(router
.flattenRoutes(mergedPathsRoutes
));
8873 if ('detailRoutes' in route
) {
8874 var mergedPathsRoutes
$1 = route
.detailRoutes
.map(function (detailRoute
) {
8875 var dRoute
= Utils
.extend({}, detailRoute
);
8876 dRoute
.masterRoute
= route
;
8877 dRoute
.masterRoutePath
= route
.path
;
8880 flattenedRoutes
= flattenedRoutes
.concat(route
, router
.flattenRoutes(mergedPathsRoutes
$1));
8882 if ('routes' in route
) {
8883 var mergedPathsRoutes
$2 = route
.routes
.map(function (childRoute
) {
8884 var cRoute
= Utils
.extend({}, childRoute
);
8885 cRoute
.path
= (((route
.path
) + "/" + (cRoute
.path
))).replace('///', '/').replace('//', '/');
8889 flattenedRoutes
= flattenedRoutes
.concat(router
.flattenRoutes(mergedPathsRoutes
$2));
8891 flattenedRoutes
= flattenedRoutes
.concat(route
, router
.flattenRoutes(mergedPathsRoutes
$2));
8894 if (!('routes' in route
) && !('tabs' in route
&& route
.tabs
) && !('detailRoutes' in route
)) {
8895 flattenedRoutes
.push(route
);
8898 return flattenedRoutes
;
8901 // eslint-disable-next-line
8902 Router
.prototype.parseRouteUrl
= function parseRouteUrl (url
) {
8903 if (!url
) { return {}; }
8904 var query
= Utils
.parseUrlQuery(url
);
8905 var hash
= url
.split('#')[1];
8907 var path
= url
.split('#')[0].split('?')[0];
8917 // eslint-disable-next-line
8918 Router
.prototype.constructRouteUrl
= function constructRouteUrl (route
, ref
) {
8919 if ( ref
=== void 0 ) ref
= {};
8920 var params
= ref
.params
;
8921 var query
= ref
.query
;
8923 var path
= route
.path
;
8924 var toUrl
= pathToRegexp_1
.compile(path
);
8927 url
= toUrl(params
|| {});
8929 throw new Error(("Framework7: error constructing route URL from passed params:\nRoute: " + path
+ "\n" + (error
.toString())));
8933 if (typeof query
=== 'string') { url
+= "?" + query
; }
8934 else { url
+= "?" + (Utils
.serializeObject(query
)); }
8940 Router
.prototype.findTabRoute
= function findTabRoute (tabEl
) {
8942 var $tabEl
= $(tabEl
);
8943 var parentPath
= router
.currentRoute
.route
.parentPath
;
8944 var tabId
= $tabEl
.attr('id');
8945 var flattenedRoutes
= router
.flattenRoutes(router
.routes
);
8947 flattenedRoutes
.forEach(function (route
) {
8949 route
.parentPath
=== parentPath
8951 && route
.tab
.id
=== tabId
8953 foundTabRoute
= route
;
8956 return foundTabRoute
;
8959 Router
.prototype.findRouteByKey
= function findRouteByKey (key
, value
) {
8961 var routes
= router
.routes
;
8962 var flattenedRoutes
= router
.flattenRoutes(routes
);
8965 flattenedRoutes
.forEach(function (route
) {
8966 if (matchingRoute
) { return; }
8967 if (route
[key
] === value
) {
8968 matchingRoute
= route
;
8971 return matchingRoute
;
8974 Router
.prototype.findMatchingRoute
= function findMatchingRoute (url
) {
8975 if (!url
) { return undefined; }
8977 var routes
= router
.routes
;
8978 var flattenedRoutes
= router
.flattenRoutes(routes
);
8979 var ref
= router
.parseRouteUrl(url
);
8980 var path
= ref
.path
;
8981 var query
= ref
.query
;
8982 var hash
= ref
.hash
;
8983 var params
= ref
.params
;
8985 flattenedRoutes
.forEach(function (route
) {
8986 if (matchingRoute
) { return; }
8989 var pathsToMatch
= [route
.path
];
8991 if (typeof route
.alias
=== 'string') { pathsToMatch
.push(route
.alias
); }
8992 else if (Array
.isArray(route
.alias
)) {
8993 route
.alias
.forEach(function (aliasPath
) {
8994 pathsToMatch
.push(aliasPath
);
9000 pathsToMatch
.forEach(function (pathToMatch
) {
9001 if (matched
) { return; }
9002 matched
= pathToRegexp_1(pathToMatch
, keys
).exec(path
);
9006 keys
.forEach(function (keyObj
, index
) {
9007 if (typeof keyObj
.name
=== 'number') { return; }
9008 var paramValue
= matched
[index
+ 1];
9009 if (typeof paramValue
=== 'undefined' || paramValue
=== null) {
9010 params
[keyObj
.name
] = paramValue
;
9012 params
[keyObj
.name
] = decodeURIComponent(paramValue
);
9017 if (route
.parentPath
) {
9018 parentPath
= path
.split('/').slice(0, route
.parentPath
.split('/').length
- 1).join('/');
9027 parentPath
: parentPath
,
9033 return matchingRoute
;
9036 // eslint-disable-next-line
9037 Router
.prototype.replaceRequestUrlParams
= function replaceRequestUrlParams (url
, options
) {
9038 if ( url
=== void 0 ) url
= '';
9039 if ( options
=== void 0 ) options
= {};
9041 var compiledUrl
= url
;
9042 if (typeof compiledUrl
=== 'string'
9043 && compiledUrl
.indexOf('{{') >= 0
9046 && options
.route
.params
9047 && Object
.keys(options
.route
.params
).length
9049 Object
.keys(options
.route
.params
).forEach(function (paramName
) {
9050 var regExp
= new RegExp(("{{" + paramName
+ "}}"), 'g');
9051 compiledUrl
= compiledUrl
.replace(regExp
, options
.route
.params
[paramName
] || '');
9057 Router
.prototype.removeFromXhrCache
= function removeFromXhrCache (url
) {
9059 var xhrCache
= router
.cache
.xhr
;
9061 for (var i
= 0; i
< xhrCache
.length
; i
+= 1) {
9062 if (xhrCache
[i
].url
=== url
) { index
= i
; }
9064 if (index
!== false) { xhrCache
.splice(index
, 1); }
9067 Router
.prototype.xhrRequest
= function xhrRequest (requestUrl
, options
) {
9069 var params
= router
.params
;
9070 var ignoreCache
= options
.ignoreCache
;
9071 var url
= requestUrl
;
9073 var hasQuery
= url
.indexOf('?') >= 0;
9074 if (params
.passRouteQueryToRequest
9077 && options
.route
.query
9078 && Object
.keys(options
.route
.query
).length
9080 url
+= "" + (hasQuery
? '&' : '?') + (Utils
.serializeObject(options
.route
.query
));
9084 if (params
.passRouteParamsToRequest
9087 && options
.route
.params
9088 && Object
.keys(options
.route
.params
).length
9090 url
+= "" + (hasQuery
? '&' : '?') + (Utils
.serializeObject(options
.route
.params
));
9094 if (url
.indexOf('{{') >= 0) {
9095 url
= router
.replaceRequestUrlParams(url
, options
);
9097 // should we ignore get params or not
9098 if (params
.xhrCacheIgnoreGetParameters
&& url
.indexOf('?') >= 0) {
9099 url
= url
.split('?')[0];
9101 return new Promise(function (resolve
, reject
) {
9102 if (params
.xhrCache
&& !ignoreCache
&& url
.indexOf('nocache') < 0 && params
.xhrCacheIgnore
.indexOf(url
) < 0) {
9103 for (var i
= 0; i
< router
.cache
.xhr
.length
; i
+= 1) {
9104 var cachedUrl
= router
.cache
.xhr
[i
];
9105 if (cachedUrl
.url
=== url
) {
9107 if (Utils
.now() - cachedUrl
.time
< params
.xhrCacheDuration
) {
9109 resolve(cachedUrl
.content
);
9115 router
.xhr
= router
.app
.request({
9118 beforeSend
: function beforeSend(xhr
) {
9119 router
.emit('routerAjaxStart', xhr
, options
);
9121 complete
: function complete(xhr
, status
) {
9122 router
.emit('routerAjaxComplete', xhr
);
9123 if ((status
!== 'error' && status
!== 'timeout' && (xhr
.status
>= 200 && xhr
.status
< 300)) || xhr
.status
=== 0) {
9124 if (params
.xhrCache
&& xhr
.responseText
!== '') {
9125 router
.removeFromXhrCache(url
);
9126 router
.cache
.xhr
.push({
9129 content
: xhr
.responseText
,
9132 router
.emit('routerAjaxSuccess', xhr
, options
);
9133 resolve(xhr
.responseText
);
9135 router
.emit('routerAjaxError', xhr
, options
);
9139 error
: function error(xhr
) {
9140 router
.emit('routerAjaxError', xhr
, options
);
9147 // Remove theme elements
9148 Router
.prototype.removeThemeElements
= function removeThemeElements (el
) {
9150 var theme
= router
.app
.theme
;
9152 if (theme
=== 'ios') {
9153 toRemove
= '.md-only, .aurora-only, .if-md, .if-aurora, .if-not-ios, .not-ios';
9154 } else if (theme
=== 'md') {
9155 toRemove
= '.ios-only, .aurora-only, .if-ios, .if-aurora, .if-not-md, .not-md';
9156 } else if (theme
=== 'aurora') {
9157 toRemove
= '.ios-only, .md-only, .if-ios, .if-md, .if-not-aurora, .not-aurora';
9159 $(el
).find(toRemove
).remove();
9162 Router
.prototype.getPageData
= function getPageData (pageEl
, navbarEl
, from, to
, route
, pageFromEl
) {
9163 if ( route
=== void 0 ) route
= {};
9166 var $pageEl
= $(pageEl
).eq(0);
9167 var $navbarEl
= $(navbarEl
).eq(0);
9168 var currentPage
= $pageEl
[0].f7Page
|| {};
9171 if ((from === 'next' && to
=== 'current') || (from === 'current' && to
=== 'previous')) { direction
= 'forward'; }
9172 if ((from === 'current' && to
=== 'next') || (from === 'previous' && to
=== 'current')) { direction
= 'backward'; }
9173 if (currentPage
&& !currentPage
.fromPage
) {
9174 var $pageFromEl
= $(pageFromEl
);
9175 if ($pageFromEl
.length
) {
9176 pageFrom
= $pageFromEl
[0].f7Page
;
9179 pageFrom
= currentPage
.pageFrom
|| pageFrom
;
9180 if (pageFrom
&& pageFrom
.pageFrom
) {
9181 pageFrom
.pageFrom
= null;
9191 $navbarEl
: $navbarEl
,
9192 navbarEl
: $navbarEl
[0],
9193 name
: $pageEl
.attr('data-name'),
9197 direction
: direction
,
9198 route
: currentPage
.route
? currentPage
.route
: route
,
9202 $pageEl
[0].f7Page
= page
;
9207 Router
.prototype.pageCallback
= function pageCallback (callback
, pageEl
, navbarEl
, from, to
, options
, pageFromEl
) {
9208 if ( options
=== void 0 ) options
= {};
9210 if (!pageEl
) { return; }
9212 var $pageEl
= $(pageEl
);
9213 if (!$pageEl
.length
) { return; }
9214 var $navbarEl
= $(navbarEl
);
9215 var route
= options
.route
;
9216 var restoreScrollTopOnBack
= router
.params
.restoreScrollTopOnBack
9218 router
.params
.masterDetailBreakpoint
> 0
9219 && $pageEl
.hasClass('page-master')
9220 && router
.app
.width
>= router
.params
.masterDetailBreakpoint
9222 var keepAlive
= $pageEl
[0].f7Page
&& $pageEl
[0].f7Page
.route
&& $pageEl
[0].f7Page
.route
.route
&& $pageEl
[0].f7Page
.route
.route
.keepAlive
;
9224 if (callback
=== 'beforeRemove' && keepAlive
) {
9225 callback
= 'beforeUnmount'; // eslint-disable-line
9228 var camelName
= "page" + (callback
[0].toUpperCase() + callback
.slice(1, callback
.length
));
9229 var colonName
= "page:" + (callback
.toLowerCase());
9232 if (callback
=== 'beforeRemove' && $pageEl
[0].f7Page
) {
9233 page
= Utils
.extend($pageEl
[0].f7Page
, { from: from, to
: to
, position
: from });
9235 page
= router
.getPageData($pageEl
[0], $navbarEl
[0], from, to
, route
, pageFromEl
);
9237 page
.swipeBack
= !!options
.swipeBack
;
9239 var ref
= options
.route
? options
.route
.route
: {};
9240 var on
= ref
.on
; if ( on
=== void 0 ) on
= {};
9241 var once
= ref
.once
; if ( once
=== void 0 ) once
= {};
9243 Utils
.extend(on
, options
.on
);
9246 Utils
.extend(once
, options
.once
);
9249 function attachEvents() {
9250 if ($pageEl
[0].f7RouteEventsAttached
) { return; }
9251 $pageEl
[0].f7RouteEventsAttached
= true;
9252 if (on
&& Object
.keys(on
).length
> 0) {
9253 $pageEl
[0].f7RouteEventsOn
= on
;
9254 Object
.keys(on
).forEach(function (eventName
) {
9255 on
[eventName
] = on
[eventName
].bind(router
);
9256 $pageEl
.on(Utils
.eventNameToColonCase(eventName
), on
[eventName
]);
9259 if (once
&& Object
.keys(once
).length
> 0) {
9260 $pageEl
[0].f7RouteEventsOnce
= once
;
9261 Object
.keys(once
).forEach(function (eventName
) {
9262 once
[eventName
] = once
[eventName
].bind(router
);
9263 $pageEl
.once(Utils
.eventNameToColonCase(eventName
), once
[eventName
]);
9268 function detachEvents() {
9269 if (!$pageEl
[0].f7RouteEventsAttached
) { return; }
9270 if ($pageEl
[0].f7RouteEventsOn
) {
9271 Object
.keys($pageEl
[0].f7RouteEventsOn
).forEach(function (eventName
) {
9272 $pageEl
.off(Utils
.eventNameToColonCase(eventName
), $pageEl
[0].f7RouteEventsOn
[eventName
]);
9275 if ($pageEl
[0].f7RouteEventsOnce
) {
9276 Object
.keys($pageEl
[0].f7RouteEventsOnce
).forEach(function (eventName
) {
9277 $pageEl
.off(Utils
.eventNameToColonCase(eventName
), $pageEl
[0].f7RouteEventsOnce
[eventName
]);
9280 $pageEl
[0].f7RouteEventsAttached
= null;
9281 $pageEl
[0].f7RouteEventsOn
= null;
9282 $pageEl
[0].f7RouteEventsOnce
= null;
9283 delete $pageEl
[0].f7RouteEventsAttached
;
9284 delete $pageEl
[0].f7RouteEventsOn
;
9285 delete $pageEl
[0].f7RouteEventsOnce
;
9288 if (callback
=== 'mounted') {
9291 if (callback
=== 'init') {
9292 if (restoreScrollTopOnBack
&& (from === 'previous' || !from) && to
=== 'current' && router
.scrollHistory
[page
.route
.url
] && !$pageEl
.hasClass('no-restore-scroll')) {
9293 var $pageContent
= $pageEl
.find('.page-content');
9294 if ($pageContent
.length
> 0) {
9295 // eslint-disable-next-line
9296 $pageContent
= $pageContent
.filter(function (pageContentIndex
, pageContentEl
) {
9298 $(pageContentEl
).parents('.tab:not(.tab-active)').length
=== 0
9299 && !$(pageContentEl
).is('.tab:not(.tab-active)')
9303 $pageContent
.scrollTop(router
.scrollHistory
[page
.route
.url
]);
9306 if ($pageEl
[0].f7PageInitialized
) {
9307 $pageEl
.trigger('page:reinit', page
);
9308 router
.emit('pageReinit', page
);
9311 $pageEl
[0].f7PageInitialized
= true;
9313 if (restoreScrollTopOnBack
&& callback
=== 'beforeOut' && from === 'current' && to
=== 'previous') {
9314 // Save scroll position
9315 var $pageContent
$1 = $pageEl
.find('.page-content');
9316 if ($pageContent
$1.length
> 0) {
9317 // eslint-disable-next-line
9318 $pageContent
$1 = $pageContent
$1.filter(function (pageContentIndex
, pageContentEl
) {
9320 $(pageContentEl
).parents('.tab:not(.tab-active)').length
=== 0
9321 && !$(pageContentEl
).is('.tab:not(.tab-active)')
9325 router
.scrollHistory
[page
.route
.url
] = $pageContent
$1.scrollTop();
9327 if (restoreScrollTopOnBack
&& callback
=== 'beforeOut' && from === 'current' && to
=== 'next') {
9328 // Delete scroll position
9329 delete router
.scrollHistory
[page
.route
.url
];
9332 $pageEl
.trigger(colonName
, page
);
9333 router
.emit(camelName
, page
);
9335 if (callback
=== 'beforeRemove' || callback
=== 'beforeUnmount') {
9338 if ($pageEl
[0].f7Page
&& $pageEl
[0].f7Page
.navbarEl
) {
9339 delete $pageEl
[0].f7Page
.navbarEl
.f7Page
;
9341 $pageEl
[0].f7Page
= null;
9346 Router
.prototype.saveHistory
= function saveHistory () {
9348 router
.view
.history
= router
.history
;
9349 if (router
.params
.pushState
) {
9350 win
.localStorage
[("f7router-" + (router
.view
.id
) + "-history")] = JSON
.stringify(router
.history
);
9354 Router
.prototype.restoreHistory
= function restoreHistory () {
9356 if (router
.params
.pushState
&& win
.localStorage
[("f7router-" + (router
.view
.id
) + "-history")]) {
9357 router
.history
= JSON
.parse(win
.localStorage
[("f7router-" + (router
.view
.id
) + "-history")]);
9358 router
.view
.history
= router
.history
;
9362 Router
.prototype.clearHistory
= function clearHistory () {
9364 router
.history
= [];
9365 if (router
.view
) { router
.view
.history
= []; }
9366 router
.saveHistory();
9369 Router
.prototype.updateCurrentUrl
= function updateCurrentUrl (newUrl
) {
9371 appRouterCheck(router
, 'updateCurrentUrl');
9373 if (router
.history
.length
) {
9374 router
.history
[router
.history
.length
- 1] = newUrl
;
9376 router
.history
.push(newUrl
);
9379 // Update current route params
9380 var ref
= router
.parseRouteUrl(newUrl
);
9381 var query
= ref
.query
;
9382 var hash
= ref
.hash
;
9383 var params
= ref
.params
;
9385 var path
= ref
.path
;
9386 if (router
.currentRoute
) {
9387 Utils
.extend(router
.currentRoute
, {
9396 if (router
.params
.pushState
) {
9397 var pushStateRoot
= router
.params
.pushStateRoot
|| '';
9403 pushStateRoot
+ router
.params
.pushStateSeparator
+ newUrl
9408 router
.saveHistory();
9410 router
.emit('routeUrlUpdate', router
.currentRoute
, router
);
9413 Router
.prototype.init
= function init () {
9415 var app
= router
.app
;
9416 var view
= router
.view
;
9421 (view
&& router
.params
.iosSwipeBack
&& app
.theme
=== 'ios')
9422 || (view
&& router
.params
.mdSwipeBack
&& app
.theme
=== 'md')
9423 || (view
&& router
.params
.auroraSwipeBack
&& app
.theme
=== 'aurora')
9429 // Dynamic not separated navbbar
9430 if (router
.dynamicNavbar
&& !router
.separateNavbar
) {
9431 router
.$el
.addClass('router-dynamic-navbar-inside');
9434 var initUrl
= router
.params
.url
;
9435 var documentUrl
= doc
.location
.href
.split(doc
.location
.origin
)[1];
9436 var historyRestored
;
9437 var ref
= router
.params
;
9438 var pushState
= ref
.pushState
;
9439 var pushStateOnLoad
= ref
.pushStateOnLoad
;
9440 var pushStateSeparator
= ref
.pushStateSeparator
;
9441 var pushStateAnimateOnLoad
= ref
.pushStateAnimateOnLoad
;
9442 var ref
$1 = router
.params
;
9443 var pushStateRoot
= ref
$1.pushStateRoot
;
9444 if (win
.cordova
&& pushState
&& !pushStateSeparator
&& !pushStateRoot
&& doc
.location
.pathname
.indexOf('index.html')) {
9445 // eslint-disable-next-line
9446 console
.warn('Framework7: wrong or not complete pushState configuration, trying to guess pushStateRoot');
9447 pushStateRoot
= doc
.location
.pathname
.split('index.html')[0];
9449 if (!pushState
|| !pushStateOnLoad
) {
9451 initUrl
= documentUrl
;
9453 if (doc
.location
.search
&& initUrl
.indexOf('?') < 0) {
9454 initUrl
+= doc
.location
.search
;
9456 if (doc
.location
.hash
&& initUrl
.indexOf('#') < 0) {
9457 initUrl
+= doc
.location
.hash
;
9460 if (pushStateRoot
&& documentUrl
.indexOf(pushStateRoot
) >= 0) {
9461 documentUrl
= documentUrl
.split(pushStateRoot
)[1];
9462 if (documentUrl
=== '') { documentUrl
= '/'; }
9464 if (pushStateSeparator
.length
> 0 && documentUrl
.indexOf(pushStateSeparator
) >= 0) {
9465 initUrl
= documentUrl
.split(pushStateSeparator
)[1];
9467 initUrl
= documentUrl
;
9469 router
.restoreHistory();
9470 if (router
.history
.indexOf(initUrl
) >= 0) {
9471 router
.history
= router
.history
.slice(0, router
.history
.indexOf(initUrl
) + 1);
9472 } else if (router
.params
.url
=== initUrl
) {
9473 router
.history
= [initUrl
];
9474 } else if (History
.state
&& History
.state
[view
.id
] && History
.state
[view
.id
].url
=== router
.history
[router
.history
.length
- 1]) {
9475 initUrl
= router
.history
[router
.history
.length
- 1];
9477 router
.history
= [documentUrl
.split(pushStateSeparator
)[0] || '/', initUrl
];
9479 if (router
.history
.length
> 1) {
9480 historyRestored
= true;
9482 router
.history
= [];
9484 router
.saveHistory();
9487 if (router
.history
.length
> 1) {
9489 currentRoute
= router
.findMatchingRoute(router
.history
[0]);
9490 if (!currentRoute
) {
9491 currentRoute
= Utils
.extend(router
.parseRouteUrl(router
.history
[0]), {
9493 url
: router
.history
[0],
9494 path
: router
.history
[0].split('?')[0],
9500 currentRoute
= router
.findMatchingRoute(initUrl
);
9501 if (!currentRoute
) {
9502 currentRoute
= Utils
.extend(router
.parseRouteUrl(initUrl
), {
9505 path
: initUrl
.split('?')[0],
9511 if (router
.params
.stackPages
) {
9512 router
.$el
.children('.page').each(function (index
, pageEl
) {
9513 var $pageEl
= $(pageEl
);
9514 router
.initialPages
.push($pageEl
[0]);
9515 if (router
.separateNavbar
&& $pageEl
.children('.navbar').length
> 0) {
9516 router
.initialNavbars
.push($pageEl
.children('.navbar').find('.navbar-inner')[0]);
9521 if (router
.$el
.children('.page:not(.stacked)').length
=== 0 && initUrl
) {
9522 // No pages presented in DOM, reload new page
9523 router
.navigate(initUrl
, {
9525 reloadCurrent
: true,
9529 // Init current DOM page
9531 router
.currentRoute
= currentRoute
;
9532 router
.$el
.children('.page:not(.stacked)').each(function (index
, pageEl
) {
9533 var $pageEl
= $(pageEl
);
9535 $pageEl
.addClass('page-current');
9536 if (router
.separateNavbar
) {
9537 $navbarInnerEl
= $pageEl
.children('.navbar').children('.navbar-inner');
9538 if ($navbarInnerEl
.length
> 0) {
9539 if (!router
.$navbarEl
.parents(doc
).length
) {
9540 router
.$el
.prepend(router
.$navbarEl
);
9542 $navbarInnerEl
.addClass('navbar-current');
9543 router
.$navbarEl
.append($navbarInnerEl
);
9544 if ($navbarInnerEl
.children('.title-large').length
) {
9545 $navbarInnerEl
.addClass('navbar-inner-large');
9547 $pageEl
.children('.navbar').remove();
9549 router
.$navbarEl
.addClass('navbar-hidden');
9550 if ($navbarInnerEl
.children('.title-large').length
) {
9551 router
.$navbarEl
.addClass('navbar-hidden navbar-large-hidden');
9555 if (router
.currentRoute
&& router
.currentRoute
.route
&& router
.currentRoute
.route
.master
&& router
.params
.masterDetailBreakpoint
> 0) {
9556 $pageEl
.addClass('page-master');
9557 $pageEl
.trigger('page:role', { role
: 'master' });
9558 if ($navbarInnerEl
&& $navbarInnerEl
.length
) {
9559 $navbarInnerEl
.addClass('navbar-master');
9563 route
: router
.currentRoute
,
9565 if (router
.currentRoute
&& router
.currentRoute
.route
&& router
.currentRoute
.route
.options
) {
9566 Utils
.extend(initOptions
, router
.currentRoute
.route
.options
);
9568 router
.currentPageEl
= $pageEl
[0];
9569 if (router
.separateNavbar
&& $navbarInnerEl
.length
) {
9570 router
.currentNavbarEl
= $navbarInnerEl
[0];
9572 router
.removeThemeElements($pageEl
);
9573 if (router
.separateNavbar
&& $navbarInnerEl
.length
) {
9574 router
.removeThemeElements($navbarInnerEl
);
9576 if (initOptions
.route
.route
.tab
) {
9578 router
.tabLoad(initOptions
.route
.route
.tab
, Utils
.extend({}, initOptions
));
9580 router
.pageCallback('init', $pageEl
, $navbarInnerEl
, 'current', undefined, initOptions
);
9582 if (historyRestored
) {
9583 router
.navigate(initUrl
, {
9587 animate
: pushStateAnimateOnLoad
,
9589 pageAfterIn
: function pageAfterIn() {
9590 var preloadPreviousPage
= router
.params
.preloadPreviousPage
|| router
.params
[((app
.theme
) + "SwipeBack")];
9591 if (preloadPreviousPage
&& router
.history
.length
> 2) {
9592 router
.back({ preload
: true });
9598 if (!historyRestored
&& !hasTabRoute
) {
9599 router
.history
.push(initUrl
);
9600 router
.saveHistory();
9603 if (initUrl
&& pushState
&& pushStateOnLoad
&& (!History
.state
|| !History
.state
[view
.id
])) {
9604 History
.initViewState(view
.id
, {
9608 router
.emit('local::init routerInit', router
);
9611 Router
.prototype.destroy
= function destroy () {
9614 router
.emit('local::destroy routerDestroy', router
);
9616 // Delete props & methods
9617 Object
.keys(router
).forEach(function (routerProp
) {
9618 router
[routerProp
] = null;
9619 delete router
[routerProp
];
9626 }(Framework7Class
));
9629 Router
.prototype.forward
= forward
;
9630 Router
.prototype.load
= load
;
9631 Router
.prototype.navigate
= navigate
;
9632 Router
.prototype.refreshPage
= refreshPage
;
9634 Router
.prototype.tabLoad
= tabLoad
;
9635 Router
.prototype.tabRemove
= tabRemove
;
9637 Router
.prototype.modalLoad
= modalLoad
;
9638 Router
.prototype.modalRemove
= modalRemove
;
9640 Router
.prototype.backward
= backward
;
9641 Router
.prototype.loadBack
= loadBack
;
9642 Router
.prototype.back
= back
;
9643 // Clear previoius pages from the DOM
9644 Router
.prototype.clearPreviousPages
= clearPreviousPages
;
9646 Router
.prototype.clearPreviousHistory
= clearPreviousHistory
;
9648 var RouterModule
= {
9660 create
: function create() {
9661 var instance
= this;
9664 if (instance
.params
.router
) {
9665 instance
.router
= new Router(instance
.app
, instance
);
9669 instance
.router
= new Router(instance
);
9674 var View
= /*@__PURE__*/(function (Framework7Class
) {
9675 function View(appInstance
, el
, viewParams
) {
9676 if ( viewParams
=== void 0 ) viewParams
= {};
9678 Framework7Class
.call(this, viewParams
, [appInstance
]);
9680 var app
= appInstance
;
9689 // Default View params
9690 view
.params
= Utils
.extend(defaults
, app
.params
.view
, viewParams
);
9693 if (view
.params
.routes
.length
> 0) {
9694 view
.routes
= view
.params
.routes
;
9696 view
.routes
= [].concat(app
.routes
, view
.params
.routesAdd
);
9701 if (typeof el
=== 'string') { selector
= el
; }
9703 // Supposed to be HTMLElement or Dom7
9704 selector
= ($el
.attr('id') ? ("#" + ($el
.attr('id'))) : '') + ($el
.attr('class') ? ("." + ($el
.attr('class').replace(/ /g
, '.').replace('.active', ''))) : '');
9709 if (app
.theme
=== 'ios' && view
.params
.iosDynamicNavbar
&& view
.params
.iosSeparateDynamicNavbar
) {
9710 $navbarEl
= $el
.children('.navbar').eq(0);
9711 if ($navbarEl
.length
=== 0) {
9712 $navbarEl
= $('<div class="navbar"></div>');
9717 Utils
.extend(false, view
, {
9721 name
: view
.params
.name
,
9722 main
: view
.params
.main
|| $el
.hasClass('view-main'),
9723 $navbarEl
: $navbarEl
,
9724 navbarEl
: $navbarEl
? $navbarEl
[0] : undefined,
9731 $el
[0].f7View
= view
;
9737 app
.views
.push(view
);
9739 app
.views
.main
= view
;
9742 app
.views
[view
.name
] = view
;
9746 view
.index
= app
.views
.indexOf(view
);
9751 viewId
= "view_" + (view
.name
);
9752 } else if (view
.main
) {
9753 viewId
= 'view_main';
9755 viewId
= "view_" + (view
.index
);
9760 if (app
.initialized
) {
9763 app
.on('init', function () {
9771 if ( Framework7Class
) View
.__proto__
= Framework7Class
;
9772 View
.prototype = Object
.create( Framework7Class
&& Framework7Class
.prototype );
9773 View
.prototype.constructor = View
;
9775 View
.prototype.destroy
= function destroy () {
9779 view
.$el
.trigger('view:beforedestroy', view
);
9780 view
.emit('local::beforeDestroy viewBeforeDestroy', view
);
9782 app
.off('resize', view
.checkmasterDetailBreakpoint
);
9785 app
.views
.main
= null;
9786 delete app
.views
.main
;
9787 } else if (view
.name
) {
9788 app
.views
[view
.name
] = null;
9789 delete app
.views
[view
.name
];
9791 view
.$el
[0].f7View
= null;
9792 delete view
.$el
[0].f7View
;
9794 app
.views
.splice(app
.views
.indexOf(view
), 1);
9797 if (view
.params
.router
&& view
.router
) {
9798 view
.router
.destroy();
9801 view
.emit('local::destroy viewDestroy', view
);
9803 // Delete props & methods
9804 Object
.keys(view
).forEach(function (viewProp
) {
9805 view
[viewProp
] = null;
9806 delete view
[viewProp
];
9812 View
.prototype.checkmasterDetailBreakpoint
= function checkmasterDetailBreakpoint () {
9815 var wasMasterDetail
= view
.$el
.hasClass('view-master-detail');
9816 if (app
.width
>= view
.params
.masterDetailBreakpoint
) {
9817 view
.$el
.addClass('view-master-detail');
9818 if (!wasMasterDetail
) {
9819 view
.emit('local::masterDetailBreakpoint viewMasterDetailBreakpoint');
9820 view
.$el
.trigger('view:masterDetailBreakpoint', view
);
9823 view
.$el
.removeClass('view-master-detail');
9824 if (wasMasterDetail
) {
9825 view
.emit('local::masterDetailBreakpoint viewMasterDetailBreakpoint');
9826 view
.$el
.trigger('view:masterDetailBreakpoint', view
);
9831 View
.prototype.initMasterDetail
= function initMasterDetail () {
9834 view
.checkmasterDetailBreakpoint
= view
.checkmasterDetailBreakpoint
.bind(view
);
9835 view
.checkmasterDetailBreakpoint();
9836 app
.on('resize', view
.checkmasterDetailBreakpoint
);
9839 View
.prototype.init
= function init () {
9841 if (view
.params
.router
) {
9842 if (view
.params
.masterDetailBreakpoint
> 0) {
9843 view
.initMasterDetail();
9846 view
.$el
.trigger('view:init', view
);
9847 view
.emit('local::init viewInit', view
);
9852 }(Framework7Class
));
9855 View
.use(RouterModule
);
9857 function initClicks(app
) {
9858 function handleClicks(e
) {
9859 var $clickedEl
= $(e
.target
);
9860 var $clickedLinkEl
= $clickedEl
.closest('a');
9861 var isLink
= $clickedLinkEl
.length
> 0;
9862 var url
= isLink
&& $clickedLinkEl
.attr('href');
9863 // const isTabLink = isLink && $clickedLinkEl.hasClass('tab-link') && ($clickedLinkEl.attr('data-tab') || (url && url.indexOf('#') === 0));
9865 // Check if link is external
9867 // eslint-disable-next-line
9868 if ($clickedLinkEl
.is(app
.params
.clicks
.externalLinks
) || (url
&& url
.indexOf('javascript:') >= 0)) {
9869 var target
= $clickedLinkEl
.attr('target');
9873 && win
.cordova
.InAppBrowser
9874 && (target
=== '_system' || target
=== '_blank')
9877 win
.cordova
.InAppBrowser
.open(url
, target
);
9884 Object
.keys(app
.modules
).forEach(function (moduleName
) {
9885 var moduleClicks
= app
.modules
[moduleName
].clicks
;
9886 if (!moduleClicks
) { return; }
9887 if (e
.preventF7Router
) { return; }
9888 Object
.keys(moduleClicks
).forEach(function (clickSelector
) {
9889 var matchingClickedElement
= $clickedEl
.closest(clickSelector
).eq(0);
9890 if (matchingClickedElement
.length
> 0) {
9891 moduleClicks
[clickSelector
].call(app
, matchingClickedElement
, matchingClickedElement
.dataset(), e
);
9897 var clickedLinkData
= {};
9900 clickedLinkData
= $clickedLinkEl
.dataset();
9904 if (e
.preventF7Router
) { return; }
9905 if ($clickedLinkEl
.hasClass('prevent-router') || $clickedLinkEl
.hasClass('router-prevent')) { return; }
9907 var validUrl
= url
&& url
.length
> 0 && url
[0] !== '#';
9908 if (validUrl
|| $clickedLinkEl
.hasClass('back')) {
9910 if (clickedLinkData
.view
) {
9911 view
= $(clickedLinkData
.view
)[0].f7View
;
9913 view
= $clickedEl
.parents('.view')[0] && $clickedEl
.parents('.view')[0].f7View
;
9914 if (!$clickedLinkEl
.hasClass('back') && view
&& view
.params
.linksView
) {
9915 if (typeof view
.params
.linksView
=== 'string') { view
= $(view
.params
.linksView
)[0].f7View
; }
9916 else if (view
.params
.linksView
instanceof View
) { view
= view
.params
.linksView
; }
9920 if (app
.views
.main
) { view
= app
.views
.main
; }
9922 if (!view
|| !view
.router
) { return; }
9923 if (clickedLinkData
.context
&& typeof clickedLinkData
.context
=== 'string') {
9925 clickedLinkData
.context
= JSON
.parse(clickedLinkData
.context
);
9927 // something wrong there
9930 if ($clickedLinkEl
[0].f7RouteProps
) {
9931 clickedLinkData
.props
= $clickedLinkEl
[0].f7RouteProps
;
9933 if ($clickedLinkEl
.hasClass('back')) { view
.router
.back(url
, clickedLinkData
); }
9934 else { view
.router
.navigate(url
, clickedLinkData
); }
9938 app
.on('click', handleClicks
);
9940 // TODO: check if need this in iOS
9941 // Prevent scrolling on overlays
9942 // function preventScrolling(e) {
9943 // e.preventDefault();
9945 // if (Support.touch && !Device.android) {
9946 // const activeListener = Support.passiveListener ? { passive: false, capture: false } : false;
9947 // $(document).on((app.params.touch.fastClicks ? 'touchstart' : 'touchmove'), '.panel-backdrop, .dialog-backdrop, .preloader-backdrop, .popup-backdrop, .searchbar-backdrop', preventScrolling, activeListener);
9950 var ClicksModule
= {
9955 externalLinks
: '.external',
9959 init
: function init() {
9966 var RouterTemplateLoaderModule
= {
9967 name
: 'routerTemplateLoader',
9969 templateLoader
: function templateLoader(template
, templateUrl
, options
, resolve
, reject
) {
9971 function compile(t
) {
9975 context
= options
.context
|| {};
9976 if (typeof context
=== 'function') { context
= context
.call(router
); }
9977 else if (typeof context
=== 'string') {
9979 context
= JSON
.parse(context
);
9985 if (typeof t
=== 'function') {
9986 compiledHtml
= t(context
);
9988 compiledHtml
= Template7
.compile(t
)(Utils
.extend({}, context
|| {}, {
9990 $root
: Utils
.extend({}, router
.app
.data
, router
.app
.methods
),
9991 $route
: options
.route
,
9992 $f7route
: options
.route
,
9996 ios
: router
.app
.theme
=== 'ios',
9997 md
: router
.app
.theme
=== 'md',
9998 aurora
: router
.app
.theme
=== 'aurora',
10006 resolve(compiledHtml
, { context
: context
});
10011 router
.xhr
.abort();
10012 router
.xhr
= false;
10015 .xhrRequest(templateUrl
, options
)
10016 .then(function (templateContent
) {
10017 compile(templateContent
);
10019 .catch(function () {
10027 modalTemplateLoader
: function modalTemplateLoader(template
, templateUrl
, options
, resolve
, reject
) {
10029 return router
.templateLoader(template
, templateUrl
, options
, function (html
) {
10034 tabTemplateLoader
: function tabTemplateLoader(template
, templateUrl
, options
, resolve
, reject
) {
10036 return router
.templateLoader(template
, templateUrl
, options
, function (html
) {
10041 pageTemplateLoader
: function pageTemplateLoader(template
, templateUrl
, options
, resolve
, reject
) {
10043 return router
.templateLoader(template
, templateUrl
, options
, function (html
, newOptions
) {
10044 if ( newOptions
=== void 0 ) newOptions
= {};
10046 resolve(router
.getPageEl(html
), newOptions
);
10052 var RouterComponentLoaderModule
= {
10053 name
: 'routerComponentLoader',
10055 componentLoader
: function componentLoader(component
, componentUrl
, options
, resolve
, reject
) {
10056 if ( options
=== void 0 ) options
= {};
10059 var app
= router
.app
;
10060 var url
= typeof component
=== 'string' ? component
: componentUrl
;
10061 var compiledUrl
= router
.replaceRequestUrlParams(url
, options
);
10062 function compile(componentOptions
) {
10063 var context
= options
.context
|| {};
10064 if (typeof context
=== 'function') { context
= context
.call(router
); }
10065 else if (typeof context
=== 'string') {
10067 context
= JSON
.parse(context
);
10073 var extendContext
= Utils
.merge(
10077 $route
: options
.route
,
10078 $f7route
: options
.route
,
10082 ios
: app
.theme
=== 'ios',
10083 md
: app
.theme
=== 'md',
10084 aurora
: app
.theme
=== 'aurora',
10088 var createdComponent
= app
.component
.create(componentOptions
, extendContext
);
10089 resolve(createdComponent
.el
);
10091 var cachedComponent
;
10093 router
.cache
.components
.forEach(function (cached
) {
10094 if (cached
.url
=== compiledUrl
) { cachedComponent
= cached
.component
; }
10097 if (compiledUrl
&& cachedComponent
) {
10098 compile(cachedComponent
);
10099 } else if (compiledUrl
&& !cachedComponent
) {
10102 router
.xhr
.abort();
10103 router
.xhr
= false;
10106 .xhrRequest(url
, options
)
10107 .then(function (loadedComponent
) {
10108 var parsedComponent
= app
.component
.parse(loadedComponent
);
10109 router
.cache
.components
.push({
10111 component
: parsedComponent
,
10113 compile(parsedComponent
);
10115 .catch(function (err
) {
10120 compile(component
);
10124 modalComponentLoader
: function modalComponentLoader(rootEl
, component
, componentUrl
, options
, resolve
, reject
) {
10126 router
.componentLoader(component
, componentUrl
, options
, function (el
) {
10131 tabComponentLoader
: function tabComponentLoader(tabEl
, component
, componentUrl
, options
, resolve
, reject
) {
10133 router
.componentLoader(component
, componentUrl
, options
, function (el
) {
10138 pageComponentLoader
: function pageComponentLoader(routerEl
, component
, componentUrl
, options
, resolve
, reject
) {
10140 router
.componentLoader(component
, componentUrl
, options
, function (el
, newOptions
) {
10141 if ( newOptions
=== void 0 ) newOptions
= {};
10143 resolve(el
, newOptions
);
10149 var HistoryModule
= {
10155 init
: function init() {
10156 History
.init(this);
10161 var keyPrefix
= 'f7storage-';
10163 get: function get(key
) {
10164 return new Promise(function (resolve
, reject
) {
10166 var value
= JSON
.parse(win
.localStorage
.getItem(("" + keyPrefix
+ key
)));
10173 set: function set(key
, value
) {
10174 return new Promise(function (resolve
, reject
) {
10176 win
.localStorage
.setItem(("" + keyPrefix
+ key
), JSON
.stringify(value
));
10183 remove
: function remove(key
) {
10184 return new Promise(function (resolve
, reject
) {
10186 win
.localStorage
.removeItem(("" + keyPrefix
+ key
));
10193 clear
: function clear() {
10196 length
: function length() {
10199 keys
: function keys() {
10200 return new Promise(function (resolve
, reject
) {
10202 var keys
= Object
.keys(win
.localStorage
)
10203 .filter(function (keyName
) { return keyName
.indexOf(keyPrefix
) === 0; })
10204 .map(function (keyName
) { return keyName
.replace(keyPrefix
, ''); });
10211 forEach
: function forEach(callback
) {
10212 return new Promise(function (resolve
, reject
) {
10214 Object
.keys(win
.localStorage
)
10215 .filter(function (keyName
) { return keyName
.indexOf(keyPrefix
) === 0; })
10216 .forEach(function (keyName
, index
) {
10217 var key
= keyName
.replace(keyPrefix
, '');
10218 Storage
.get(key
).then(function (value
) {
10219 callback(key
, value
, index
);
10230 var StorageModule
= {
10238 function vnode(sel
, data
, children
, text
, elm
) {
10239 var key
= data
=== undefined ? undefined : data
.key
;
10240 return { sel
: sel
, data
: data
, children
: children
,
10241 text
: text
, elm
: elm
, key
: key
};
10244 var array
= Array
.isArray
;
10245 function primitive(s
) {
10246 return typeof s
=== 'string' || typeof s
=== 'number';
10249 function addNS(data
, children
, sel
) {
10250 data
.ns
= 'http://www.w3.org/2000/svg';
10251 if (sel
!== 'foreignObject' && children
!== undefined) {
10252 for (var i
= 0; i
< children
.length
; ++i
) {
10253 var childData
= children
[i
].data
;
10254 if (childData
!== undefined) {
10255 addNS(childData
, children
[i
].children
, children
[i
].sel
);
10260 function h(sel
, b
, c
) {
10261 var data
= {}, children
, text
, i
;
10262 if (c
!== undefined) {
10267 else if (primitive(c
)) {
10270 else if (c
&& c
.sel
) {
10274 else if (b
!== undefined) {
10278 else if (primitive(b
)) {
10281 else if (b
&& b
.sel
) {
10288 if (array(children
)) {
10289 for (i
= 0; i
< children
.length
; ++i
) {
10290 if (primitive(children
[i
]))
10291 { children
[i
] = vnode(undefined, undefined, undefined, children
[i
], undefined); }
10294 if (sel
[0] === 's' && sel
[1] === 'v' && sel
[2] === 'g' &&
10295 (sel
.length
=== 3 || sel
[3] === '.' || sel
[3] === '#')) {
10296 addNS(data
, children
, sel
);
10298 return vnode(sel
, data
, children
, text
, undefined);
10301 /* eslint no-use-before-define: "off" */
10303 var selfClosing
= 'area base br col command embed hr img input keygen link menuitem meta param source track wbr'.split(' ');
10304 var propsAttrs
= 'hidden checked disabled readonly selected autocomplete autofocus autoplay required multiple value indeterminate'.split(' ');
10305 var booleanProps
= 'hidden checked disabled readonly selected autocomplete autofocus autoplay required multiple readOnly indeterminate'.split(' ');
10306 var tempDom
= doc
.createElement('div');
10308 function getHooks(data
, app
, initial
, isRoot
) {
10310 if (!data
|| !data
.attrs
|| !data
.attrs
.class) { return hooks
; }
10311 var classNames
= data
.attrs
.class;
10315 var postpatch
= [];
10316 classNames
.split(' ').forEach(function (className
) {
10318 insert
.push
.apply(insert
, app
.getVnodeHooks('insert', className
));
10320 destroy
.push
.apply(destroy
, app
.getVnodeHooks('destroy', className
));
10321 update
.push
.apply(update
, app
.getVnodeHooks('update', className
));
10322 postpatch
.push
.apply(postpatch
, app
.getVnodeHooks('postpatch', className
));
10325 if (isRoot
&& !initial
) {
10326 postpatch
.push(function (oldVnode
, vnode
) {
10327 var vn
= vnode
|| oldVnode
;
10328 if (!vn
) { return; }
10329 if (vn
.data
&& vn
.data
.context
&& vn
.data
.context
.$options
.updated
) {
10330 vn
.data
.context
.$options
.updated();
10334 if (insert
.length
=== 0 && destroy
.length
=== 0 && update
.length
=== 0 && postpatch
.length
=== 0) {
10337 if (insert
.length
) {
10338 hooks
.insert = function (vnode
) {
10339 insert
.forEach(function (f
) { return f(vnode
); });
10342 if (destroy
.length
) {
10343 hooks
.destroy = function (vnode
) {
10344 destroy
.forEach(function (f
) { return f(vnode
); });
10347 if (update
.length
) {
10348 hooks
.update = function (oldVnode
, vnode
) {
10349 update
.forEach(function (f
) { return f(oldVnode
, vnode
); });
10352 if (postpatch
.length
) {
10353 hooks
.postpatch = function (oldVnode
, vnode
) {
10354 postpatch
.forEach(function (f
) { return f(oldVnode
, vnode
); });
10360 function getEventHandler(handlerString
, context
, ref
) {
10361 if ( ref
=== void 0 ) ref
= {};
10362 var stop
= ref
.stop
;
10363 var prevent
= ref
.prevent
;
10364 var once
= ref
.once
;
10369 var customArgs
= [];
10370 var needMethodBind
= true;
10372 if (handlerString
.indexOf('(') < 0) {
10373 methodName
= handlerString
;
10375 methodName
= handlerString
.split('(')[0];
10377 if (methodName
.indexOf('.') >= 0) {
10378 methodName
.split('.').forEach(function (path
, pathIndex
) {
10379 if (pathIndex
=== 0 && path
=== 'this') { return; }
10380 if (pathIndex
=== 0 && path
=== 'window') {
10381 // eslint-disable-next-line
10383 needMethodBind
= false;
10386 if (!method
) { method
= context
; }
10387 if (method
[path
]) { method
= method
[path
]; }
10389 throw new Error(("Framework7: Component doesn't have method \"" + (methodName
.split('.').slice(0, pathIndex
+ 1).join('.')) + "\""));
10393 if (!context
[methodName
]) {
10394 throw new Error(("Framework7: Component doesn't have method \"" + methodName
+ "\""));
10396 method
= context
[methodName
];
10398 if (needMethodBind
) {
10399 method
= method
.bind(context
);
10402 function handler() {
10403 var args
= [], len
= arguments
.length
;
10404 while ( len
-- ) args
[ len
] = arguments
[ len
];
10407 if (once
&& fired
) { return; }
10408 if (stop
) { e
.stopPropagation(); }
10409 if (prevent
) { e
.preventDefault(); }
10412 if (handlerString
.indexOf('(') < 0) {
10415 var handlerArguments
= handlerString
10418 .replace(/'[^']*'|"[^"]*"/g, function (a
) { return a
.replace(/,/g
, '<_comma_>'); })
10420 .map(function (a
) { return a
.replace(/<_comma_>/g, ','); });
10421 handlerArguments
.forEach(function (argument
) {
10422 var arg
= argument
.trim();
10423 // eslint-disable-next-line
10424 if (!isNaN(arg
)) { arg
= parseFloat(arg
); }
10425 else if (arg
=== 'true') { arg
= true; }
10426 else if (arg
=== 'false') { arg
= false; }
10427 else if (arg
=== 'null') { arg
= null; }
10428 else if (arg
=== 'undefined') { arg
= undefined; }
10429 else if (arg
[0] === '"') { arg
= arg
.replace(/"/g, ''); }
10430 else if (arg[0] === '\'') { arg = arg.replace(/'/g, ''); }
10431 else if (arg.indexOf('.') > 0) {
10433 arg.split('.').forEach(function (path) {
10434 if (!deepArg) { deepArg = context; }
10435 deepArg = deepArg[path];
10439 arg = context[arg];
10441 customArgs.push(arg);
10445 method.apply(void 0, customArgs);
10451 function getData(el, context, app, initial, isRoot) {
10455 var attributes = el.attributes;
10456 Array.prototype.forEach.call(attributes, function (attr) {
10457 var attrName = attr.name;
10458 var attrValue = attr.value;
10459 if (propsAttrs.indexOf(attrName) >= 0) {
10461 if (!data.props) { data.props = {}; }
10462 if (attrName === 'readonly') {
10463 attrName = 'readOnly';
10465 if (booleanProps.indexOf(attrName) >= 0) {
10466 // eslint-disable-next-line
10467 data.props[attrName] = attrValue === false ? false : true;
10469 data.props[attrName] = attrValue;
10471 } else if (attrName === 'key') {
10473 data.key = attrValue;
10474 } else if (attrName.indexOf('@') === 0) {
10476 if (!data.on) { data.on = {}; }
10477 var eventName = attrName.substr(1);
10479 var prevent = false;
10481 if (eventName.indexOf('.') >= 0) {
10482 eventName.split('.').forEach(function (eventNamePart, eventNameIndex) {
10483 if (eventNameIndex === 0) { eventName = eventNamePart; }
10485 if (eventNamePart === 'stop') { stop = true; }
10486 if (eventNamePart === 'prevent') { prevent = true; }
10487 if (eventNamePart === 'once') { once = true; }
10491 data.on[eventName] = getEventHandler(attrValue, context, { stop: stop, prevent: prevent, once: once });
10492 } else if (attrName === 'style') {
10494 if (attrValue.indexOf('{') >= 0 && attrValue.indexOf('}') >= 0) {
10496 data.style = JSON.parse(attrValue);
10498 if (!data.attrs) { data.attrs = {}; }
10499 data.attrs.style = attrValue;
10502 if (!data.attrs) { data.attrs = {}; }
10503 data.attrs.style = attrValue;
10506 // Rest of attribures
10507 if (!data.attrs) { data.attrs = {}; }
10508 data.attrs[attrName] = attrValue;
10511 if (attrName === 'id' && !data.key && !isRoot) {
10512 data.key = attrValue;
10516 var hooks = getHooks(data, app, initial, isRoot);
10517 hooks.prepatch = function (oldVnode, vnode) {
10518 if (!oldVnode || !vnode) { return; }
10519 if (oldVnode && oldVnode.data && oldVnode.data.props) {
10520 Object.keys(oldVnode.data.props).forEach(function (key) {
10521 if (booleanProps.indexOf(key) < 0) { return; }
10522 if (!vnode.data) { vnode.data = {}; }
10523 if (!vnode.data.props) { vnode.data.props = {}; }
10524 if (oldVnode.data.props[key] === true && !(key in vnode.data.props)) {
10525 vnode.data.props[key] = false;
10536 function getChildren(el, context, app, initial) {
10538 var nodes = el.childNodes;
10539 for (var i = 0; i < nodes.length; i += 1) {
10540 var childNode = nodes[i];
10541 var child = elementToVNode(childNode, context, app, initial);
10543 children.push(child);
10549 function elementToVNode(el, context, app, initial, isRoot) {
10550 if (el.nodeType === 1) {
10551 // element (statement adds inline SVG compatibility)
10552 var tagName = (el instanceof win.SVGElement) ? el.nodeName : el.nodeName.toLowerCase();
10555 getData(el, context, app, initial, isRoot),
10556 selfClosing.indexOf(tagName) >= 0 ? [] : getChildren(el, context, app, initial)
10559 if (el.nodeType === 3) {
10561 return el.textContent;
10566 function vdom (html, context, app, initial) {
10567 if ( html === void 0 ) html = '';
10569 // Save to temp dom
10570 tempDom.innerHTML = html.trim();
10574 for (var i = 0; i < tempDom.childNodes.length; i += 1) {
10575 if (!rootEl && tempDom.childNodes[i].nodeType === 1) {
10576 rootEl = tempDom.childNodes[i];
10579 var result = elementToVNode(rootEl, context, app, initial, true);
10582 tempDom.innerHTML = '';
10587 function createElement(tagName) {
10588 return document.createElement(tagName);
10590 function createElementNS(namespaceURI, qualifiedName) {
10591 return document.createElementNS(namespaceURI, qualifiedName);
10593 function createTextNode(text) {
10594 return document.createTextNode(text);
10596 function createComment(text) {
10597 return document.createComment(text);
10599 function insertBefore$1(parentNode, newNode, referenceNode) {
10600 parentNode.insertBefore(newNode, referenceNode);
10602 function removeChild(node, child) {
10603 if (!node) { return; }
10604 node.removeChild(child);
10606 function appendChild(node, child) {
10607 node.appendChild(child);
10609 function parentNode(node) {
10610 return node.parentNode;
10612 function nextSibling(node) {
10613 return node.nextSibling;
10615 function tagName(elm) {
10616 return elm.tagName;
10618 function setTextContent(node, text) {
10619 node.textContent = text;
10621 function getTextContent(node) {
10622 return node.textContent;
10624 function isElement(node) {
10625 return node.nodeType === 1;
10627 function isText(node) {
10628 return node.nodeType === 3;
10630 function isComment(node) {
10631 return node.nodeType === 8;
10634 createElement: createElement,
10635 createElementNS: createElementNS,
10636 createTextNode: createTextNode,
10637 createComment: createComment,
10638 insertBefore: insertBefore$1,
10639 removeChild: removeChild,
10640 appendChild: appendChild,
10641 parentNode: parentNode,
10642 nextSibling: nextSibling,
10644 setTextContent: setTextContent,
10645 getTextContent: getTextContent,
10646 isElement: isElement,
10648 isComment: isComment,
10651 function isUndef(s) { return s === undefined; }
10652 function isDef(s) { return s !== undefined; }
10653 var emptyNode = vnode('', {}, [], undefined, undefined);
10654 function sameVnode(vnode1, vnode2) {
10655 return vnode1.key === vnode2.key && vnode1.sel === vnode2.sel;
10657 function isVnode(vnode) {
10658 return vnode.sel !== undefined;
10660 function createKeyToOldIdx(children, beginIdx, endIdx) {
10661 var i, map = {}, key, ch;
10662 for (i = beginIdx; i <= endIdx; ++i) {
10666 if (key !== undefined)
10672 var hooks = ['create', 'update', 'remove', 'destroy', 'pre', 'post'];
10673 function init(modules, domApi) {
10674 var i, j, cbs = {};
10675 var api = domApi !== undefined ? domApi : htmlDomApi;
10676 for (i = 0; i < hooks.length; ++i) {
10677 cbs[hooks[i]] = [];
10678 for (j = 0; j < modules.length; ++j) {
10679 var hook = modules[j][hooks[i]];
10680 if (hook !== undefined) {
10681 cbs[hooks[i]].push(hook);
10685 function emptyNodeAt(elm) {
10686 var id = elm.id ? '#' + elm.id : '';
10687 var c = elm.className ? '.' + elm.className.split(' ').join('.') : '';
10688 return vnode(api.tagName(elm).toLowerCase() + id + c, {}, [], undefined, elm);
10690 function createRmCb(childElm, listeners) {
10691 return function rmCb() {
10692 if (--listeners === 0) {
10693 var parent_1 = api.parentNode(childElm);
10694 api.removeChild(parent_1, childElm);
10698 function createElm(vnode, insertedVnodeQueue) {
10699 var i, data = vnode.data;
10700 if (data !== undefined) {
10701 if (isDef(i = data.hook) && isDef(i = i.init)) {
10706 var children = vnode.children, sel = vnode.sel;
10708 if (isUndef(vnode.text)) {
10711 vnode.elm = api.createComment(vnode.text);
10713 else if (sel !== undefined) {
10715 var hashIdx = sel.indexOf('#');
10716 var dotIdx = sel.indexOf('.', hashIdx);
10717 var hash = hashIdx > 0 ? hashIdx : sel.length;
10718 var dot = dotIdx > 0 ? dotIdx : sel.length;
10719 var tag = hashIdx !== -1 || dotIdx !== -1 ? sel.slice(0, Math.min(hash, dot)) : sel;
10720 var elm = vnode.elm = isDef(data) && isDef(i = data.ns) ? api.createElementNS(i, tag)
10721 : api.createElement(tag);
10723 { elm.setAttribute('id', sel.slice(hash + 1, dot)); }
10725 { elm.setAttribute('class', sel.slice(dot + 1).replace(/\./g, ' ')); }
10726 for (i = 0; i < cbs.create.length; ++i)
10727 { cbs.create[i](emptyNode, vnode); }
10728 if (array(children)) {
10729 for (i = 0; i < children.length; ++i) {
10730 var ch = children[i];
10732 api.appendChild(elm, createElm(ch, insertedVnodeQueue));
10736 else if (primitive(vnode.text)) {
10737 api.appendChild(elm, api.createTextNode(vnode.text));
10739 i = vnode.data.hook; // Reuse variable
10742 { i.create(emptyNode, vnode); }
10744 { insertedVnodeQueue.push(vnode); }
10748 vnode.elm = api.createTextNode(vnode.text);
10752 function addVnodes(parentElm, before, vnodes, startIdx, endIdx, insertedVnodeQueue) {
10753 for (; startIdx <= endIdx; ++startIdx) {
10754 var ch = vnodes[startIdx];
10756 api.insertBefore(parentElm, createElm(ch, insertedVnodeQueue), before);
10760 function invokeDestroyHook(vnode) {
10761 var i, j, data = vnode.data;
10762 if (data !== undefined) {
10763 if (isDef(i = data.hook) && isDef(i = i.destroy))
10765 for (i = 0; i < cbs.destroy.length; ++i)
10766 { cbs.destroy[i](vnode); }
10767 if (vnode.children !== undefined) {
10768 for (j = 0; j < vnode.children.length; ++j) {
10769 i = vnode.children[j];
10770 if (i != null && typeof i !== "string
") {
10771 invokeDestroyHook(i);
10777 function removeVnodes(parentElm, vnodes, startIdx, endIdx) {
10778 for (; startIdx <= endIdx; ++startIdx) {
10779 var i_1 = void 0, listeners = void 0, rm = void 0, ch = vnodes[startIdx];
10781 if (isDef(ch.sel)) {
10782 invokeDestroyHook(ch);
10783 listeners = cbs.remove.length + 1;
10784 rm = createRmCb(ch.elm, listeners);
10785 for (i_1 = 0; i_1 < cbs.remove.length; ++i_1)
10786 { cbs.remove[i_1](ch, rm); }
10787 if (isDef(i_1 = ch.data) && isDef(i_1 = i_1.hook) && isDef(i_1 = i_1.remove)) {
10795 api.removeChild(parentElm, ch.elm);
10800 function updateChildren(parentElm, oldCh, newCh, insertedVnodeQueue) {
10801 var oldStartIdx = 0, newStartIdx = 0;
10802 var oldEndIdx = oldCh.length - 1;
10803 var oldStartVnode = oldCh[0];
10804 var oldEndVnode = oldCh[oldEndIdx];
10805 var newEndIdx = newCh.length - 1;
10806 var newStartVnode = newCh[0];
10807 var newEndVnode = newCh[newEndIdx];
10812 while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
10813 if (oldStartVnode == null) {
10814 oldStartVnode = oldCh[++oldStartIdx]; // Vnode might have been moved left
10816 else if (oldEndVnode == null) {
10817 oldEndVnode = oldCh[--oldEndIdx];
10819 else if (newStartVnode == null) {
10820 newStartVnode = newCh[++newStartIdx];
10822 else if (newEndVnode == null) {
10823 newEndVnode = newCh[--newEndIdx];
10825 else if (sameVnode(oldStartVnode, newStartVnode)) {
10826 patchVnode(oldStartVnode, newStartVnode, insertedVnodeQueue);
10827 oldStartVnode = oldCh[++oldStartIdx];
10828 newStartVnode = newCh[++newStartIdx];
10830 else if (sameVnode(oldEndVnode, newEndVnode)) {
10831 patchVnode(oldEndVnode, newEndVnode, insertedVnodeQueue);
10832 oldEndVnode = oldCh[--oldEndIdx];
10833 newEndVnode = newCh[--newEndIdx];
10835 else if (sameVnode(oldStartVnode, newEndVnode)) {
10836 patchVnode(oldStartVnode, newEndVnode, insertedVnodeQueue);
10837 api.insertBefore(parentElm, oldStartVnode.elm, api.nextSibling(oldEndVnode.elm));
10838 oldStartVnode = oldCh[++oldStartIdx];
10839 newEndVnode = newCh[--newEndIdx];
10841 else if (sameVnode(oldEndVnode, newStartVnode)) {
10842 patchVnode(oldEndVnode, newStartVnode, insertedVnodeQueue);
10843 api.insertBefore(parentElm, oldEndVnode.elm, oldStartVnode.elm);
10844 oldEndVnode = oldCh[--oldEndIdx];
10845 newStartVnode = newCh[++newStartIdx];
10848 if (oldKeyToIdx === undefined) {
10849 oldKeyToIdx = createKeyToOldIdx(oldCh, oldStartIdx, oldEndIdx);
10851 idxInOld = oldKeyToIdx[newStartVnode.key];
10852 if (isUndef(idxInOld)) {
10853 api.insertBefore(parentElm, createElm(newStartVnode, insertedVnodeQueue), oldStartVnode.elm);
10854 newStartVnode = newCh[++newStartIdx];
10857 elmToMove = oldCh[idxInOld];
10858 if (elmToMove.sel !== newStartVnode.sel) {
10859 api.insertBefore(parentElm, createElm(newStartVnode, insertedVnodeQueue), oldStartVnode.elm);
10862 patchVnode(elmToMove, newStartVnode, insertedVnodeQueue);
10863 oldCh[idxInOld] = undefined;
10864 api.insertBefore(parentElm, elmToMove.elm, oldStartVnode.elm);
10866 newStartVnode = newCh[++newStartIdx];
10870 if (oldStartIdx <= oldEndIdx || newStartIdx <= newEndIdx) {
10871 if (oldStartIdx > oldEndIdx) {
10872 before = newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].elm;
10873 addVnodes(parentElm, before, newCh, newStartIdx, newEndIdx, insertedVnodeQueue);
10876 removeVnodes(parentElm, oldCh, oldStartIdx, oldEndIdx);
10880 function patchVnode(oldVnode, vnode, insertedVnodeQueue) {
10882 if (isDef(i = vnode.data) && isDef(hook = i.hook) && isDef(i = hook.prepatch)) {
10883 i(oldVnode, vnode);
10885 var elm = vnode.elm = oldVnode.elm;
10886 var oldCh = oldVnode.children;
10887 var ch = vnode.children;
10888 if (oldVnode === vnode)
10890 if (vnode.data !== undefined) {
10891 for (i = 0; i < cbs.update.length; ++i)
10892 { cbs.update[i](oldVnode, vnode); }
10893 i = vnode.data.hook;
10894 if (isDef(i) && isDef(i = i.update))
10895 { i(oldVnode, vnode); }
10897 if (isUndef(vnode.text)) {
10898 if (isDef(oldCh) && isDef(ch)) {
10900 { updateChildren(elm, oldCh, ch, insertedVnodeQueue); }
10902 else if (isDef(ch)) {
10903 if (isDef(oldVnode.text))
10904 { api.setTextContent(elm, ''); }
10905 addVnodes(elm, null, ch, 0, ch.length - 1, insertedVnodeQueue);
10907 else if (isDef(oldCh)) {
10908 removeVnodes(elm, oldCh, 0, oldCh.length - 1);
10910 else if (isDef(oldVnode.text)) {
10911 api.setTextContent(elm, '');
10914 else if (oldVnode.text !== vnode.text) {
10915 api.setTextContent(elm, vnode.text);
10917 if (isDef(hook) && isDef(i = hook.postpatch)) {
10918 i(oldVnode, vnode);
10921 return function patch(oldVnode, vnode) {
10922 var i, elm, parent;
10923 var insertedVnodeQueue = [];
10924 for (i = 0; i < cbs.pre.length; ++i)
10926 if (!isVnode(oldVnode)) {
10927 oldVnode = emptyNodeAt(oldVnode);
10929 if (sameVnode(oldVnode, vnode)) {
10930 patchVnode(oldVnode, vnode, insertedVnodeQueue);
10933 elm = oldVnode.elm;
10934 parent = api.parentNode(elm);
10935 createElm(vnode, insertedVnodeQueue);
10936 if (parent !== null) {
10937 api.insertBefore(parent, vnode.elm, api.nextSibling(elm));
10938 removeVnodes(parent, [oldVnode], 0, 0);
10941 for (i = 0; i < insertedVnodeQueue.length; ++i) {
10942 insertedVnodeQueue[i].data.hook.insert(insertedVnodeQueue[i]);
10944 for (i = 0; i < cbs.post.length; ++i)
10950 var xlinkNS = 'http://www.w3.org/1999/xlink';
10951 var xmlNS = 'http://www.w3.org/XML/1998/namespace';
10952 var colonChar = 58;
10954 function updateAttrs(oldVnode, vnode) {
10955 var key, elm = vnode.elm, oldAttrs = oldVnode.data.attrs, attrs = vnode.data.attrs;
10956 if (!oldAttrs && !attrs)
10958 if (oldAttrs === attrs)
10960 oldAttrs = oldAttrs || {};
10961 attrs = attrs || {};
10962 // update modified attributes, add new attributes
10963 for (key in attrs) {
10964 var cur = attrs[key];
10965 var old = oldAttrs[key];
10967 if (cur === true) {
10968 elm.setAttribute(key, "");
10970 else if (cur === false) {
10971 elm.removeAttribute(key);
10974 if (key.charCodeAt(0) !== xChar) {
10975 elm.setAttribute(key, cur);
10977 else if (key.charCodeAt(3) === colonChar) {
10978 // Assume xml namespace
10979 elm.setAttributeNS(xmlNS, key, cur);
10981 else if (key.charCodeAt(5) === colonChar) {
10982 // Assume xlink namespace
10983 elm.setAttributeNS(xlinkNS, key, cur);
10986 elm.setAttribute(key, cur);
10991 // remove removed attributes
10992 // use `in` operator since the previous `for` iteration uses it (.i.e. add even attributes with undefined value)
10993 // the other option is to remove all attributes with value == undefined
10994 for (key in oldAttrs) {
10995 if (!(key in attrs)) {
10996 elm.removeAttribute(key);
11000 var attributesModule = { create: updateAttrs, update: updateAttrs };
11002 function updateProps(oldVnode, vnode) {
11003 var key, cur, old, elm = vnode.elm, oldProps = oldVnode.data.props, props = vnode.data.props;
11004 if (!oldProps && !props)
11006 if (oldProps === props)
11008 oldProps = oldProps || {};
11009 props = props || {};
11010 for (key in oldProps) {
11015 for (key in props) {
11017 old = oldProps[key];
11018 if (old !== cur && (key !== 'value' || elm[key] !== cur)) {
11023 var propsModule = { create: updateProps, update: updateProps };
11025 var raf = (typeof window !== 'undefined' && window.requestAnimationFrame) || setTimeout;
11026 var nextFrame = function (fn) { raf(function () { raf(fn); }); };
11027 function setNextFrame(obj, prop, val) {
11028 nextFrame(function () { obj[prop] = val; });
11030 function updateStyle(oldVnode, vnode) {
11031 var cur, name, elm = vnode.elm, oldStyle = oldVnode.data.style, style = vnode.data.style;
11032 if (!oldStyle && !style)
11034 if (oldStyle === style)
11036 oldStyle = oldStyle || {};
11037 style = style || {};
11038 var oldHasDel = 'delayed' in oldStyle;
11039 for (name in oldStyle) {
11040 if (!style[name]) {
11041 if (name[0] === '-' && name[1] === '-') {
11042 elm.style.removeProperty(name);
11045 elm.style[name] = '';
11049 for (name in style) {
11051 if (name === 'delayed' && style.delayed) {
11052 for (var name2 in style.delayed) {
11053 cur = style.delayed[name2];
11054 if (!oldHasDel || cur !== oldStyle.delayed[name2]) {
11055 setNextFrame(elm.style, name2, cur);
11059 else if (name !== 'remove' && cur !== oldStyle[name]) {
11060 if (name[0] === '-' && name[1] === '-') {
11061 elm.style.setProperty(name, cur);
11064 elm.style[name] = cur;
11069 function applyDestroyStyle(vnode) {
11070 var style, name, elm = vnode.elm, s = vnode.data.style;
11071 if (!s || !(style = s.destroy))
11073 for (name in style) {
11074 elm.style[name] = style[name];
11077 function applyRemoveStyle(vnode, rm) {
11078 var s = vnode.data.style;
11079 if (!s || !s.remove) {
11083 var name, elm = vnode.elm, i = 0, compStyle, style = s.remove, amount = 0, applied = [];
11084 for (name in style) {
11085 applied.push(name);
11086 elm.style[name] = style[name];
11088 compStyle = getComputedStyle(elm);
11089 var props = compStyle['transition-property'].split(', ');
11090 for (; i < props.length; ++i) {
11091 if (applied.indexOf(props[i]) !== -1)
11094 elm.addEventListener('transitionend', function (ev) {
11095 if (ev.target === elm)
11101 var styleModule = {
11102 create: updateStyle,
11103 update: updateStyle,
11104 destroy: applyDestroyStyle,
11105 remove: applyRemoveStyle
11108 function invokeHandler(handler, event, args) {
11109 if (typeof handler === 'function') {
11110 // call function handler
11111 handler.apply(void 0, [ event ].concat( args ));
11114 function handleEvent(event, args, vnode) {
11115 var name = event.type;
11116 var on = vnode.data.on;
11117 // call event handler(s) if exists
11118 if (on && on[name]) {
11119 invokeHandler(on[name], event, args);
11122 function createListener() {
11123 return function handler(event) {
11124 var args = [], len = arguments.length - 1;
11125 while ( len-- > 0 ) args[ len ] = arguments[ len + 1 ];
11127 handleEvent(event, args, handler.vnode);
11130 function updateEvents(oldVnode, vnode) {
11131 var oldOn = oldVnode.data.on;
11132 var oldListener = oldVnode.listener;
11133 var oldElm = oldVnode.elm;
11134 var on = vnode && vnode.data.on;
11135 var elm = (vnode && vnode.elm);
11136 // optimization for reused immutable handlers
11137 if (oldOn === on) {
11140 // remove existing listeners which no longer used
11141 if (oldOn && oldListener) {
11142 // if element changed or deleted we remove all existing listeners unconditionally
11144 Object.keys(oldOn).forEach(function (name) {
11145 $(oldElm).off(name, oldListener);
11148 Object.keys(oldOn).forEach(function (name) {
11150 $(oldElm).off(name, oldListener);
11155 // add new listeners which has not already attached
11157 // reuse existing listener or create new
11158 var listener = oldVnode.listener || createListener();
11159 vnode.listener = listener;
11160 // update vnode for listener
11161 listener.vnode = vnode;
11162 // if element changed or added we add all needed listeners unconditionally
11164 Object.keys(on).forEach(function (name) {
11165 $(elm).on(name, listener);
11168 Object.keys(on).forEach(function (name) {
11169 if (!oldOn[name]) {
11170 $(elm).on(name, listener);
11177 var eventListenersModule = {
11178 create: updateEvents,
11179 update: updateEvents,
11180 destroy: updateEvents,
11183 /* eslint import/no-named-as-default: off */
11189 eventListenersModule ]);
11191 var Framework7Component = function Framework7Component(app, options, extendContext) {
11192 if ( extendContext === void 0 ) extendContext = {};
11194 var id = Utils.id();
11195 var self = Utils.merge(
11204 $options: Utils.extend({ id: id }, options),
11205 $id: options.id || id,
11208 var $options = self.$options;
11210 // Root data and methods
11211 Object.defineProperty(self, '$root', {
11213 configurable: true,
11214 get: function get() {
11215 var root = Utils.merge({}, app.data, app.methods);
11216 if (win && win.Proxy) {
11217 root = new win.Proxy(root, {
11218 set: function set(target, name, val) {
11219 app.data[name] = val;
11221 deleteProperty: function deleteProperty(target, name) {
11222 delete app.data[name];
11223 delete app.methods[name];
11225 has: function has(target, name) {
11226 return (name in app.data || name in app.methods);
11232 set: function set() {},
11236 ('beforeCreate created beforeMount mounted beforeDestroy destroyed updated').split(' ').forEach(function (cycleKey) {
11237 if ($options[cycleKey]) { $options[cycleKey] = $options[cycleKey].bind(self); }
11240 if ($options.data) {
11241 $options.data = $options.data.bind(self);
11243 Utils.extend(self, $options.data());
11245 if ($options.render) { $options.render = $options.render.bind(self); }
11246 if ($options.methods) {
11247 Object.keys($options.methods).forEach(function (methodName) {
11248 self[methodName] = $options.methods[methodName].bind(self);
11254 Object.keys($options.on).forEach(function (eventName) {
11255 $options.on[eventName] = $options.on[eventName].bind(self);
11258 if ($options.once) {
11259 Object.keys($options.once).forEach(function (eventName) {
11260 $options.once[eventName] = $options.once[eventName].bind(self);
11264 // Before create hook
11265 if ($options.beforeCreate) { $options.beforeCreate(); }
11268 var html = self.$render();
11271 if (html && typeof html === 'string') {
11272 html = html.trim();
11273 self.$vnode = vdom(html, self, app, true);
11274 self.el = doc.createElement('div');
11275 patch(self.el, self.$vnode);
11279 self.$el = $(self.el);
11281 // Set styles scope ID
11282 if ($options.style) {
11283 self.$styleEl = doc.createElement('style');
11284 self.$styleEl.innerHTML = $options.style;
11285 if ($options.styleScoped) {
11286 self.el.setAttribute(("data
-f7
-" + ($options.id)), '');
11290 self.$attachEvents();
11292 // Created callback
11293 if ($options.created) { $options.created(); }
11295 // Store component instance
11296 self.el.f7Component = self;
11301 Framework7Component.prototype.$attachEvents = function $attachEvents () {
11303 var $options = self.$options;
11304 var $el = self.$el;
11306 Object.keys($options.on).forEach(function (eventName) {
11307 $el.on(Utils.eventNameToColonCase(eventName), $options.on[eventName]);
11310 if ($options.once) {
11311 Object.keys($options.once).forEach(function (eventName) {
11312 $el.once(Utils.eventNameToColonCase(eventName), $options.once[eventName]);
11317 Framework7Component.prototype.$detachEvents = function $detachEvents () {
11319 var $options = self.$options;
11320 var $el = self.$el;
11322 Object.keys($options.on).forEach(function (eventName) {
11323 $el.off(Utils.eventNameToColonCase(eventName), $options.on[eventName]);
11326 if ($options.once) {
11327 Object.keys($options.once).forEach(function (eventName) {
11328 $el.off(Utils.eventNameToColonCase(eventName), $options.once[eventName]);
11333 Framework7Component.prototype.$render = function $render () {
11335 var $options = self.$options;
11337 if ($options.render) {
11338 html = $options.render();
11339 } else if ($options.template) {
11340 if (typeof $options.template === 'string') {
11342 html = Template7.compile($options.template)(self);
11347 // Supposed to be function
11348 html = $options.template(self);
11354 Framework7Component.prototype.$forceUpdate = function $forceUpdate () {
11356 var html = self.$render();
11359 if (html && typeof html === 'string') {
11360 html = html.trim();
11361 var newVNode = vdom(html, self, self.$app);
11362 self.$vnode = patch(self.$vnode, newVNode);
11366 Framework7Component.prototype.$setState = function $setState (mergeState) {
11368 Utils.merge(self, mergeState);
11369 self.$forceUpdate();
11372 Framework7Component.prototype.$mount = function $mount (mountMethod) {
11374 if (self.$options.beforeMount) { self.$options.beforeMount(); }
11375 if (self.$styleEl) { $('head').append(self.$styleEl); }
11376 if (mountMethod) { mountMethod(self.el); }
11377 if (self.$options.mounted) { self.$options.mounted(); }
11380 Framework7Component.prototype.$destroy = function $destroy () {
11382 if (self.$options.beforeDestroy) { self.$options.beforeDestroy(); }
11383 if (self.$styleEl) { $(self.$styleEl).remove(); }
11384 self.$detachEvents();
11385 if (self.$options.destroyed) { self.$options.destroyed(); }
11386 // Delete component instance
11387 if (self.el && self.el.f7Component) {
11388 self.el.f7Component = null;
11389 delete self.el.f7Component;
11391 // Patch with empty node
11393 self.$vnode = patch(self.$vnode, { sel: self.$vnode.sel, data: {} });
11395 Utils.deleteProps(self);
11398 function parseComponent(componentString) {
11399 var id = Utils.id();
11400 var callbackCreateName = "f7_component_create_callback_
" + id;
11401 var callbackRenderName = "f7_component_render_callback_
" + id;
11405 var hasTemplate = componentString.match(/<template([ ]?)([a-z0-9-]*)>/);
11406 var templateType = hasTemplate[2] || 't7';
11408 template = componentString
11409 .split(/<template[ ]?[a-z0-9-]*>/)
11410 .filter(function (item, index) { return index > 0; })
11411 .join('<template>')
11412 .split('</template>')
11413 .filter(function (item, index, arr) { return index < arr.length - 1; })
11414 .join('</template>')
11415 .replace(/{{#raw}}([ \n]*)<template/g, '{{#raw}}<template')
11416 .replace(/\/template>([ \n]*){{\/raw}}/g, '/template>{{/raw}}')
11417 .replace(/([ \n])<template/g, '$1{{#raw}}<template')
11418 .replace(/\/template>([ \n])/g, '/template>{{/raw}}$1');
11423 var styleScoped = false;
11425 if (componentString.indexOf('<style>') >= 0) {
11426 style = componentString.split('<style>')[1].split('</style>')[0];
11427 } else if (componentString.indexOf('<style scoped>') >= 0) {
11428 styleScoped = true;
11429 style = componentString.split('<style scoped>')[1].split('</style>')[0];
11430 style = style.split('\n').map(function (line) {
11431 var trimmedLine = line.trim();
11432 if (trimmedLine.indexOf('@') === 0) { return line; }
11433 if (line.indexOf('{') >= 0) {
11434 if (line.indexOf('{{this}}') >= 0) {
11435 return line.replace('{{this}}', ("[data
-f7
-" + id + "]"));
11437 return ("[data
-f7
-" + id + "] " + (line.trim()));
11446 if (componentString.indexOf('<script>') >= 0) {
11447 var scripts = componentString.split('<script>');
11448 scriptContent = scripts[scripts.length - 1].split('</script>')[0].trim();
11450 scriptContent = 'return {}';
11452 if (!scriptContent || !scriptContent.trim()) { scriptContent = 'return {}'; }
11454 scriptContent = "window
." + callbackCreateName + " = function () {" + scriptContent + "}";
11456 // Insert Script El
11457 scriptEl = doc.createElement('script');
11458 scriptEl.innerHTML = scriptContent;
11459 $('head').append(scriptEl);
11461 var component = win[callbackCreateName]();
11463 // Remove Script El
11464 $(scriptEl).remove();
11465 win[callbackCreateName] = null;
11466 delete win[callbackCreateName];
11469 if (!component.template && !component.render) {
11470 component.template = template;
11471 component.templateType = templateType;
11473 if (component.template) {
11474 if (component.templateType === 't7') {
11475 component.template = Template7.compile(component.template);
11477 if (component.templateType === 'es') {
11478 var renderContent = "window
." + callbackRenderName + " = function () {\n return function render() {\n return `" + (component.template) + "`;\n }\n }";
11479 scriptEl = doc.createElement('script');
11480 scriptEl.innerHTML = renderContent;
11481 $('head').append(scriptEl);
11483 component.render = win[callbackRenderName]();
11485 // Remove Script El
11486 $(scriptEl).remove();
11487 win[callbackRenderName] = null;
11488 delete win[callbackRenderName];
11494 component.style = style;
11495 component.styleScoped = styleScoped;
11503 var ComponentModule = {
11505 create: function create() {
11508 parse: function parse(componentString) {
11509 return parseComponent(componentString);
11511 create: function create(options, extendContext) {
11512 return new Framework7Component(app, options, extendContext);
11520 register: function register(path, scope) {
11522 if (!('serviceWorker' in window.navigator) || !app.serviceWorker.container) {
11523 return new Promise(function (resolve, reject) {
11524 reject(new Error('Service worker is not supported'));
11527 return new Promise(function (resolve, reject) {
11528 app.serviceWorker.container.register(path, (scope ? { scope: scope } : {}))
11529 .then(function (reg) {
11530 SW.registrations.push(reg);
11531 app.emit('serviceWorkerRegisterSuccess', reg);
11533 }).catch(function (error) {
11534 app.emit('serviceWorkerRegisterError', error);
11539 unregister: function unregister(registration) {
11541 if (!('serviceWorker' in window.navigator) || !app.serviceWorker.container) {
11542 return new Promise(function (resolve, reject) {
11543 reject(new Error('Service worker is not supported'));
11547 if (!registration) { registrations = SW.registrations; }
11548 else if (Array.isArray(registration)) { registrations = registration; }
11549 else { registrations = [registration]; }
11550 return Promise.all(registrations.map(function (reg) { return new Promise(function (resolve, reject) {
11552 .then(function () {
11553 if (SW.registrations.indexOf(reg) >= 0) {
11554 SW.registrations.splice(SW.registrations.indexOf(reg), 1);
11556 app.emit('serviceWorkerUnregisterSuccess', reg);
11559 .catch(function (error) {
11560 app.emit('serviceWorkerUnregisterError', reg, error);
11567 var ServiceWorkerModule = {
11575 create: function create() {
11577 Utils.extend(app, {
11579 container: ('serviceWorker' in window.navigator) ? window.navigator.serviceWorker : undefined,
11580 registrations: SW.registrations,
11581 register: SW.register.bind(app),
11582 unregister: SW.unregister.bind(app),
11587 init: function init() {
11588 if (!('serviceWorker' in window.navigator)) { return; }
11590 if (!app.serviceWorker.container) { return; }
11591 var paths = app.params.serviceWorker.path;
11592 var scope = app.params.serviceWorker.scope;
11593 if (!paths || (Array.isArray(paths) && !paths.length)) { return; }
11594 var toRegister = Array.isArray(paths) ? paths : [paths];
11595 toRegister.forEach(function (path) {
11596 app.serviceWorker.register(path, scope);
11603 hide: function hide() {
11604 $('html').removeClass('with-statusbar');
11605 if (Device.cordova && win.StatusBar) {
11606 win.StatusBar.hide();
11609 show: function show() {
11610 if (Device.cordova && win.StatusBar) {
11611 win.StatusBar.show();
11612 Utils.nextTick(function () {
11613 if (Device.needsStatusbarOverlay()) {
11614 $('html').addClass('with-statusbar');
11619 $('html').addClass('with-statusbar');
11621 onClick: function onClick() {
11624 if ($('.popup.modal-in').length > 0) {
11625 // Check for opened popup
11626 pageContent = $('.popup.modal-in').find('.page:not(.page-previous):not(.page-next):not(.cached)').find('.page-content');
11627 } else if ($('.panel.panel-active').length > 0) {
11628 // Check for opened panel
11629 pageContent = $('.panel.panel-active').find('.page:not(.page-previous):not(.page-next):not(.cached)').find('.page-content');
11630 } else if ($('.views > .view.tab-active').length > 0) {
11631 // View in tab bar app layout
11632 pageContent = $('.views > .view.tab-active').find('.page:not(.page-previous):not(.page-next):not(.cached)').find('.page-content');
11633 } else if ($('.views').length > 0) {
11634 pageContent = $('.views').find('.page:not(.page-previous):not(.page-next):not(.cached)').find('.page-content');
11636 pageContent = app.root.children('.view').find('.page:not(.page-previous):not(.page-next):not(.cached)').find('.page-content');
11639 if (pageContent && pageContent.length > 0) {
11641 if (pageContent.hasClass('tab')) {
11642 pageContent = pageContent.parent('.tabs').children('.page-content.tab-active');
11644 if (pageContent.length > 0) { pageContent.scrollTop(0, 300); }
11647 setTextColor: function setTextColor(color) {
11648 if (Device.cordova && win.StatusBar) {
11649 if (color === 'white') {
11650 win.StatusBar.styleLightContent();
11652 win.StatusBar.styleDefault();
11656 setIosTextColor: function setIosTextColor(color) {
11657 if (!Device.ios) { return; }
11658 Statusbar.setTextColor(color);
11660 setBackgroundColor: function setBackgroundColor(color) {
11661 $('.statusbar').css('background-color', color);
11662 if (Device.cordova && win.StatusBar) {
11663 win.StatusBar.backgroundColorByHexString(color);
11666 isVisible: function isVisible() {
11667 if (Device.cordova && win.StatusBar) {
11668 return win.StatusBar.isVisible;
11672 overlaysWebView: function overlaysWebView(overlays) {
11673 if ( overlays === void 0 ) overlays = true;
11675 if (Device.cordova && win.StatusBar) {
11676 win.StatusBar.overlaysWebView(overlays);
11678 $('html').addClass('with-statusbar');
11680 $('html').removeClass('with-statusbar');
11684 checkOverlay: function checkOverlay() {
11685 if (Device.needsStatusbarOverlay()) {
11686 $('html').addClass('with-statusbar');
11688 $('html').removeClass('with-statusbar');
11691 init: function init() {
11693 var params = app.params.statusbar;
11694 if (!params.enabled) { return; }
11696 if (params.overlay === 'auto') {
11697 if (Device.needsStatusbarOverlay()) {
11698 $('html').addClass('with-statusbar');
11700 $('html').removeClass('with-statusbar');
11703 if (Device.ios && (Device.cordova || Device.webView)) {
11704 if (win.orientation === 0) {
11705 app.once('resize', function () {
11706 Statusbar.checkOverlay();
11710 $(doc).on('resume', function () {
11711 Statusbar.checkOverlay();
11714 app.on(Device.ios ? 'orientationchange' : 'orientationchange resize', function () {
11715 Statusbar.checkOverlay();
11718 } else if (params.overlay === true) {
11719 $('html').addClass('with-statusbar');
11720 } else if (params.overlay === false) {
11721 $('html').removeClass('with-statusbar');
11724 if (Device.cordova && win.StatusBar) {
11725 if (params.scrollTopOnClick) {
11726 $(win).on('statusTap', Statusbar.onClick.bind(app));
11729 if (params.iosOverlaysWebView) {
11730 win.StatusBar.overlaysWebView(true);
11732 win.StatusBar.overlaysWebView(false);
11734 if (params.iosTextColor === 'white') {
11735 win.StatusBar.styleLightContent();
11737 win.StatusBar.styleDefault();
11740 if (Device.android) {
11741 if (params.androidOverlaysWebView) {
11742 win.StatusBar.overlaysWebView(true);
11744 win.StatusBar.overlaysWebView(false);
11746 if (params.androidTextColor === 'white') {
11747 win.StatusBar.styleLightContent();
11749 win.StatusBar.styleDefault();
11753 if (params.iosBackgroundColor && Device.ios) {
11754 Statusbar.setBackgroundColor(params.iosBackgroundColor);
11756 if ((params.materialBackgroundColor || params.androidBackgroundColor) && Device.android) {
11757 Statusbar.setBackgroundColor(params.materialBackgroundColor || params.androidBackgroundColor);
11762 var Statusbar$1 = {
11768 scrollTopOnClick: true,
11770 iosOverlaysWebView: true,
11771 iosTextColor: 'black',
11772 iosBackgroundColor: null,
11774 androidOverlaysWebView: false,
11775 androidTextColor: 'black',
11776 androidBackgroundColor: null,
11779 create: function create() {
11781 Utils.extend(app, {
11783 checkOverlay: Statusbar.checkOverlay,
11784 hide: Statusbar.hide,
11785 show: Statusbar.show,
11786 overlaysWebView: Statusbar.overlaysWebView,
11787 setTextColor: Statusbar.setTextColor,
11788 setBackgroundColor: Statusbar.setBackgroundColor,
11789 isVisible: Statusbar.isVisible,
11790 init: Statusbar.init.bind(app),
11795 init: function init() {
11797 Statusbar.init.call(app);
11801 '.statusbar': function onStatusbarClick() {
11803 if (!app.params.statusbar.enabled) { return; }
11804 if (!app.params.statusbar.scrollTopOnClick) { return; }
11805 Statusbar.onClick.call(app);
11810 function getCurrentView(app) {
11811 var $popoverView = $('.popover.modal-in .view');
11812 var $popupView = $('.popup.modal-in .view');
11813 var $panelView = $('.panel.panel-active .view');
11814 var $viewsEl = $('.views');
11815 if ($viewsEl.length === 0) { $viewsEl = app.root; }
11816 // Find active view as tab
11817 var $viewEl = $viewsEl.children('.view');
11818 // Propably in tabs or split view
11819 if ($viewEl.length > 1) {
11820 if ($viewEl.hasClass('tab')) {
11822 $viewEl = $viewsEl.children('.view.tab-active');
11825 if ($popoverView.length > 0 && $popoverView[0].f7View) { return $popoverView[0].f7View; }
11826 if ($popupView.length > 0 && $popupView[0].f7View) { return $popupView[0].f7View; }
11827 if ($panelView.length > 0 && $panelView[0].f7View) { return $panelView[0].f7View; }
11828 if ($viewEl.length > 0) {
11829 if ($viewEl.length === 1 && $viewEl[0].f7View) { return $viewEl[0].f7View; }
11830 if ($viewEl.length > 1) {
11831 return app.views.main;
11847 xhrCacheIgnore: [],
11848 xhrCacheIgnoreGetParameters: false,
11849 xhrCacheDuration: 1000 * 60 * 10, // Ten minutes
11850 preloadPreviousPage: true,
11851 allowDuplicateUrls: false,
11852 reloadPages: false,
11853 reloadDetail: false,
11854 masterDetailBreakpoint: 0,
11855 removeElements: true,
11856 removeElementsWithTimeout: false,
11857 removeElementsTimeout: 0,
11858 restoreScrollTopOnBack: true,
11859 unloadTabContent: true,
11860 passRouteQueryToRequest: true,
11861 passRouteParamsToRequest: false,
11863 iosSwipeBack: true,
11864 iosSwipeBackAnimateShadow: true,
11865 iosSwipeBackAnimateOpacity: true,
11866 iosSwipeBackActiveArea: 30,
11867 iosSwipeBackThreshold: 0,
11868 mdSwipeBack: false,
11869 mdSwipeBackAnimateShadow: true,
11870 mdSwipeBackAnimateOpacity: false,
11871 mdSwipeBackActiveArea: 30,
11872 mdSwipeBackThreshold: 0,
11873 auroraSwipeBack: false,
11874 auroraSwipeBackAnimateShadow: false,
11875 auroraSwipeBackAnimateOpacity: true,
11876 auroraSwipeBackActiveArea: 30,
11877 auroraSwipeBackThreshold: 0,
11880 pushStateRoot: undefined,
11881 pushStateAnimate: true,
11882 pushStateAnimateOnLoad: false,
11883 pushStateSeparator: '#!',
11884 pushStateOnLoad: true,
11887 // iOS Dynamic Navbar
11888 iosDynamicNavbar: true,
11889 iosSeparateDynamicNavbar: true,
11890 // Animate iOS Navbar Back Icon
11891 iosAnimateNavbarBackIcon: true,
11893 iosPageLoadDelay: 0,
11894 mdPageLoadDelay: 0,
11895 auroraPageLoadDelay: 0,
11897 routesBeforeEnter: null,
11898 routesBeforeLeave: null,
11904 create: function create() {
11906 Utils.extend(app, {
11907 views: Utils.extend([], {
11908 create: function create(el, params) {
11909 return new View(app, el, params);
11911 get: function get(viewEl) {
11912 var $viewEl = $(viewEl);
11913 if ($viewEl.length && $viewEl[0].f7View) { return $viewEl[0].f7View; }
11918 Object.defineProperty(app.views, 'current', {
11920 configurable: true,
11921 get: function get() {
11922 return getCurrentView(app);
11926 app.view = app.views;
11929 init: function init() {
11931 $('.view-init').each(function (index, viewEl) {
11932 if (viewEl.f7View) { return; }
11933 var viewParams = $(viewEl).dataset();
11934 app.views.create(viewEl, viewParams);
11937 modalOpen: function modalOpen(modal) {
11939 modal.$el.find('.view-init').each(function (index, viewEl) {
11940 if (viewEl.f7View) { return; }
11941 var viewParams = $(viewEl).dataset();
11942 app.views.create(viewEl, viewParams);
11945 modalBeforeDestroy: function modalBeforeDestroy(modal) {
11946 if (!modal || !modal.$el) { return; }
11947 modal.$el.find('.view-init').each(function (index, viewEl) {
11948 var view = viewEl.f7View;
11949 if (!view) { return; }
11957 size: function size(el) {
11959 if (app.theme !== 'ios' && !app.params.navbar[((app.theme) + "CenterTitle
")]) {
11963 if ($el.hasClass('navbar')) {
11964 $el = $el.children('.navbar-inner').each(function (index, navbarEl) {
11965 app.navbar.size(navbarEl);
11971 $el.hasClass('stacked')
11972 || $el.parents('.stacked').length > 0
11973 || $el.parents('.tab:not(.tab-active)').length > 0
11974 || $el.parents('.popup:not(.modal-in)').length > 0
11979 if (app.theme !== 'ios' && app.params.navbar[((app.theme) + "CenterTitle
")]) {
11980 $el.addClass('navbar-inner-centered-title');
11982 if (app.theme === 'ios' && !app.params.navbar.iosCenterTitle) {
11983 $el.addClass('navbar-inner-left-title');
11986 var $viewEl = $el.parents('.view').eq(0);
11987 var left = app.rtl ? $el.children('.right') : $el.children('.left');
11988 var right = app.rtl ? $el.children('.left') : $el.children('.right');
11989 var title = $el.children('.title');
11990 var subnavbar = $el.children('.subnavbar');
11991 var noLeft = left.length === 0;
11992 var noRight = right.length === 0;
11993 var leftWidth = noLeft ? 0 : left.outerWidth(true);
11994 var rightWidth = noRight ? 0 : right.outerWidth(true);
11995 var titleWidth = title.outerWidth(true);
11996 var navbarStyles = $el.styles();
11997 var navbarWidth = $el[0].offsetWidth;
11998 var navbarInnerWidth = navbarWidth - parseInt(navbarStyles.paddingLeft, 10) - parseInt(navbarStyles.paddingRight, 10);
11999 var isPrevious = $el.hasClass('navbar-previous');
12000 var sliding = $el.hasClass('sliding');
12004 var separateNavbar;
12005 var separateNavbarRightOffset = 0;
12006 var separateNavbarLeftOffset = 0;
12008 if ($viewEl.length > 0 && $viewEl[0].f7View) {
12009 router = $viewEl[0].f7View.router;
12010 dynamicNavbar = router && router.dynamicNavbar;
12011 separateNavbar = router && router.separateNavbar;
12012 if (!separateNavbar) {
12013 separateNavbarRightOffset = navbarWidth;
12014 separateNavbarLeftOffset = navbarWidth / 5;
12021 currLeft = navbarInnerWidth - titleWidth;
12026 if (!noLeft && !noRight) {
12027 currLeft = ((navbarInnerWidth - rightWidth - titleWidth) + leftWidth) / 2;
12029 var requiredLeft = (navbarInnerWidth - titleWidth) / 2;
12030 if (navbarInnerWidth - leftWidth - rightWidth > titleWidth) {
12031 if (requiredLeft < leftWidth) {
12032 requiredLeft = leftWidth;
12034 if (requiredLeft + titleWidth > navbarInnerWidth - rightWidth) {
12035 requiredLeft = navbarInnerWidth - rightWidth - titleWidth;
12037 diff = requiredLeft - currLeft;
12043 var inverter = app.rtl ? -1 : 1;
12045 if (dynamicNavbar && app.theme === 'ios') {
12046 if (title.hasClass('sliding') || (title.length > 0 && sliding)) {
12047 var titleLeftOffset = (-(currLeft + diff) * inverter) + separateNavbarLeftOffset;
12048 var titleRightOffset = ((navbarInnerWidth - currLeft - diff - titleWidth) * inverter) - separateNavbarRightOffset;
12051 if (router && router.params.iosAnimateNavbarBackIcon) {
12052 var activeNavbarBackLink = $el.parent().find('.navbar-current').children('.left.sliding').find('.back .icon ~ span');
12053 if (activeNavbarBackLink.length > 0) {
12054 titleLeftOffset += activeNavbarBackLink[0].offsetLeft;
12058 title[0].f7NavbarLeftOffset = titleLeftOffset;
12059 title[0].f7NavbarRightOffset = titleRightOffset;
12061 if (!noLeft && (left.hasClass('sliding') || sliding)) {
12063 left[0].f7NavbarLeftOffset = (-(navbarInnerWidth - left[0].offsetWidth) / 2) * inverter;
12064 left[0].f7NavbarRightOffset = leftWidth * inverter;
12066 left[0].f7NavbarLeftOffset = -leftWidth + separateNavbarLeftOffset;
12067 left[0].f7NavbarRightOffset = ((navbarInnerWidth - left[0].offsetWidth) / 2) - separateNavbarRightOffset;
12068 if (router && router.params.iosAnimateNavbarBackIcon && left.find('.back .icon').length > 0) {
12069 if (left.find('.back .icon ~ span').length) {
12070 var leftOffset = left[0].f7NavbarLeftOffset;
12071 var rightOffset = left[0].f7NavbarRightOffset;
12072 left[0].f7NavbarLeftOffset = 0;
12073 left[0].f7NavbarRightOffset = 0;
12074 left.find('.back .icon ~ span')[0].f7NavbarLeftOffset = leftOffset;
12075 left.find('.back .icon ~ span')[0].f7NavbarRightOffset = rightOffset - left.find('.back .icon')[0].offsetWidth;
12080 if (!noRight && (right.hasClass('sliding') || sliding)) {
12082 right[0].f7NavbarLeftOffset = -rightWidth * inverter;
12083 right[0].f7NavbarRightOffset = ((navbarInnerWidth - right[0].offsetWidth) / 2) * inverter;
12085 right[0].f7NavbarLeftOffset = (-(navbarInnerWidth - right[0].offsetWidth) / 2) + separateNavbarLeftOffset;
12086 right[0].f7NavbarRightOffset = rightWidth - separateNavbarRightOffset;
12089 if (subnavbar.length && (subnavbar.hasClass('sliding') || sliding)) {
12090 subnavbar[0].f7NavbarLeftOffset = app.rtl ? subnavbar[0].offsetWidth : (-subnavbar[0].offsetWidth + separateNavbarLeftOffset);
12091 subnavbar[0].f7NavbarRightOffset = (-subnavbar[0].f7NavbarLeftOffset - separateNavbarRightOffset) + separateNavbarLeftOffset;
12096 if (app.params.navbar[((app.theme) + "CenterTitle
")]) {
12097 var titleLeft = diff;
12098 if (app.rtl && noLeft && noRight && title.length > 0) { titleLeft = -titleLeft; }
12099 title.css({ left: (titleLeft + "px
") });
12102 hide: function hide(el, animate) {
12103 if ( animate === void 0 ) animate = true;
12107 if ($el.hasClass('navbar-inner')) { $el = $el.parents('.navbar'); }
12108 if (!$el.length) { return; }
12109 if ($el.hasClass('navbar-hidden')) { return; }
12110 var className = "navbar
-hidden
" + (animate ? ' navbar-transitioning' : '');
12111 var currentIsLarge = app.theme === 'ios'
12112 ? $el.find('.navbar-current .title-large').length
12113 : $el.find('.title-large').length;
12114 if (currentIsLarge) {
12115 className += ' navbar-large-hidden';
12117 $el.transitionEnd(function () {
12118 $el.removeClass('navbar-transitioning');
12120 $el.addClass(className);
12121 $el.trigger('navbar:hide');
12122 app.emit('navbarHide', $el[0]);
12124 show: function show(el, animate) {
12125 if ( el === void 0 ) el = '.navbar-hidden';
12126 if ( animate === void 0 ) animate = true;
12130 if ($el.hasClass('navbar-inner')) { $el = $el.parents('.navbar'); }
12131 if (!$el.length) { return; }
12132 if (!$el.hasClass('navbar-hidden')) { return; }
12134 $el.addClass('navbar-transitioning');
12135 $el.transitionEnd(function () {
12136 $el.removeClass('navbar-transitioning');
12139 $el.removeClass('navbar-hidden navbar-large-hidden');
12140 $el.trigger('navbar:show');
12141 app.emit('navbarShow', $el[0]);
12143 getElByPage: function getElByPage(page) {
12145 var $navbarInnerEl;
12147 if (page.$navbarEl || page.$el) {
12149 $pageEl = page.$el;
12152 if ($pageEl.length > 0) { pageData = $pageEl[0].f7Page; }
12154 if (pageData && pageData.$navbarEl && pageData.$navbarEl.length > 0) {
12155 $navbarInnerEl = pageData.$navbarEl;
12156 } else if ($pageEl) {
12157 $navbarInnerEl = $pageEl.children('.navbar').children('.navbar-inner');
12159 if (!$navbarInnerEl || ($navbarInnerEl && $navbarInnerEl.length === 0)) { return undefined; }
12160 return $navbarInnerEl[0];
12162 getPageByEl: function getPageByEl(navbarInnerEl) {
12163 var $navbarInnerEl = $(navbarInnerEl);
12164 if ($navbarInnerEl.hasClass('navbar')) {
12165 $navbarInnerEl = $navbarInnerEl.find('.navbar-inner');
12166 if ($navbarInnerEl.length > 1) { return undefined; }
12168 if ($navbarInnerEl.parents('.page').length) {
12169 return $navbarInnerEl.parents('.page')[0];
12172 $navbarInnerEl.parents('.view').find('.page').each(function (index, el) {
12173 if (el && el.f7Page && el.f7Page.navbarEl && $navbarInnerEl[0] === el.f7Page.navbarEl) {
12180 collapseLargeTitle: function collapseLargeTitle(navbarInnerEl) {
12182 var $navbarInnerEl = $(navbarInnerEl);
12183 if ($navbarInnerEl.hasClass('navbar')) {
12184 $navbarInnerEl = $navbarInnerEl.find('.navbar-inner-large');
12185 if ($navbarInnerEl.length > 1) {
12186 $navbarInnerEl = $(navbarInnerEl).find('.navbar-inner-large.navbar-current');
12188 if ($navbarInnerEl.length > 1 || !$navbarInnerEl.length) {
12192 var $pageEl = $(app.navbar.getPageByEl($navbarInnerEl));
12193 $navbarInnerEl.addClass('navbar-inner-large-collapsed');
12194 $pageEl.eq(0).addClass('page-with-navbar-large-collapsed').trigger('page:navbarlargecollapsed');
12195 app.emit('pageNavbarLargeCollapsed', $pageEl[0]);
12196 var $navbarEl = $navbarInnerEl.parents('.navbar');
12197 if (app.theme === 'md' || app.theme === 'aurora') {
12198 $navbarEl.addClass('navbar-large-collapsed');
12200 $navbarEl.trigger('navbar:collapse');
12201 app.emit('navbarCollapse', $navbarEl[0]);
12203 expandLargeTitle: function expandLargeTitle(navbarInnerEl) {
12205 var $navbarInnerEl = $(navbarInnerEl);
12206 if ($navbarInnerEl.hasClass('navbar')) {
12207 $navbarInnerEl = $navbarInnerEl.find('.navbar-inner-large');
12208 if ($navbarInnerEl.length > 1) {
12209 $navbarInnerEl = $(navbarInnerEl).find('.navbar-inner-large.navbar-current');
12211 if ($navbarInnerEl.length > 1 || !$navbarInnerEl.length) {
12215 var $pageEl = $(app.navbar.getPageByEl($navbarInnerEl));
12216 $navbarInnerEl.removeClass('navbar-inner-large-collapsed');
12217 $pageEl.eq(0).removeClass('page-with-navbar-large-collapsed').trigger('page:navbarlargeexpanded');
12218 app.emit('pageNavbarLargeExpanded', $pageEl[0]);
12219 var $navbarEl = $navbarInnerEl.parents('.navbar');
12220 if (app.theme === 'md' || app.theme === 'aurora') {
12221 $navbarEl.removeClass('navbar-large-collapsed');
12223 $navbarEl.trigger('navbar:expand');
12224 app.emit('navbarExpand', $navbarEl[0]);
12226 toggleLargeTitle: function toggleLargeTitle(navbarInnerEl) {
12228 var $navbarInnerEl = $(navbarInnerEl);
12229 if ($navbarInnerEl.hasClass('navbar')) {
12230 $navbarInnerEl = $navbarInnerEl.find('.navbar-inner-large');
12231 if ($navbarInnerEl.length > 1) {
12232 $navbarInnerEl = $(navbarInnerEl).find('.navbar-inner-large.navbar-current');
12234 if ($navbarInnerEl.length > 1 || !$navbarInnerEl.length) {
12238 if ($navbarInnerEl.hasClass('navbar-inner-large-collapsed')) {
12239 app.navbar.expandLargeTitle($navbarInnerEl);
12241 app.navbar.collapseLargeTitle($navbarInnerEl);
12244 initNavbarOnScroll: function initNavbarOnScroll(pageEl, navbarInnerEl, needHide, needCollapse) {
12246 var $pageEl = $(pageEl);
12247 var $navbarInnerEl = $(navbarInnerEl);
12248 var $navbarEl = app.theme === 'md' || app.theme === 'aurora'
12249 ? $navbarInnerEl.parents('.navbar')
12250 : $(navbarInnerEl || app.navbar.getElByPage(pageEl)).closest('.navbar');
12251 var isLarge = $navbarInnerEl.find('.title-large').length || $navbarInnerEl.hasClass('.navbar-inner-large');
12252 var navbarHideHeight = 44;
12253 var snapPageScrollToLargeTitle = app.params.navbar.snapPageScrollToLargeTitle;
12255 var previousScrollTop;
12256 var currentScrollTop;
12264 var navbarCollapsed;
12265 var navbarTitleLargeHeight;
12266 if (needCollapse || (needHide && isLarge)) {
12267 navbarTitleLargeHeight = $navbarInnerEl.css('--f7-navbar-large-title-height');
12268 if (navbarTitleLargeHeight && navbarTitleLargeHeight.indexOf('px') >= 0) {
12269 navbarTitleLargeHeight = parseInt(navbarTitleLargeHeight, 10);
12270 if (Number.isNaN(navbarTitleLargeHeight)) {
12271 if (app.theme === 'ios') { navbarTitleLargeHeight = 52; }
12272 else if (app.theme === 'md') { navbarTitleLargeHeight = 48; }
12273 else if (app.theme === 'aurora') { navbarTitleLargeHeight = 38; }
12275 } else { // eslint-disable-next-line
12276 if (app.theme === 'ios') { navbarTitleLargeHeight = 52; }
12277 else if (app.theme === 'md') { navbarTitleLargeHeight = 48; }
12278 else if (app.theme === 'aurora') { navbarTitleLargeHeight = 38; }
12281 if (needHide && isLarge) {
12282 navbarHideHeight += navbarTitleLargeHeight;
12287 var scrollTimeoutId;
12288 var touchEndTimeoutId;
12289 var touchSnapTimeout = 70;
12290 var desktopSnapTimeout = 300;
12292 function snapLargeNavbar() {
12293 var inSearchbarExpanded = $navbarInnerEl.hasClass('with-searchbar-expandable-enabled');
12294 if (inSearchbarExpanded) { return; }
12295 if (!scrollContent || currentScrollTop < 0) { return; }
12296 if (currentScrollTop >= navbarTitleLargeHeight / 2 && currentScrollTop < navbarTitleLargeHeight) {
12297 $(scrollContent).scrollTop(navbarTitleLargeHeight, 100);
12298 } else if (currentScrollTop < navbarTitleLargeHeight) {
12299 $(scrollContent).scrollTop(0, 200);
12303 function handleLargeNavbarCollapse() {
12304 var collapseProgress = Math.min(Math.max((currentScrollTop / navbarTitleLargeHeight), 0), 1);
12305 var inSearchbarExpanded = $navbarInnerEl.hasClass('with-searchbar-expandable-enabled');
12306 if (inSearchbarExpanded) { return; }
12307 navbarCollapsed = $navbarInnerEl.hasClass('navbar-inner-large-collapsed');
12308 if (collapseProgress === 0 && navbarCollapsed) {
12309 app.navbar.expandLargeTitle($navbarInnerEl[0]);
12310 $navbarInnerEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12311 $pageEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12312 $navbarInnerEl[0].style.overflow = '';
12313 if (app.theme === 'md' || app.theme === 'aurora') {
12314 $navbarEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12316 } else if (collapseProgress === 1 && !navbarCollapsed) {
12317 app.navbar.collapseLargeTitle($navbarInnerEl[0]);
12318 $navbarInnerEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12319 $navbarInnerEl[0].style.overflow = '';
12320 $pageEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12321 if (app.theme === 'md' || app.theme === 'aurora') {
12322 $navbarEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12324 } else if ((collapseProgress === 1 && navbarCollapsed) || (collapseProgress === 0 && !navbarCollapsed)) {
12325 $navbarInnerEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12326 $navbarInnerEl[0].style.overflow = '';
12327 $pageEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12328 if (app.theme === 'md' || app.theme === 'aurora') {
12329 $navbarEl[0].style.removeProperty('--f7-navbar-large-collapse-progress');
12332 $navbarInnerEl[0].style.setProperty('--f7-navbar-large-collapse-progress', collapseProgress);
12333 $navbarInnerEl[0].style.overflow = 'visible';
12334 $pageEl[0].style.setProperty('--f7-navbar-large-collapse-progress', collapseProgress);
12335 if (app.theme === 'md' || app.theme === 'aurora') {
12336 $navbarEl[0].style.setProperty('--f7-navbar-large-collapse-progress', collapseProgress);
12340 if (snapPageScrollToLargeTitle) {
12341 if (!Support.touch) {
12342 clearTimeout(scrollTimeoutId);
12343 scrollTimeoutId = setTimeout(function () {
12345 }, desktopSnapTimeout);
12346 } else if (touchEndTimeoutId) {
12347 clearTimeout(touchEndTimeoutId);
12348 touchEndTimeoutId = null;
12349 touchEndTimeoutId = setTimeout(function () {
12351 clearTimeout(touchEndTimeoutId);
12352 touchEndTimeoutId = null;
12353 }, touchSnapTimeout);
12358 function handleTitleHideShow() {
12359 scrollHeight = scrollContent.scrollHeight;
12360 offsetHeight = scrollContent.offsetHeight;
12361 reachEnd = currentScrollTop + offsetHeight >= scrollHeight;
12362 navbarHidden = $navbarEl.hasClass('navbar-hidden');
12365 if (app.params.navbar.showOnPageScrollEnd) {
12368 } else if (previousScrollTop > currentScrollTop) {
12369 if (app.params.navbar.showOnPageScrollTop || currentScrollTop <= navbarHideHeight) {
12374 } else if (currentScrollTop > navbarHideHeight) {
12380 if (action === 'show' && navbarHidden) {
12381 app.navbar.show($navbarEl);
12382 navbarHidden = false;
12383 } else if (action === 'hide' && !navbarHidden) {
12384 app.navbar.hide($navbarEl);
12385 navbarHidden = true;
12387 previousScrollTop = currentScrollTop;
12390 function handleScroll() {
12391 scrollContent = this;
12392 currentScrollTop = scrollContent.scrollTop;
12393 scrollChanged = currentScrollTop;
12395 if (needCollapse) {
12396 handleLargeNavbarCollapse();
12398 if ($pageEl.hasClass('page-previous')) { return; }
12400 handleTitleHideShow();
12403 function handeTouchStart() {
12404 scrollChanged = false;
12406 function handleTouchEnd() {
12407 clearTimeout(touchEndTimeoutId);
12408 touchEndTimeoutId = null;
12409 touchEndTimeoutId = setTimeout(function () {
12410 if (scrollChanged !== false) {
12412 clearTimeout(touchEndTimeoutId);
12413 touchEndTimeoutId = null;
12415 }, touchSnapTimeout);
12417 $pageEl.on('scroll', '.page-content', handleScroll, true);
12418 if (Support.touch && needCollapse && snapPageScrollToLargeTitle) {
12419 app.on('touchstart:passive', handeTouchStart);
12420 app.on('touchend:passive', handleTouchEnd);
12422 if (needCollapse) {
12423 $pageEl.find('.page-content').each(function (pageContentIndex, pageContentEl) {
12424 if (pageContentEl.scrollTop > 0) { handleScroll.call(pageContentEl); }
12427 $pageEl[0].f7DetachNavbarScrollHandlers = function f7DetachNavbarScrollHandlers() {
12428 delete $pageEl[0].f7DetachNavbarScrollHandlers;
12429 $pageEl.off('scroll', '.page-content', handleScroll, true);
12430 if (Support.touch && needCollapse && snapPageScrollToLargeTitle) {
12431 app.off('touchstart:passive', handeTouchStart);
12432 app.off('touchend:passive', handleTouchEnd);
12439 create: function create() {
12441 Utils.extend(app, {
12443 size: Navbar.size.bind(app),
12444 hide: Navbar.hide.bind(app),
12445 show: Navbar.show.bind(app),
12446 getElByPage: Navbar.getElByPage.bind(app),
12447 getPageByEl: Navbar.getPageByEl.bind(app),
12448 collapseLargeTitle: Navbar.collapseLargeTitle.bind(app),
12449 expandLargeTitle: Navbar.expandLargeTitle.bind(app),
12450 toggleLargeTitle: Navbar.toggleLargeTitle.bind(app),
12451 initNavbarOnScroll: Navbar.initNavbarOnScroll.bind(app),
12457 scrollTopOnTitleClick: true,
12458 iosCenterTitle: true,
12459 mdCenterTitle: false,
12460 auroraCenterTitle: true,
12461 hideOnPageScroll: false,
12462 showOnPageScrollEnd: true,
12463 showOnPageScrollTop: true,
12464 collapseLargeTitleOnScroll: true,
12465 snapPageScrollToLargeTitle: true,
12469 'panelBreakpoint panelResize resize viewMasterDetailBreakpoint': function onResize() {
12471 $('.navbar').each(function (index, navbarEl) {
12472 app.navbar.size(navbarEl);
12475 pageBeforeRemove: function pageBeforeRemove(page) {
12476 if (page.$el[0].f7DetachNavbarScrollHandlers) {
12477 page.$el[0].f7DetachNavbarScrollHandlers();
12480 pageBeforeIn: function pageBeforeIn(page) {
12482 if (app.theme !== 'ios') { return; }
12484 var view = page.$el.parents('.view')[0].f7View;
12485 var navbarInnerEl = app.navbar.getElByPage(page);
12486 if (!navbarInnerEl) {
12487 $navbarEl = page.$el.parents('.view').children('.navbar');
12489 $navbarEl = $(navbarInnerEl).parents('.navbar');
12491 if (page.$el.hasClass('no-navbar') || (view.router.dynamicNavbar && !navbarInnerEl)) {
12492 var animate = !!(page.pageFrom && page.router.history.length > 0);
12493 app.navbar.hide($navbarEl, animate);
12495 app.navbar.show($navbarEl);
12498 pageReinit: function pageReinit(page) {
12500 var $navbarInnerEl = $(app.navbar.getElByPage(page));
12501 if (!$navbarInnerEl || $navbarInnerEl.length === 0) { return; }
12502 app.navbar.size($navbarInnerEl);
12504 pageInit: function pageInit(page) {
12506 var $navbarInnerEl = $(app.navbar.getElByPage(page));
12507 if (!$navbarInnerEl || $navbarInnerEl.length === 0) { return; }
12510 app.navbar.size($navbarInnerEl);
12512 // Need Collapse On Scroll
12513 var needCollapseOnScrollHandler;
12514 if ($navbarInnerEl.children('.title-large').length > 0) {
12515 $navbarInnerEl.addClass('navbar-inner-large');
12517 if ($navbarInnerEl.hasClass('navbar-inner-large')) {
12518 if (app.params.navbar.collapseLargeTitleOnScroll) { needCollapseOnScrollHandler = true; }
12519 if (app.theme === 'md' || app.theme === 'aurora') {
12520 $navbarInnerEl.parents('.navbar').addClass('navbar-large');
12522 page.$el.addClass('page-with-navbar-large');
12525 // Need Hide On Scroll
12526 var needHideOnScrollHandler;
12528 app.params.navbar.hideOnPageScroll
12529 || page.$el.find('.hide-navbar-on-scroll').length
12530 || page.$el.hasClass('hide-navbar-on-scroll')
12531 || page.$el.find('.hide-bars-on-scroll').length
12532 || page.$el.hasClass('hide-bars-on-scroll')
12535 page.$el.find('.keep-navbar-on-scroll').length
12536 || page.$el.hasClass('keep-navbar-on-scroll')
12537 || page.$el.find('.keep-bars-on-scroll').length
12538 || page.$el.hasClass('keep-bars-on-scroll')
12540 needHideOnScrollHandler = false;
12542 needHideOnScrollHandler = true;
12546 if (needCollapseOnScrollHandler || needHideOnScrollHandler) {
12547 app.navbar.initNavbarOnScroll(page.el, $navbarInnerEl[0], needHideOnScrollHandler, needCollapseOnScrollHandler);
12550 modalOpen: function modalOpen(modal) {
12552 if (!app.params.navbar[((app.theme) + "CenterTitle
")]) {
12555 modal.$el.find('.navbar:not(.navbar-previous):not(.stacked)').each(function (index, navbarEl) {
12556 app.navbar.size(navbarEl);
12559 panelOpen: function panelOpen(panel) {
12561 if (!app.params.navbar[((app.theme) + "CenterTitle
")]) {
12564 panel.$el.find('.navbar:not(.navbar-previous):not(.stacked)').each(function (index, navbarEl) {
12565 app.navbar.size(navbarEl);
12568 panelSwipeOpen: function panelSwipeOpen(panel) {
12570 if (!app.params.navbar[((app.theme) + "CenterTitle
")]) {
12573 panel.$el.find('.navbar:not(.navbar-previous):not(.stacked)').each(function (index, navbarEl) {
12574 app.navbar.size(navbarEl);
12577 tabShow: function tabShow(tabEl) {
12579 if (!app.params.navbar[((app.theme) + "CenterTitle
")]) {
12582 $(tabEl).find('.navbar:not(.navbar-previous):not(.stacked)').each(function (index, navbarEl) {
12583 app.navbar.size(navbarEl);
12588 '.navbar .title': function onTitleClick($clickedEl) {
12590 if (!app.params.navbar.scrollTopOnTitleClick) { return; }
12591 if ($clickedEl.closest('a').length > 0) {
12595 // Find active page
12596 var navbar = $clickedEl.parents('.navbar');
12599 pageContent = navbar.parents('.page-content');
12601 if (pageContent.length === 0) {
12603 if (navbar.parents('.page').length > 0) {
12604 pageContent = navbar.parents('.page').find('.page-content');
12607 if (pageContent.length === 0) {
12608 if (navbar.nextAll('.page-current:not(.stacked)').length > 0) {
12609 pageContent = navbar.nextAll('.page-current:not(.stacked)').find('.page-content');
12613 if (pageContent && pageContent.length > 0) {
12615 if (pageContent.hasClass('tab')) {
12616 pageContent = pageContent.parent('.tabs').children('.page-content.tab-active');
12618 if (pageContent.length > 0) { pageContent.scrollTop(0, 300); }
12624 postpatch: function postpatch(vnode) {
12626 if (!app.params.navbar[((app.theme) + "CenterTitle
")]) {
12629 app.navbar.size(vnode.elm);
12636 setHighlight: function setHighlight(tabbarEl) {
12638 if (app.theme !== 'md') { return; }
12640 var $tabbarEl = $(tabbarEl);
12642 if ($tabbarEl.length === 0 || !($tabbarEl.hasClass('tabbar') || $tabbarEl.hasClass('tabbar-labels'))) { return; }
12644 var $highlightEl = $tabbarEl.find('.tab-link-highlight');
12645 var tabLinksCount = $tabbarEl.find('.tab-link').length;
12646 if (tabLinksCount === 0) {
12647 $highlightEl.remove();
12651 if ($highlightEl.length === 0) {
12652 $tabbarEl.children('.toolbar-inner').append('<span class="tab
-link
-highlight
"></span>');
12653 $highlightEl = $tabbarEl.find('.tab-link-highlight');
12654 } else if ($highlightEl.next().length) {
12655 $tabbarEl.children('.toolbar-inner').append($highlightEl);
12658 var $activeLink = $tabbarEl.find('.tab-link-active');
12659 var highlightWidth;
12660 var highlightTranslate;
12662 if ($tabbarEl.hasClass('tabbar-scrollable') && $activeLink && $activeLink[0]) {
12663 highlightWidth = ($activeLink[0].offsetWidth) + "px
";
12664 highlightTranslate = ($activeLink[0].offsetLeft) + "px
";
12666 var activeIndex = $activeLink.index();
12667 highlightWidth = (100 / tabLinksCount) + "%";
12668 highlightTranslate = ((app.rtl ? -activeIndex : activeIndex) * 100) + "%";
12671 Utils.nextFrame(function () {
12673 .css('width', highlightWidth)
12674 .transform(("translate3d(" + highlightTranslate + ",0,0)"));
12677 init: function init(tabbarEl) {
12679 app.toolbar.setHighlight(tabbarEl);
12681 hide: function hide(el, animate) {
12682 if ( animate === void 0 ) animate = true;
12685 if ($el.hasClass('toolbar-hidden')) { return; }
12686 var className = "toolbar
-hidden
" + (animate ? ' toolbar-transitioning' : '');
12687 $el.transitionEnd(function () {
12688 $el.removeClass('toolbar-transitioning');
12690 $el.addClass(className);
12692 show: function show(el, animate) {
12693 if ( animate === void 0 ) animate = true;
12696 if (!$el.hasClass('toolbar-hidden')) { return; }
12698 $el.addClass('toolbar-transitioning');
12699 $el.transitionEnd(function () {
12700 $el.removeClass('toolbar-transitioning');
12703 $el.removeClass('toolbar-hidden');
12705 initHideToolbarOnScroll: function initHideToolbarOnScroll(pageEl) {
12707 var $pageEl = $(pageEl);
12708 var $toolbarEl = $pageEl.parents('.view').children('.toolbar');
12709 if ($toolbarEl.length === 0) {
12710 $toolbarEl = $pageEl.find('.toolbar');
12712 if ($toolbarEl.length === 0) {
12713 $toolbarEl = $pageEl.parents('.views').children('.tabbar, .tabbar-labels');
12715 if ($toolbarEl.length === 0) {
12719 var previousScrollTop;
12720 var currentScrollTop;
12727 function handleScroll() {
12728 var scrollContent = this;
12729 if ($pageEl.hasClass('page-previous')) { return; }
12730 currentScrollTop = scrollContent.scrollTop;
12731 scrollHeight = scrollContent.scrollHeight;
12732 offsetHeight = scrollContent.offsetHeight;
12733 reachEnd = currentScrollTop + offsetHeight >= scrollHeight;
12734 toolbarHidden = $toolbarEl.hasClass('toolbar-hidden');
12737 if (app.params.toolbar.showOnPageScrollEnd) {
12740 } else if (previousScrollTop > currentScrollTop) {
12741 if (app.params.toolbar.showOnPageScrollTop || currentScrollTop <= 44) {
12746 } else if (currentScrollTop > 44) {
12752 if (action === 'show' && toolbarHidden) {
12753 app.toolbar.show($toolbarEl);
12754 toolbarHidden = false;
12755 } else if (action === 'hide' && !toolbarHidden) {
12756 app.toolbar.hide($toolbarEl);
12757 toolbarHidden = true;
12760 previousScrollTop = currentScrollTop;
12762 $pageEl.on('scroll', '.page-content', handleScroll, true);
12763 $pageEl[0].f7ScrollToolbarHandler = handleScroll;
12768 create: function create() {
12770 Utils.extend(app, {
12772 hide: Toolbar.hide.bind(app),
12773 show: Toolbar.show.bind(app),
12774 setHighlight: Toolbar.setHighlight.bind(app),
12775 initHideToolbarOnScroll: Toolbar.initHideToolbarOnScroll.bind(app),
12776 init: Toolbar.init.bind(app),
12782 hideOnPageScroll: false,
12783 showOnPageScrollEnd: true,
12784 showOnPageScrollTop: true,
12788 pageBeforeRemove: function pageBeforeRemove(page) {
12789 if (page.$el[0].f7ScrollToolbarHandler) {
12790 page.$el.off('scroll', '.page-content', page.$el[0].f7ScrollToolbarHandler, true);
12793 pageBeforeIn: function pageBeforeIn(page) {
12795 var $toolbarEl = page.$el.parents('.view').children('.toolbar');
12796 if ($toolbarEl.length === 0) {
12797 $toolbarEl = page.$el.parents('.views').children('.tabbar, .tabbar-labels');
12799 if ($toolbarEl.length === 0) {
12800 $toolbarEl = page.$el.find('.toolbar');
12802 if ($toolbarEl.length === 0) {
12805 if (page.$el.hasClass('no-toolbar')) {
12806 app.toolbar.hide($toolbarEl);
12808 app.toolbar.show($toolbarEl);
12811 pageInit: function pageInit(page) {
12813 page.$el.find('.tabbar, .tabbar-labels').each(function (index, tabbarEl) {
12814 app.toolbar.init(tabbarEl);
12817 app.params.toolbar.hideOnPageScroll
12818 || page.$el.find('.hide-toolbar-on-scroll').length
12819 || page.$el.hasClass('hide-toolbar-on-scroll')
12820 || page.$el.find('.hide-bars-on-scroll').length
12821 || page.$el.hasClass('hide-bars-on-scroll')
12824 page.$el.find('.keep-toolbar-on-scroll').length
12825 || page.$el.hasClass('keep-toolbar-on-scroll')
12826 || page.$el.find('.keep-bars-on-scroll').length
12827 || page.$el.hasClass('keep-bars-on-scroll')
12831 app.toolbar.initHideToolbarOnScroll(page.el);
12834 init: function init() {
12836 app.root.find('.tabbar, .tabbar-labels').each(function (index, tabbarEl) {
12837 app.toolbar.init(tabbarEl);
12846 pageInit: function pageInit(page) {
12847 if (page.$navbarEl && page.$navbarEl.length && page.$navbarEl.find('.subnavbar').length) {
12848 page.$el.addClass('page-with-subnavbar');
12850 if (page.$el.find('.subnavbar').length) {
12851 page.$el.addClass('page-with-subnavbar');
12857 var TouchRipple = function TouchRipple($el, x, y) {
12859 if (!$el) { return undefined; }
12860 var box = $el[0].getBoundingClientRect();
12865 var width = box.width;
12866 var height = box.height;
12867 var diameter = Math.max((Math.pow( ((Math.pow( height, 2 )) + (Math.pow( width, 2 ))), 0.5 )), 48);
12869 ripple.$rippleWaveEl = $(("<div
class=\"ripple
-wave
\" style
=\"width
: " + diameter + "px
; height
: " + diameter + "px
; margin
-top
:-" + (diameter / 2) + "px
; margin
-left
:-" + (diameter / 2) + "px
; left
:" + (center.x) + "px
; top
:" + (center.y) + "px
;\"></div
>"));
12871 $el.prepend(ripple.$rippleWaveEl);
12873 ripple.rippleTransform = "translate3d(" + (-center.x + (width / 2)) + "px
, " + (-center.y + (height / 2)) + "px
, 0) scale(1)";
12875 Utils.nextFrame(function () {
12876 if (!ripple || !ripple.$rippleWaveEl) { return; }
12877 ripple.$rippleWaveEl.transform(ripple.rippleTransform);
12883 TouchRipple.prototype.destroy = function destroy () {
12885 if (ripple.$rippleWaveEl) {
12886 ripple.$rippleWaveEl.remove();
12888 Object.keys(ripple).forEach(function (key) {
12889 ripple[key] = null;
12890 delete ripple[key];
12895 TouchRipple.prototype.remove = function remove () {
12897 if (ripple.removing) { return; }
12898 var $rippleWaveEl = this.$rippleWaveEl;
12899 var rippleTransform = this.rippleTransform;
12900 var removeTimeout = Utils.nextTick(function () {
12903 ripple.removing = true;
12905 .addClass('ripple-wave-fill')
12906 .transform(rippleTransform.replace('scale(1)', 'scale(1.01)'))
12907 .transitionEnd(function () {
12908 clearTimeout(removeTimeout);
12909 Utils.nextFrame(function () {
12911 .addClass('ripple-wave-out')
12912 .transform(rippleTransform.replace('scale(1)', 'scale(1.01)'));
12914 removeTimeout = Utils.nextTick(function () {
12918 $rippleWaveEl.transitionEnd(function () {
12919 clearTimeout(removeTimeout);
12926 var TouchRipple$1 = {
12927 name: 'touch-ripple',
12929 TouchRipple: TouchRipple,
12931 create: function create() {
12933 app.touchRipple = {
12934 create: function create() {
12935 var args = [], len = arguments.length;
12936 while ( len-- ) args[ len ] = arguments[ len ];
12938 return new (Function.prototype.bind.apply( TouchRipple, [ null ].concat( args) ));
12944 var openedModals = [];
12945 var dialogsQueue = [];
12946 function clearDialogsQueue() {
12947 if (dialogsQueue.length === 0) { return; }
12948 var dialog = dialogsQueue.shift();
12951 var Modal = /*@__PURE__*/(function (Framework7Class) {
12952 function Modal(app, params) {
12953 Framework7Class.call(this, params, [app]);
12959 // Extend defaults with modules params
12960 modal.useModulesParams(defaults);
12962 modal.params = Utils.extend(defaults, params);
12963 modal.opened = false;
12966 modal.useModules();
12971 if ( Framework7Class ) Modal.__proto__ = Framework7Class;
12972 Modal.prototype = Object.create( Framework7Class && Framework7Class.prototype );
12973 Modal.prototype.constructor = Modal;
12975 Modal.prototype.onOpen = function onOpen () {
12977 modal.opened = true;
12978 openedModals.push(modal);
12979 $('html').addClass(("with-modal
-" + (modal.type.toLowerCase())));
12980 modal.$el.trigger(("modal
:open
" + (modal.type.toLowerCase()) + ":open
"), modal);
12981 modal.emit(("local
::open modalOpen
" + (modal.type) + "Open
"), modal);
12984 Modal.prototype.onOpened = function onOpened () {
12986 modal.$el.trigger(("modal
:opened
" + (modal.type.toLowerCase()) + ":opened
"), modal);
12987 modal.emit(("local
::opened modalOpened
" + (modal.type) + "Opened
"), modal);
12990 Modal.prototype.onClose = function onClose () {
12992 modal.opened = false;
12993 if (!modal.type || !modal.$el) { return; }
12994 openedModals.splice(openedModals.indexOf(modal), 1);
12995 $('html').removeClass(("with-modal
-" + (modal.type.toLowerCase())));
12996 modal.$el.trigger(("modal
:close
" + (modal.type.toLowerCase()) + ":close
"), modal);
12997 modal.emit(("local
::close modalClose
" + (modal.type) + "Close
"), modal);
13000 Modal.prototype.onClosed = function onClosed () {
13002 if (!modal.type || !modal.$el) { return; }
13003 modal.$el.removeClass('modal-out');
13005 modal.$el.trigger(("modal
:closed
" + (modal.type.toLowerCase()) + ":closed
"), modal);
13006 modal.emit(("local
::closed modalClosed
" + (modal.type) + "Closed
"), modal);
13009 Modal.prototype.open = function open (animateModal) {
13011 var app = modal.app;
13012 var $el = modal.$el;
13013 var $backdropEl = modal.$backdropEl;
13014 var type = modal.type;
13015 var animate = true;
13016 if (typeof animateModal !== 'undefined') { animate = animateModal; }
13017 else if (typeof modal.params.animate !== 'undefined') {
13018 animate = modal.params.animate;
13021 if (!$el || $el.hasClass('modal-in')) {
13025 if (type === 'dialog' && app.params.modal.queueDialogs) {
13027 if ($('.dialog.modal-in').length > 0) {
13028 pushToQueue = true;
13029 } else if (openedModals.length > 0) {
13030 openedModals.forEach(function (openedModal) {
13031 if (openedModal.type === 'dialog') { pushToQueue = true; }
13035 dialogsQueue.push(modal);
13040 var $modalParentEl = $el.parent();
13041 var wasInDom = $el.parents(doc).length > 0;
13042 if (app.params.modal.moveToRoot && !$modalParentEl.is(app.root)) {
13043 app.root.append($el);
13044 modal.once((type + "Closed
"), function () {
13046 $modalParentEl.append($el);
13055 /* eslint no-underscore-dangle: ["error
", { "allow
": ["_clientLeft
"] }] */
13056 modal._clientLeft = $el[0].clientLeft;
13059 function transitionEnd() {
13060 if ($el.hasClass('modal-out')) {
13062 } else if ($el.hasClass('modal-in')) {
13068 $backdropEl.removeClass('not-animated');
13069 $backdropEl.addClass('backdrop-in');
13072 .animationEnd(function () {
13076 .transitionEnd(function () {
13080 .removeClass('modal-out not-animated')
13081 .addClass('modal-in');
13085 $backdropEl.addClass('backdrop-in not-animated');
13087 $el.removeClass('modal-out').addClass('modal-in not-animated');
13095 Modal.prototype.close = function close (animateModal) {
13097 var $el = modal.$el;
13098 var $backdropEl = modal.$backdropEl;
13100 var animate = true;
13101 if (typeof animateModal !== 'undefined') { animate = animateModal; }
13102 else if (typeof modal.params.animate !== 'undefined') {
13103 animate = modal.params.animate;
13106 if (!$el || !$el.hasClass('modal-in')) {
13112 var needToHideBackdrop = true;
13113 if (modal.type === 'popup') {
13114 modal.$el.prevAll('.popup.modal-in').each(function (index, popupEl) {
13115 var popupInstance = popupEl.f7Modal;
13116 if (!popupInstance) { return; }
13118 popupInstance.params.closeByBackdropClick
13119 && popupInstance.params.backdrop
13120 && popupInstance.backdropEl === modal.backdropEl
13122 needToHideBackdrop = false;
13126 if (needToHideBackdrop) {
13127 $backdropEl[animate ? 'removeClass' : 'addClass']('not-animated');
13128 $backdropEl.removeClass('backdrop-in');
13133 $el[animate ? 'removeClass' : 'addClass']('not-animated');
13134 function transitionEnd() {
13135 if ($el.hasClass('modal-out')) {
13137 } else if ($el.hasClass('modal-in')) {
13143 .animationEnd(function () {
13147 .transitionEnd(function () {
13151 .removeClass('modal-in')
13152 .addClass('modal-out');
13157 .addClass('not-animated')
13158 .removeClass('modal-in')
13159 .addClass('modal-out');
13165 if (modal.type === 'dialog') {
13166 clearDialogsQueue();
13172 Modal.prototype.destroy = function destroy () {
13174 if (modal.destroyed) { return; }
13175 modal.emit(("local
::beforeDestroy modalBeforeDestroy
" + (modal.type) + "BeforeDestroy
"), modal);
13177 modal.$el.trigger(("modal
:beforedestroy
" + (modal.type.toLowerCase()) + ":beforedestroy
"), modal);
13178 if (modal.$el.length && modal.$el[0].f7Modal) {
13179 delete modal.$el[0].f7Modal;
13182 Utils.deleteProps(modal);
13183 modal.destroyed = true;
13187 }(Framework7Class));
13189 var CustomModal = /*@__PURE__*/(function (Modal) {
13190 function CustomModal(app, params) {
13191 var extendedParams = Utils.extend({
13193 closeByBackdropClick: true,
13197 // Extends with open/close Modal methods;
13198 Modal.call(this, app, extendedParams);
13200 var customModal = this;
13202 customModal.params = extendedParams;
13206 if (!customModal.params.el) {
13207 $el = $(customModal.params.content);
13209 $el = $(customModal.params.el);
13212 if ($el && $el.length > 0 && $el[0].f7Modal) {
13213 return $el[0].f7Modal;
13216 if ($el.length === 0) {
13217 return customModal.destroy();
13220 if (customModal.params.backdrop) {
13221 $backdropEl = app.root.children('.custom-modal-backdrop');
13222 if ($backdropEl.length === 0) {
13223 $backdropEl = $('<div class="custom
-modal
-backdrop
"></div>');
13224 app.root.append($backdropEl);
13228 function handleClick(e) {
13229 if (!customModal || customModal.destroyed) { return; }
13230 if ($backdropEl && e.target === $backdropEl[0]) {
13231 customModal.close();
13235 customModal.on('customModalOpened', function () {
13236 if (customModal.params.closeByBackdropClick && customModal.params.backdrop) {
13237 app.on('click', handleClick);
13240 customModal.on('customModalClose', function () {
13241 if (customModal.params.closeByBackdropClick && customModal.params.backdrop) {
13242 app.off('click', handleClick);
13246 Utils.extend(customModal, {
13250 $backdropEl: $backdropEl,
13251 backdropEl: $backdropEl && $backdropEl[0],
13252 type: 'customModal',
13255 $el[0].f7Modal = customModal;
13257 return customModal;
13260 if ( Modal ) CustomModal.__proto__ = Modal;
13261 CustomModal.prototype = Object.create( Modal && Modal.prototype );
13262 CustomModal.prototype.constructor = CustomModal;
13264 return CustomModal;
13271 CustomModal: CustomModal,
13273 create: function create() {
13275 app.customModal = {
13276 create: function create(params) {
13277 return new CustomModal(app, params);
13284 queueDialogs: true,
13293 var Dialog = /*@__PURE__*/(function (Modal) {
13294 function Dialog(app, params) {
13295 var extendedParams = Utils.extend({
13296 title: app.params.dialog.title,
13300 verticalButtons: false,
13301 onClick: undefined,
13302 cssClass: undefined,
13303 destroyOnClose: false,
13306 if (typeof extendedParams.closeByBackdropClick === 'undefined') {
13307 extendedParams.closeByBackdropClick = app.params.dialog.closeByBackdropClick;
13310 // Extends with open/close Modal methods;
13311 Modal.call(this, app, extendedParams);
13315 var title = extendedParams.title;
13316 var text = extendedParams.text;
13317 var content = extendedParams.content;
13318 var buttons = extendedParams.buttons;
13319 var verticalButtons = extendedParams.verticalButtons;
13320 var cssClass = extendedParams.cssClass;
13322 dialog.params = extendedParams;
13326 if (!dialog.params.el) {
13327 var dialogClasses = ['dialog'];
13328 if (buttons.length === 0) { dialogClasses.push('dialog-no-buttons'); }
13329 if (buttons.length > 0) { dialogClasses.push(("dialog
-buttons
-" + (buttons.length))); }
13330 if (verticalButtons) { dialogClasses.push('dialog-buttons-vertical'); }
13331 if (cssClass) { dialogClasses.push(cssClass); }
13333 var buttonsHTML = '';
13334 if (buttons.length > 0) {
13335 buttonsHTML = "\n <div
class=\"dialog
-buttons
\">\n " + (buttons.map(function (button) { return ("\n <span
class=\"dialog
-button
" + (button.bold ? ' dialog-button-bold' : '') + (button.color ? (" color
-" + (button.color)) : '') + (button.cssClass ? (" " + (button.cssClass)) : '') + "\">" + (button.text) + "</span>\n "); }).join('')) + "\n </div>\n ";
13338 var dialogHtml = "\n <div
class=\"" + (dialogClasses.join(' ')) + "\">\n <div
class=\"dialog
-inner
\">\n " + (title ? ("<div
class=\"dialog
-title
\">" + title + "</div>") : '') + "\n " + (text ? ("<div class=\"dialog-text\">" + text + "</div>") : '') + "\n " + content + "\n </div>\n " + buttonsHTML + "\n </div>\n ";
13339 $el = $(dialogHtml);
13341 $el = $(dialog.params.el);
13344 if ($el && $el.length > 0 && $el[0].f7Modal) {
13345 return $el[0].f7Modal;
13348 if ($el.length === 0) {
13349 return dialog.destroy();
13352 var $backdropEl = app.root.children('.dialog-backdrop');
13353 if ($backdropEl.length === 0) {
13354 $backdropEl = $('<div class="dialog
-backdrop
"></div>');
13355 app.root.append($backdropEl);
13359 function buttonOnClick(e) {
13360 var buttonEl = this;
13361 var index = $(buttonEl).index();
13362 var button = buttons[index];
13363 if (button.onClick) { button.onClick(dialog, e); }
13364 if (dialog.params.onClick) { dialog.params.onClick(dialog, index); }
13365 if (button.close !== false) { dialog.close(); }
13367 var addKeyboardHander;
13368 function onKeyDown(e) {
13369 var keyCode = e.keyCode;
13370 buttons.forEach(function (button, index) {
13371 if (button.keyCodes && button.keyCodes.indexOf(keyCode) >= 0) {
13372 if (doc.activeElement) { doc.activeElement.blur(); }
13373 if (button.onClick) { button.onClick(dialog, e); }
13374 if (dialog.params.onClick) { dialog.params.onClick(dialog, index); }
13375 if (button.close !== false) { dialog.close(); }
13379 if (buttons && buttons.length > 0) {
13380 dialog.on('open', function () {
13381 $el.find('.dialog-button').each(function (index, buttonEl) {
13382 var button = buttons[index];
13383 if (button.keyCodes) { addKeyboardHander = true; }
13384 $(buttonEl).on('click', buttonOnClick);
13389 && !app.device.android
13390 && !app.device.cordova
13392 $(doc).on('keydown', onKeyDown);
13395 dialog.on('close', function () {
13396 $el.find('.dialog-button').each(function (index, buttonEl) {
13397 $(buttonEl).off('click', buttonOnClick);
13402 && !app.device.android
13403 && !app.device.cordova
13405 $(doc).off('keydown', onKeyDown);
13407 addKeyboardHander = false;
13410 Utils.extend(dialog, {
13414 $backdropEl: $backdropEl,
13415 backdropEl: $backdropEl[0],
13417 setProgress: function setProgress(progress, duration) {
13418 app.progressbar.set($el.find('.progressbar'), progress, duration);
13421 setText: function setText(newText) {
13422 var $textEl = $el.find('.dialog-text');
13423 if ($textEl.length === 0) {
13424 $textEl = $('<div class="dialog
-text
"></div>');
13425 if (typeof title !== 'undefined') {
13426 $textEl.insertAfter($el.find('.dialog-title'));
13428 $el.find('.dialog-inner').prepend($textEl);
13431 $textEl.html(newText);
13432 dialog.params.text = newText;
13435 setTitle: function setTitle(newTitle) {
13436 var $titleEl = $el.find('.dialog-title');
13437 if ($titleEl.length === 0) {
13438 $titleEl = $('<div class="dialog
-title
"></div>');
13439 $el.find('.dialog-inner').prepend($titleEl);
13441 $titleEl.html(newTitle);
13442 dialog.params.title = newTitle;
13447 function handleClick(e) {
13448 var target = e.target;
13449 var $target = $(target);
13450 if ($target.closest(dialog.el).length === 0) {
13452 dialog.params.closeByBackdropClick
13453 && dialog.backdropEl
13454 && dialog.backdropEl === target
13461 dialog.on('opened', function () {
13462 if (dialog.params.closeByBackdropClick) {
13463 app.on('click', handleClick);
13466 dialog.on('close', function () {
13467 if (dialog.params.closeByBackdropClick) {
13468 app.off('click', handleClick);
13472 $el[0].f7Modal = dialog;
13474 if (dialog.params.destroyOnClose) {
13475 dialog.once('closed', function () {
13476 setTimeout(function () {
13485 if ( Modal ) Dialog.__proto__ = Modal;
13486 Dialog.prototype = Object.create( Modal && Modal.prototype );
13487 Dialog.prototype.constructor = Dialog;
13498 buttonCancel: 'Cancel',
13499 usernamePlaceholder: 'Username',
13500 passwordPlaceholder: 'Password',
13501 preloaderTitle: 'Loading... ',
13502 progressTitle: 'Loading... ',
13503 closeByBackdropClick: false,
13504 destroyPredefinedDialogs: true,
13505 keyboardActions: true,
13511 create: function create() {
13513 function defaultDialogTitle() {
13514 return app.params.dialog.title || app.name;
13516 var destroyOnClose = app.params.dialog.destroyPredefinedDialogs;
13517 var keyboardActions = app.params.dialog.keyboardActions;
13518 app.dialog = Utils.extend(
13521 constructor: Dialog,
13522 defaultSelector: '.dialog.modal-in',
13526 alert: function alert() {
13529 var args = [], len = arguments.length;
13530 while ( len-- ) args[ len ] = arguments[ len ];
13531 var text = args[0];
13532 var title = args[1];
13533 var callbackOk = args[2];
13534 if (args.length === 2 && typeof args[1] === 'function') {
13535 (assign = args, text = assign[0], callbackOk = assign[1], title = assign[2]);
13537 return new Dialog(app, {
13538 title: typeof title === 'undefined' ? defaultDialogTitle() : title,
13541 text: app.params.dialog.buttonOk,
13543 onClick: callbackOk,
13544 keyCodes: keyboardActions ? [13, 27] : null,
13546 destroyOnClose: destroyOnClose,
13549 prompt: function prompt() {
13552 var args = [], len = arguments.length;
13553 while ( len-- ) args[ len ] = arguments[ len ];
13554 var text = args[0];
13555 var title = args[1];
13556 var callbackOk = args[2];
13557 var callbackCancel = args[3];
13558 var defaultValue = args[4];
13559 if (typeof args[1] === 'function') {
13560 (assign = args, text = assign[0], callbackOk = assign[1], callbackCancel = assign[2], defaultValue = assign[3], title = assign[4]);
13562 defaultValue = typeof defaultValue === 'undefined' || defaultValue === null ? '' : defaultValue;
13563 return new Dialog(app, {
13564 title: typeof title === 'undefined' ? defaultDialogTitle() : title,
13566 content: ("<div
class=\"dialog
-input
-field input
\"><input type
=\"text
\" class=\"dialog
-input
\" value
=\"" + defaultValue + "\"></div
>"),
13569 text: app.params.dialog.buttonCancel,
13570 keyCodes: keyboardActions ? [27] : null,
13571 color: app.theme === 'aurora' ? 'gray' : null,
13574 text: app.params.dialog.buttonOk,
13576 keyCodes: keyboardActions ? [13] : null,
13578 onClick: function onClick(dialog, index) {
13579 var inputValue = dialog.$el.find('.dialog-input').val();
13580 if (index === 0 && callbackCancel) { callbackCancel(inputValue); }
13581 if (index === 1 && callbackOk) { callbackOk(inputValue); }
13583 destroyOnClose: destroyOnClose,
13586 confirm: function confirm() {
13589 var args = [], len = arguments.length;
13590 while ( len-- ) args[ len ] = arguments[ len ];
13591 var text = args[0];
13592 var title = args[1];
13593 var callbackOk = args[2];
13594 var callbackCancel = args[3];
13595 if (typeof args[1] === 'function') {
13596 (assign = args, text = assign[0], callbackOk = assign[1], callbackCancel = assign[2], title = assign[3]);
13598 return new Dialog(app, {
13599 title: typeof title === 'undefined' ? defaultDialogTitle() : title,
13603 text: app.params.dialog.buttonCancel,
13604 onClick: callbackCancel,
13605 keyCodes: keyboardActions ? [27] : null,
13606 color: app.theme === 'aurora' ? 'gray' : null,
13609 text: app.params.dialog.buttonOk,
13611 onClick: callbackOk,
13612 keyCodes: keyboardActions ? [13] : null,
13614 destroyOnClose: destroyOnClose,
13617 login: function login() {
13620 var args = [], len = arguments.length;
13621 while ( len-- ) args[ len ] = arguments[ len ];
13622 var text = args[0];
13623 var title = args[1];
13624 var callbackOk = args[2];
13625 var callbackCancel = args[3];
13626 if (typeof args[1] === 'function') {
13627 (assign = args, text = assign[0], callbackOk = assign[1], callbackCancel = assign[2], title = assign[3]);
13629 return new Dialog(app, {
13630 title: typeof title === 'undefined' ? defaultDialogTitle() : title,
13632 content: ("\n <div
class=\"dialog
-input
-field dialog
-input
-double input
\">\n <input type
=\"text
\" name
=\"dialog
-username
\" placeholder
=\"" + (app.params.dialog.usernamePlaceholder) + "\" class=\"dialog
-input
\">\n </div>\n <div class=\"dialog-input-field dialog-input-double input\">\n <input type=\"password\" name=\"dialog-password\" placeholder=\"" + (app.params.dialog.passwordPlaceholder) + "\" class=\"dialog-input\">\n </div>"),
13635 text: app.params.dialog.buttonCancel,
13636 keyCodes: keyboardActions ? [27] : null,
13637 color: app.theme === 'aurora' ? 'gray' : null,
13640 text: app.params.dialog.buttonOk,
13642 keyCodes: keyboardActions ? [13] : null,
13644 onClick: function onClick(dialog, index) {
13645 var username = dialog.$el.find('[name="dialog
-username
"]').val();
13646 var password = dialog.$el.find('[name="dialog
-password
"]').val();
13647 if (index === 0 && callbackCancel) { callbackCancel(username, password); }
13648 if (index === 1 && callbackOk) { callbackOk(username, password); }
13650 destroyOnClose: destroyOnClose,
13653 password: function password() {
13656 var args = [], len = arguments.length;
13657 while ( len-- ) args[ len ] = arguments[ len ];
13658 var text = args[0];
13659 var title = args[1];
13660 var callbackOk = args[2];
13661 var callbackCancel = args[3];
13662 if (typeof args[1] === 'function') {
13663 (assign = args, text = assign[0], callbackOk = assign[1], callbackCancel = assign[2], title = assign[3]);
13665 return new Dialog(app, {
13666 title: typeof title === 'undefined' ? defaultDialogTitle() : title,
13668 content: ("\n <div
class=\"dialog
-input
-field input
\">\n <input type
=\"password
\" name
=\"dialog
-password
\" placeholder
=\"" + (app.params.dialog.passwordPlaceholder) + "\" class=\"dialog
-input
\">\n </div
>"),
13671 text: app.params.dialog.buttonCancel,
13672 keyCodes: keyboardActions ? [27] : null,
13673 color: app.theme === 'aurora' ? 'gray' : null,
13676 text: app.params.dialog.buttonOk,
13678 keyCodes: keyboardActions ? [13] : null,
13680 onClick: function onClick(dialog, index) {
13681 var password = dialog.$el.find('[name="dialog
-password
"]').val();
13682 if (index === 0 && callbackCancel) { callbackCancel(password); }
13683 if (index === 1 && callbackOk) { callbackOk(password); }
13685 destroyOnClose: destroyOnClose,
13688 preloader: function preloader(title, color) {
13689 var preloaderInner = Utils[((app.theme) + "PreloaderContent
")] || '';
13690 return new Dialog(app, {
13691 title: typeof title === 'undefined' || title === null ? app.params.dialog.preloaderTitle : title,
13692 content: ("<div
class=\"preloader
" + (color ? (" color
-" + color) : '') + "\">" + preloaderInner + "</div
>"),
13693 cssClass: 'dialog-preloader',
13694 destroyOnClose: destroyOnClose,
13697 progress: function progress() {
13698 var assign, assign$1, assign$2;
13700 var args = [], len = arguments.length;
13701 while ( len-- ) args[ len ] = arguments[ len ];
13702 var title = args[0];
13703 var progress = args[1];
13704 var color = args[2];
13705 if (args.length === 2) {
13706 if (typeof args[0] === 'number') {
13707 (assign = args, progress = assign[0], color = assign[1], title = assign[2]);
13708 } else if (typeof args[0] === 'string' && typeof args[1] === 'string') {
13709 (assign$1 = args, title = assign$1[0], color = assign$1[1], progress = assign$1[2]);
13711 } else if (args.length === 1) {
13712 if (typeof args[0] === 'number') {
13713 (assign$2 = args, progress = assign$2[0], title = assign$2[1], color = assign$2[2]);
13716 var infinite = typeof progress === 'undefined';
13717 var dialog = new Dialog(app, {
13718 title: typeof title === 'undefined' ? app.params.dialog.progressTitle : title,
13719 cssClass: 'dialog-progress',
13720 content: ("\n <div
class=\"progressbar
" + (infinite ? '-infinite' : '') + (color ? (" color
-" + color) : '') + "\">\n " + (!infinite ? '<span></span>' : '') + "\n </div
>\n "),
13721 destroyOnClose: destroyOnClose,
13723 if (!infinite) { dialog.setProgress(progress); }
13724 return dialog.open();
13731 var Popup = /*@__PURE__*/(function (Modal) {
13732 function Popup(app, params) {
13733 var extendedParams = Utils.extend(
13739 // Extends with open/close Modal methods;
13740 Modal.call(this, app, extendedParams);
13744 popup.params = extendedParams;
13748 if (!popup.params.el) {
13749 $el = $(popup.params.content).filter(function (elIndex, node) { return node.nodeType === 1; }).eq(0);
13751 $el = $(popup.params.el).eq(0);
13754 if ($el && $el.length > 0 && $el[0].f7Modal) {
13755 return $el[0].f7Modal;
13758 if ($el.length === 0) {
13759 return popup.destroy();
13763 if (popup.params.backdrop && popup.params.backdropEl) {
13764 $backdropEl = $(popup.params.backdropEl);
13765 } else if (popup.params.backdrop) {
13766 $backdropEl = app.root.children('.popup-backdrop');
13767 if ($backdropEl.length === 0) {
13768 $backdropEl = $('<div class="popup
-backdrop
"></div>');
13769 app.root.append($backdropEl);
13773 Utils.extend(popup, {
13777 $backdropEl: $backdropEl,
13778 backdropEl: $backdropEl && $backdropEl[0],
13782 function handleClick(e) {
13783 var target = e.target;
13784 var $target = $(target);
13785 var keyboardOpened = !app.device.desktop && app.device.cordova && ((window.Keyboard && window.Keyboard.isVisible) || (window.cordova.plugins && window.cordova.plugins.Keyboard && window.cordova.plugins.Keyboard.isVisible));
13786 if (keyboardOpened) { return; }
13787 if ($target.closest(popup.el).length === 0) {
13790 && popup.params.closeByBackdropClick
13791 && popup.params.backdrop
13792 && popup.backdropEl
13793 && popup.backdropEl === target
13795 var needToClose = true;
13796 popup.$el.nextAll('.popup.modal-in').each(function (index, popupEl) {
13797 var popupInstance = popupEl.f7Modal;
13798 if (!popupInstance) { return; }
13800 popupInstance.params.closeByBackdropClick
13801 && popupInstance.params.backdrop
13802 && popupInstance.backdropEl === popup.backdropEl
13804 needToClose = false;
13814 function onKeyDown(e) {
13815 var keyCode = e.keyCode;
13816 if (keyCode === 27 && popup.params.closeOnEscape) {
13820 if (popup.params.closeOnEscape) {
13821 popup.on('popupOpen', function () {
13822 $(document).on('keydown', onKeyDown);
13824 popup.on('popupClose', function () {
13825 $(document).off('keydown', onKeyDown);
13829 popup.on('popupOpened', function () {
13830 $el.removeClass('swipe-close-to-bottom swipe-close-to-top');
13831 if (popup.params.closeByBackdropClick) {
13832 app.on('click', handleClick);
13835 popup.on('popupClose', function () {
13836 if (popup.params.closeByBackdropClick) {
13837 app.off('click', handleClick);
13841 var allowSwipeToClose = true;
13842 var isTouched = false;
13846 var touchStartTime;
13848 var isMoved = false;
13850 var pageContentScrollTop;
13851 var pageContentOffsetHeight;
13852 var pageContentScrollHeight;
13854 function handleTouchStart(e) {
13855 if (isTouched || !allowSwipeToClose || !popup.params.swipeToClose) { return; }
13856 if (popup.params.swipeHandler && $(e.target).closest(popup.params.swipeHandler).length === 0) {
13862 x: e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX,
13863 y: e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY,
13865 touchStartTime = Utils.now();
13866 isScrolling = undefined;
13867 if (!popup.params.swipeHandler && e.type === 'touchstart') {
13868 pageContentEl = $(e.target).closest('.page-content')[0];
13871 function handleTouchMove(e) {
13872 if (!isTouched) { return; }
13874 x: e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX,
13875 y: e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY,
13878 if (typeof isScrolling === 'undefined') {
13879 isScrolling = !!(isScrolling || Math.abs(currentTouch.x - startTouch.x) > Math.abs(currentTouch.y - startTouch.y));
13887 touchesDiff = startTouch.y - currentTouch.y;
13888 var direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
13891 if (typeof popup.params.swipeToClose === 'string' && direction !== popup.params.swipeToClose) {
13897 if (pageContentEl) {
13898 pageContentScrollTop = pageContentEl.scrollTop;
13899 pageContentScrollHeight = pageContentEl.scrollHeight;
13900 pageContentOffsetHeight = pageContentEl.offsetHeight;
13902 !(pageContentScrollHeight === pageContentOffsetHeight)
13903 && !(direction === 'to-bottom' && pageContentScrollTop === 0)
13904 && !(direction === 'to-top' && pageContentScrollTop === (pageContentScrollHeight - pageContentOffsetHeight))
13914 e.preventDefault();
13915 $el.transition(0).transform(("translate3d(0," + (-touchesDiff) + "px
,0)"));
13917 function handleTouchEnd() {
13923 allowSwipeToClose = false;
13924 $el.transition('');
13925 var direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
13926 if ((typeof popup.params.swipeToClose === 'string' && direction !== popup.params.swipeToClose)) {
13928 allowSwipeToClose = true;
13931 var diff = Math.abs(touchesDiff);
13932 var timeDiff = (new Date()).getTime() - touchStartTime;
13933 if ((timeDiff < 300 && diff > 20) || (timeDiff >= 300 && diff > 100)) {
13934 Utils.nextTick(function () {
13935 if (direction === 'to-bottom') {
13936 $el.addClass('swipe-close-to-bottom');
13938 $el.addClass('swipe-close-to-top');
13942 allowSwipeToClose = true;
13946 allowSwipeToClose = true;
13950 var passive = Support.passiveListener ? { passive: true } : false;
13951 if (popup.params.swipeToClose) {
13952 $el.on(app.touchEvents.start, handleTouchStart, passive);
13953 app.on('touchmove', handleTouchMove);
13954 app.on('touchend:passive', handleTouchEnd);
13955 popup.once('popupDestroy', function () {
13956 $el.off(app.touchEvents.start, handleTouchStart, passive);
13957 app.off('touchmove', handleTouchMove);
13958 app.off('touchend:passive', handleTouchEnd);
13962 $el[0].f7Modal = popup;
13967 if ( Modal ) Popup.__proto__ = Modal;
13968 Popup.prototype = Object.create( Modal && Modal.prototype );
13969 Popup.prototype.constructor = Popup;
13979 backdropEl: undefined,
13980 closeByBackdropClick: true,
13981 closeOnEscape: false,
13982 swipeToClose: false,
13983 swipeHandler: null,
13989 create: function create() {
13991 app.popup = ModalMethods({
13993 constructor: Popup,
13994 defaultSelector: '.popup.modal-in',
13998 '.popup-open': function openPopup($clickedEl, data) {
13999 if ( data === void 0 ) data = {};
14002 app.popup.open(data.popup, data.animate);
14004 '.popup-close': function closePopup($clickedEl, data) {
14005 if ( data === void 0 ) data = {};
14008 app.popup.close(data.popup, data.animate);
14013 var LoginScreen = /*@__PURE__*/(function (Modal) {
14014 function LoginScreen(app, params) {
14015 var extendedParams = Utils.extend({
14019 // Extends with open/close Modal methods;
14020 Modal.call(this, app, extendedParams);
14022 var loginScreen = this;
14024 loginScreen.params = extendedParams;
14028 if (!loginScreen.params.el) {
14029 $el = $(loginScreen.params.content).filter(function (elIndex, node) { return node.nodeType === 1; }).eq(0);
14031 $el = $(loginScreen.params.el).eq(0);
14034 if ($el && $el.length > 0 && $el[0].f7Modal) {
14035 return $el[0].f7Modal;
14038 if ($el.length === 0) {
14039 return loginScreen.destroy();
14042 Utils.extend(loginScreen, {
14046 type: 'loginScreen',
14049 $el[0].f7Modal = loginScreen;
14051 return loginScreen;
14054 if ( Modal ) LoginScreen.__proto__ = Modal;
14055 LoginScreen.prototype = Object.create( Modal && Modal.prototype );
14056 LoginScreen.prototype.constructor = LoginScreen;
14058 return LoginScreen;
14061 var LoginScreen$1 = {
14062 name: 'loginScreen',
14064 LoginScreen: LoginScreen,
14066 create: function create() {
14068 app.loginScreen = ModalMethods({
14070 constructor: LoginScreen,
14071 defaultSelector: '.login-screen.modal-in',
14075 '.login-screen-open': function openLoginScreen($clickedEl, data) {
14076 if ( data === void 0 ) data = {};
14079 app.loginScreen.open(data.loginScreen, data.animate);
14081 '.login-screen-close': function closeLoginScreen($clickedEl, data) {
14082 if ( data === void 0 ) data = {};
14085 app.loginScreen.close(data.loginScreen, data.animate);
14090 var Popover = /*@__PURE__*/(function (Modal) {
14091 function Popover(app, params) {
14092 var extendedParams = Utils.extend(
14094 app.params.popover,
14098 // Extends with open/close Modal methods;
14099 Modal.call(this, app, extendedParams);
14101 var popover = this;
14103 popover.params = extendedParams;
14107 if (!popover.params.el) {
14108 $el = $(popover.params.content).filter(function (elIndex, node) { return node.nodeType === 1; }).eq(0);
14110 $el = $(popover.params.el).eq(0);
14113 if ($el && $el.length > 0 && $el[0].f7Modal) {
14114 return $el[0].f7Modal;
14118 var $targetEl = $(popover.params.targetEl).eq(0);
14120 if ($el.length === 0) {
14121 return popover.destroy();
14126 if (popover.params.backdrop && popover.params.backdropEl) {
14127 $backdropEl = $(popover.params.backdropEl);
14128 } else if (popover.params.backdrop) {
14129 $backdropEl = app.root.children('.popover-backdrop');
14130 if ($backdropEl.length === 0) {
14131 $backdropEl = $('<div class="popover
-backdrop
"></div>');
14132 app.root.append($backdropEl);
14138 if ($el.find('.popover-angle').length === 0) {
14139 $angleEl = $('<div class="popover
-angle
"></div>');
14140 $el.prepend($angleEl);
14142 $angleEl = $el.find('.popover-angle');
14146 var originalOpen = popover.open;
14148 Utils.extend(popover, {
14152 $targetEl: $targetEl,
14153 targetEl: $targetEl[0],
14154 $angleEl: $angleEl,
14155 angleEl: $angleEl[0],
14156 $backdropEl: $backdropEl,
14157 backdropEl: $backdropEl && $backdropEl[0],
14159 open: function open() {
14162 var args = [], len = arguments.length;
14163 while ( len-- ) args[ len ] = arguments[ len ];
14164 var targetEl = args[0];
14165 var animate = args[1];
14166 if (typeof args[0] === 'boolean') { (assign = args, animate = assign[0], targetEl = assign[1]); }
14168 popover.$targetEl = $(targetEl);
14169 popover.targetEl = popover.$targetEl[0];
14171 return originalOpen.call(popover, animate);
14175 function handleResize() {
14178 popover.on('popoverOpen', function () {
14180 app.on('resize', handleResize);
14181 $(window).on('keyboardDidShow keyboardDidHide', handleResize);
14182 popover.on('popoverClose popoverBeforeDestroy', function () {
14183 app.off('resize', handleResize);
14184 $(window).off('keyboardDidShow keyboardDidHide', handleResize);
14188 function handleClick(e) {
14189 var target = e.target;
14190 var $target = $(target);
14191 var keyboardOpened = !app.device.desktop && app.device.cordova && ((window.Keyboard && window.Keyboard.isVisible) || (window.cordova.plugins && window.cordova.plugins.Keyboard && window.cordova.plugins.Keyboard.isVisible));
14192 if (keyboardOpened) { return; }
14193 if ($target.closest(popover.el).length === 0) {
14195 popover.params.closeByBackdropClick
14196 && popover.params.backdrop
14197 && popover.backdropEl
14198 && popover.backdropEl === target
14201 } else if (popover.params.closeByOutsideClick) {
14207 function onKeyDown(e) {
14208 var keyCode = e.keyCode;
14209 if (keyCode === 27 && popover.params.closeOnEscape) {
14214 if (popover.params.closeOnEscape) {
14215 popover.on('popoverOpen', function () {
14216 $(document).on('keydown', onKeyDown);
14218 popover.on('popoverClose', function () {
14219 $(document).off('keydown', onKeyDown);
14223 popover.on('popoverOpened', function () {
14224 if (popover.params.closeByOutsideClick || popover.params.closeByBackdropClick) {
14225 app.on('click', handleClick);
14228 popover.on('popoverClose', function () {
14229 if (popover.params.closeByOutsideClick || popover.params.closeByBackdropClick) {
14230 app.off('click', handleClick);
14234 $el[0].f7Modal = popover;
14239 if ( Modal ) Popover.__proto__ = Modal;
14240 Popover.prototype = Object.create( Modal && Modal.prototype );
14241 Popover.prototype.constructor = Popover;
14243 Popover.prototype.resize = function resize () {
14244 var popover = this;
14245 var app = popover.app;
14246 var $el = popover.$el;
14247 var $targetEl = popover.$targetEl;
14248 var $angleEl = popover.$angleEl;
14249 var ref = popover.params;
14250 var targetX = ref.targetX;
14251 var targetY = ref.targetY;
14252 $el.css({ left: '', top: '' });
14253 var ref$1 = [$el.width(), $el.height()];
14254 var width = ref$1[0];
14255 var height = ref$1[1];
14259 if (app.theme === 'ios' || app.theme === 'aurora') {
14260 $angleEl.removeClass('on-left on-right on-top on-bottom').css({ left: '', top: '' });
14261 angleSize = $angleEl.width() / 2;
14263 $el.removeClass('popover-on-left popover-on-right popover-on-top popover-on-bottom popover-on-middle').css({ left: '', top: '' });
14268 var targetOffsetLeft;
14269 var targetOffsetTop;
14270 if ($targetEl && $targetEl.length > 0) {
14271 targetWidth = $targetEl.outerWidth();
14272 targetHeight = $targetEl.outerHeight();
14274 var targetOffset = $targetEl.offset();
14275 targetOffsetLeft = targetOffset.left - app.left;
14276 targetOffsetTop = targetOffset.top - app.top;
14278 var targetParentPage = $targetEl.parents('.page');
14279 if (targetParentPage.length > 0) {
14280 targetOffsetTop -= targetParentPage[0].scrollTop;
14282 } else if (typeof targetX !== 'undefined' && targetY !== 'undefined') {
14283 targetOffsetLeft = targetX;
14284 targetOffsetTop = targetY;
14285 targetWidth = popover.params.targetWidth || 0;
14286 targetHeight = popover.params.targetHeight || 0;
14289 var ref$2 = [0, 0, 0];
14290 var left = ref$2[0];
14291 var top = ref$2[1];
14292 var diff = ref$2[2];
14294 var position = app.theme === 'md' ? 'bottom' : 'top';
14295 if (app.theme === 'md') {
14296 if (height < app.height - targetOffsetTop - targetHeight) {
14298 position = 'bottom';
14299 top = targetOffsetTop + targetHeight;
14300 } else if (height < targetOffsetTop) {
14302 top = targetOffsetTop - height;
14306 position = 'middle';
14307 top = ((targetHeight / 2) + targetOffsetTop) - (height / 2);
14309 top = Math.max(8, Math.min(top, app.height - height - 8));
14311 // Horizontal Position
14313 if (targetOffsetLeft < app.width / 2) {
14314 hPosition = 'right';
14315 left = position === 'middle'
14316 ? targetOffsetLeft + targetWidth
14317 : targetOffsetLeft;
14319 hPosition = 'left';
14320 left = position === 'middle'
14321 ? targetOffsetLeft - width
14322 : (targetOffsetLeft + targetWidth) - width;
14324 left = Math.max(8, Math.min(left, app.width - width - 8));
14325 $el.addClass(("popover
-on
-" + position + " popover
-on
-" + hPosition));
14328 if ((height + angleSize) < targetOffsetTop) {
14330 top = targetOffsetTop - height - angleSize;
14331 } else if ((height + angleSize) < app.height - targetOffsetTop - targetHeight) {
14333 position = 'bottom';
14334 top = targetOffsetTop + targetHeight + angleSize;
14337 position = 'middle';
14338 top = ((targetHeight / 2) + targetOffsetTop) - (height / 2);
14340 top = Math.max(5, Math.min(top, app.height - height - 5));
14344 // Horizontal Position
14345 if (position === 'top' || position === 'bottom') {
14346 left = ((targetWidth / 2) + targetOffsetLeft) - (width / 2);
14348 left = Math.max(5, Math.min(left, app.width - width - 5));
14349 if (position === 'top') {
14350 $angleEl.addClass('on-bottom');
14352 if (position === 'bottom') {
14353 $angleEl.addClass('on-top');
14356 angleLeft = ((width / 2) - angleSize) + diff;
14357 angleLeft = Math.max(Math.min(angleLeft, width - (angleSize * 2) - 13), 13);
14358 $angleEl.css({ left: (angleLeft + "px
") });
14359 } else if (position === 'middle') {
14360 left = targetOffsetLeft - width - angleSize;
14361 $angleEl.addClass('on-right');
14362 if (left < 5 || (left + width > app.width)) {
14363 if (left < 5) { left = targetOffsetLeft + targetWidth + angleSize; }
14364 if (left + width > app.width) { left = app.width - width - 5; }
14365 $angleEl.removeClass('on-right').addClass('on-left');
14367 angleTop = ((height / 2) - angleSize) + diff;
14368 angleTop = Math.max(Math.min(angleTop, height - (angleSize * 2) - 13), 13);
14369 $angleEl.css({ top: (angleTop + "px
") });
14374 $el.css({ top: (top + "px
"), left: (left + "px
") });
14385 backdropEl: undefined,
14386 closeByBackdropClick: true,
14387 closeByOutsideClick: true,
14388 closeOnEscape: false,
14394 create: function create() {
14396 app.popover = Utils.extend(
14399 constructor: Popover,
14400 defaultSelector: '.popover.modal-in',
14403 open: function open(popoverEl, targetEl, animate) {
14404 var $popoverEl = $(popoverEl);
14405 var popover = $popoverEl[0].f7Modal;
14406 if (!popover) { popover = new Popover(app, { el: $popoverEl, targetEl: targetEl }); }
14407 return popover.open(targetEl, animate);
14413 '.popover-open': function openPopover($clickedEl, data) {
14414 if ( data === void 0 ) data = {};
14417 app.popover.open(data.popover, $clickedEl, data.animate);
14419 '.popover-close': function closePopover($clickedEl, data) {
14420 if ( data === void 0 ) data = {};
14423 app.popover.close(data.popover, data.animate);
14428 /* eslint indent: ["off
"] */
14430 var Actions = /*@__PURE__*/(function (Modal) {
14431 function Actions(app, params) {
14432 var extendedParams = Utils.extend(
14434 app.params.actions,
14438 // Extends with open/close Modal methods;
14439 Modal.call(this, app, extendedParams);
14441 var actions = this;
14443 actions.params = extendedParams;
14447 if (actions.params.buttons) {
14448 groups = actions.params.buttons;
14449 if (!Array.isArray(groups[0])) { groups = [groups]; }
14451 actions.groups = groups;
14455 if (actions.params.el) {
14456 $el = $(actions.params.el).eq(0);
14457 } else if (actions.params.content) {
14458 $el = $(actions.params.content).filter(function (elIndex, node) { return node.nodeType === 1; }).eq(0);
14459 } else if (actions.params.buttons) {
14460 if (actions.params.convertToPopover) {
14461 actions.popoverHtml = actions.renderPopover();
14463 actions.actionsHtml = actions.render();
14466 if ($el && $el.length > 0 && $el[0].f7Modal) {
14467 return $el[0].f7Modal;
14470 if ($el && $el.length === 0 && !(actions.actionsHtml || actions.popoverHtml)) {
14471 return actions.destroy();
14476 if (actions.params.backdrop && actions.params.backdropEl) {
14477 $backdropEl = $(actions.params.backdropEl);
14478 } else if (actions.params.backdrop) {
14479 $backdropEl = app.root.children('.actions-backdrop');
14480 if ($backdropEl.length === 0) {
14481 $backdropEl = $('<div class="actions
-backdrop
"></div>');
14482 app.root.append($backdropEl);
14486 var originalOpen = actions.open;
14487 var originalClose = actions.close;
14490 function buttonOnClick(e) {
14491 var $buttonEl = $(this);
14494 if ($buttonEl.hasClass('list-button') || $buttonEl.hasClass('item-link')) {
14495 buttonIndex = $buttonEl.parents('li').index();
14496 groupIndex = $buttonEl.parents('.list').index();
14498 buttonIndex = $buttonEl.index();
14499 groupIndex = $buttonEl.parents('.actions-group').index();
14501 if (typeof groups !== 'undefined') {
14502 var button = groups[groupIndex][buttonIndex];
14503 if (button.onClick) { button.onClick(actions, e); }
14504 if (actions.params.onClick) { actions.params.onClick(actions, e); }
14505 if (button.close !== false) { actions.close(); }
14508 actions.open = function open(animate) {
14509 var convertToPopover = false;
14510 var ref = actions.params;
14511 var targetEl = ref.targetEl;
14512 var targetX = ref.targetX;
14513 var targetY = ref.targetY;
14514 var targetWidth = ref.targetWidth;
14515 var targetHeight = ref.targetHeight;
14516 if (actions.params.convertToPopover && (targetEl || (targetX !== undefined && targetY !== undefined))) {
14519 actions.params.forceToPopover
14520 || (app.device.ios && app.device.ipad)
14521 || app.width >= 768
14522 || (app.device.desktop && app.theme === 'aurora')
14524 convertToPopover = true;
14527 if (convertToPopover && actions.popoverHtml) {
14528 popover = app.popover.create({
14529 content: actions.popoverHtml,
14530 backdrop: actions.params.backdrop,
14531 targetEl: targetEl,
14534 targetWidth: targetWidth,
14535 targetHeight: targetHeight,
14537 popover.open(animate);
14538 popover.once('popoverOpened', function () {
14539 popover.$el.find('.list-button, .item-link').each(function (groupIndex, buttonEl) {
14540 $(buttonEl).on('click', buttonOnClick);
14543 popover.once('popoverClosed', function () {
14544 popover.$el.find('.list-button, .item-link').each(function (groupIndex, buttonEl) {
14545 $(buttonEl).off('click', buttonOnClick);
14547 Utils.nextTick(function () {
14549 popover = undefined;
14553 actions.$el = actions.actionsHtml ? $(actions.actionsHtml) : actions.$el;
14554 actions.$el[0].f7Modal = actions;
14555 if (actions.groups) {
14556 actions.$el.find('.actions-button').each(function (groupIndex, buttonEl) {
14557 $(buttonEl).on('click', buttonOnClick);
14559 actions.once('actionsClosed', function () {
14560 actions.$el.find('.actions-button').each(function (groupIndex, buttonEl) {
14561 $(buttonEl).off('click', buttonOnClick);
14565 actions.el = actions.$el[0];
14566 originalOpen.call(actions, animate);
14571 actions.close = function close(animate) {
14573 popover.close(animate);
14575 originalClose.call(actions, animate);
14580 Utils.extend(actions, {
14583 el: $el ? $el[0] : undefined,
14584 $backdropEl: $backdropEl,
14585 backdropEl: $backdropEl && $backdropEl[0],
14589 function handleClick(e) {
14590 var target = e.target;
14591 var $target = $(target);
14592 var keyboardOpened = !app.device.desktop && app.device.cordova && ((window.Keyboard && window.Keyboard.isVisible) || (window.cordova.plugins && window.cordova.plugins.Keyboard && window.cordova.plugins.Keyboard.isVisible));
14593 if (keyboardOpened) { return; }
14594 if ($target.closest(actions.el).length === 0) {
14596 actions.params.closeByBackdropClick
14597 && actions.params.backdrop
14598 && actions.backdropEl
14599 && actions.backdropEl === target
14602 } else if (actions.params.closeByOutsideClick) {
14608 function onKeyDown(e) {
14609 var keyCode = e.keyCode;
14610 if (keyCode === 27 && actions.params.closeOnEscape) {
14615 if (actions.params.closeOnEscape) {
14616 actions.on('open', function () {
14617 $(document).on('keydown', onKeyDown);
14619 actions.on('close', function () {
14620 $(document).off('keydown', onKeyDown);
14624 actions.on('opened', function () {
14625 if (actions.params.closeByBackdropClick || actions.params.closeByOutsideClick) {
14626 app.on('click', handleClick);
14629 actions.on('close', function () {
14630 if (actions.params.closeByBackdropClick || actions.params.closeByOutsideClick) {
14631 app.off('click', handleClick);
14636 $el[0].f7Modal = actions;
14642 if ( Modal ) Actions.__proto__ = Modal;
14643 Actions.prototype = Object.create( Modal && Modal.prototype );
14644 Actions.prototype.constructor = Actions;
14646 Actions.prototype.render = function render () {
14647 var actions = this;
14648 if (actions.params.render) { return actions.params.render.call(actions, actions); }
14649 var groups = actions.groups;
14650 return ("\n <div
class=\"actions
-modal
" + (actions.params.grid ? ' actions-grid' : '') + "\">\n " + (groups.map(function (group) { return ("<div
class=\"actions
-group
\">\n " + (group.map(function (button) {
14651 var buttonClasses = [("actions
-" + (button.label ? 'label' : 'button'))];
14652 var color = button.color;
14653 var bg = button.bg;
14654 var bold = button.bold;
14655 var disabled = button.disabled;
14656 var label = button.label;
14657 var text = button.text;
14658 var icon = button.icon;
14659 if (color) { buttonClasses.push(("color
-" + color)); }
14660 if (bg) { buttonClasses.push(("bg
-color
-" + bg)); }
14661 if (bold) { buttonClasses.push('actions-button-bold'); }
14662 if (disabled) { buttonClasses.push('disabled'); }
14664 return ("<div
class=\"" + (buttonClasses.join(' ')) + "\">" + text + "</div
>");
14666 return ("\n <div
class=\"" + (buttonClasses.join(' ')) + "\">\n " + (icon ? ("<div
class=\"actions
-button
-media
\">" + icon + "</div>") : '') + "\n <div class=\"actions-button-text\">" + text + "</div>\n </div
>").trim();
14667 }).join('')) + "\n </div>"); }).join('')) + "\n </div>\n ").trim();
14670 Actions.prototype.renderPopover = function renderPopover () {
14671 var actions = this;
14672 if (actions.params.renderPopover) { return actions.params.renderPopover.call(actions, actions); }
14673 var groups = actions.groups;
14674 return ("\n <div
class=\"popover popover
-from-actions
\">\n <div
class=\"popover
-inner
\">\n " + (groups.map(function (group) { return ("\n <div
class=\"list
\">\n <ul
>\n " + (group.map(function (button) {
14675 var itemClasses = [];
14676 var color = button.color;
14677 var bg = button.bg;
14678 var bold = button.bold;
14679 var disabled = button.disabled;
14680 var label = button.label;
14681 var text = button.text;
14682 var icon = button.icon;
14683 if (color) { itemClasses.push(("color
-" + color)); }
14684 if (bg) { itemClasses.push(("bg
-color
-" + bg)); }
14685 if (bold) { itemClasses.push('popover-from-actions-bold'); }
14686 if (disabled) { itemClasses.push('disabled'); }
14688 itemClasses.push('popover-from-actions-label');
14689 return ("<li
class=\"" + (itemClasses.join(' ')) + "\">" + text + "</li
>");
14692 itemClasses.push('item-link item-content');
14693 return ("\n <li
>\n <a
class=\"" + (itemClasses.join(' ')) + "\">\n <div
class=\"item
-media
\">\n " + icon + "\n </div>\n <div class=\"item-inner\">\n <div class=\"item-title\">\n " + text + "\n </div>\n </div>\n </a>\n </li
>\n ");
14695 itemClasses.push('list-button');
14696 return ("\n <li
>\n <a
class=\"" + (itemClasses.join(' ')) + "\">" + text + "</a>\n </li>\n ");
14697 }).join('')) + "\n </ul>\n </div>\n "); }).join('')) + "\n </div>\n </div>\n ").trim();
14707 convertToPopover: true,
14708 forceToPopover: false,
14710 backdropEl: undefined,
14711 closeByBackdropClick: true,
14712 closeOnEscape: false,
14714 renderPopover: null,
14720 create: function create() {
14722 app.actions = ModalMethods({
14724 constructor: Actions,
14725 defaultSelector: '.actions-modal.modal-in',
14729 '.actions-open': function openActions($clickedEl, data) {
14730 if ( data === void 0 ) data = {};
14733 app.actions.open(data.actions, data.animate);
14735 '.actions-close': function closeActions($clickedEl, data) {
14736 if ( data === void 0 ) data = {};
14739 app.actions.close(data.actions, data.animate);
14744 var Sheet = /*@__PURE__*/(function (Modal) {
14745 function Sheet(app, params) {
14746 var extendedParams = Utils.extend(
14752 // Extends with open/close Modal methods;
14753 Modal.call(this, app, extendedParams);
14757 sheet.params = extendedParams;
14758 if (typeof sheet.params.backdrop === 'undefined') {
14759 sheet.params.backdrop = app.theme !== 'ios';
14764 if (!sheet.params.el) {
14765 $el = $(sheet.params.content).filter(function (elIndex, node) { return node.nodeType === 1; }).eq(0);
14767 $el = $(sheet.params.el).eq(0);
14770 if ($el && $el.length > 0 && $el[0].f7Modal) {
14771 return $el[0].f7Modal;
14774 if ($el.length === 0) {
14775 return sheet.destroy();
14779 if (sheet.params.backdrop && sheet.params.backdropEl) {
14780 $backdropEl = $(sheet.params.backdropEl);
14781 } else if (sheet.params.backdrop) {
14782 $backdropEl = app.root.children('.sheet-backdrop');
14783 if ($backdropEl.length === 0) {
14784 $backdropEl = $('<div class="sheet
-backdrop
"></div>');
14785 app.root.append($backdropEl);
14789 Utils.extend(sheet, {
14793 $backdropEl: $backdropEl,
14794 backdropEl: $backdropEl && $backdropEl[0],
14798 var $pageContentEl;
14799 function scrollToElementOnOpen() {
14800 var $scrollEl = $(sheet.params.scrollToEl).eq(0);
14801 if ($scrollEl.length === 0) { return; }
14802 $pageContentEl = $scrollEl.parents('.page-content');
14803 if ($pageContentEl.length === 0) { return; }
14805 var paddingTop = parseInt($pageContentEl.css('padding-top'), 10);
14806 var paddingBottom = parseInt($pageContentEl.css('padding-bottom'), 10);
14807 var pageHeight = $pageContentEl[0].offsetHeight - paddingTop - $el.height();
14808 var pageScrollHeight = $pageContentEl[0].scrollHeight - paddingTop - $el.height();
14809 var pageScroll = $pageContentEl.scrollTop();
14811 var newPaddingBottom;
14813 var scrollElTop = ($scrollEl.offset().top - paddingTop) + $scrollEl[0].offsetHeight;
14814 if (scrollElTop > pageHeight) {
14815 var scrollTop = (pageScroll + scrollElTop) - pageHeight;
14816 if (scrollTop + pageHeight > pageScrollHeight) {
14817 newPaddingBottom = ((scrollTop + pageHeight) - pageScrollHeight) + paddingBottom;
14818 if (pageHeight === pageScrollHeight) {
14819 newPaddingBottom = $el.height();
14821 $pageContentEl.css({
14822 'padding-bottom': (newPaddingBottom + "px
"),
14825 $pageContentEl.scrollTop(scrollTop, 300);
14829 function scrollToElementOnClose() {
14830 if ($pageContentEl && $pageContentEl.length > 0) {
14831 $pageContentEl.css({
14832 'padding-bottom': '',
14836 function handleClick(e) {
14837 var target = e.target;
14838 var $target = $(target);
14839 var keyboardOpened = !app.device.desktop && app.device.cordova && ((window.Keyboard && window.Keyboard.isVisible) || (window.cordova.plugins && window.cordova.plugins.Keyboard && window.cordova.plugins.Keyboard.isVisible));
14840 if (keyboardOpened) { return; }
14841 if ($target.closest(sheet.el).length === 0) {
14843 sheet.params.closeByBackdropClick
14844 && sheet.params.backdrop
14845 && sheet.backdropEl
14846 && sheet.backdropEl === target
14849 } else if (sheet.params.closeByOutsideClick) {
14855 function onKeyDown(e) {
14856 var keyCode = e.keyCode;
14857 if (keyCode === 27 && sheet.params.closeOnEscape) {
14863 var isTouched = false;
14867 var touchStartTime;
14869 var isMoved = false;
14870 var isTopSheetModal;
14871 var swipeStepTranslate;
14872 var startTranslate;
14873 var currentTranslate;
14874 var sheetElOffsetHeight;
14878 function handleTouchStart(e) {
14879 if (isTouched || !(sheet.params.swipeToClose || sheet.params.swipeToStep)) { return; }
14880 if (sheet.params.swipeHandler && $(e.target).closest(sheet.params.swipeHandler).length === 0) {
14886 x: e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX,
14887 y: e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY,
14889 touchStartTime = Utils.now();
14890 isScrolling = undefined;
14891 isTopSheetModal = $el.hasClass('sheet-modal-top');
14893 function handleTouchMove(e) {
14894 if (!isTouched) { return; }
14896 x: e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX,
14897 y: e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY,
14900 if (typeof isScrolling === 'undefined') {
14901 isScrolling = !!(isScrolling || Math.abs(currentTouch.x - startTouch.x) > Math.abs(currentTouch.y - startTouch.y));
14909 touchesDiff = startTouch.y - currentTouch.y;
14911 sheetElOffsetHeight = $el[0].offsetHeight;
14912 startTranslate = Utils.getTranslate($el[0], 'y');
14913 if (isTopSheetModal) {
14914 minTranslate = sheet.params.swipeToClose ? -sheetElOffsetHeight : -swipeStepTranslate;
14918 maxTranslate = sheet.params.swipeToClose ? sheetElOffsetHeight : swipeStepTranslate;
14922 currentTranslate = startTranslate - touchesDiff;
14923 currentTranslate = Math.min(Math.max(currentTranslate, minTranslate), maxTranslate);
14924 e.preventDefault();
14927 .transform(("translate3d(0," + currentTranslate + "px
,0)"));
14928 if (sheet.params.swipeToStep) {
14930 if (isTopSheetModal) {
14931 progress = 1 - (currentTranslate / swipeStepTranslate);
14933 progress = (swipeStepTranslate - currentTranslate) / swipeStepTranslate;
14935 progress = Math.min(Math.max(progress, 0), 1);
14936 $el.trigger('sheet:stepprogress', progress);
14937 sheet.emit('local::stepProgress sheetStepProgress', sheet, progress);
14940 function handleTouchEnd() {
14946 $el.transform('').transition('');
14948 var direction = touchesDiff < 0 ? 'to-bottom' : 'to-top';
14950 var diff = Math.abs(touchesDiff);
14951 if (diff === 0 || currentTranslate === startTranslate) { return; }
14953 var timeDiff = (new Date()).getTime() - touchStartTime;
14955 if (!sheet.params.swipeToStep) {
14956 if (direction !== (isTopSheetModal ? 'to-top' : 'to-bottom')) {
14959 if ((timeDiff < 300 && diff > 20) || (timeDiff >= 300 && diff > (sheetElOffsetHeight / 2))) {
14965 var openDirection = isTopSheetModal ? 'to-bottom' : 'to-top';
14966 var closeDirection = isTopSheetModal ? 'to-top' : 'to-bottom';
14967 var absCurrentTranslate = Math.abs(currentTranslate);
14968 var absSwipeStepTranslate = Math.abs(swipeStepTranslate);
14970 if (timeDiff < 300 && diff > 10) {
14971 if (direction === openDirection && absCurrentTranslate < absSwipeStepTranslate) {
14973 $el.removeClass('modal-in-swipe-step');
14974 $el.trigger('sheet:stepprogress', 1);
14975 sheet.emit('local::stepProgress sheetStepProgress', sheet, 1);
14976 $el.trigger('sheet:stepopen');
14977 sheet.emit('local::stepOpen sheetStepOpen', sheet);
14979 if (direction === closeDirection && absCurrentTranslate > absSwipeStepTranslate) {
14981 if (sheet.params.swipeToClose) {
14985 $el.addClass('modal-in-swipe-step');
14986 $el.trigger('sheet:stepprogress', 0);
14987 sheet.emit('local::stepProgress sheetStepProgress', sheet, 0);
14988 $el.trigger('sheet:stepclose');
14989 sheet.emit('local::stepClose sheetStepClose', sheet);
14992 if (direction === closeDirection && absCurrentTranslate <= absSwipeStepTranslate) {
14994 $el.addClass('modal-in-swipe-step');
14995 $el.trigger('sheet:stepprogress', 0);
14996 sheet.emit('local::stepProgress sheetStepProgress', sheet, 0);
14997 $el.trigger('sheet:stepclose');
14998 sheet.emit('local::stepClose sheetStepClose', sheet);
15002 if (timeDiff >= 300) {
15003 var stepOpened = !$el.hasClass('modal-in-swipe-step');
15005 if (absCurrentTranslate < (absSwipeStepTranslate / 2)) {
15007 $el.removeClass('modal-in-swipe-step');
15008 $el.trigger('sheet:stepprogress', 1);
15009 sheet.emit('local::stepProgress sheetStepProgress', sheet, 1);
15010 $el.trigger('sheet:stepopen');
15011 sheet.emit('local::stepOpen sheetStepOpen', sheet);
15012 } else if ((absCurrentTranslate - absSwipeStepTranslate) > (sheetElOffsetHeight - absSwipeStepTranslate) / 2) {
15014 if (sheet.params.swipeToClose) { sheet.close(); }
15016 } else if (stepOpened) {
15017 if (absCurrentTranslate > absSwipeStepTranslate + (sheetElOffsetHeight - absSwipeStepTranslate) / 2) {
15019 if (sheet.params.swipeToClose) { sheet.close(); }
15020 } else if (absCurrentTranslate > absSwipeStepTranslate / 2) {
15022 $el.addClass('modal-in-swipe-step');
15023 $el.trigger('sheet:stepprogress', 0);
15024 sheet.emit('local::stepProgress sheetStepProgress', sheet, 0);
15025 $el.trigger('sheet:stepclose');
15026 sheet.emit('local::stepClose sheetStepClose', sheet);
15032 function setSwipeStep(byResize) {
15033 var $swipeStepEl = $el.find('.sheet-modal-swipe-step').eq(0);
15034 if (!$swipeStepEl.length) { return; }
15035 if ($el.hasClass('sheet-modal-top')) {
15036 swipeStepTranslate = -($swipeStepEl.offset().top - $el.offset().top + $swipeStepEl[0].offsetHeight);
15038 swipeStepTranslate = $el[0].offsetHeight - ($swipeStepEl.offset().top - $el.offset().top + $swipeStepEl[0].offsetHeight);
15040 $el[0].style.setProperty('--f7-sheet-swipe-step', (swipeStepTranslate + "px
"));
15042 $el.addClass('modal-in-swipe-step');
15046 function onResize() {
15047 setSwipeStep(true);
15050 var passive = Support.passiveListener ? { passive: true } : false;
15051 if (sheet.params.swipeToClose || sheet.params.swipeToStep) {
15052 $el.on(app.touchEvents.start, handleTouchStart, passive);
15053 app.on('touchmove', handleTouchMove);
15054 app.on('touchend:passive', handleTouchEnd);
15055 sheet.once('sheetDestroy', function () {
15056 $el.off(app.touchEvents.start, handleTouchStart, passive);
15057 app.off('touchmove', handleTouchMove);
15058 app.off('touchend:passive', handleTouchEnd);
15062 sheet.on('sheetOpen', function () {
15063 if (sheet.params.closeOnEscape) {
15064 $(document).on('keydown', onKeyDown);
15066 if (sheet.params.swipeToStep) {
15068 app.on('resize', onResize);
15070 if (sheet.params.scrollToEl) {
15071 scrollToElementOnOpen();
15074 sheet.on('sheetOpened', function () {
15075 if (sheet.params.closeByOutsideClick || sheet.params.closeByBackdropClick) {
15076 app.on('click', handleClick);
15079 sheet.on('sheetClose', function () {
15080 if (sheet.params.swipeToStep) {
15081 $el.removeClass('modal-in-swipe-step');
15082 app.off('resize', onResize);
15084 if (sheet.params.closeOnEscape) {
15085 $(document).off('keydown', onKeyDown);
15087 if (sheet.params.scrollToEl) {
15088 scrollToElementOnClose();
15090 if (sheet.params.closeByOutsideClick || sheet.params.closeByBackdropClick) {
15091 app.off('click', handleClick);
15095 sheet.stepOpen = function stepOpen() {
15096 $el.removeClass('modal-in-swipe-step');
15098 sheet.stepClose = function stepClose() {
15099 $el.addClass('modal-in-swipe-step');
15101 sheet.stepToggle = function stepToggle() {
15102 $el.toggleClass('modal-in-swipe-step');
15105 $el[0].f7Modal = sheet;
15110 if ( Modal ) Sheet.__proto__ = Modal;
15111 Sheet.prototype = Object.create( Modal && Modal.prototype );
15112 Sheet.prototype.constructor = Sheet;
15121 backdrop: undefined,
15122 backdropEl: undefined,
15123 closeByBackdropClick: true,
15124 closeByOutsideClick: false,
15125 closeOnEscape: false,
15126 swipeToClose: false,
15127 swipeToStep: false,
15128 swipeHandler: null,
15134 create: function create() {
15136 app.sheet = Utils.extend(
15140 constructor: Sheet,
15141 defaultSelector: '.sheet-modal.modal-in',
15144 stepOpen: function stepOpen(sheet) {
15145 var sheetInstance = app.sheet.get(sheet);
15146 if (sheetInstance && sheetInstance.stepOpen) { return sheetInstance.stepOpen(); }
15149 stepClose: function stepClose(sheet) {
15150 var sheetInstance = app.sheet.get(sheet);
15151 if (sheetInstance && sheetInstance.stepClose) { return sheetInstance.stepClose(); }
15154 stepToggle: function stepToggle(sheet) {
15155 var sheetInstance = app.sheet.get(sheet);
15156 if (sheetInstance && sheetInstance.stepToggle) { return sheetInstance.stepToggle(); }
15163 '.sheet-open': function openSheet($clickedEl, data) {
15164 if ( data === void 0 ) data = {};
15167 if ($('.sheet-modal.modal-in').length > 0 && data.sheet && $(data.sheet)[0] !== $('.sheet-modal.modal-in')[0]) {
15168 app.sheet.close('.sheet-modal.modal-in');
15170 app.sheet.open(data.sheet, data.animate);
15172 '.sheet-close': function closeSheet($clickedEl, data) {
15173 if ( data === void 0 ) data = {};
15176 app.sheet.close(data.sheet, data.animate);
15181 var Toast = /*@__PURE__*/(function (Modal) {
15182 function Toast(app, params) {
15183 var extendedParams = Utils.extend({
15185 }, app.params.toast, params);
15187 // Extends with open/close Modal methods;
15188 Modal.call(this, app, extendedParams);
15194 toast.params = extendedParams;
15196 var ref = toast.params;
15197 var closeButton = ref.closeButton;
15198 var closeTimeout = ref.closeTimeout;
15201 if (!toast.params.el) {
15203 var toastHtml = toast.render();
15205 $el = $(toastHtml);
15207 $el = $(toast.params.el);
15210 if ($el && $el.length > 0 && $el[0].f7Modal) {
15211 return $el[0].f7Modal;
15214 if ($el.length === 0) {
15215 return toast.destroy();
15218 Utils.extend(toast, {
15224 $el[0].f7Modal = toast;
15227 $el.find('.toast-button').on('click', function () {
15228 toast.emit('local::closeButtonClick toastCloseButtonClick', toast);
15232 toast.on('beforeDestroy', function () {
15233 $el.find('.toast-button').off('click');
15238 toast.on('open', function () {
15239 $('.toast.modal-in').each(function (index, openedEl) {
15240 var toastInstance = app.toast.get(openedEl);
15241 if (openedEl !== toast.el && toastInstance) {
15242 toastInstance.close();
15245 if (closeTimeout) {
15246 timeoutId = Utils.nextTick(function () {
15251 toast.on('close', function () {
15252 win.clearTimeout(timeoutId);
15255 if (toast.params.destroyOnClose) {
15256 toast.once('closed', function () {
15257 setTimeout(function () {
15266 if ( Modal ) Toast.__proto__ = Modal;
15267 Toast.prototype = Object.create( Modal && Modal.prototype );
15268 Toast.prototype.constructor = Toast;
15270 Toast.prototype.render = function render () {
15272 if (toast.params.render) { return toast.params.render.call(toast, toast); }
15273 var ref = toast.params;
15274 var position = ref.position;
15275 var cssClass = ref.cssClass;
15276 var icon = ref.icon;
15277 var text = ref.text;
15278 var closeButton = ref.closeButton;
15279 var closeButtonColor = ref.closeButtonColor;
15280 var closeButtonText = ref.closeButtonText;
15281 return ("\n <div
class=\"toast toast
-" + position + " " + (cssClass || '') + " " + (icon ? 'toast-with-icon' : '') + "\">\n <div
class=\"toast
-content
\">\n " + (icon ? ("<div
class=\"toast
-icon
\">" + icon + "</div>") : '') + "\n <div class=\"toast-text\">" + text + "</div>\n " + (closeButton && !icon ? ("\n <a
class=\"toast
-button button
" + (closeButtonColor ? ("color
-" + closeButtonColor) : '') + "\">" + closeButtonText + "</a>\n ").trim() : '') + "\n </div>\n </div
>\n ").trim();
15292 create: function create() {
15294 app.toast = Utils.extend(
15298 constructor: Toast,
15299 defaultSelector: '.toast.modal-in',
15303 show: function show(params) {
15304 Utils.extend(params, {
15305 destroyOnClose: true,
15307 return new Toast(app, params).open();
15316 position: 'bottom',
15317 closeButton: false,
15318 closeButtonColor: null,
15319 closeButtonText: 'Ok',
15320 closeTimeout: null,
15328 init: function init(el) {
15331 if ($el.length === 0 || $el.children('.preloader-inner').length > 0 || $el.children('.preloader-inner-line').length > 0) { return; }
15332 $el.append(Utils[((app.theme) + "PreloaderContent
")]);
15336 show: function show(color) {
15337 if ( color === void 0 ) color = 'white';
15340 if (Preloader.visible) { return; }
15341 var preloaderInner = Utils[((app.theme) + "PreloaderContent
")] || '';
15342 $('html').addClass('with-modal-preloader');
15343 app.root.append(("\n <div
class=\"preloader
-backdrop
\"></div>\n <div class=\"preloader-modal\">\n <div class=\"preloader color-" + color + "\">" + preloaderInner + "</div>\n </div
>\n "));
15344 Preloader.visible = true;
15346 hide: function hide() {
15348 if (!Preloader.visible) { return; }
15349 $('html').removeClass('with-modal-preloader');
15350 app.root.find('.preloader-backdrop, .preloader-modal').remove();
15351 Preloader.visible = false;
15354 var Preloader$1 = {
15356 create: function create() {
15358 Utils.extend(app, {
15360 init: Preloader.init.bind(app),
15361 show: Preloader.show.bind(app),
15362 hide: Preloader.hide.bind(app),
15367 photoBrowserOpen: function photoBrowserOpen(pb) {
15369 pb.$el.find('.preloader').each(function (index, preloaderEl) {
15370 app.preloader.init(preloaderEl);
15373 pageInit: function pageInit(page) {
15375 page.$el.find('.preloader').each(function (index, preloaderEl) {
15376 app.preloader.init(preloaderEl);
15382 insert: function insert(vnode) {
15384 var preloaderEl = vnode.elm;
15385 app.preloader.init(preloaderEl);
15391 var Progressbar = {
15392 set: function set() {
15395 var args = [], len = arguments.length;
15396 while ( len-- ) args[ len ] = arguments[ len ];
15399 var progress = args[1];
15400 var duration = args[2];
15401 if (typeof args[0] === 'number') {
15402 (assign = args, progress = assign[0], duration = assign[1]);
15405 if (typeof progress === 'undefined' || progress === null) { return el; }
15406 if (!progress) { progress = 0; }
15408 var $el = $(el || app.root);
15409 if ($el.length === 0) {
15412 var progressNormalized = Math.min(Math.max(progress, 0), 100);
15413 var $progressbarEl;
15414 if ($el.hasClass('progressbar')) { $progressbarEl = $el.eq(0); }
15416 $progressbarEl = $el.children('.progressbar');
15418 if ($progressbarEl.length === 0 || $progressbarEl.hasClass('progressbar-infinite')) {
15419 return $progressbarEl;
15421 var $progressbarLine = $progressbarEl.children('span');
15422 if ($progressbarLine.length === 0) {
15423 $progressbarLine = $('<span></span>');
15424 $progressbarEl.append($progressbarLine);
15427 .transition(typeof duration !== 'undefined' ? duration : '')
15428 .transform(("translate3d(" + ((-100 + progressNormalized)) + "%,0,0)"));
15430 return $progressbarEl[0];
15432 show: function show() {
15433 var assign, assign$1;
15435 var args = [], len = arguments.length;
15436 while ( len-- ) args[ len ] = arguments[ len ];
15439 // '.page', 50, 'multi'
15441 var progress = args[1];
15442 var color = args[2];
15443 var type = 'determined';
15445 if (args.length === 2) {
15446 if ((typeof args[0] === 'string' || typeof args[0] === 'object') && typeof args[1] === 'string') {
15447 // '.page', 'multi'
15448 (assign = args, el = assign[0], color = assign[1], progress = assign[2]);
15450 } else if (typeof args[0] === 'number' && typeof args[1] === 'string') {
15452 (assign$1 = args, progress = assign$1[0], color = assign$1[1]);
15455 } else if (args.length === 1) {
15456 if (typeof args[0] === 'number') {
15458 progress = args[0];
15459 } else if (typeof args[0] === 'string') {
15464 } else if (args.length === 0) {
15470 if ($el.length === 0) { return undefined; }
15472 var $progressbarEl;
15473 if ($el.hasClass('progressbar') || $el.hasClass('progressbar-infinite')) {
15474 $progressbarEl = $el;
15476 $progressbarEl = $el.children('.progressbar:not(.progressbar-out), .progressbar-infinite:not(.progressbar-out)');
15477 if ($progressbarEl.length === 0) {
15478 $progressbarEl = $(("\n <span
class=\"progressbar
" + (type === 'infinite' ? '-infinite' : '') + (color ? (" color
-" + color) : '') + " progressbar
-in\">\n " + (type === 'infinite' ? '' : '<span></span>') + "\n </span
>"));
15479 $el.append($progressbarEl);
15483 if (typeof progress !== 'undefined') {
15484 app.progressbar.set($progressbarEl, progress);
15487 return $progressbarEl[0];
15489 hide: function hide(el, removeAfterHide) {
15490 if ( removeAfterHide === void 0 ) removeAfterHide = true;
15493 var $el = $(el || app.root);
15494 if ($el.length === 0) { return undefined; }
15495 var $progressbarEl;
15496 if ($el.hasClass('progressbar') || $el.hasClass('progressbar-infinite')) {
15497 $progressbarEl = $el;
15499 $progressbarEl = $el.children('.progressbar, .progressbar-infinite');
15501 if ($progressbarEl.length === 0 || !$progressbarEl.hasClass('progressbar-in') || $progressbarEl.hasClass('progressbar-out')) {
15502 return $progressbarEl;
15505 .removeClass('progressbar-in')
15506 .addClass('progressbar-out')
15507 .animationEnd(function () {
15508 if (removeAfterHide) {
15509 $progressbarEl.remove();
15512 return $progressbarEl;
15516 var Progressbar$1 = {
15517 name: 'progressbar',
15518 create: function create() {
15520 Utils.extend(app, {
15522 set: Progressbar.set.bind(app),
15523 show: Progressbar.show.bind(app),
15524 hide: Progressbar.hide.bind(app),
15529 pageInit: function pageInit(page) {
15531 page.$el.find('.progressbar').each(function (index, progressbarEl) {
15532 var $progressbarEl = $(progressbarEl);
15533 app.progressbar.set($progressbarEl, $progressbarEl.attr('data-progress'));
15539 insert: function insert(vnode) {
15541 var el = vnode.elm;
15542 app.progressbar.set(el, el.getAttribute('data-progress'));
15544 update: function update(vnode) {
15546 var el = vnode.elm;
15547 app.progressbar.set(el, el.getAttribute('data-progress'));
15554 init: function init() {
15562 var $sortableContainer;
15563 var sortingElHeight;
15566 var $insertAfterEl;
15567 var $insertBeforeEl;
15570 var $pageContentEl;
15573 var sortingElOffsetLocal;
15574 var sortingElOffsetTop;
15575 var initialScrollTop;
15577 function handleTouchStart(e) {
15580 touchStartY = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
15581 $sortingEl = $(this).parent('li');
15582 indexFrom = $sortingEl.index();
15583 $sortableContainer = $sortingEl.parents('.sortable');
15584 var $listGroup = $sortingEl.parents('.list-group');
15585 if ($listGroup.length && $listGroup.parents($sortableContainer).length) {
15586 $sortableContainer = $listGroup;
15588 $sortingItems = $sortableContainer.children('ul').children('li');
15589 if (app.panel) { app.panel.allowOpen = false; }
15590 if (app.swipeout) { app.swipeout.allow = false; }
15592 function handleTouchMove(e) {
15593 if (!isTouched || !$sortingEl) { return; }
15594 var pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY;
15596 $pageEl = $sortingEl.parents('.page');
15597 $pageContentEl = $sortingEl.parents('.page-content');
15598 var paddingTop = parseInt($pageContentEl.css('padding-top'), 10);
15599 var paddingBottom = parseInt($pageContentEl.css('padding-bottom'), 10);
15600 initialScrollTop = $pageContentEl[0].scrollTop;
15601 pageOffset = $pageEl.offset().top + paddingTop;
15602 pageHeight = $pageEl.height() - paddingTop - paddingBottom;
15603 $sortingEl.addClass('sorting');
15604 $sortableContainer.addClass('sortable-sorting');
15605 sortingElOffsetLocal = $sortingEl[0].offsetTop;
15606 minTop = $sortingEl[0].offsetTop;
15607 maxTop = $sortingEl.parent().height() - sortingElOffsetLocal - $sortingEl.height();
15608 sortingElHeight = $sortingEl[0].offsetHeight;
15609 sortingElOffsetTop = $sortingEl.offset().top;
15613 e.preventDefault();
15614 e.f7PreventSwipePanel = true;
15616 touchesDiff = pageY - touchStartY;
15618 var translateScrollOffset = $pageContentEl[0].scrollTop - initialScrollTop;
15619 var translate = Math.min(Math.max(touchesDiff + translateScrollOffset, -minTop), maxTop);
15620 $sortingEl.transform(("translate3d(0," + translate + "px
,0)"));
15622 var scrollAddition = 44;
15623 var allowScroll = true;
15624 if ((touchesDiff + translateScrollOffset) + scrollAddition < -minTop) {
15625 allowScroll = false;
15627 if ((touchesDiff + translateScrollOffset) - scrollAddition > maxTop) {
15628 allowScroll = false;
15631 $insertBeforeEl = undefined;
15632 $insertAfterEl = undefined;
15636 if (sortingElOffsetTop + touchesDiff + sortingElHeight + scrollAddition > pageOffset + pageHeight) {
15638 scrollDiff = (sortingElOffsetTop + touchesDiff + sortingElHeight + scrollAddition) - (pageOffset + pageHeight);
15640 if (sortingElOffsetTop + touchesDiff < pageOffset + scrollAddition) {
15642 scrollDiff = (sortingElOffsetTop + touchesDiff) - pageOffset - scrollAddition;
15645 $pageContentEl[0].scrollTop += scrollDiff;
15649 $sortingItems.each(function (index, el) {
15650 var $currentEl = $(el);
15651 if ($currentEl[0] === $sortingEl[0]) { return; }
15652 var currentElOffset = $currentEl[0].offsetTop;
15653 var currentElHeight = $currentEl.height();
15654 var sortingElOffset = sortingElOffsetLocal + translate;
15656 if ((sortingElOffset >= currentElOffset - (currentElHeight / 2)) && $sortingEl.index() < $currentEl.index()) {
15657 $currentEl.transform(("translate3d(0, " + (-sortingElHeight) + "px
,0)"));
15658 $insertAfterEl = $currentEl;
15659 $insertBeforeEl = undefined;
15660 } else if ((sortingElOffset <= currentElOffset + (currentElHeight / 2)) && $sortingEl.index() > $currentEl.index()) {
15661 $currentEl.transform(("translate3d(0, " + sortingElHeight + "px
,0)"));
15662 $insertAfterEl = undefined;
15663 if (!$insertBeforeEl) { $insertBeforeEl = $currentEl; }
15665 $currentEl.transform('translate3d(0, 0%,0)');
15669 function handleTouchEnd() {
15670 if (!isTouched || !isMoved) {
15673 if (isTouched && !isMoved) {
15674 if (app.panel) { app.panel.allowOpen = true; }
15675 if (app.swipeout) { app.swipeout.allow = true; }
15679 if (app.panel) { app.panel.allowOpen = true; }
15680 if (app.swipeout) { app.swipeout.allow = true; }
15682 $sortingItems.transform('');
15683 $sortingEl.removeClass('sorting');
15684 $sortableContainer.removeClass('sortable-sorting');
15687 if ($insertAfterEl) { indexTo = $insertAfterEl.index(); }
15688 else if ($insertBeforeEl) { indexTo = $insertBeforeEl.index(); }
15690 if (app.params.sortable.moveElements) {
15691 if ($insertAfterEl) {
15692 $sortingEl.insertAfter($insertAfterEl);
15694 if ($insertBeforeEl) {
15695 $sortingEl.insertBefore($insertBeforeEl);
15699 if (($insertAfterEl || $insertBeforeEl)
15700 && $sortableContainer.hasClass('virtual-list')
15702 indexFrom = $sortingEl[0].f7VirtualListIndex;
15703 if (typeof indexFrom === 'undefined') { indexFrom = $sortingEl.attr('data-virtual-list-index'); }
15704 if ($insertBeforeEl) {
15705 indexTo = $insertBeforeEl[0].f7VirtualListIndex;
15706 if (typeof indexTo === 'undefined') { indexTo = $insertBeforeEl.attr('data-virtual-list-index'); }
15708 indexTo = $insertAfterEl[0].f7VirtualListIndex;
15709 if (typeof indexTo === 'undefined') { indexTo = $insertAfterEl.attr('data-virtual-list-index'); }
15711 if (indexTo !== null) { indexTo = parseInt(indexTo, 10); }
15712 else { indexTo = undefined; }
15714 var virtualList = $sortableContainer[0].f7VirtualList;
15715 if (virtualList) { virtualList.moveItem(indexFrom, indexTo); }
15717 if (typeof indexTo !== 'undefined' && !Number.isNaN(indexTo) && indexTo !== indexFrom) {
15718 $sortingEl.trigger('sortable:sort', { from: indexFrom, to: indexTo });
15719 app.emit('sortableSort', $sortingEl[0], { from: indexFrom, to: indexTo });
15722 $insertBeforeEl = undefined;
15723 $insertAfterEl = undefined;
15728 var activeListener = app.support.passiveListener ? { passive: false, capture: false } : false;
15730 $(doc).on(app.touchEvents.start, '.list.sortable .sortable-handler', handleTouchStart, activeListener);
15731 app.on('touchmove:active', handleTouchMove);
15732 app.on('touchend:passive', handleTouchEnd);
15734 enable: function enable(el) {
15735 if ( el === void 0 ) el = '.list.sortable';
15739 if ($el.length === 0) { return; }
15740 $el.addClass('sortable-enabled');
15741 $el.trigger('sortable:enable');
15742 app.emit('sortableEnable', $el[0]);
15744 disable: function disable(el) {
15745 if ( el === void 0 ) el = '.list.sortable';
15749 if ($el.length === 0) { return; }
15750 $el.removeClass('sortable-enabled');
15751 $el.trigger('sortable:disable');
15752 app.emit('sortableDisable', $el[0]);
15754 toggle: function toggle(el) {
15755 if ( el === void 0 ) el = '.list.sortable';
15759 if ($el.length === 0) { return; }
15760 if ($el.hasClass('sortable-enabled')) {
15761 app.sortable.disable($el);
15763 app.sortable.enable($el);
15771 moveElements: true,
15774 create: function create() {
15776 Utils.extend(app, {
15778 init: Sortable.init.bind(app),
15779 enable: Sortable.enable.bind(app),
15780 disable: Sortable.disable.bind(app),
15781 toggle: Sortable.toggle.bind(app),
15786 init: function init() {
15788 if (!app.params.sortable) { return; }
15789 app.sortable.init();
15793 '.sortable-enable': function enable($clickedEl, data) {
15794 if ( data === void 0 ) data = {};
15797 app.sortable.enable(data.sortable);
15799 '.sortable-disable': function disable($clickedEl, data) {
15800 if ( data === void 0 ) data = {};
15803 app.sortable.disable(data.sortable);
15805 '.sortable-toggle': function toggle($clickedEl, data) {
15806 if ( data === void 0 ) data = {};
15809 app.sortable.toggle(data.sortable);
15815 init: function init() {
15817 var touchesStart = {};
15821 var touchStartTime;
15824 var $swipeoutContent;
15827 var actionsLeftWidth;
15828 var actionsRightWidth;
15831 var openedActionsSide;
15835 var $overswipeLeftButton;
15836 var $overswipeRightButton;
15838 var overswipeRight;
15840 function handleTouchStart(e) {
15841 if (!Swipeout.allow) { return; }
15844 isScrolling = undefined;
15845 touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
15846 touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
15847 touchStartTime = (new Date()).getTime();
15848 $swipeoutEl = $(this);
15850 function handleTouchMove(e) {
15851 if (!isTouched) { return; }
15852 var pageX = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX;
15853 var pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY;
15854 if (typeof isScrolling === 'undefined') {
15855 isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x));
15863 if ($('.list.sortable-opened').length > 0) { return; }
15864 $swipeoutContent = $swipeoutEl.find('.swipeout-content');
15865 $actionsRight = $swipeoutEl.find('.swipeout-actions-right');
15866 $actionsLeft = $swipeoutEl.find('.swipeout-actions-left');
15867 actionsLeftWidth = null;
15868 actionsRightWidth = null;
15869 $leftButtons = null;
15870 $rightButtons = null;
15871 $overswipeRightButton = null;
15872 $overswipeLeftButton = null;
15873 if ($actionsLeft.length > 0) {
15874 actionsLeftWidth = $actionsLeft.outerWidth();
15875 $leftButtons = $actionsLeft.children('a');
15876 $overswipeLeftButton = $actionsLeft.find('.swipeout-overswipe');
15878 if ($actionsRight.length > 0) {
15879 actionsRightWidth = $actionsRight.outerWidth();
15880 $rightButtons = $actionsRight.children('a');
15881 $overswipeRightButton = $actionsRight.find('.swipeout-overswipe');
15883 opened = $swipeoutEl.hasClass('swipeout-opened');
15885 openedActionsSide = $swipeoutEl.find('.swipeout-actions-left.swipeout-actions-opened').length > 0 ? 'left' : 'right';
15887 $swipeoutEl.removeClass('swipeout-transitioning');
15888 if (!app.params.swipeout.noFollow) {
15889 $swipeoutEl.find('.swipeout-actions-opened').removeClass('swipeout-actions-opened');
15890 $swipeoutEl.removeClass('swipeout-opened');
15894 e.preventDefault();
15896 touchesDiff = pageX - touchesStart.x;
15897 translate = touchesDiff;
15900 if (openedActionsSide === 'right') { translate -= actionsRightWidth; }
15901 else { translate += actionsLeftWidth; }
15905 (translate > 0 && $actionsLeft.length === 0)
15906 || (translate < 0 && $actionsRight.length === 0)
15911 $swipeoutContent.transform('');
15912 if ($rightButtons && $rightButtons.length > 0) {
15913 $rightButtons.transform('');
15915 if ($leftButtons && $leftButtons.length > 0) {
15916 $leftButtons.transform('');
15923 if (translate < 0) { direction = 'to-left'; }
15924 else if (translate > 0) { direction = 'to-right'; }
15925 else if (!direction) { direction = 'to-left'; }
15930 e.f7PreventSwipePanel = true;
15931 if (app.params.swipeout.noFollow) {
15933 if (openedActionsSide === 'right' && touchesDiff > 0) {
15934 app.swipeout.close($swipeoutEl);
15936 if (openedActionsSide === 'left' && touchesDiff < 0) {
15937 app.swipeout.close($swipeoutEl);
15940 if (touchesDiff < 0 && $actionsRight.length > 0) {
15941 app.swipeout.open($swipeoutEl, 'right');
15943 if (touchesDiff > 0 && $actionsLeft.length > 0) {
15944 app.swipeout.open($swipeoutEl, 'left');
15951 overswipeLeft = false;
15952 overswipeRight = false;
15953 if ($actionsRight.length > 0) {
15954 // Show right actions
15955 var buttonTranslate = translate;
15956 progress = buttonTranslate / actionsRightWidth;
15957 if (buttonTranslate < -actionsRightWidth) {
15958 buttonTranslate = -actionsRightWidth - (Math.pow( (-buttonTranslate - actionsRightWidth), 0.8 ));
15959 translate = buttonTranslate;
15960 if ($overswipeRightButton.length > 0) {
15961 overswipeRight = true;
15964 if (direction !== 'to-left') {
15966 buttonTranslate = 0;
15968 $rightButtons.each(function (index, buttonEl) {
15969 var $buttonEl = $(buttonEl);
15970 if (typeof buttonEl.f7SwipeoutButtonOffset === 'undefined') {
15971 $buttonEl[0].f7SwipeoutButtonOffset = buttonEl.offsetLeft;
15973 buttonOffset = buttonEl.f7SwipeoutButtonOffset;
15974 if ($overswipeRightButton.length > 0 && $buttonEl.hasClass('swipeout-overswipe') && direction === 'to-left') {
15975 $buttonEl.css({ left: ((overswipeRight ? -buttonOffset : 0) + "px
") });
15976 if (overswipeRight) {
15977 if (!$buttonEl.hasClass('swipeout-overswipe-active')) {
15978 $swipeoutEl.trigger('swipeout:overswipeenter');
15979 app.emit('swipeoutOverswipeEnter', $swipeoutEl[0]);
15981 $buttonEl.addClass('swipeout-overswipe-active');
15983 if ($buttonEl.hasClass('swipeout-overswipe-active')) {
15984 $swipeoutEl.trigger('swipeout:overswipeexit');
15985 app.emit('swipeoutOverswipeExit', $swipeoutEl[0]);
15987 $buttonEl.removeClass('swipeout-overswipe-active');
15990 $buttonEl.transform(("translate3d(" + (buttonTranslate - (buttonOffset * (1 + Math.max(progress, -1)))) + "px
,0,0)"));
15993 if ($actionsLeft.length > 0) {
15994 // Show left actions
15995 var buttonTranslate$1 = translate;
15996 progress = buttonTranslate$1 / actionsLeftWidth;
15997 if (buttonTranslate$1 > actionsLeftWidth) {
15998 buttonTranslate$1 = actionsLeftWidth + (Math.pow( (buttonTranslate$1 - actionsLeftWidth), 0.8 ));
15999 translate = buttonTranslate$1;
16000 if ($overswipeLeftButton.length > 0) {
16001 overswipeLeft = true;
16004 if (direction !== 'to-right') {
16005 buttonTranslate$1 = 0;
16008 $leftButtons.each(function (index, buttonEl) {
16009 var $buttonEl = $(buttonEl);
16010 if (typeof buttonEl.f7SwipeoutButtonOffset === 'undefined') {
16011 $buttonEl[0].f7SwipeoutButtonOffset = actionsLeftWidth - buttonEl.offsetLeft - buttonEl.offsetWidth;
16013 buttonOffset = buttonEl.f7SwipeoutButtonOffset;
16014 if ($overswipeLeftButton.length > 0 && $buttonEl.hasClass('swipeout-overswipe') && direction === 'to-right') {
16015 $buttonEl.css({ left: ((overswipeLeft ? buttonOffset : 0) + "px
") });
16016 if (overswipeLeft) {
16017 if (!$buttonEl.hasClass('swipeout-overswipe-active')) {
16018 $swipeoutEl.trigger('swipeout:overswipeenter');
16019 app.emit('swipeoutOverswipeEnter', $swipeoutEl[0]);
16021 $buttonEl.addClass('swipeout-overswipe-active');
16023 if ($buttonEl.hasClass('swipeout-overswipe-active')) {
16024 $swipeoutEl.trigger('swipeout:overswipeexit');
16025 app.emit('swipeoutOverswipeExit', $swipeoutEl[0]);
16027 $buttonEl.removeClass('swipeout-overswipe-active');
16030 if ($leftButtons.length > 1) {
16031 $buttonEl.css('z-index', $leftButtons.length - index);
16033 $buttonEl.transform(("translate3d(" + (buttonTranslate$1 + (buttonOffset * (1 - Math.min(progress, 1)))) + "px
,0,0)"));
16036 $swipeoutEl.trigger('swipeout', progress);
16037 app.emit('swipeout', $swipeoutEl[0], progress);
16038 $swipeoutContent.transform(("translate3d(" + translate + "px
,0,0)"));
16040 function handleTouchEnd() {
16041 if (!isTouched || !isMoved) {
16049 var timeDiff = (new Date()).getTime() - touchStartTime;
16050 var $actions = direction === 'to-left' ? $actionsRight : $actionsLeft;
16051 var actionsWidth = direction === 'to-left' ? actionsRightWidth : actionsLeftWidth;
16060 (touchesDiff < -10 && direction === 'to-left')
16061 || (touchesDiff > 10 && direction === 'to-right')
16066 && (Math.abs(translate) > actionsWidth / 2)
16073 if (timeDiff < 300) {
16074 if (Math.abs(translate) === 0) { action = 'close'; }
16075 if (Math.abs(translate) === actionsWidth) { action = 'open'; }
16078 if (action === 'open') {
16079 Swipeout.el = $swipeoutEl[0];
16080 $swipeoutEl.trigger('swipeout:open');
16081 app.emit('swipeoutOpen', $swipeoutEl[0]);
16082 $swipeoutEl.addClass('swipeout-opened swipeout-transitioning');
16083 var newTranslate = direction === 'to-left' ? -actionsWidth : actionsWidth;
16084 $swipeoutContent.transform(("translate3d(" + newTranslate + "px
,0,0)"));
16085 $actions.addClass('swipeout-actions-opened');
16086 $buttons = direction === 'to-left' ? $rightButtons : $leftButtons;
16088 for (i = 0; i < $buttons.length; i += 1) {
16089 $($buttons[i]).transform(("translate3d(" + newTranslate + "px
,0,0)"));
16092 if (overswipeRight) {
16093 $actionsRight.find('.swipeout-overswipe')[0].click();
16095 if (overswipeLeft) {
16096 $actionsLeft.find('.swipeout-overswipe')[0].click();
16099 $swipeoutEl.trigger('swipeout:close');
16100 app.emit('swipeoutClose', $swipeoutEl[0]);
16101 Swipeout.el = undefined;
16102 $swipeoutEl.addClass('swipeout-transitioning').removeClass('swipeout-opened');
16103 $swipeoutContent.transform('');
16104 $actions.removeClass('swipeout-actions-opened');
16108 if ($leftButtons && $leftButtons.length > 0 && $leftButtons !== $buttons) {
16109 $leftButtons.each(function (index, buttonEl) {
16110 var $buttonEl = $(buttonEl);
16111 buttonOffset = buttonEl.f7SwipeoutButtonOffset;
16112 if (typeof buttonOffset === 'undefined') {
16113 $buttonEl[0].f7SwipeoutButtonOffset = actionsLeftWidth - buttonEl.offsetLeft - buttonEl.offsetWidth;
16115 $buttonEl.transform(("translate3d(" + buttonOffset + "px
,0,0)"));
16118 if ($rightButtons && $rightButtons.length > 0 && $rightButtons !== $buttons) {
16119 $rightButtons.each(function (index, buttonEl) {
16120 var $buttonEl = $(buttonEl);
16121 buttonOffset = buttonEl.f7SwipeoutButtonOffset;
16122 if (typeof buttonOffset === 'undefined') {
16123 $buttonEl[0].f7SwipeoutButtonOffset = buttonEl.offsetLeft;
16125 $buttonEl.transform(("translate3d(" + (-buttonOffset) + "px
,0,0)"));
16128 $swipeoutContent.transitionEnd(function () {
16129 if ((opened && action === 'open') || (!opened && action === 'close')) { return; }
16130 $swipeoutEl.trigger(action === 'open' ? 'swipeout:opened' : 'swipeout:closed');
16131 app.emit(action === 'open' ? 'swipeoutOpened' : 'swipeoutClosed', $swipeoutEl[0]);
16132 $swipeoutEl.removeClass('swipeout-transitioning');
16133 if (opened && action === 'close') {
16134 if ($actionsRight.length > 0) {
16135 $rightButtons.transform('');
16137 if ($actionsLeft.length > 0) {
16138 $leftButtons.transform('');
16144 var passiveListener = app.support.passiveListener ? { passive: true } : false;
16146 app.on('touchstart', function (e) {
16148 var $targetEl = $(e.target);
16150 $(Swipeout.el).is($targetEl[0])
16151 || $targetEl.parents('.swipeout').is(Swipeout.el)
16152 || $targetEl.hasClass('modal-in')
16153 || ($targetEl.attr('class') || '').indexOf('-backdrop') > 0
16154 || $targetEl.hasClass('actions-modal')
16155 || $targetEl.parents('.actions-modal.modal-in, .dialog.modal-in').length > 0
16157 app.swipeout.close(Swipeout.el);
16161 $(doc).on(app.touchEvents.start, 'li.swipeout', handleTouchStart, passiveListener);
16162 app.on('touchmove:active', handleTouchMove);
16163 app.on('touchend:passive', handleTouchEnd);
16167 open: function open() {
16170 var args = [], len = arguments.length;
16171 while ( len-- ) args[ len ] = arguments[ len ];
16174 var side = args[1];
16175 var callback = args[2];
16176 if (typeof args[1] === 'function') {
16177 (assign = args, el = assign[0], callback = assign[1], side = assign[2]);
16179 var $el = $(el).eq(0);
16181 if ($el.length === 0) { return; }
16182 if (!$el.hasClass('swipeout') || $el.hasClass('swipeout-opened')) { return; }
16184 if ($el.find('.swipeout-actions-right').length > 0) { side = 'right'; }
16185 else { side = 'left'; }
16187 var $swipeoutActions = $el.find((".swipeout
-actions
-" + side));
16188 var $swipeoutContent = $el.find('.swipeout-content');
16189 if ($swipeoutActions.length === 0) { return; }
16190 $el.trigger('swipeout:open').addClass('swipeout-opened').removeClass('swipeout-transitioning');
16191 app.emit('swipeoutOpen', $el[0]);
16192 $swipeoutActions.addClass('swipeout-actions-opened');
16193 var $buttons = $swipeoutActions.children('a');
16194 var swipeoutActionsWidth = $swipeoutActions.outerWidth();
16195 var translate = side === 'right' ? -swipeoutActionsWidth : swipeoutActionsWidth;
16196 if ($buttons.length > 1) {
16197 $buttons.each(function (buttonIndex, buttonEl) {
16198 var $buttonEl = $(buttonEl);
16199 if (side === 'right') {
16200 $buttonEl.transform(("translate3d(" + (-buttonEl.offsetLeft) + "px
,0,0)"));
16202 $buttonEl.css('z-index', $buttons.length - buttonIndex).transform(("translate3d(" + (swipeoutActionsWidth - buttonEl.offsetWidth - buttonEl.offsetLeft) + "px
,0,0)"));
16206 $el.addClass('swipeout-transitioning');
16207 $swipeoutContent.transitionEnd(function () {
16208 $el.trigger('swipeout:opened');
16209 app.emit('swipeoutOpened', $el[0]);
16210 if (callback) { callback.call($el[0]); }
16212 Utils.nextFrame(function () {
16213 $buttons.transform(("translate3d(" + translate + "px
,0,0)"));
16214 $swipeoutContent.transform(("translate3d(" + translate + "px
,0,0)"));
16216 Swipeout.el = $el[0];
16218 close: function close(el, callback) {
16220 var $el = $(el).eq(0);
16221 if ($el.length === 0) { return; }
16222 if (!$el.hasClass('swipeout-opened')) { return; }
16223 var side = $el.find('.swipeout-actions-opened').hasClass('swipeout-actions-right') ? 'right' : 'left';
16224 var $swipeoutActions = $el.find('.swipeout-actions-opened').removeClass('swipeout-actions-opened');
16225 var $buttons = $swipeoutActions.children('a');
16226 var swipeoutActionsWidth = $swipeoutActions.outerWidth();
16227 Swipeout.allow = false;
16228 $el.trigger('swipeout:close');
16229 app.emit('swipeoutClose', $el[0]);
16230 $el.removeClass('swipeout-opened').addClass('swipeout-transitioning');
16233 function onSwipeoutClose() {
16234 Swipeout.allow = true;
16235 if ($el.hasClass('swipeout-opened')) { return; }
16236 $el.removeClass('swipeout-transitioning');
16237 $buttons.transform('');
16238 $el.trigger('swipeout:closed');
16239 app.emit('swipeoutClosed', $el[0]);
16240 if (callback) { callback.call($el[0]); }
16241 if (closeTimeout) { clearTimeout(closeTimeout); }
16243 $el.find('.swipeout-content').transform('').transitionEnd(onSwipeoutClose);
16244 closeTimeout = setTimeout(onSwipeoutClose, 500);
16246 $buttons.each(function (index, buttonEl) {
16247 var $buttonEl = $(buttonEl);
16248 if (side === 'right') {
16249 $buttonEl.transform(("translate3d(" + (-buttonEl.offsetLeft) + "px
,0,0)"));
16251 $buttonEl.transform(("translate3d(" + (swipeoutActionsWidth - buttonEl.offsetWidth - buttonEl.offsetLeft) + "px
,0,0)"));
16253 $buttonEl.css({ left: '0px' }).removeClass('swipeout-overswipe-active');
16255 if (Swipeout.el && Swipeout.el === $el[0]) { Swipeout.el = undefined; }
16257 delete: function delete$1(el, callback) {
16259 var $el = $(el).eq(0);
16260 if ($el.length === 0) { return; }
16261 Swipeout.el = undefined;
16262 $el.trigger('swipeout:delete');
16263 app.emit('swipeoutDelete', $el[0]);
16264 $el.css({ height: (($el.outerHeight()) + "px
") });
16265 $el.transitionEnd(function () {
16266 $el.trigger('swipeout:deleted');
16267 app.emit('swipeoutDeleted', $el[0]);
16268 if (callback) { callback.call($el[0]); }
16269 if ($el.parents('.virtual-list').length > 0) {
16270 var virtualList = $el.parents('.virtual-list')[0].f7VirtualList;
16271 var virtualIndex = $el[0].f7VirtualListIndex;
16272 if (virtualList && typeof virtualIndex !== 'undefined') { virtualList.deleteItem(virtualIndex); }
16273 } else if (app.params.swipeout.removeElements) {
16274 if (app.params.swipeout.removeElementsWithTimeout) {
16275 setTimeout(function () {
16277 }, app.params.swipeout.removeElementsTimeout);
16282 $el.removeClass('swipeout-deleting swipeout-transitioning');
16285 // eslint-disable-next-line
16286 // $el[0]._clientLeft = $el[0].clientLeft;
16287 Utils.nextFrame(function () {
16289 .addClass('swipeout-deleting swipeout-transitioning')
16290 .css({ height: '0px' })
16291 .find('.swipeout-content')
16292 .transform('translate3d(-100%,0,0)');
16300 actionsNoFold: false,
16302 removeElements: true,
16303 removeElementsWithTimeout: false,
16304 removeElementsTimeout: 0,
16307 create: function create() {
16309 Utils.extend(app, {
16311 init: Swipeout.init.bind(app),
16312 open: Swipeout.open.bind(app),
16313 close: Swipeout.close.bind(app),
16314 delete: Swipeout.delete.bind(app),
16317 Object.defineProperty(app.swipeout, 'el', {
16319 configurable: true,
16320 get: function () { return Swipeout.el; },
16321 set: function set(el) {
16325 Object.defineProperty(app.swipeout, 'allow', {
16327 configurable: true,
16328 get: function () { return Swipeout.allow; },
16329 set: function set(allow) {
16330 Swipeout.allow = allow;
16335 '.swipeout-open': function openSwipeout($clickedEl, data) {
16336 if ( data === void 0 ) data = {};
16339 app.swipeout.open(data.swipeout, data.side);
16341 '.swipeout-close': function closeSwipeout($clickedEl) {
16343 var $swipeoutEl = $clickedEl.closest('.swipeout');
16344 if ($swipeoutEl.length === 0) { return; }
16345 app.swipeout.close($swipeoutEl);
16347 '.swipeout-delete': function deleteSwipeout($clickedEl, data) {
16348 if ( data === void 0 ) data = {};
16351 var $swipeoutEl = $clickedEl.closest('.swipeout');
16352 if ($swipeoutEl.length === 0) { return; }
16353 var confirm = data.confirm;
16354 var confirmTitle = data.confirmTitle;
16355 if (data.confirm) {
16356 app.dialog.confirm(confirm, confirmTitle, function () {
16357 app.swipeout.delete($swipeoutEl);
16360 app.swipeout.delete($swipeoutEl);
16365 init: function init() {
16367 if (!app.params.swipeout) { return; }
16368 app.swipeout.init();
16374 toggleClicked: function toggleClicked($clickedEl) {
16376 var $accordionItemEl = $clickedEl.closest('.accordion-item').eq(0);
16377 if (!$accordionItemEl.length) { $accordionItemEl = $clickedEl.parents('li').eq(0); }
16379 var $accordionContent = $clickedEl.parents('.accordion-item-content').eq(0);
16380 if ($accordionContent.length) {
16381 if ($accordionContent.parents($accordionItemEl).length) { return; }
16384 if ($clickedEl.parents('li').length > 1 && $clickedEl.parents('li')[0] !== $accordionItemEl[0]) { return; }
16385 app.accordion.toggle($accordionItemEl);
16387 open: function open(el) {
16390 var prevented = false;
16391 function prevent() {
16394 $el.trigger('accordion:beforeopen', { prevent: prevent }, prevent);
16395 app.emit('accordionBeforeOpen', $el[0], prevent);
16396 if (prevented) { return; }
16397 var $list = $el.parents('.accordion-list').eq(0);
16398 var $contentEl = $el.children('.accordion-item-content');
16399 $contentEl.removeAttr('aria-hidden');
16400 if ($contentEl.length === 0) { $contentEl = $el.find('.accordion-item-content'); }
16401 if ($contentEl.length === 0) { return; }
16402 var $openedItem = $list.length > 0 && $el.parent().children('.accordion-item-opened');
16403 if ($openedItem.length > 0) {
16404 app.accordion.close($openedItem);
16406 $contentEl.transitionEnd(function () {
16407 if ($el.hasClass('accordion-item-opened')) {
16408 $contentEl.transition(0);
16409 $contentEl.css('height', 'auto');
16410 Utils.nextFrame(function () {
16411 $contentEl.transition('');
16412 $el.trigger('accordion:opened');
16413 app.emit('accordionOpened', $el[0]);
16416 $contentEl.css('height', '');
16417 $el.trigger('accordion:closed');
16418 app.emit('accordionClosed', $el[0]);
16421 $contentEl.css('height', (($contentEl[0].scrollHeight) + "px
"));
16422 $el.trigger('accordion:open');
16423 $el.addClass('accordion-item-opened');
16424 app.emit('accordionOpen', $el[0]);
16426 close: function close(el) {
16429 var prevented = false;
16430 function prevent() {
16433 $el.trigger('accordion:beforeclose', { prevent: prevent }, prevent);
16434 app.emit('accordionBeforeClose', $el[0], prevent);
16435 if (prevented) { return; }
16436 var $contentEl = $el.children('.accordion-item-content');
16437 if ($contentEl.length === 0) { $contentEl = $el.find('.accordion-item-content'); }
16438 $el.removeClass('accordion-item-opened');
16439 $contentEl.attr('aria-hidden', true);
16440 $contentEl.transition(0);
16441 $contentEl.css('height', (($contentEl[0].scrollHeight) + "px
"));
16443 $contentEl.transitionEnd(function () {
16444 if ($el.hasClass('accordion-item-opened')) {
16445 $contentEl.transition(0);
16446 $contentEl.css('height', 'auto');
16447 Utils.nextFrame(function () {
16448 $contentEl.transition('');
16449 $el.trigger('accordion:opened');
16450 app.emit('accordionOpened', $el[0]);
16453 $contentEl.css('height', '');
16454 $el.trigger('accordion:closed');
16455 app.emit('accordionClosed', $el[0]);
16458 Utils.nextFrame(function () {
16459 $contentEl.transition('');
16460 $contentEl.css('height', '');
16461 $el.trigger('accordion:close');
16462 app.emit('accordionClose', $el[0]);
16465 toggle: function toggle(el) {
16468 if ($el.length === 0) { return; }
16469 if ($el.hasClass('accordion-item-opened')) { app.accordion.close(el); }
16470 else { app.accordion.open(el); }
16474 var Accordion$1 = {
16476 create: function create() {
16478 Utils.extend(app, {
16480 open: Accordion.open.bind(app),
16481 close: Accordion.close.bind(app),
16482 toggle: Accordion.toggle.bind(app),
16487 '.accordion-item .item-link, .accordion-item-toggle, .links-list.accordion-list > ul > li > a': function open($clickedEl) {
16489 Accordion.toggleClicked.call(app, $clickedEl);
16494 var ContactsList = {
16495 name: 'contactsList',
16498 var VirtualList = /*@__PURE__*/(function (Framework7Class) {
16499 function VirtualList(app, params) {
16500 if ( params === void 0 ) params = {};
16502 Framework7Class.call(this, params, [app]);
16506 if (app.theme === 'md') {
16507 defaultHeight = 48;
16508 } else if (app.theme === 'ios') {
16509 defaultHeight = 44;
16510 } else if (app.theme === 'aurora') {
16511 defaultHeight = 38;
16516 height: defaultHeight,
16518 dynamicHeightBufferSize: 1,
16519 showFilteredItemsOnly: false,
16520 renderExternal: undefined,
16521 setListHeight: true,
16522 searchByItem: undefined,
16523 searchAll: undefined,
16524 itemTemplate: undefined,
16527 scrollableParentEl: undefined,
16528 renderItem: function renderItem(item) {
16529 return ("\n <li
>\n <div
class=\"item
-content
\">\n <div
class=\"item
-inner
\">\n <div
class=\"item
-title
\">" + item + "</div>\n </div>\n </div>\n </li>\n ").trim();
16534 // Extend defaults with modules params
16535 vl.useModulesParams(defaults);
16537 vl.params = Utils.extend(defaults, params);
16538 if (vl.params.height === undefined || !vl.params.height) {
16539 vl.params.height = defaultHeight;
16542 vl.$el = $(params.el);
16545 if (vl.$el.length === 0) { return undefined; }
16546 vl.$el[0].f7VirtualList = vl;
16548 vl.items = vl.params.items;
16549 if (vl.params.showFilteredItemsOnly) {
16550 vl.filteredItems = [];
16552 if (vl.params.itemTemplate) {
16553 if (typeof vl.params.itemTemplate === 'string') { vl.renderItem = app.t7.compile(vl.params.itemTemplate); }
16554 else if (typeof vl.params.itemTemplate === 'function') { vl.renderItem = vl.params.itemTemplate; }
16555 } else if (vl.params.renderItem) {
16556 vl.renderItem = vl.params.renderItem;
16558 vl.$pageContentEl = vl.$el.parents('.page-content');
16559 vl.pageContentEl = vl.$pageContentEl[0];
16561 vl.$scrollableParentEl = vl.params.scrollableParentEl ? $(vl.params.scrollableParentEl).eq(0) : vl.$pageContentEl;
16562 if (!vl.$scrollableParentEl.length && vl.$pageContentEl.length) {
16563 vl.$scrollableParentEl = vl.$pageContentEl;
16565 vl.scrollableParentEl = vl.$scrollableParentEl[0];
16568 if (typeof vl.params.updatableScroll !== 'undefined') {
16569 vl.updatableScroll = vl.params.updatableScroll;
16571 vl.updatableScroll = true;
16572 if (Device.ios && Device.osVersion.split('.')[0] < 8) {
16573 vl.updatableScroll = false;
16578 var ul = vl.params.ul;
16579 vl.$ul = ul ? $(vl.params.ul) : vl.$el.children('ul');
16580 if (vl.$ul.length === 0 && vl.params.createUl) {
16581 vl.$el.append('<ul></ul>');
16582 vl.$ul = vl.$el.children('ul');
16587 if (!vl.ul && !vl.params.createUl) { $itemsWrapEl = vl.$el; }
16588 else { $itemsWrapEl = vl.$ul; }
16591 $itemsWrapEl: $itemsWrapEl,
16592 itemsWrapEl: $itemsWrapEl[0],
16593 // DOM cached items
16595 displayDomCache: {},
16596 // Temporary DOM Element
16597 tempDomElement: doc.createElement('ul'),
16598 // Last repain position
16599 lastRepaintY: null,
16601 fragment: doc.createDocumentFragment(),
16603 pageHeight: undefined,
16604 rowsPerScreen: undefined,
16605 rowsBefore: undefined,
16606 rowsAfter: undefined,
16607 rowsToRender: undefined,
16608 maxBufferHeight: 0,
16609 listHeight: undefined,
16610 dynamicHeight: typeof vl.params.height === 'function',
16617 var handleScrollBound = vl.handleScroll.bind(vl);
16618 var handleResizeBound = vl.handleResize.bind(vl);
16623 vl.attachEvents = function attachEvents() {
16624 $pageEl = vl.$el.parents('.page').eq(0);
16625 $tabEl = vl.$el.parents('.tab').eq(0);
16626 $panelEl = vl.$el.parents('.panel').eq(0);
16627 $popupEl = vl.$el.parents('.popup').eq(0);
16629 vl.$scrollableParentEl.on('scroll', handleScrollBound);
16630 if ($pageEl) { $pageEl.on('page:reinit', handleResizeBound); }
16631 if ($tabEl) { $tabEl.on('tab:show', handleResizeBound); }
16632 if ($panelEl) { $panelEl.on('panel:open', handleResizeBound); }
16633 if ($popupEl) { $popupEl.on('popup:open', handleResizeBound); }
16634 app.on('resize', handleResizeBound);
16636 vl.detachEvents = function attachEvents() {
16637 vl.$scrollableParentEl.off('scroll', handleScrollBound);
16638 if ($pageEl) { $pageEl.off('page:reinit', handleResizeBound); }
16639 if ($tabEl) { $tabEl.off('tab:show', handleResizeBound); }
16640 if ($panelEl) { $panelEl.off('panel:open', handleResizeBound); }
16641 if ($popupEl) { $popupEl.off('popup:open', handleResizeBound); }
16642 app.off('resize', handleResizeBound);
16650 if ( Framework7Class ) VirtualList.__proto__ = Framework7Class;
16651 VirtualList.prototype = Object.create( Framework7Class && Framework7Class.prototype );
16652 VirtualList.prototype.constructor = VirtualList;
16654 VirtualList.prototype.setListSize = function setListSize () {
16656 var items = vl.filteredItems || vl.items;
16657 vl.pageHeight = vl.$scrollableParentEl[0].offsetHeight;
16658 if (vl.dynamicHeight) {
16661 for (var i = 0; i < items.length; i += 1) {
16662 var itemHeight = vl.params.height(items[i]);
16663 vl.listHeight += itemHeight;
16664 vl.heights.push(itemHeight);
16667 vl.listHeight = Math.ceil(items.length / vl.params.cols) * vl.params.height;
16668 vl.rowsPerScreen = Math.ceil(vl.pageHeight / vl.params.height);
16669 vl.rowsBefore = vl.params.rowsBefore || vl.rowsPerScreen * 2;
16670 vl.rowsAfter = vl.params.rowsAfter || vl.rowsPerScreen;
16671 vl.rowsToRender = (vl.rowsPerScreen + vl.rowsBefore + vl.rowsAfter);
16672 vl.maxBufferHeight = (vl.rowsBefore / 2) * vl.params.height;
16675 if (vl.updatableScroll || vl.params.setListHeight) {
16676 vl.$itemsWrapEl.css({ height: ((vl.listHeight) + "px
") });
16680 VirtualList.prototype.render = function render (force, forceScrollTop) {
16682 if (force) { vl.lastRepaintY = null; }
16684 var scrollTop = -(vl.$el[0].getBoundingClientRect().top - vl.$scrollableParentEl[0].getBoundingClientRect().top);
16686 if (typeof forceScrollTop !== 'undefined') { scrollTop = forceScrollTop; }
16687 if (vl.lastRepaintY === null || Math.abs(scrollTop - vl.lastRepaintY) > vl.maxBufferHeight || (!vl.updatableScroll && (vl.$scrollableParentEl[0].scrollTop + vl.pageHeight >= vl.$scrollableParentEl[0].scrollHeight))) {
16688 vl.lastRepaintY = scrollTop;
16693 var items = vl.filteredItems || vl.items;
16696 var heightBeforeFirstItem = 0;
16697 var heightBeforeLastItem = 0;
16698 if (vl.dynamicHeight) {
16701 vl.maxBufferHeight = vl.pageHeight;
16703 for (var j = 0; j < vl.heights.length; j += 1) {
16704 itemHeight = vl.heights[j];
16705 if (typeof fromIndex === 'undefined') {
16706 if (itemTop + itemHeight >= scrollTop - (vl.pageHeight * 2 * vl.params.dynamicHeightBufferSize)) { fromIndex = j; }
16707 else { heightBeforeFirstItem += itemHeight; }
16710 if (typeof toIndex === 'undefined') {
16711 if (itemTop + itemHeight >= scrollTop + (vl.pageHeight * 2 * vl.params.dynamicHeightBufferSize) || j === vl.heights.length - 1) { toIndex = j + 1; }
16712 heightBeforeLastItem += itemHeight;
16714 itemTop += itemHeight;
16716 toIndex = Math.min(toIndex, items.length);
16718 fromIndex = (parseInt(scrollTop / vl.params.height, 10) - vl.rowsBefore) * vl.params.cols;
16719 if (fromIndex < 0) {
16722 toIndex = Math.min(fromIndex + (vl.rowsToRender * vl.params.cols), items.length);
16726 var renderExternalItems = [];
16727 vl.reachEnd = false;
16729 for (i = fromIndex; i < toIndex; i += 1) {
16730 var itemEl = (void 0);
16731 // Define real item index
16732 var index = vl.items.indexOf(items[i]);
16734 if (i === fromIndex) { vl.currentFromIndex = index; }
16735 if (i === toIndex - 1) { vl.currentToIndex = index; }
16736 if (vl.filteredItems) {
16737 if (vl.items[index] === vl.filteredItems[vl.filteredItems.length - 1]) { vl.reachEnd = true; }
16738 } else if (index === vl.items.length - 1) { vl.reachEnd = true; }
16741 if (vl.params.renderExternal) {
16742 renderExternalItems.push(items[i]);
16743 } else if (vl.domCache[index]) {
16744 itemEl = vl.domCache[index];
16745 itemEl.f7VirtualListIndex = index;
16747 if (vl.renderItem) {
16748 vl.tempDomElement.innerHTML = vl.renderItem(items[i], index).trim();
16750 vl.tempDomElement.innerHTML = items[i].toString().trim();
16752 itemEl = vl.tempDomElement.childNodes[0];
16753 if (vl.params.cache) { vl.domCache[index] = itemEl; }
16754 itemEl.f7VirtualListIndex = index;
16757 // Set item top position
16758 if (i === fromIndex) {
16759 if (vl.dynamicHeight) {
16760 topPosition = heightBeforeFirstItem;
16762 topPosition = ((i * vl.params.height) / vl.params.cols);
16765 if (!vl.params.renderExternal) {
16766 itemEl.style.top = topPosition + "px
";
16768 // Before item insert
16769 vl.emit('local::itemBeforeInsert vlItemBeforeInsert', vl, itemEl, items[i]);
16771 // Append item to fragment
16772 vl.fragment.appendChild(itemEl);
16776 // Update list height with not updatable scroll
16777 if (!vl.updatableScroll) {
16778 if (vl.dynamicHeight) {
16779 vl.itemsWrapEl.style.height = heightBeforeLastItem + "px
";
16781 vl.itemsWrapEl.style.height = ((i * vl.params.height) / vl.params.cols) + "px
";
16785 // Update list html
16786 if (vl.params.renderExternal) {
16787 if (items && items.length === 0) {
16788 vl.reachEnd = true;
16791 vl.emit('local::beforeClear vlBeforeClear', vl, vl.fragment);
16792 vl.itemsWrapEl.innerHTML = '';
16794 vl.emit('local::itemsBeforeInsert vlItemsBeforeInsert', vl, vl.fragment);
16796 if (items && items.length === 0) {
16797 vl.reachEnd = true;
16798 if (vl.params.emptyTemplate) { vl.itemsWrapEl.innerHTML = vl.params.emptyTemplate; }
16800 vl.itemsWrapEl.appendChild(vl.fragment);
16803 vl.emit('local::itemsAfterInsert vlItemsAfterInsert', vl, vl.fragment);
16806 if (typeof forceScrollTop !== 'undefined' && force) {
16807 vl.$scrollableParentEl.scrollTop(forceScrollTop, 0);
16809 if (vl.params.renderExternal) {
16810 vl.params.renderExternal(vl, {
16811 fromIndex: fromIndex,
16813 listHeight: vl.listHeight,
16814 topPosition: topPosition,
16815 items: renderExternalItems,
16821 VirtualList.prototype.filterItems = function filterItems (indexes, resetScrollTop) {
16822 if ( resetScrollTop === void 0 ) resetScrollTop = true;
16825 vl.filteredItems = [];
16826 for (var i = 0; i < indexes.length; i += 1) {
16827 vl.filteredItems.push(vl.items[indexes[i]]);
16829 if (resetScrollTop) {
16830 vl.$scrollableParentEl[0].scrollTop = 0;
16835 VirtualList.prototype.resetFilter = function resetFilter () {
16837 if (vl.params.showFilteredItemsOnly) {
16838 vl.filteredItems = [];
16840 vl.filteredItems = null;
16841 delete vl.filteredItems;
16846 VirtualList.prototype.scrollToItem = function scrollToItem (index) {
16848 if (index > vl.items.length) { return false; }
16850 if (vl.dynamicHeight) {
16851 for (var i = 0; i < index; i += 1) {
16852 itemTop += vl.heights[i];
16855 itemTop = index * vl.params.height;
16857 var listTop = vl.$el[0].offsetTop;
16858 vl.render(true, (listTop + itemTop) - parseInt(vl.$scrollableParentEl.css('padding-top'), 10));
16862 VirtualList.prototype.handleScroll = function handleScroll () {
16867 // Handle resize event
16868 VirtualList.prototype.isVisible = function isVisible () {
16870 return !!(vl.el.offsetWidth || vl.el.offsetHeight || vl.el.getClientRects().length);
16873 VirtualList.prototype.handleResize = function handleResize () {
16875 if (vl.isVisible()) {
16882 VirtualList.prototype.appendItems = function appendItems (items) {
16884 for (var i = 0; i < items.length; i += 1) {
16885 vl.items.push(items[i]);
16890 VirtualList.prototype.appendItem = function appendItem (item) {
16892 vl.appendItems([item]);
16896 VirtualList.prototype.replaceAllItems = function replaceAllItems (items) {
16899 delete vl.filteredItems;
16904 VirtualList.prototype.replaceItem = function replaceItem (index, item) {
16906 vl.items[index] = item;
16907 if (vl.params.cache) { delete vl.domCache[index]; }
16912 VirtualList.prototype.prependItems = function prependItems (items) {
16914 for (var i = items.length - 1; i >= 0; i -= 1) {
16915 vl.items.unshift(items[i]);
16917 if (vl.params.cache) {
16919 Object.keys(vl.domCache).forEach(function (cached) {
16920 newCache[parseInt(cached, 10) + items.length] = vl.domCache[cached];
16922 vl.domCache = newCache;
16927 VirtualList.prototype.prependItem = function prependItem (item) {
16929 vl.prependItems([item]);
16933 VirtualList.prototype.moveItem = function moveItem (from, to) {
16935 var fromIndex = from;
16937 if (fromIndex === toIndex) { return; }
16938 // remove item from array
16939 var item = vl.items.splice(fromIndex, 1)[0];
16940 if (toIndex >= vl.items.length) {
16941 // Add item to the end
16942 vl.items.push(item);
16943 toIndex = vl.items.length - 1;
16945 // Add item to new index
16946 vl.items.splice(toIndex, 0, item);
16949 if (vl.params.cache) {
16951 Object.keys(vl.domCache).forEach(function (cached) {
16952 var cachedIndex = parseInt(cached, 10);
16953 var leftIndex = fromIndex < toIndex ? fromIndex : toIndex;
16954 var rightIndex = fromIndex < toIndex ? toIndex : fromIndex;
16955 var indexShift = fromIndex < toIndex ? -1 : 1;
16956 if (cachedIndex < leftIndex || cachedIndex > rightIndex) { newCache[cachedIndex] = vl.domCache[cachedIndex]; }
16957 if (cachedIndex === leftIndex) { newCache[rightIndex] = vl.domCache[cachedIndex]; }
16958 if (cachedIndex > leftIndex && cachedIndex <= rightIndex) { newCache[cachedIndex + indexShift] = vl.domCache[cachedIndex]; }
16960 vl.domCache = newCache;
16966 VirtualList.prototype.insertItemBefore = function insertItemBefore (index, item) {
16969 vl.prependItem(item);
16972 if (index >= vl.items.length) {
16973 vl.appendItem(item);
16976 vl.items.splice(index, 0, item);
16978 if (vl.params.cache) {
16980 Object.keys(vl.domCache).forEach(function (cached) {
16981 var cachedIndex = parseInt(cached, 10);
16982 if (cachedIndex >= index) {
16983 newCache[cachedIndex + 1] = vl.domCache[cachedIndex];
16986 vl.domCache = newCache;
16992 VirtualList.prototype.deleteItems = function deleteItems (indexes) {
16995 var indexShift = 0;
16996 var loop = function ( i ) {
16997 var index = indexes[i];
16998 if (typeof prevIndex !== 'undefined') {
16999 if (index > prevIndex) {
17003 index += indexShift;
17004 prevIndex = indexes[i];
17006 var deletedItem = vl.items.splice(index, 1)[0];
17008 // Delete from filtered
17009 if (vl.filteredItems && vl.filteredItems.indexOf(deletedItem) >= 0) {
17010 vl.filteredItems.splice(vl.filteredItems.indexOf(deletedItem), 1);
17013 if (vl.params.cache) {
17015 Object.keys(vl.domCache).forEach(function (cached) {
17016 var cachedIndex = parseInt(cached, 10);
17017 if (cachedIndex === index) {
17018 delete vl.domCache[index];
17019 } else if (parseInt(cached, 10) > index) {
17020 newCache[cachedIndex - 1] = vl.domCache[cached];
17022 newCache[cachedIndex] = vl.domCache[cached];
17025 vl.domCache = newCache;
17029 for (var i = 0; i < indexes.length; i += 1) loop( i );
17033 VirtualList.prototype.deleteAllItems = function deleteAllItems () {
17036 delete vl.filteredItems;
17037 if (vl.params.cache) { vl.domCache = {}; }
17041 VirtualList.prototype.deleteItem = function deleteItem (index) {
17043 vl.deleteItems([index]);
17047 VirtualList.prototype.clearCache = function clearCache () {
17052 // Update Virtual List
17053 VirtualList.prototype.update = function update (deleteCache) {
17055 if (deleteCache && vl.params.cache) {
17062 VirtualList.prototype.init = function init () {
17069 VirtualList.prototype.destroy = function destroy () {
17072 vl.$el[0].f7VirtualList = null;
17073 delete vl.$el[0].f7VirtualList;
17074 Utils.deleteProps(vl);
17078 return VirtualList;
17079 }(Framework7Class));
17081 var VirtualList$1 = {
17082 name: 'virtualList',
17084 VirtualList: VirtualList,
17086 create: function create() {
17088 app.virtualList = ConstructorMethods({
17089 defaultSelector: '.virtual-list',
17090 constructor: VirtualList,
17092 domProp: 'f7VirtualList',
17097 var ListIndex = /*@__PURE__*/(function (Framework7Class) {
17098 function ListIndex(app, params) {
17099 if ( params === void 0 ) params = {};
17101 Framework7Class.call(this, params, [app]);
17105 el: null, // where to render indexes
17106 listEl: null, // list el to generate indexes
17107 indexes: 'auto', // or array of indexes
17110 auroraItemHeight: 14,
17113 // eslint-disable-next-line
17114 renderItem: function renderItem(itemContent, itemIndex) {
17115 return ("\n <li
>" + itemContent + "</li
>\n ").trim();
17117 renderSkipPlaceholder: function renderSkipPlaceholder() {
17118 return '<li class="list
-index
-skip
-placeholder
"></li>';
17123 // Extend defaults with modules params
17124 index.useModulesParams(defaults);
17126 index.params = Utils.extend(defaults, params);
17130 var $pageContentEl;
17133 if (index.params.el) {
17134 $el = $(index.params.el);
17139 if ($el[0].f7ListIndex) {
17140 return $el[0].f7ListIndex;
17143 $ul = $el.find('ul');
17144 if ($ul.length === 0) {
17145 $ul = $('<ul></ul>');
17149 if (index.params.listEl) {
17150 $listEl = $(index.params.listEl);
17153 if (index.params.indexes === 'auto' && !$listEl) {
17158 $pageContentEl = $listEl.parents('.page-content').eq(0);
17160 $pageContentEl = $el.siblings('.page-content').eq(0);
17161 if ($pageContentEl.length === 0) {
17162 $pageContentEl = $el.parents('.page').eq(0).find('.page-content').eq(0);
17166 $el[0].f7ListIndex = index;
17168 Utils.extend(index, {
17175 listEl: $listEl && $listEl[0],
17176 $pageContentEl: $pageContentEl,
17177 pageContentEl: $pageContentEl && $pageContentEl[0],
17178 indexes: params.indexes,
17184 index.useModules();
17187 function handleResize() {
17188 var height = { index: index };
17190 if (height !== index.height) {
17195 function handleClick(e) {
17196 var $clickedLi = $(e.target).closest('li');
17197 if (!$clickedLi.length) { return; }
17199 var itemIndex = $clickedLi.index();
17200 if (index.skipRate > 0) {
17201 var percentage = itemIndex / ($clickedLi.siblings('li').length - 1);
17202 itemIndex = Math.round((index.indexes.length - 1) * percentage);
17204 var itemContent = index.indexes[itemIndex];
17206 index.$el.trigger('listindex:click', itemContent, itemIndex);
17207 index.emit('local::click listIndexClick', index, itemContent, itemIndex);
17208 index.$el.trigger('listindex:select', itemContent, itemIndex);
17209 index.emit('local::select listIndexSelect', index, itemContent, itemIndex);
17211 if (index.$listEl && index.params.scrollList) {
17212 index.scrollListToIndex(itemContent, itemIndex);
17216 var touchesStart = {};
17222 var previousIndex = null;
17223 function handleTouchStart(e) {
17224 var $children = $ul.children();
17225 if (!$children.length) { return; }
17226 topPoint = $children[0].getBoundingClientRect().top;
17227 bottomPoint = $children[$children.length - 1].getBoundingClientRect().top + $children[0].offsetHeight;
17229 touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
17230 touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
17233 previousIndex = null;
17235 function handleTouchMove(e) {
17236 if (!isTouched) { return; }
17237 if (!isMoved && index.params.label) {
17238 $labelEl = $('<span class="list
-index
-label
"></span>');
17239 $el.append($labelEl);
17242 var pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY;
17243 e.preventDefault();
17245 var percentage = (pageY - topPoint) / (bottomPoint - topPoint);
17246 percentage = Math.min(Math.max(percentage, 0), 1);
17248 var itemIndex = Math.round((index.indexes.length - 1) * percentage);
17249 var itemContent = index.indexes[itemIndex];
17252 var ulHeight = bottomPoint - topPoint;
17253 var bubbleBottom = ((index.height - ulHeight) / 2) + ((1 - percentage) * ulHeight);
17255 if (itemIndex !== previousIndex) {
17256 if (index.params.label) {
17257 $labelEl.html(itemContent).transform(("translateY(-" + bubbleBottom + "px
)"));
17260 if (index.$listEl && index.params.scrollList) {
17261 index.scrollListToIndex(itemContent, itemIndex);
17265 previousIndex = itemIndex;
17267 index.$el.trigger('listindex:select', index);
17268 index.emit('local::select listIndexSelect', index, itemContent, itemIndex);
17270 function handleTouchEnd() {
17271 if (!isTouched) { return; }
17274 if (index.params.label) {
17275 if ($labelEl) { $labelEl.remove(); }
17276 $labelEl = undefined;
17279 var passiveListener = app.support.passiveListener ? { passive: true } : false;
17280 index.attachEvents = function attachEvents() {
17281 $el.parents('.tab').on('tab:show', handleResize);
17282 $el.parents('.page').on('page:reinit', handleResize);
17283 $el.parents('.panel').on('panel:open', handleResize);
17285 .parents('.sheet-modal, .actions-modal, .popup, .popover, .login-screen, .dialog, .toast')
17286 .on('modal:open', handleResize);
17287 app.on('resize', handleResize);
17289 $el.on('click', handleClick);
17290 $el.on(app.touchEvents.start, handleTouchStart, passiveListener);
17291 app.on('touchmove:active', handleTouchMove);
17292 app.on('touchend:passive', handleTouchEnd);
17294 index.detachEvents = function attachEvents() {
17295 $el.parents('.tab').off('tab:show', handleResize);
17296 $el.parents('.page').off('page:reinit', handleResize);
17297 $el.parents('.panel').off('panel:open', handleResize);
17299 .parents('.sheet-modal, .actions-modal, .popup, .popover, .login-screen, .dialog, .toast')
17300 .off('modal:open', handleResize);
17301 app.off('resize', handleResize);
17303 $el.off('click', handleClick);
17304 $el.off(app.touchEvents.start, handleTouchStart, passiveListener);
17305 app.off('touchmove:active', handleTouchMove);
17306 app.off('touchend:passive', handleTouchEnd);
17314 if ( Framework7Class ) ListIndex.__proto__ = Framework7Class;
17315 ListIndex.prototype = Object.create( Framework7Class && Framework7Class.prototype );
17316 ListIndex.prototype.constructor = ListIndex;
17317 // eslint-disable-next-line
17318 ListIndex.prototype.scrollListToIndex = function scrollListToIndex (itemContent, itemIndex) {
17320 var $listEl = index.$listEl;
17321 var $pageContentEl = index.$pageContentEl;
17322 var app = index.app;
17323 if (!$listEl || !$pageContentEl || $pageContentEl.length === 0) { return index; }
17326 $listEl.find('.list-group-title, .item-divider').each(function (elIndex, el) {
17327 if ($scrollToEl) { return; }
17329 if ($el.text() === itemContent) {
17333 if (!$scrollToEl || $scrollToEl.length === 0) { return index; }
17335 var parentTop = $scrollToEl.parent().offset().top;
17336 var paddingTop = parseInt($pageContentEl.css('padding-top'), 10);
17337 var scrollTop = $pageContentEl[0].scrollTop;
17338 var scrollToElTop = $scrollToEl.offset().top;
17339 if ($pageContentEl.parents('.page-with-navbar-large').length) {
17340 var navbarInnerEl = app.navbar.getElByPage($pageContentEl.parents('.page-with-navbar-large').eq(0));
17341 var $titleLargeEl = $(navbarInnerEl).find('.title-large');
17342 if ($titleLargeEl.length) {
17343 paddingTop -= $titleLargeEl[0].offsetHeight || 0;
17347 if (parentTop <= paddingTop) {
17348 $pageContentEl.scrollTop((parentTop + scrollTop) - paddingTop);
17350 $pageContentEl.scrollTop((scrollToElTop + scrollTop) - paddingTop);
17355 ListIndex.prototype.renderSkipPlaceholder = function renderSkipPlaceholder () {
17357 return index.params.renderSkipPlaceholder.call(index);
17360 ListIndex.prototype.renderItem = function renderItem (itemContent, itemIndex) {
17362 return index.params.renderItem.call(index, itemContent, itemIndex);
17365 ListIndex.prototype.render = function render () {
17367 var $ul = index.$ul;
17368 var indexes = index.indexes;
17369 var skipRate = index.skipRate;
17372 var html = indexes.map(function (itemContent, itemIndex) {
17373 if (itemIndex % skipRate !== 0 && skipRate > 0) {
17377 var itemHtml = index.renderItem(itemContent, itemIndex);
17379 itemHtml = index.renderSkipPlaceholder() + itemHtml;
17381 wasSkipped = false;
17390 ListIndex.prototype.calcSize = function calcSize () {
17392 var app = index.app;
17393 var params = index.params;
17395 var indexes = index.indexes;
17396 var height = el.offsetHeight;
17397 var itemHeight = params[((app.theme) + "ItemHeight
")];
17398 var maxItems = Math.floor(height / itemHeight);
17399 var items = indexes.length;
17401 if (items > maxItems) {
17402 skipRate = Math.ceil(((items * 2) - 1) / maxItems);
17405 index.height = height;
17406 index.skipRate = skipRate;
17411 ListIndex.prototype.calcIndexes = function calcIndexes () {
17413 if (index.params.indexes === 'auto') {
17414 index.indexes = [];
17416 index.$listEl.find('.list-group-title, .item-divider').each(function (elIndex, el) {
17417 var elContent = $(el).text();
17418 if (index.indexes.indexOf(elContent) < 0) {
17419 index.indexes.push(elContent);
17423 index.indexes = index.params.indexes;
17428 ListIndex.prototype.update = function update () {
17430 index.calcIndexes();
17437 ListIndex.prototype.init = function init () {
17439 index.calcIndexes();
17442 index.attachEvents();
17445 ListIndex.prototype.destroy = function destroy () {
17447 index.$el.trigger('listindex:beforedestroy', index);
17448 index.emit('local::beforeDestroy listIndexBeforeDestroy', index);
17449 index.detachEvents();
17450 if (index.$el[0]) {
17451 index.$el[0].f7ListIndex = null;
17452 delete index.$el[0].f7ListIndex;
17454 Utils.deleteProps(index);
17459 }(Framework7Class));
17461 var ListIndex$1 = {
17464 ListIndex: ListIndex,
17466 create: function create() {
17468 app.listIndex = ConstructorMethods({
17469 defaultSelector: '.list-index',
17470 constructor: ListIndex,
17472 domProp: 'f7ListIndex',
17476 tabMounted: function tabMounted(tabEl) {
17478 $(tabEl).find('.list-index-init').each(function (index, listIndexEl) {
17479 var params = Utils.extend($(listIndexEl).dataset(), { el: listIndexEl });
17480 app.listIndex.create(params);
17483 tabBeforeRemove: function tabBeforeRemove(tabEl) {
17484 $(tabEl).find('.list-index-init').each(function (index, listIndexEl) {
17485 if (listIndexEl.f7ListIndex) { listIndexEl.f7ListIndex.destroy(); }
17488 pageInit: function pageInit(page) {
17490 page.$el.find('.list-index-init').each(function (index, listIndexEl) {
17491 var params = Utils.extend($(listIndexEl).dataset(), { el: listIndexEl });
17492 app.listIndex.create(params);
17495 pageBeforeRemove: function pageBeforeRemove(page) {
17496 page.$el.find('.list-index-init').each(function (index, listIndexEl) {
17497 if (listIndexEl.f7ListIndex) { listIndexEl.f7ListIndex.destroy(); }
17502 'list-index-init': {
17503 insert: function insert(vnode) {
17505 var listIndexEl = vnode.elm;
17506 var params = Utils.extend($(listIndexEl).dataset(), { el: listIndexEl });
17507 app.listIndex.create(params);
17509 destroy: function destroy(vnode) {
17510 var listIndexEl = vnode.elm;
17511 if (listIndexEl.f7ListIndex) { listIndexEl.f7ListIndex.destroy(); }
17522 show: function show() {
17523 var assign, assign$1, assign$2;
17525 var args = [], len = arguments.length;
17526 while ( len-- ) args[ len ] = arguments[ len ];
17533 if (args.length === 1 && args[0].constructor === Object) {
17534 tabEl = args[0].tabEl;
17535 tabLinkEl = args[0].tabLinkEl;
17536 animate = args[0].animate;
17537 tabRoute = args[0].tabRoute;
17539 (assign = args, tabEl = assign[0], tabLinkEl = assign[1], animate = assign[2], tabRoute = assign[3]);
17540 if (typeof args[1] === 'boolean') {
17541 (assign$1 = args, tabEl = assign$1[0], animate = assign$1[1], tabLinkEl = assign$1[2], tabRoute = assign$1[3]);
17542 if (args.length > 2 && tabLinkEl.constructor === Object) {
17543 (assign$2 = args, tabEl = assign$2[0], animate = assign$2[1], tabRoute = assign$2[2], tabLinkEl = assign$2[3]);
17547 if (typeof animate === 'undefined') { animate = true; }
17549 var $newTabEl = $(tabEl);
17550 if (tabRoute && $newTabEl[0]) {
17551 $newTabEl[0].f7TabRoute = tabRoute;
17554 if ($newTabEl.length === 0 || $newTabEl.hasClass('tab-active')) {
17556 $newTabEl: $newTabEl,
17557 newTabEl: $newTabEl[0],
17562 if (tabLinkEl) { $tabLinkEl = $(tabLinkEl); }
17564 var $tabsEl = $newTabEl.parent('.tabs');
17565 if ($tabsEl.length === 0) {
17567 $newTabEl: $newTabEl,
17568 newTabEl: $newTabEl[0],
17572 // Release swipeouts in hidden tabs
17573 if (app.swipeout) { app.swipeout.allowOpen = true; }
17576 var tabsChangedCallbacks = [];
17578 function onTabsChanged(callback) {
17579 tabsChangedCallbacks.push(callback);
17581 function tabsChanged() {
17582 tabsChangedCallbacks.forEach(function (callback) {
17587 var animated = false;
17589 if ($tabsEl.parent().hasClass('tabs-animated-wrap')) {
17590 $tabsEl.parent()[animate ? 'removeClass' : 'addClass']('not-animated');
17592 var transitionDuration = parseFloat($tabsEl.css('transition-duration').replace(',', '.'));
17593 if (animate && transitionDuration) {
17594 $tabsEl.transitionEnd(tabsChanged);
17598 var tabsTranslate = (app.rtl ? $newTabEl.index() : -$newTabEl.index()) * 100;
17599 $tabsEl.transform(("translate3d(" + tabsTranslate + "%,0,0)"));
17604 if ($tabsEl.parent().hasClass('tabs-swipeable-wrap') && app.swiper) {
17605 swiper = $tabsEl.parent()[0].swiper;
17606 if (swiper && swiper.activeIndex !== $newTabEl.index()) {
17609 .once('slideChangeTransitionEnd', function () {
17612 .slideTo($newTabEl.index(), animate ? undefined : 0);
17613 } else if (swiper && swiper.animating) {
17616 .once('slideChangeTransitionEnd', function () {
17622 // Remove active class from old tabs
17623 var $oldTabEl = $tabsEl.children('.tab-active');
17624 $oldTabEl.removeClass('tab-active');
17625 if (!swiper || (swiper && !swiper.animating) || (swiper && tabRoute)) {
17626 $oldTabEl.trigger('tab:hide');
17627 app.emit('tabHide', $oldTabEl[0]);
17630 // Trigger 'show' event on new tab
17631 $newTabEl.addClass('tab-active');
17632 if (!swiper || (swiper && !swiper.animating) || (swiper && tabRoute)) {
17633 $newTabEl.trigger('tab:show');
17634 app.emit('tabShow', $newTabEl[0]);
17637 // Find related link for new tab
17640 if (typeof tabEl === 'string') { $tabLinkEl = $((".tab
-link
[href
=\"" + tabEl + "\"]")); }
17641 else { $tabLinkEl = $((".tab
-link
[href
=\"#" + ($newTabEl.attr('id')) + "\"]")); }
17642 // Search by data-tab
17643 if (!$tabLinkEl || ($tabLinkEl && $tabLinkEl.length === 0)) {
17644 $('[data-tab]').each(function (index, el) {
17645 if ($newTabEl.is($(el).attr('data-tab'))) { $tabLinkEl = $(el); }
17648 if (tabRoute && (!$tabLinkEl || ($tabLinkEl && $tabLinkEl.length === 0))) {
17649 $tabLinkEl = $(("[data
-route
-tab
-id
=\"" + (tabRoute.route.tab.id) + "\"]"));
17650 if ($tabLinkEl.length === 0) {
17651 $tabLinkEl = $((".tab
-link
[href
=\"" + (tabRoute.url) + "\"]"));
17654 if ($tabLinkEl.length > 1 && $newTabEl.parents('.page').length) {
17655 // eslint-disable-next-line
17656 $tabLinkEl = $tabLinkEl.filter(function (index, tabLinkElement) {
17657 return $(tabLinkElement).parents('.page')[0] === $newTabEl.parents('.page')[0];
17659 if (app.theme === 'ios' && $tabLinkEl.length === 0 && tabRoute) {
17660 var $pageEl = $newTabEl.parents('.page');
17661 var $navbarEl = $(app.navbar.getElByPage($pageEl));
17662 $tabLinkEl = $navbarEl.find(("[data
-route
-tab
-id
=\"" + (tabRoute.route.tab.id) + "\"]"));
17663 if ($tabLinkEl.length === 0) {
17664 $tabLinkEl = $navbarEl.find((".tab
-link
[href
=\"" + (tabRoute.url) + "\"]"));
17669 if ($tabLinkEl.length > 0) {
17670 // Find related link for old tab
17672 if ($oldTabEl && $oldTabEl.length > 0) {
17674 var oldTabId = $oldTabEl.attr('id');
17676 $oldTabLinkEl = $((".tab
-link
[href
=\"#" + oldTabId + "\"]"));
17677 // Search by data-route-tab-id
17678 if (!$oldTabLinkEl || ($oldTabLinkEl && $oldTabLinkEl.length === 0)) {
17679 $oldTabLinkEl = $((".tab
-link
[data
-route
-tab
-id
=\"" + oldTabId + "\"]"));
17682 // Search by data-tab
17683 if (!$oldTabLinkEl || ($oldTabLinkEl && $oldTabLinkEl.length === 0)) {
17684 $('[data-tab]').each(function (index, tabLinkElement) {
17685 if ($oldTabEl.is($(tabLinkElement).attr('data-tab'))) { $oldTabLinkEl = $(tabLinkElement); }
17688 if (!$oldTabLinkEl || ($oldTabLinkEl && $oldTabLinkEl.length === 0)) {
17689 $oldTabLinkEl = $tabLinkEl.siblings('.tab-link-active');
17691 } else if (tabRoute) {
17692 $oldTabLinkEl = $tabLinkEl.siblings('.tab-link-active');
17695 if ($oldTabLinkEl && $oldTabLinkEl.length > 1 && $oldTabEl && $oldTabEl.parents('.page').length) {
17696 // eslint-disable-next-line
17697 $oldTabLinkEl = $oldTabLinkEl.filter(function (index, tabLinkElement) {
17698 return $(tabLinkElement).parents('.page')[0] === $oldTabEl.parents('.page')[0];
17702 if ($oldTabLinkEl && $oldTabLinkEl.length > 0) { $oldTabLinkEl.removeClass('tab-link-active'); }
17704 // Update links' classes
17705 if ($tabLinkEl && $tabLinkEl.length > 0) {
17706 $tabLinkEl.addClass('tab-link-active');
17707 // Material Highlight
17708 if (app.theme === 'md' && app.toolbar) {
17709 var $tabbarEl = $tabLinkEl.parents('.tabbar, .tabbar-labels');
17710 if ($tabbarEl.length > 0) {
17711 app.toolbar.setHighlight($tabbarEl);
17717 $newTabEl: $newTabEl,
17718 newTabEl: $newTabEl[0],
17719 $oldTabEl: $oldTabEl,
17720 oldTabEl: $oldTabEl[0],
17721 onTabsChanged: onTabsChanged,
17722 animated: animated,
17728 create: function create() {
17730 Utils.extend(app, {
17732 show: Tab.show.bind(app),
17737 '.tab-link': function tabLinkClick($clickedEl, data) {
17738 if ( data === void 0 ) data = {};
17741 if (($clickedEl.attr('href') && $clickedEl.attr('href').indexOf('#') === 0) || $clickedEl.attr('data-tab')) {
17743 tabEl: data.tab || $clickedEl.attr('href'),
17744 tabLinkEl: $clickedEl,
17745 animate: data.animate,
17752 function swipePanel(panel) {
17753 var app = panel.app;
17754 Utils.extend(panel, {
17756 swipeInitialized: true,
17758 var params = app.params.panel;
17759 var $el = panel.$el;
17760 var $backdropEl = panel.$backdropEl;
17761 var side = panel.side;
17762 var effect = panel.effect;
17768 var touchesStart = {};
17769 var touchStartTime;
17772 var backdropOpacity;
17778 var touchMoves = 0;
17779 function handleTouchStart(e) {
17780 if (!panel.swipeable) { return; }
17781 if (!app.panel.allowOpen || (!params.swipe && !params.swipeOnlyClose) || isTouched) { return; }
17782 if ($('.modal-in:not(.toast):not(.notification), .photo-browser-in').length > 0) { return; }
17783 otherPanel = app.panel[side === 'left' ? 'right' : 'left'] || {};
17784 if (!panel.opened && otherPanel.opened) { return; }
17785 if (!(params.swipeCloseOpposite || params.swipeOnlyClose)) {
17786 if (otherPanel.opened) { return; }
17788 if (e.target && e.target.nodeName.toLowerCase() === 'input' && e.target.type === 'range') { return; }
17789 if ($(e.target).closest('.range-slider, .tabs-swipeable-wrap, .calendar-months, .no-swipe-panel, .card-opened').length > 0) { return; }
17790 touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
17791 touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
17792 if (params.swipeOnlyClose && !panel.opened) {
17795 if (params.swipe !== 'both' && params.swipeCloseOpposite && params.swipe !== side && !panel.opened) {
17798 if (params.swipeActiveArea && !panel.opened) {
17799 if (side === 'left') {
17800 if (touchesStart.x > params.swipeActiveArea) { return; }
17802 if (side === 'right') {
17803 if (touchesStart.x < app.width - params.swipeActiveArea) { return; }
17806 if (params.swipeCloseActiveAreaSide && panel.opened) {
17807 if (side === 'left') {
17808 if (touchesStart.x < ($el[0].offsetWidth - params.swipeCloseActiveAreaSide)) { return; }
17810 if (side === 'right') {
17811 if (touchesStart.x > ((app.width - $el[0].offsetWidth) + params.swipeCloseActiveAreaSide)) { return; }
17815 $viewEl = $(panel.getViewEl());
17818 isScrolling = undefined;
17820 touchStartTime = Utils.now();
17821 direction = undefined;
17823 function handleTouchMove(e) {
17824 if (!isTouched) { return; }
17826 if (touchMoves < 2) { return; }
17827 if (e.f7PreventSwipePanel || app.preventSwipePanelBySwipeBack || app.preventSwipePanel) {
17831 var pageX = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX;
17832 var pageY = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY;
17833 if (typeof isScrolling === 'undefined') {
17834 isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x));
17841 if (pageX > touchesStart.x) {
17842 direction = 'to-right';
17844 direction = 'to-left';
17847 if (params.swipe === 'both') {
17848 if (params.swipeActiveArea > 0 && !panel.opened) {
17849 if (side === 'left' && touchesStart.x > params.swipeActiveArea) {
17853 if (side === 'right' && touchesStart.x < app.width - params.swipeActiveArea) {
17859 if ($el.hasClass('panel-visible-by-breakpoint')) {
17867 direction === 'to-left' && !$el.hasClass('panel-active')
17870 || (side === 'right'
17872 direction === 'to-right' && !$el.hasClass('panel-active')
17881 var threshold = panel.opened ? 0 : -params.swipeThreshold;
17882 if (side === 'right') { threshold = -threshold; }
17884 if (params.swipeNoFollow) {
17885 var touchesDiffNoFollow = (pageX - touchesStart.x);
17886 var timeDiff = (new Date()).getTime() - touchStartTime;
17888 if (!panel.opened && (
17889 (side === 'left' && touchesDiffNoFollow > -threshold)
17890 || (side === 'right' && -touchesDiffNoFollow > threshold)
17892 needToSwitch = true;
17894 if (panel.opened && (
17895 (side === 'left' && touchesDiffNoFollow < 0)
17896 || (side === 'right' && touchesDiffNoFollow > 0)
17898 needToSwitch = true;
17901 if (needToSwitch) {
17902 if (timeDiff < 300) {
17903 if (direction === 'to-left') {
17904 if (side === 'right') { app.panel.open(side); }
17905 if (side === 'left' && $el.hasClass('panel-active')) { app.panel.close(); }
17907 if (direction === 'to-right') {
17908 if (side === 'left') { app.panel.open(side); }
17909 if (side === 'right' && $el.hasClass('panel-active')) { app.panel.close(); }
17919 if (!panel.opened) {
17920 $el.css('display', 'block');
17921 $backdropEl.css('display', 'block');
17922 $el.trigger('panel:swipeopen', panel);
17923 panel.emit('local::swipeOpen panelSwipeOpen', panel);
17925 panelWidth = $el[0].offsetWidth;
17931 e.preventDefault();
17933 touchesDiff = (pageX - touchesStart.x) + threshold;
17935 if (side === 'right') {
17936 if (effect === 'cover') {
17937 translate = touchesDiff + (panel.opened ? 0 : panelWidth);
17938 if (translate < 0) { translate = 0; }
17939 if (translate > panelWidth) {
17940 translate = panelWidth;
17943 translate = touchesDiff - (panel.opened ? panelWidth : 0);
17944 if (translate > 0) { translate = 0; }
17945 if (translate < -panelWidth) {
17946 translate = -panelWidth;
17950 translate = touchesDiff + (panel.opened ? panelWidth : 0);
17951 if (translate < 0) { translate = 0; }
17952 if (translate > panelWidth) {
17953 translate = panelWidth;
17956 if (effect === 'reveal') {
17957 $viewEl.transform(("translate3d(" + translate + "px
,0,0)")).transition(0);
17958 $backdropEl.transform(("translate3d(" + translate + "px
,0,0)")).transition(0);
17960 $el.trigger('panel:swipe', panel, Math.abs(translate / panelWidth));
17961 panel.emit('local::swipe panelSwipe', panel, Math.abs(translate / panelWidth));
17963 if (side === 'left') { translate -= panelWidth; }
17964 $el.transform(("translate3d(" + translate + "px
,0,0)")).transition(0);
17966 $backdropEl.transition(0);
17967 backdropOpacity = 1 - Math.abs(translate / panelWidth);
17968 $backdropEl.css({ opacity: backdropOpacity });
17970 $el.trigger('panel:swipe', panel, Math.abs(translate / panelWidth));
17971 panel.emit('local::swipe panelSwipe', panel, Math.abs(translate / panelWidth));
17974 function handleTouchEnd() {
17975 if (!isTouched || !isMoved) {
17982 var timeDiff = (new Date()).getTime() - touchStartTime;
17984 var edge = (translate === 0 || Math.abs(translate) === panelWidth);
17986 var threshold = params.swipeThreshold || 0;
17988 if (!panel.opened) {
17989 if (Math.abs(touchesDiff) < threshold) {
17991 } else if (effect === 'cover') {
17992 if (translate === 0) {
17993 action = 'swap'; // open
17994 } else if (timeDiff < 300 && Math.abs(translate) > 0) {
17995 action = 'swap'; // open
17996 } else if (timeDiff >= 300 && Math.abs(translate) < panelWidth / 2) {
17997 action = 'swap'; // open
17999 action = 'reset'; // close
18001 } else if (translate === 0) {
18004 (timeDiff < 300 && Math.abs(translate) > 0)
18005 || (timeDiff >= 300 && (Math.abs(translate) >= panelWidth / 2))
18011 } else if (effect === 'cover') {
18012 if (translate === 0) {
18013 action = 'reset'; // open
18014 } else if (timeDiff < 300 && Math.abs(translate) > 0) {
18015 action = 'swap'; // open
18016 } else if (timeDiff >= 300 && Math.abs(translate) < panelWidth / 2) {
18017 action = 'reset'; // open
18019 action = 'swap'; // close
18021 } else if (translate === -panelWidth) {
18024 (timeDiff < 300 && Math.abs(translate) >= 0)
18025 || (timeDiff >= 300 && (Math.abs(translate) <= panelWidth / 2))
18027 if (side === 'left' && translate === panelWidth) { action = 'reset'; }
18028 else { action = 'swap'; }
18032 if (action === 'swap') {
18033 if (panel.opened) {
18034 panel.close(!edge);
18039 if (action === 'reset') {
18040 if (!panel.opened) {
18042 $el.css({ display: '' });
18044 var target = effect === 'reveal' ? $viewEl : $el;
18045 $('html').addClass('with-panel-transitioning');
18046 target.transitionEnd(function () {
18047 if ($el.hasClass('panel-active')) { return; }
18048 $el.css({ display: '' });
18049 $('html').removeClass('with-panel-transitioning');
18054 if (effect === 'reveal') {
18055 Utils.nextFrame(function () {
18056 $viewEl.transition('');
18057 $viewEl.transform('');
18060 $el.transition('').transform('');
18061 $backdropEl.css({ display: '' }).transform('').transition('').css('opacity', '');
18065 app.on('touchstart:passive', handleTouchStart);
18066 app.on('touchmove:active', handleTouchMove);
18067 app.on('touchend:passive', handleTouchEnd);
18068 panel.on('panelDestroy', function () {
18069 app.off('touchstart:passive', handleTouchStart);
18070 app.off('touchmove:active', handleTouchMove);
18071 app.off('touchend:passive', handleTouchEnd);
18075 function resizablePanel(panel) {
18076 var app = panel.app;
18077 Utils.extend(panel, {
18079 resizableWidth: null,
18080 resizableInitialized: true,
18082 var $htmlEl = $('html');
18083 var $el = panel.$el;
18084 var $backdropEl = panel.$backdropEl;
18085 var side = panel.side;
18086 var effect = panel.effect;
18087 if (!$el) { return; }
18091 var touchesStart = {};
18099 var visibleByBreakpoint;
18101 function transformCSSWidth(v) {
18102 if (!v) { return null; }
18103 if (v.indexOf('%') >= 0 || v.indexOf('vw') >= 0) {
18104 return parseInt(v, 10) / 100 * app.width;
18106 var newV = parseInt(v, 10);
18107 if (Number.isNaN(newV)) { return null; }
18111 function isResizable() {
18112 return panel.resizable && $el.hasClass('panel-resizable');
18115 function handleTouchStart(e) {
18116 if (!isResizable()) { return; }
18117 touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
18118 touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
18121 panelMinWidth = transformCSSWidth($el.css('min-width'));
18122 panelMaxWidth = transformCSSWidth($el.css('max-width'));
18123 visibleByBreakpoint = $el.hasClass('panel-visible-by-breakpoint');
18125 function handleTouchMove(e) {
18126 if (!isTouched) { return; }
18127 var pageX = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX;
18130 panelWidth = $el[0].offsetWidth;
18132 $el.addClass('panel-resizing');
18133 $htmlEl.css('cursor', 'col-resize');
18134 if (effect === 'reveal' || visibleByBreakpoint) {
18135 $viewEl = $(panel.getViewEl());
18137 if (effect === 'reveal' && !visibleByBreakpoint) {
18138 $backdropEl.transition(0);
18139 $viewEl.transition(0);
18145 e.preventDefault();
18147 touchesDiff = (pageX - touchesStart.x);
18149 var newPanelWidth = side === 'left' ? panelWidth + touchesDiff : panelWidth - touchesDiff;
18150 if (panelMinWidth && !Number.isNaN(panelMinWidth)) {
18151 newPanelWidth = Math.max(newPanelWidth, panelMinWidth);
18153 if (panelMaxWidth && !Number.isNaN(panelMaxWidth)) {
18154 newPanelWidth = Math.min(newPanelWidth, panelMaxWidth);
18156 newPanelWidth = Math.min(Math.max(newPanelWidth, 0), app.width);
18158 panel.resizableWidth = newPanelWidth;
18159 $el[0].style.width = newPanelWidth + "px
";
18160 if (effect === 'reveal' && !visibleByBreakpoint) {
18162 $viewEl.transform(("translate3d(" + (side === 'left' ? newPanelWidth : -newPanelWidth) + "px
, 0, 0)"));
18165 $backdropEl.transform(("translate3d(" + (side === 'left' ? newPanelWidth : -newPanelWidth) + "px
, 0, 0)"));
18167 } else if (visibleByBreakpoint && $viewEl) {
18168 $viewEl.css(("margin
-" + side), (newPanelWidth + "px
"));
18171 $el.trigger('panel:resize', panel, newPanelWidth);
18172 panel.emit('local::resize panelResize', panel, newPanelWidth);
18174 function handleTouchEnd() {
18175 $('html').css('cursor', '');
18176 if (!isTouched || !isMoved) {
18184 $htmlEl[0].style.setProperty(("--f7
-panel
-" + side + "-width
"), ((panel.resizableWidth) + "px
"));
18185 $el[0].style.width = '';
18186 if (effect === 'reveal' && !visibleByBreakpoint) {
18187 $viewEl.transform('');
18188 $backdropEl.transform('');
18190 $el.removeClass('panel-resizing');
18191 Utils.nextFrame(function () {
18192 if (visibleByBreakpoint) { return; }
18193 $el.transition('');
18194 if (effect === 'reveal') {
18195 $backdropEl.transition('');
18196 if ($viewEl) { $viewEl.transition(''); }
18201 function handleResize() {
18202 if (!panel.opened || !panel.resizableWidth) { return; }
18203 panelMinWidth = transformCSSWidth($el.css('min-width'));
18204 panelMaxWidth = transformCSSWidth($el.css('max-width'));
18206 if (panelMinWidth && !Number.isNaN(panelMinWidth) && panel.resizableWidth < panelMinWidth) {
18207 panel.resizableWidth = Math.max(panel.resizableWidth, panelMinWidth);
18209 if (panelMaxWidth && !Number.isNaN(panelMaxWidth) && panel.resizableWidth > panelMaxWidth) {
18210 panel.resizableWidth = Math.min(panel.resizableWidth, panelMaxWidth);
18212 panel.resizableWidth = Math.min(Math.max(panel.resizableWidth, 0), app.width);
18214 $htmlEl[0].style.setProperty(("--f7
-panel
-" + side + "-width
"), ((panel.resizableWidth) + "px
"));
18217 if (panel.$el.find('.panel-resize-handler').length === 0) {
18218 panel.$el.append('<div class="panel
-resize
-handler
"></div>');
18220 panel.$resizeHandlerEl = panel.$el.children('.panel-resize-handler');
18222 $el.addClass('panel-resizable');
18225 var passive = Support.passiveListener ? { passive: true } : false;
18227 panel.$el.on(app.touchEvents.start, '.panel-resize-handler', handleTouchStart, passive);
18228 app.on('touchmove:active', handleTouchMove);
18229 app.on('touchend:passive', handleTouchEnd);
18230 app.on('resize', handleResize);
18231 panel.on('beforeOpen', handleResize);
18233 panel.once('panelDestroy', function () {
18234 $el.removeClass('panel-resizable');
18235 panel.$resizeHandlerEl.remove();
18236 panel.$el.off(app.touchEvents.start, '.panel-resize-handler', handleTouchStart, passive);
18237 app.off('touchmove:active', handleTouchMove);
18238 app.off('touchend:passive', handleTouchEnd);
18239 app.off('resize', handleResize);
18240 panel.off('beforeOpen', handleResize);
18244 var Panel = /*@__PURE__*/(function (Framework7Class) {
18245 function Panel(app, params) {
18246 if ( params === void 0 ) params = {};
18248 Framework7Class.call(this, params, [app]);
18251 var el = params.el;
18253 if (!el && params.content) {
18254 el = params.content;
18258 if ($el.length === 0) { return panel; }
18259 if ($el[0].f7Panel) { return $el[0].f7Panel; }
18261 $el[0].f7Panel = panel;
18263 var opened = params.opened;
18264 var side = params.side;
18265 var effect = params.effect;
18266 if (typeof opened === 'undefined') { opened = $el.hasClass('panel-active'); }
18267 if (typeof side === 'undefined') { side = $el.hasClass('panel-left') ? 'left' : 'right'; }
18268 if (typeof effect === 'undefined') { effect = $el.hasClass('panel-cover') ? 'cover' : 'reveal'; }
18270 if (!app.panel[side]) {
18271 app.panel[side] = panel;
18273 throw new Error(("Framework7
: Can
't create panel; app already has a " + side + " panel!"));
18276 var $backdropEl = $('.panel
-backdrop
');
18278 if ($backdropEl.length === 0) {
18279 $backdropEl = $('<div
class="panel-backdrop"></div
>');
18280 $backdropEl.insertBefore($el);
18283 Utils.extend(panel, {
18290 $backdropEl: $backdropEl,
18291 backdropEl: $backdropEl[0],
18296 panel.useModules();
18304 if ( Framework7Class ) Panel.__proto__ = Framework7Class;
18305 Panel.prototype = Object.create( Framework7Class && Framework7Class.prototype );
18306 Panel.prototype.constructor = Panel;
18308 Panel.prototype.getViewEl = function getViewEl () {
18310 var app = panel.app;
18312 if (app.root.children('.views
').length > 0) {
18313 viewEl = app.root.children('.views
')[0];
18315 viewEl = app.root.children('.view
')[0];
18320 Panel.prototype.setBreakpoint = function setBreakpoint (emitEvents) {
18321 var obj, obj$1, obj$2;
18323 if ( emitEvents === void 0 ) emitEvents = true;
18325 var app = panel.app;
18326 var side = panel.side;
18327 var $el = panel.$el;
18328 var $viewEl = $(panel.getViewEl());
18329 var breakpoint = app.params.panel[(side + "Breakpoint")];
18330 var wasVisible = $el.hasClass('panel
-visible
-by
-breakpoint
');
18332 if (app.width >= breakpoint) {
18334 $('html
').removeClass(("with-panel-" + side + "-reveal with-panel-" + side + "-cover with-panel"));
18335 $el.css('display
', '').addClass('panel
-visible
-by
-breakpoint
').removeClass('panel
-active
');
18338 $viewEl.css(( obj = {}, obj[("margin-" + side)] = (($el.width()) + "px"), obj ));
18339 app.allowPanelOpen = true;
18341 app.emit('local
::breakpoint panelBreakpoint
');
18342 panel.$el.trigger('panel
:breakpoint
', panel);
18345 $viewEl.css(( obj$1 = {}, obj$1[("margin-" + side)] = (($el.width()) + "px"), obj$1 ));
18347 } else if (wasVisible) {
18348 $el.css('display
', '').removeClass('panel
-visible
-by
-breakpoint panel
-active
');
18351 $viewEl.css(( obj$2 = {}, obj$2[("margin-" + side)] = '', obj$2 ));
18353 app.emit('local
::breakpoint panelBreakpoint
');
18354 panel.$el.trigger('panel
:breakpoint
', panel);
18359 Panel.prototype.initBreakpoints = function initBreakpoints () {
18361 var app = panel.app;
18362 panel.resizeHandler = function resizeHandler() {
18363 panel.setBreakpoint();
18365 if (app.params.panel[((panel.side) + "Breakpoint")]) {
18366 app.on('resize
', panel.resizeHandler);
18368 panel.setBreakpoint();
18372 Panel.prototype.initSwipePanel = function initSwipePanel () {
18378 Panel.prototype.initResizablePanel = function initResizablePanel () {
18379 resizablePanel(this);
18382 Panel.prototype.toggle = function toggle (animate) {
18383 if ( animate === void 0 ) animate = true;
18386 if (panel.opened) { panel.close(animate); }
18387 else { panel.open(animate); }
18390 Panel.prototype.onOpen = function onOpen () {
18392 panel.opened = true;
18394 panel.$el.trigger('panel
:beforeopen
', panel);
18395 panel.emit('local
::beforeOpen panelBeforeOpen
', panel);
18397 panel.$el.trigger('panel
:open
', panel);
18398 panel.emit('local
::open panelOpen
', panel);
18401 Panel.prototype.onOpened = function onOpened () {
18403 var app = panel.app;
18404 app.panel.allowOpen = true;
18406 panel.$el.trigger('panel
:opened
', panel);
18407 panel.emit('local
::opened panelOpened
', panel);
18410 Panel.prototype.onClose = function onClose () {
18412 panel.opened = false;
18413 panel.$el.addClass('panel
-closing
');
18415 panel.$el.trigger('panel
:beforeclose
', panel);
18416 panel.emit('local
::beforeClose panelBeforeClose
', panel);
18418 panel.$el.trigger('panel
:close
', panel);
18419 panel.emit('local
::close panelClose
', panel);
18422 Panel.prototype.onClosed = function onClosed () {
18424 var app = panel.app;
18425 app.panel.allowOpen = true;
18426 panel.$el.removeClass('panel
-closing
');
18427 panel.$el.trigger('panel
:closed
', panel);
18428 panel.emit('local
::closed panelClosed
', panel);
18431 Panel.prototype.open = function open (animate) {
18432 if ( animate === void 0 ) animate = true;
18435 var app = panel.app;
18436 if (!app.panel.allowOpen) { return false; }
18438 var side = panel.side;
18439 var effect = panel.effect;
18440 var $el = panel.$el;
18441 var $backdropEl = panel.$backdropEl;
18442 var opened = panel.opened;
18444 var $panelParentEl = $el.parent();
18445 var wasInDom = $el.parents(document).length > 0;
18447 if (!$panelParentEl.is(app.root) || $el.prevAll('.views
, .view
').length) {
18448 var $insertBeforeEl = app.root.children('.panel
, .views
, .view
').eq(0);
18449 var $insertAfterEl = app.root.children('.statusbar
').eq(0);
18451 if ($insertBeforeEl.length) {
18452 $el.insertBefore($insertBeforeEl);
18453 } else if ($insertAfterEl.length) {
18454 $el.insertAfter($insertBeforeEl);
18456 app.root.prepend($el);
18460 && $backdropEl.length
18463 !$backdropEl.parent().is(app.root)
18464 && $backdropEl.nextAll('.panel
').length === 0
18467 $backdropEl.parent().is(app.root)
18468 && $backdropEl.nextAll('.panel
').length === 0
18472 $backdropEl.insertBefore($el);
18475 panel.once('panelClosed
', function () {
18477 $panelParentEl.append($el);
18484 // Ignore if opened
18485 if (opened || $el.hasClass('panel
-visible
-by
-breakpoint
') || $el.hasClass('panel
-active
')) { return false; }
18487 // Close if some panel is opened
18488 app.panel.close(side === 'left
' ? 'right
' : 'left
', animate);
18490 app.panel.allowOpen = false;
18492 $el[animate ? 'removeClass
' : 'addClass
']('not
-animated
');
18494 .css({ display: 'block
' })
18495 .addClass('panel
-active
');
18497 $backdropEl[animate ? 'removeClass
' : 'addClass
']('not
-animated
');
18498 $backdropEl.css({ display: 'block
' });
18500 /* eslint no-underscore-dangle: ["error", { "allow": ["_clientLeft"] }] */
18501 // panel._clientLeft = $el[0].clientLeft;
18504 var transitionEndTarget = effect === 'reveal
' ? $el.nextAll('.view
, .views
').eq(0) : $el;
18506 function panelTransitionEnd() {
18507 transitionEndTarget.transitionEnd(function (e) {
18508 if ($(e.target).is(transitionEndTarget)) {
18509 if ($el.hasClass('panel
-active
')) {
18511 $backdropEl.css({ display: '' });
18514 $backdropEl.css({ display: '' });
18516 } else { panelTransitionEnd(); }
18521 Utils.nextFrame(function () {
18522 $('html
').addClass(("with-panel with-panel-" + side + "-" + effect));
18524 panelTransitionEnd();
18527 $('html
').addClass(("with-panel with-panel-" + side + "-" + effect));
18530 $backdropEl.css({ display: '' });
18536 Panel.prototype.close = function close (animate) {
18537 if ( animate === void 0 ) animate = true;
18540 var app = panel.app;
18542 var side = panel.side;
18543 var effect = panel.effect;
18544 var $el = panel.$el;
18545 var $backdropEl = panel.$backdropEl;
18546 var opened = panel.opened;
18547 if (!opened || $el.hasClass('panel
-visible
-by
-breakpoint
') || !$el.hasClass('panel
-active
')) { return false; }
18549 $el[animate ? 'removeClass
' : 'addClass
']('not
-animated
');
18550 $el.removeClass('panel
-active
');
18552 $backdropEl[animate ? 'removeClass
' : 'addClass
']('not
-animated
');
18554 var transitionEndTarget = effect === 'reveal
' ? $el.nextAll('.view
, .views
').eq(0) : $el;
18557 app.panel.allowOpen = false;
18560 transitionEndTarget.transitionEnd(function () {
18561 if ($el.hasClass('panel
-active
')) { return; }
18562 $el.css({ display: '' });
18563 $('html
').removeClass('with-panel
-transitioning
');
18567 .removeClass(("with-panel with-panel-" + side + "-" + effect))
18568 .addClass('with-panel
-transitioning
');
18570 $el.css({ display: '' });
18571 $el.removeClass('not
-animated
');
18572 $('html
').removeClass(("with-panel with-panel-transitioning with-panel-" + side + "-" + effect));
18578 Panel.prototype.init = function init () {
18580 var app = panel.app;
18581 if (app.params.panel[((panel.side) + "Breakpoint")]) {
18582 panel.initBreakpoints();
18586 (app.params.panel.swipe === panel.side)
18587 || (app.params.panel.swipe === 'both
')
18588 || (app.params.panel.swipe && app.params.panel.swipe !== panel.side && app.params.panel.swipeCloseOpposite)
18590 panel.initSwipePanel();
18593 if (panel.params.resizable || panel.$el.hasClass('panel
-resizable
')) {
18594 panel.initResizablePanel();
18598 Panel.prototype.destroy = function destroy () {
18602 var app = panel.app;
18605 // Panel already destroyed
18609 panel.emit('local
::beforeDestroy panelBeforeDestroy
', panel);
18610 panel.$el.trigger('panel
:beforedestroy
', panel);
18612 if (panel.resizeHandler) {
18613 app.off('resize
', panel.resizeHandler);
18616 if (panel.$el.hasClass('panel
-visible
-by
-breakpoint
')) {
18617 var $viewEl = $(panel.getViewEl());
18618 panel.$el.css('display
', '').removeClass('panel
-visible
-by
-breakpoint panel
-active
');
18619 $viewEl.css(( obj = {}, obj[("margin-" + (panel.side))] = '', obj ));
18620 app.emit('local
::breakpoint panelBreakpoint
');
18621 panel.$el.trigger('panel
:breakpoint
', panel);
18624 panel.$el.trigger('panel
:destroy
', panel);
18625 panel.emit('local
::destroy panelDestroy
');
18626 delete app.panel[panel.side];
18628 panel.el.f7Panel = null;
18629 delete panel.el.f7Panel;
18631 Utils.deleteProps(panel);
18637 }(Framework7Class));
18644 rightBreakpoint: 0,
18645 swipe: undefined, // or 'left
' or 'right
' or 'both
'
18646 swipeActiveArea: 0,
18647 swipeCloseActiveAreaSide: 0,
18648 swipeCloseOpposite: true,
18649 swipeOnlyClose: false,
18650 swipeNoFollow: false,
18652 closeByBackdropClick: true,
18663 create: function create() {
18665 Utils.extend(app.panel, {
18666 disableResizable: function disableResizable(panel) {
18667 if ( panel === void 0 ) panel = 'both
';
18671 if (typeof panel === 'string
') {
18672 if (panel === 'both
') {
18674 panels = [app.panel.left, app.panel.right];
18677 panels.push(app.panel[side]);
18682 panels.forEach(function (panelInstance) {
18683 panelInstance.resizable = false;
18684 panelInstance.$el.removeClass('panel
-resizable
');
18687 enableResizable: function enableResizable(panel) {
18688 if ( panel === void 0 ) panel = 'both
';
18692 if (typeof panel === 'string
') {
18693 if (panel === 'both
') {
18695 panels = [app.panel.left, app.panel.right];
18698 panels.push(app.panel[side]);
18703 panels.forEach(function (panelInstance) {
18704 if (!panelInstance) { return; }
18705 if (!panelInstance.resizableInitialized) {
18706 panelInstance.initResizablePanel();
18708 panelInstance.resizable = true;
18709 panelInstance.$el.addClass('panel
-resizable
');
18713 disableSwipe: function disableSwipe(panel) {
18714 if ( panel === void 0 ) panel = 'both
';
18718 if (typeof panel === 'string
') {
18719 if (panel === 'both
') {
18721 panels = [app.panel.left, app.panel.right];
18724 panels.push(app.panel[side]);
18729 panels.forEach(function (panelInstance) {
18730 panelInstance.swipeable = false;
18733 enableSwipe: function enableSwipe(panel) {
18734 if ( panel === void 0 ) panel = 'both
';
18738 if (typeof panel === 'string
') {
18741 (app.params.panel.swipe === 'left
' && side === 'right
')
18742 || (app.params.panel.swipe === 'right
' && side === 'left
')
18746 app.params.panel.swipe = side;
18747 panels = [app.panel.left, app.panel.right];
18749 app.params.panel.swipe = side;
18750 panels.push(app.panel[side]);
18752 } else if (panel) {
18753 panels.push(panel);
18755 panels.forEach(function (panelInstance) {
18756 if (!panelInstance) { return; }
18757 if (!panelInstance.swipeInitialized) {
18758 panelInstance.initSwipePanel();
18760 panelInstance.swipeable = true;
18764 create: function create(params) {
18765 return new Panel(app, params);
18767 open: function open(side, animate) {
18768 var panelSide = side;
18770 if ($('.panel
').length > 1) {
18773 panelSide = $('.panel
').hasClass('panel
-left
') ? 'left
' : 'right
';
18775 if (!panelSide) { return false; }
18776 if (app.panel[panelSide]) {
18777 return app.panel[panelSide].open(animate);
18779 var $panelEl = $((".panel-" + panelSide));
18780 if ($panelEl.length > 0) {
18781 return app.panel.create({ el: $panelEl }).open(animate);
18785 close: function close(side, animate) {
18790 $panelEl = $((".panel-" + panelSide));
18792 $panelEl = $('.panel
.panel
-active
');
18793 panelSide = $panelEl.hasClass('panel
-left
') ? 'left
' : 'right
';
18795 if (!panelSide) { return false; }
18796 if (app.panel[panelSide]) {
18797 return app.panel[panelSide].close(animate);
18799 if ($panelEl.length > 0) {
18800 return app.panel.create({ el: $panelEl }).close(animate);
18804 toggle: function toggle(side, animate) {
18806 var panelSide = side;
18809 $panelEl = $((".panel-" + panelSide));
18810 } else if ($('.panel
.panel
-active
').length) {
18811 $panelEl = $('.panel
.panel
-active
');
18812 panelSide = $panelEl.hasClass('panel
-left
') ? 'left
' : 'right
';
18814 if ($('.panel
').length > 1) {
18817 panelSide = $('.panel
').hasClass('panel
-left
') ? 'left
' : 'right
';
18818 $panelEl = $((".panel-" + panelSide));
18820 if (!panelSide) { return false; }
18821 if (app.panel[panelSide]) {
18822 return app.panel[panelSide].toggle(animate);
18824 if ($panelEl.length > 0) {
18825 return app.panel.create({ el: $panelEl }).toggle(animate);
18829 get: function get(side) {
18830 var panelSide = side;
18832 if ($('.panel
').length > 1) {
18835 panelSide = $('.panel
').hasClass('panel
-left
') ? 'left
' : 'right
';
18837 if (!panelSide) { return undefined; }
18838 if (app.panel[panelSide]) {
18839 return app.panel[panelSide];
18841 var $panelEl = $((".panel-" + panelSide));
18842 if ($panelEl.length > 0) {
18843 return app.panel.create({ el: $panelEl });
18850 init: function init() {
18854 $('.panel
').each(function (index, panelEl) {
18855 var side = $(panelEl).hasClass('panel
-left
') ? 'left
' : 'right
';
18856 app.panel[side] = app.panel.create({ el: panelEl, side: side });
18861 '.panel
-open
': function open(clickedEl, data) {
18862 if ( data === void 0 ) data = {};
18866 if (data.panel === 'right
' || ($('.panel
').length === 1 && $('.panel
').hasClass('panel
-right
'))) {
18869 app.panel.open(side, data.animate);
18871 '.panel
-close
': function close(clickedEl, data) {
18872 if ( data === void 0 ) data = {};
18875 var side = data.panel;
18876 app.panel.close(side, data.animate);
18878 '.panel
-toggle
': function close(clickedEl, data) {
18879 if ( data === void 0 ) data = {};
18882 var side = data.panel;
18883 app.panel.toggle(side, data.animate);
18885 '.panel
-backdrop
': function close() {
18887 var $panelEl = $('.panel
-active
');
18888 var instance = $panelEl[0] && $panelEl[0].f7Panel;
18889 $panelEl.trigger('panel
:backdrop
-click
');
18891 instance.emit('backdropClick
', instance);
18893 app.emit('panelBackdropClick
', instance || $panelEl[0]);
18894 if (app.params.panel.closeByBackdropClick) { app.panel.close(); }
18899 /* eslint no-param-reassign: "off" */
18901 var CardExpandable = {
18902 open: function open(cardEl, animate) {
18905 if ( cardEl === void 0 ) cardEl = '.card
-expandable
';
18906 if ( animate === void 0 ) animate = true;
18909 if ($('.card
-opened
').length) { return; }
18910 var $cardEl = $(cardEl).eq(0);
18912 if (!$cardEl || !$cardEl.length) { return; }
18913 if ($cardEl.hasClass('card
-opened
') || $cardEl.hasClass('card
-opening
') || $cardEl.hasClass('card
-closing
')) { return; }
18915 var $pageEl = $cardEl.parents('.page
').eq(0);
18916 if (!$pageEl.length) { return; }
18920 function prevent() {
18924 $cardEl.trigger('card
:beforeopen
', { prevent: prevent });
18925 app.emit('cardBeforeOpen
', $cardEl[0], prevent);
18927 if (prevented) { return; }
18929 var cardParams = Object.assign({ animate: animate }, app.params.card, $cardEl.dataset());
18931 var $pageContentEl = $cardEl.parents('.page
-content
');
18934 if ($cardEl.attr('data
-backdrop
-el
')) {
18935 $backdropEl = $($cardEl.attr('data
-backdrop
-el
'));
18937 if (!$backdropEl && cardParams.backdrop) {
18938 $backdropEl = $pageContentEl.find('.card
-backdrop
');
18939 if (!$backdropEl.length) {
18940 $backdropEl = $('<div
class="card-backdrop"></div
>');
18941 $pageContentEl.append($backdropEl);
18947 if (cardParams.hideNavbarOnOpen) {
18948 $navbarEl = $pageEl.children('.navbar
');
18949 if (!$navbarEl.length) {
18950 if ($pageEl[0].f7Page) { $navbarEl = $pageEl[0].f7Page.$navbarEl; }
18953 if (cardParams.hideToolbarOnOpen) {
18954 $toolbarEl = $pageEl.children('.toolbar
');
18955 if (!$toolbarEl.length) {
18956 $toolbarEl = $pageEl.parents('.view
').children('.toolbar
');
18958 if (!$toolbarEl.length) {
18959 $toolbarEl = $pageEl.parents('.views
').children('.toolbar
');
18963 var currTransform = $cardEl.css('transform
');
18965 if (currTransform && currTransform.match(/[2-9]/)) {
18966 hasTransform = true;
18968 var $cardContentEl = $cardEl.children('.card
-content
');
18970 var $cardSizeEl = $(document.createElement('div
')).addClass('card
-expandable
-size
');
18971 $cardEl.append($cardSizeEl);
18973 var cardWidth = $cardEl[0].offsetWidth;
18974 var cardHeight = $cardEl[0].offsetHeight;
18975 var pageWidth = $pageEl[0].offsetWidth;
18976 var pageHeight = $pageEl[0].offsetHeight;
18978 var maxWidth = $cardSizeEl[0].offsetWidth || pageWidth;
18979 var maxHeight = $cardSizeEl[0].offsetHeight || pageHeight;
18981 var scaleX = maxWidth / cardWidth;
18982 var scaleY = maxHeight / cardHeight;
18984 var offset = $cardEl.offset();
18985 var pageOffset = $pageEl.offset();
18986 offset.left -= pageOffset.left;
18988 var cardLeftOffset;
18991 if (hasTransform) {
18992 var transformValues = currTransform
18993 .replace(/matrix\(|\)/g, '')
18995 .map(function (el) { return el.trim(); });
18996 if (transformValues && transformValues.length > 1) {
18997 var scale = parseFloat(transformValues[0]);
18998 cardLeftOffset = offset.left - cardWidth * (1 - scale) / 2;
18999 cardTopOffset = offset.top - pageOffset.top - cardHeight * (1 - scale) / 2;
19000 if (app.rtl) { cardLeftOffset -= $cardEl[0].scrollLeft; }
19002 cardLeftOffset = $cardEl[0].offsetLeft;
19003 cardTopOffset = $cardEl[0].offsetTop - ($pageContentEl.length ? $pageContentEl[0].scrollTop : 0);
19006 cardLeftOffset = offset.left;
19007 cardTopOffset = offset.top - pageOffset.top;
19008 if (app.rtl) { cardLeftOffset -= $cardEl[0].scrollLeft; }
19011 cardLeftOffset -= (pageWidth - maxWidth) / 2;
19012 cardTopOffset -= (pageHeight - maxHeight) / 2;
19014 var cardRightOffset = maxWidth - cardWidth - cardLeftOffset;
19016 (assign = [cardRightOffset, cardLeftOffset], cardLeftOffset = assign[0], cardRightOffset = assign[1]);
19018 var cardBottomOffset = maxHeight - cardHeight - cardTopOffset;
19019 var translateX = (cardRightOffset - cardLeftOffset) / 2;
19020 var translateY = (cardBottomOffset - cardTopOffset) / 2;
19021 if (cardParams.hideNavbarOnOpen && $navbarEl && $navbarEl.length) {
19022 app.navbar.hide($navbarEl, cardParams.animate);
19024 if (cardParams.hideToolbarOnOpen && $toolbarEl && $toolbarEl.length) {
19025 app.toolbar.hide($toolbarEl, cardParams.animate);
19028 $backdropEl.removeClass('card
-backdrop
-out
').addClass('card
-backdrop
-in');
19030 $cardEl.removeClass('card
-transitioning
');
19031 if (cardParams.animate) {
19032 $cardEl.addClass('card
-opening
');
19034 $cardEl.trigger('card
:open
');
19035 app.emit('cardOpen
', $cardEl[0]);
19036 function transitionEnd() {
19037 $pageEl.addClass('page
-with-card
-opened
');
19038 if (app.device.ios && $pageContentEl.length) {
19039 $pageContentEl.css('height
', (($pageContentEl[0].offsetHeight + 1) + "px"));
19040 setTimeout(function () {
19041 $pageContentEl.css('height
', '');
19044 $cardEl.addClass('card
-opened
');
19045 $cardEl.removeClass('card
-opening
');
19046 $cardEl.trigger('card
:opened
');
19047 app.emit('cardOpened
', $cardEl[0], $pageEl[0]);
19051 width: (maxWidth + "px"),
19052 height: (maxHeight + "px"),
19054 .transform(("translate3d(" + (app.rtl ? (cardLeftOffset + translateX) : (-cardLeftOffset - translateX)) + "px, 0px, 0) scale(" + (1 / scaleX) + ", " + (1 / scaleY) + ")"));
19057 .transform(("translate3d(" + translateX + "px, " + translateY + "px, 0) scale(" + scaleX + ", " + scaleY + ")"));
19058 if (cardParams.animate) {
19059 $cardEl.transitionEnd(function () {
19066 function onResize() {
19069 $cardEl.removeClass('card
-transitioning
');
19070 cardWidth = $cardEl[0].offsetWidth;
19071 cardHeight = $cardEl[0].offsetHeight;
19072 pageWidth = $pageEl[0].offsetWidth;
19073 pageHeight = $pageEl[0].offsetHeight;
19074 maxWidth = $cardSizeEl[0].offsetWidth || pageWidth;
19075 maxHeight = $cardSizeEl[0].offsetHeight || pageHeight;
19077 scaleX = maxWidth / cardWidth;
19078 scaleY = maxHeight / cardHeight;
19080 $cardEl.transform('translate3d(0px
, 0px
, 0) scale(1)');
19081 offset = $cardEl.offset();
19082 pageOffset = $pageEl.offset();
19083 offset.left -= pageOffset.left;
19084 offset.top -= pageOffset.top;
19086 cardLeftOffset = offset.left - (pageWidth - maxWidth) / 2;
19087 if (app.rtl) { cardLeftOffset -= $cardEl[0].scrollLeft; }
19088 cardTopOffset = offset.top - (pageHeight - maxHeight) / 2;
19090 cardRightOffset = maxWidth - cardWidth - cardLeftOffset;
19091 cardBottomOffset = maxHeight - cardHeight - cardTopOffset;
19093 (assign = [cardRightOffset, cardLeftOffset], cardLeftOffset = assign[0], cardRightOffset = assign[1]);
19095 translateX = (cardRightOffset - cardLeftOffset) / 2;
19096 translateY = (cardBottomOffset - cardTopOffset) / 2;
19098 $cardEl.transform(("translate3d(" + translateX + "px, " + translateY + "px, 0) scale(" + scaleX + ", " + scaleY + ")"));
19101 width: (maxWidth + "px"),
19102 height: (maxHeight + "px"),
19104 .transform(("translate3d(" + (app.rtl ? (cardLeftOffset + translateX) : (-cardLeftOffset - translateX)) + "px, 0px, 0) scale(" + (1 / scaleX) + ", " + (1 / scaleY) + ")"));
19118 function onTouchStart(e) {
19119 if (!$(e.target).closest($cardEl).length) { return; }
19120 if (!$cardEl.hasClass('card
-opened
')) { return; }
19121 cardScrollTop = $cardContentEl.scrollTop();
19123 touchStartX = e.targetTouches[0].pageX;
19124 touchStartY = e.targetTouches[0].pageY;
19125 isScrolling = undefined;
19129 function onTouchMove(e) {
19130 if (!isTouched) { return; }
19131 touchEndX = e.targetTouches[0].pageX;
19132 touchEndY = e.targetTouches[0].pageY;
19133 if (typeof isScrolling === 'undefined') {
19134 isScrolling = !!(isScrolling || Math.abs(touchEndY - touchStartY) > Math.abs(touchEndX - touchStartX));
19136 if (!isH && !isV) {
19137 if (!isScrolling && e.targetTouches[0].clientX <= 50) {
19144 if (!(isH || isV) || (isV && cardScrollTop !== 0)) {
19150 $cardEl.removeClass('card
-transitioning
');
19154 progress = isV ? Math.max((touchEndY - touchStartY) / 150, 0) : Math.max((touchEndX - touchStartX) / (cardWidth / 2), 0);
19155 if ((progress > 0 && isV) || isH) {
19156 if (isV && app.device.ios) {
19157 $cardContentEl.css('-webkit
-overflow
-scrolling
', 'auto
');
19158 $cardContentEl.scrollTop(0);
19160 e.preventDefault();
19163 if (progress > 1) { progress = Math.pow( progress, 0.3 ); }
19164 if (progress > (isV ? 1.3 : 1.1)) {
19167 app.card.close($cardEl);
19169 $cardEl.transform(("translate3d(" + translateX + "px, " + translateY + "px, 0) scale(" + (scaleX * (1 - progress * 0.2)) + ", " + (scaleY * (1 - progress * 0.2)) + ")"));
19172 function onTouchEnd() {
19173 if (!isTouched || !isMoved) { return; }
19176 if (app.device.ios) {
19177 $cardContentEl.css('-webkit
-overflow
-scrolling
', '');
19179 if (progress >= 0.8) {
19180 app.card.close($cardEl);
19183 .addClass('card
-transitioning
')
19184 .transform(("translate3d(" + translateX + "px, " + translateY + "px, 0) scale(" + scaleX + ", " + scaleY + ")"));
19188 $cardEl[0].detachEventHandlers = function detachEventHandlers() {
19189 app.off('resize
', onResize);
19190 if (Support.touch && cardParams.swipeToClose) {
19191 app.off('touchstart
:passive
', onTouchStart);
19192 app.off('touchmove
:active
', onTouchMove);
19193 app.off('touchend
:passive
', onTouchEnd);
19197 app.on('resize
', onResize);
19198 if (Support.touch && cardParams.swipeToClose) {
19199 app.on('touchstart
:passive
', onTouchStart);
19200 app.on('touchmove
:active
', onTouchMove);
19201 app.on('touchend
:passive
', onTouchEnd);
19204 close: function close(cardEl, animate) {
19205 if ( cardEl === void 0 ) cardEl = '.card
-expandable
.card
-opened
';
19206 if ( animate === void 0 ) animate = true;
19209 var $cardEl = $(cardEl).eq(0);
19210 if (!$cardEl || !$cardEl.length) { return; }
19211 if (!$cardEl.hasClass('card
-opened
') || $cardEl.hasClass('card
-opening
') || $cardEl.hasClass('card
-closing
')) { return; }
19213 var $cardContentEl = $cardEl.children('.card
-content
');
19214 var $pageContentEl = $cardEl.parents('.page
-content
');
19216 var $pageEl = $cardEl.parents('.page
').eq(0);
19217 if (!$pageEl.length) { return; }
19219 var cardParams = Object.assign({ animate: animate }, app.params.card, $cardEl.dataset());
19225 if ($cardEl.attr('data
-backdrop
-el
')) {
19226 $backdropEl = $($cardEl.attr('data
-backdrop
-el
'));
19228 if (cardParams.backdrop) {
19229 $backdropEl = $cardEl.parents('.page
-content
').find('.card
-backdrop
');
19232 if (cardParams.hideNavbarOnOpen) {
19233 $navbarEl = $pageEl.children('.navbar
');
19234 if (!$navbarEl.length) {
19235 if ($pageEl[0].f7Page) { $navbarEl = $pageEl[0].f7Page.$navbarEl; }
19237 if ($navbarEl && $navbarEl.length) {
19238 app.navbar.show($navbarEl, cardParams.animate);
19241 if (cardParams.hideToolbarOnOpen) {
19242 $toolbarEl = $pageEl.children('.toolbar
');
19243 if (!$toolbarEl.length) {
19244 $toolbarEl = $pageEl.parents('.view
').children('.toolbar
');
19246 if (!$toolbarEl.length) {
19247 $toolbarEl = $pageEl.parents('.views
').children('.toolbar
');
19249 if ($toolbarEl && $toolbarEl.length) {
19250 app.toolbar.show($toolbarEl, cardParams.animate);
19254 $pageEl.removeClass('page
-with-card
-opened
');
19256 if (app.device.ios && $pageContentEl.length) {
19257 $pageContentEl.css('height
', (($pageContentEl[0].offsetHeight + 1) + "px"));
19258 setTimeout(function () {
19259 $pageContentEl.css('height
', '');
19263 if ($backdropEl && $backdropEl.length) {
19264 $backdropEl.removeClass('card
-backdrop
-in').addClass('card
-backdrop
-out
');
19267 $cardEl.removeClass('card
-opened card
-transitioning
');
19268 if (cardParams.animate) {
19269 $cardEl.addClass('card
-closing
');
19271 $cardEl.addClass('card
-no
-transition
');
19273 $cardEl.transform('');
19274 $cardEl.trigger('card
:close
');
19275 app.emit('cardClose
', $cardEl[0]);
19277 function transitionEnd() {
19278 $cardEl.removeClass('card
-closing card
-no
-transition
');
19279 $cardEl.trigger('card
:closed
');
19280 $cardEl.find('.card
-expandable
-size
').remove();
19281 app.emit('cardClosed
', $cardEl[0], $pageEl[0]);
19289 .scrollTop(0, animate ? 300 : 0);
19291 $cardContentEl.transitionEnd(function () {
19298 if ($cardEl[0].detachEventHandlers) {
19299 $cardEl[0].detachEventHandlers();
19300 delete $cardEl[0].detachEventHandlers;
19303 toggle: function toggle(cardEl, animate) {
19304 if ( cardEl === void 0 ) cardEl = '.card
-expandable
';
19307 var $cardEl = $(cardEl).eq(0);
19308 if (!$cardEl.length) { return; }
19309 if ($cardEl.hasClass('card
-opened
')) {
19310 app.card.close($cardEl, animate);
19312 app.card.open($cardEl, animate);
19321 hideNavbarOnOpen: true,
19322 hideToolbarOnOpen: true,
19323 swipeToClose: true,
19324 closeByBackdropClick: true,
19328 create: function create() {
19330 Utils.extend(app, {
19332 open: CardExpandable.open.bind(app),
19333 close: CardExpandable.close.bind(app),
19334 toggle: CardExpandable.toggle.bind(app),
19339 pageBeforeIn: function pageBeforeIn(page) {
19341 if (app.params.card.hideNavbarOnOpen && page.navbarEl && page.$el.find('.card
-opened
.card
-expandable
').length) {
19342 app.navbar.hide(page.navbarEl);
19345 if (app.params.card.hideToolbarOnOpen && page.$el.find('.card
-opened
.card
-expandable
').length) {
19346 var $toolbarEl = page.$el.children('.toolbar
');
19347 if (!$toolbarEl.length) {
19348 $toolbarEl = page.$el.parents('.view
').children('.toolbar
');
19350 if (!$toolbarEl.length) {
19351 $toolbarEl = page.$el.parents('.views
').children('.toolbar
');
19353 if ($toolbarEl && $toolbarEl.length) {
19354 app.toolbar.hide($toolbarEl);
19360 '.card
-close
': function closeCard($clickedEl, data) {
19362 app.card.close(data.card, data.animate);
19364 '.card
-open
': function closeCard($clickedEl, data) {
19366 app.card.open(data.card, data.animate);
19368 '.card
-expandable
': function toggleExpandableCard($clickedEl, data, e) {
19370 if ($clickedEl.hasClass('card
-opened
') || $clickedEl.hasClass('card
-opening
') || $clickedEl.hasClass('card
-closing
')) { return; }
19371 if ($(e.target).closest('.card
-prevent
-open
, .card
-close
').length) { return; }
19372 app.card.open($clickedEl);
19374 '.card
-backdrop
-in': function onBackdropClick() {
19376 var needToClose = false;
19377 if (app.params.card.closeByBackdropClick) { needToClose = true; }
19378 var $openedCardEl = $('.card
-opened
');
19379 if (!$openedCardEl.length) { return; }
19380 if ($openedCardEl.attr('data
-close
-by
-backdrop
-click
') === 'true') {
19381 needToClose = true;
19382 } else if ($openedCardEl.attr('data
-close
-by
-backdrop
-click
') === 'false') {
19383 needToClose = false;
19385 if (needToClose) { app.card.close($openedCardEl); }
19396 store: function store(form, data) {
19400 var $formEl = $(form);
19401 if ($formEl.length && $formEl.is('form
') && $formEl.attr('id
')) {
19402 formId = $formEl.attr('id
');
19404 // Store form data in app.formsData
19405 app.form.data[("form-" + formId)] = data;
19407 // Store form data in local storage also
19409 win.localStorage[("f7form-" + formId)] = JSON.stringify(data);
19414 get: function get(form) {
19418 var $formEl = $(form);
19419 if ($formEl.length && $formEl.is('form
') && $formEl.attr('id
')) {
19420 formId = $formEl.attr('id
');
19424 if (win.localStorage[("f7form-" + formId)]) {
19425 return JSON.parse(win.localStorage[("f7form-" + formId)]);
19430 if (app.form.data[("form-" + formId)]) {
19431 return app.form.data[("form-" + formId)];
19435 remove: function remove(form) {
19439 var $formEl = $(form);
19440 if ($formEl.length && $formEl.is('form
') && $formEl.attr('id
')) {
19441 formId = $formEl.attr('id
');
19444 // Delete form data from app.formsData
19445 if (app.form.data[("form-" + formId)]) {
19446 app.form.data[("form-" + formId)] = '';
19447 delete app.form.data[("form-" + formId)];
19450 // Delete form data from local storage also
19452 if (win.localStorage[("f7form-" + formId)]) {
19453 win.localStorage[("f7form-" + formId)] = '';
19454 win.localStorage.removeItem(("f7form-" + formId));
19463 var FormStorage = {
19464 init: function init(formEl) {
19466 var $formEl = $(formEl);
19467 var formId = $formEl.attr('id
');
19468 if (!formId) { return; }
19469 var initialData = app.form.getFormData(formId);
19471 app.form.fillFromData($formEl, initialData);
19474 var data = app.form.convertToData($formEl);
19475 if (!data) { return; }
19476 app.form.storeFormData(formId, data);
19477 $formEl.trigger('form
:storedata
', data);
19478 app.emit('formStoreData
', $formEl[0], data);
19480 $formEl.on('change submit
', store);
19482 destroy: function destroy(formEl) {
19483 var $formEl = $(formEl);
19484 $formEl.off('change submit
');
19488 // Form To/From Data
19489 function formToData(formEl) {
19491 var $formEl = $(formEl).eq(0);
19492 if ($formEl.length === 0) { return undefined; }
19497 // Skip input types
19498 var skipTypes = ['submit
', 'image
', 'button
', 'file
'];
19499 var skipNames = [];
19500 $formEl.find('input
, select
, textarea
').each(function (inputIndex, inputEl) {
19501 var $inputEl = $(inputEl);
19502 if ($inputEl.hasClass('ignore
-store
-data
') || $inputEl.hasClass('no
-store
-data
')) {
19505 var name = $inputEl.attr('name
');
19506 var type = $inputEl.attr('type
');
19507 var tag = inputEl.nodeName.toLowerCase();
19508 if (skipTypes.indexOf(type) >= 0) { return; }
19509 if (skipNames.indexOf(name) >= 0 || !name) { return; }
19510 if (tag === 'select
' && $inputEl.prop('multiple
')) {
19511 skipNames.push(name);
19513 $formEl.find(("select[name=\"" + name + "\"] option")).each(function (index, el) {
19514 if (el.selected) { data[name].push(el.value); }
19519 skipNames.push(name);
19521 $formEl.find(("input[name=\"" + name + "\"]")).each(function (index, el) {
19522 if (el.checked) { data[name].push(el.value); }
19526 skipNames.push(name);
19527 $formEl.find(("input[name=\"" + name + "\"]")).each(function (index, el) {
19528 if (el.checked) { data[name] = el.value; }
19532 data[name] = $inputEl.val();
19537 $formEl.trigger('form
:todata
', data);
19538 app.emit('formToData
', $formEl[0], data);
19542 function formFromData(formEl, formData) {
19544 var $formEl = $(formEl).eq(0);
19545 if (!$formEl.length) { return; }
19547 var data = formData;
19548 var formId = $formEl.attr('id
');
19550 if (!data && formId) {
19551 data = app.form.getFormData(formId);
19554 if (!data) { return; }
19556 // Skip input types
19557 var skipTypes = ['submit
', 'image
', 'button
', 'file
'];
19558 var skipNames = [];
19560 $formEl.find('input
, select
, textarea
').each(function (inputIndex, inputEl) {
19561 var $inputEl = $(inputEl);
19562 if ($inputEl.hasClass('ignore
-store
-data
') || $inputEl.hasClass('no
-store
-data
')) {
19565 var name = $inputEl.attr('name
');
19566 var type = $inputEl.attr('type
');
19567 var tag = inputEl.nodeName.toLowerCase();
19568 if (typeof data[name] === 'undefined' || data[name] === null) { return; }
19569 if (skipTypes.indexOf(type) >= 0) { return; }
19570 if (skipNames.indexOf(name) >= 0 || !name) { return; }
19571 if (tag === 'select
' && $inputEl.prop('multiple
')) {
19572 skipNames.push(name);
19573 $formEl.find(("select[name=\"" + name + "\"] option")).each(function (index, el) {
19575 if (data[name].indexOf(el.value) >= 0) { selectEl.selected = true; }
19576 else { selectEl.selected = false; }
19581 skipNames.push(name);
19582 $formEl.find(("input[name=\"" + name + "\"]")).each(function (index, el) {
19583 var checkboxEl = el;
19584 if (data[name].indexOf(el.value) >= 0) { checkboxEl.checked = true; }
19585 else { checkboxEl.checked = false; }
19589 skipNames.push(name);
19590 $formEl.find(("input[name=\"" + name + "\"]")).each(function (index, el) {
19592 if (data[name] === el.value) { radioEl.checked = true; }
19593 else { radioEl.checked = false; }
19597 $inputEl.val(data[name]);
19601 if (tag === 'select
' || tag === 'input
' || tag === 'textarea
') {
19602 $inputEl.trigger('change
', 'fromdata
');
19605 $formEl.trigger('form
:fromdata
', data);
19606 app.emit('formFromData
', $formEl[0], data);
19609 function initAjaxForm() {
19612 function onSubmitChange(e, fromData) {
19613 var $formEl = $(this);
19614 if (e.type === 'change
' && !$formEl.hasClass('form
-ajax
-submit
-onchange
')) { return; }
19615 if (e.type === 'submit
') { e.preventDefault(); }
19617 if (e.type === 'change
' && fromData === 'fromdata
') { return; }
19619 var method = ($formEl.attr('method
') || 'GET
').toUpperCase();
19620 var contentType = $formEl.prop('enctype
') || $formEl.attr('enctype
');
19622 var url = $formEl.attr('action
');
19623 if (!url) { return; }
19626 if (method === 'POST
') {
19627 if (contentType === 'application
/x
-www
-form
-urlencoded
') {
19628 data = app.form.convertToData($formEl[0]);
19630 data = new win.FormData($formEl[0]);
19633 data = Utils.serializeObject(app.form.convertToData($formEl[0]));
19639 contentType: contentType,
19641 beforeSend: function beforeSend(xhr) {
19642 $formEl.trigger('formajax
:beforesend
', { data: data, xhr: xhr });
19643 app.emit('formAjaxBeforeSend
', $formEl[0], data, xhr);
19645 error: function error(xhr) {
19646 $formEl.trigger('formajax
:error
', { data: data, xhr: xhr });
19647 app.emit('formAjaxError
', $formEl[0], data, xhr);
19649 complete: function complete(xhr) {
19650 $formEl.trigger('formajax
:complete
', { data: data, xhr: xhr });
19651 app.emit('formAjaxComplete
', $formEl[0], data, xhr);
19653 success: function success(response, status, xhr) {
19654 $formEl.trigger('formajax
:success
', { data: data, xhr: xhr });
19655 app.emit('formAjaxSuccess
', $formEl[0], data, xhr);
19659 $(doc).on('submit change
', 'form
.form
-ajax
-submit
, form
.form
-ajax
-submit
-onchange
', onSubmitChange);
19664 create: function create() {
19666 Utils.extend(app, {
19669 storeFormData: FormData$1.store.bind(app),
19670 getFormData: FormData$1.get.bind(app),
19671 removeFormData: FormData$1.remove.bind(app),
19672 convertToData: formToData.bind(app),
19673 fillFromData: formFromData.bind(app),
19675 init: FormStorage.init.bind(app),
19676 destroy: FormStorage.destroy.bind(app),
19682 init: function init() {
19684 initAjaxForm.call(app);
19686 tabBeforeRemove: function tabBeforeRemove(tabEl) {
19688 $(tabEl).find('.form
-store
-data
').each(function (index, formEl) {
19689 app.form.storage.destroy(formEl);
19692 tabMounted: function tabMounted(tabEl) {
19694 $(tabEl).find('.form
-store
-data
').each(function (index, formEl) {
19695 app.form.storage.init(formEl);
19698 pageBeforeRemove: function pageBeforeRemove(page) {
19700 page.$el.find('.form
-store
-data
').each(function (index, formEl) {
19701 app.form.storage.destroy(formEl);
19704 pageInit: function pageInit(page) {
19706 page.$el.find('.form
-store
-data
').each(function (index, formEl) {
19707 app.form.storage.init(formEl);
19714 ignoreTypes: ['checkbox
', 'button
', 'submit
', 'range
', 'radio
', 'image
'],
19715 createTextareaResizableShadow: function createTextareaResizableShadow() {
19716 var $shadowEl = $(doc.createElement('textarea
'));
19717 $shadowEl.addClass('textarea
-resizable
-shadow
');
19722 Input.textareaResizableShadow = $shadowEl;
19724 textareaResizableShadow: undefined,
19725 resizeTextarea: function resizeTextarea(textareaEl) {
19727 var $textareaEl = $(textareaEl);
19728 if (!Input.textareaResizableShadow) {
19729 Input.createTextareaResizableShadow();
19731 var $shadowEl = Input.textareaResizableShadow;
19732 if (!$textareaEl.length) { return; }
19733 if (!$textareaEl.hasClass('resizable
')) { return; }
19734 if (Input.textareaResizableShadow.parents().length === 0) {
19735 app.root.append($shadowEl);
19738 var styles = win.getComputedStyle($textareaEl[0]);
19739 ('padding
-top padding
-bottom padding
-left padding
-right margin
-left margin
-right margin
-top margin
-bottom width font
-size font
-family font
-style font
-weight line
-height font
-variant text
-transform letter
-spacing border box
-sizing display
').split(' ').forEach(function (style) {
19740 var styleValue = styles[style];
19741 if (('font
-size line
-height letter
-spacing width
').split(' ').indexOf(style) >= 0) {
19742 styleValue = styleValue.replace(',', '.');
19744 $shadowEl.css(style, styleValue);
19746 var currentHeight = $textareaEl[0].clientHeight;
19749 var initialHeight = $shadowEl[0].scrollHeight;
19751 $shadowEl.val($textareaEl.val());
19752 $shadowEl.css('height
', 0);
19753 var scrollHeight = $shadowEl[0].scrollHeight;
19755 if (currentHeight !== scrollHeight) {
19756 if (scrollHeight > initialHeight) {
19757 $textareaEl.css('height
', (scrollHeight + "px"));
19758 $textareaEl.trigger('textarea
:resize
', { initialHeight: initialHeight, currentHeight: currentHeight, scrollHeight: scrollHeight });
19759 } else if (scrollHeight < currentHeight) {
19760 $textareaEl.css('height
', '');
19761 $textareaEl.trigger('textarea
:resize
', { initialHeight: initialHeight, currentHeight: currentHeight, scrollHeight: scrollHeight });
19765 validate: function validate(inputEl) {
19766 var $inputEl = $(inputEl);
19767 if (!$inputEl.length) { return; }
19768 var $itemInputEl = $inputEl.parents('.item
-input
');
19769 var $inputWrapEl = $inputEl.parents('.input
');
19770 var validity = $inputEl[0].validity;
19771 var validationMessage = $inputEl.dataset().errorMessage || $inputEl[0].validationMessage || '';
19772 if (!validity) { return; }
19773 if (!validity.valid) {
19774 var $errorEl = $inputEl.nextAll('.item
-input
-error
-message
, .input
-error
-message
');
19775 if (validationMessage) {
19776 if ($errorEl.length === 0) {
19777 $errorEl = $(("<div class=\"" + ($inputWrapEl.length ? 'input
-error
-message
' : 'item
-input
-error
-message
') + "\"></div>"));
19778 $errorEl.insertAfter($inputEl);
19780 $errorEl.text(validationMessage);
19782 if ($errorEl.length > 0) {
19783 $itemInputEl.addClass('item
-input
-with-error
-message
');
19784 $inputWrapEl.addClass('input
-with-error
-message
');
19786 $itemInputEl.addClass('item
-input
-invalid
');
19787 $inputWrapEl.addClass('input
-invalid
');
19788 $inputEl.addClass('input
-invalid
');
19790 $itemInputEl.removeClass('item
-input
-invalid item
-input
-with-error
-message
');
19791 $inputWrapEl.removeClass('input
-invalid input
-with-error
-message
');
19792 $inputEl.removeClass('input
-invalid
');
19795 validateInputs: function validateInputs(el) {
19797 $(el).find('input
, textarea
, select
').each(function (index, inputEl) {
19798 app.input.validate(inputEl);
19801 focus: function focus(inputEl) {
19802 var $inputEl = $(inputEl);
19803 var type = $inputEl.attr('type
');
19804 if (Input.ignoreTypes.indexOf(type) >= 0) { return; }
19805 $inputEl.parents('.item
-input
').addClass('item
-input
-focused
');
19806 $inputEl.parents('.input
').addClass('input
-focused
');
19807 $inputEl.addClass('input
-focused
');
19809 blur: function blur(inputEl) {
19810 var $inputEl = $(inputEl);
19811 $inputEl.parents('.item
-input
').removeClass('item
-input
-focused
');
19812 $inputEl.parents('.input
').removeClass('input
-focused
');
19813 $inputEl.removeClass('input
-focused
');
19815 checkEmptyState: function checkEmptyState(inputEl) {
19816 var $inputEl = $(inputEl);
19817 if (!$inputEl.is('input
, select
, textarea
')) {
19818 $inputEl = $inputEl.find('input
, select
, textarea
').eq(0);
19820 if (!$inputEl.length) { return; }
19822 var value = $inputEl.val();
19823 var $itemInputEl = $inputEl.parents('.item
-input
');
19824 var $inputWrapEl = $inputEl.parents('.input
');
19825 if ((value && (typeof value === 'string
' && value.trim() !== '')) || (Array.isArray(value) && value.length > 0)) {
19826 $itemInputEl.addClass('item
-input
-with-value
');
19827 $inputWrapEl.addClass('input
-with-value
');
19828 $inputEl.addClass('input
-with-value
');
19829 $inputEl.trigger('input
:notempty
');
19831 $itemInputEl.removeClass('item
-input
-with-value
');
19832 $inputWrapEl.removeClass('input
-with-value
');
19833 $inputEl.removeClass('input
-with-value
');
19834 $inputEl.trigger('input
:empty
');
19837 scrollIntoView: function scrollIntoView(inputEl, duration, centered, force) {
19838 if ( duration === void 0 ) duration = 0;
19840 var $inputEl = $(inputEl);
19841 var $scrollableEl = $inputEl.parents('.page
-content
, .panel
').eq(0);
19842 if (!$scrollableEl.length) {
19845 var contentHeight = $scrollableEl[0].offsetHeight;
19846 var contentScrollTop = $scrollableEl[0].scrollTop;
19847 var contentPaddingTop = parseInt($scrollableEl.css('padding
-top
'), 10);
19848 var contentPaddingBottom = parseInt($scrollableEl.css('padding
-bottom
'), 10);
19849 var contentOffsetTop = $scrollableEl.offset().top - contentScrollTop;
19851 var inputOffsetTop = $inputEl.offset().top - contentOffsetTop;
19852 var inputHeight = $inputEl[0].offsetHeight;
19854 var min = (inputOffsetTop + contentScrollTop) - contentPaddingTop;
19855 var max = ((inputOffsetTop + contentScrollTop) - contentHeight) + contentPaddingBottom + inputHeight;
19856 var centeredPosition = min + ((max - min) / 2);
19858 if (contentScrollTop > min) {
19859 $scrollableEl.scrollTop(centered ? centeredPosition : min, duration);
19862 if (contentScrollTop < max) {
19863 $scrollableEl.scrollTop(centered ? centeredPosition : max, duration);
19867 $scrollableEl.scrollTop(centered ? centeredPosition : max, duration);
19871 init: function init() {
19873 Input.createTextareaResizableShadow();
19874 function onFocus() {
19875 var inputEl = this;
19876 if (app.params.input.scrollIntoViewOnFocus) {
19877 if (Device.android) {
19878 $(win).once('resize
', function () {
19879 if (doc && doc.activeElement === inputEl) {
19880 app.input.scrollIntoView(inputEl, app.params.input.scrollIntoViewDuration, app.params.input.scrollIntoViewCentered, app.params.input.scrollIntoViewAlways);
19884 app.input.scrollIntoView(inputEl, app.params.input.scrollIntoViewDuration, app.params.input.scrollIntoViewCentered, app.params.input.scrollIntoViewAlways);
19887 app.input.focus(inputEl);
19889 function onBlur() {
19890 var $inputEl = $(this);
19891 var tag = $inputEl[0].nodeName.toLowerCase();
19892 app.input.blur($inputEl);
19893 if ($inputEl.dataset().validate || $inputEl.attr('validate
') !== null || $inputEl.attr('data
-validate
-on
-blur
') !== null) {
19894 app.input.validate($inputEl);
19897 if (tag === 'textarea
' && $inputEl.hasClass('resizable
')) {
19898 if (Input.textareaResizableShadow) { Input.textareaResizableShadow.remove(); }
19901 function onChange() {
19902 var $inputEl = $(this);
19903 var type = $inputEl.attr('type
');
19904 var tag = $inputEl[0].nodeName.toLowerCase();
19905 if (Input.ignoreTypes.indexOf(type) >= 0) { return; }
19907 // Check Empty State
19908 app.input.checkEmptyState($inputEl);
19910 // Check validation
19911 if ($inputEl.attr('data
-validate
-on
-blur
') === null && ($inputEl.dataset().validate || $inputEl.attr('validate
') !== null)) {
19912 app.input.validate($inputEl);
19916 if (tag === 'textarea
' && $inputEl.hasClass('resizable
')) {
19917 app.input.resizeTextarea($inputEl);
19920 function onInvalid(e) {
19921 var $inputEl = $(this);
19922 if ($inputEl.attr('data
-validate
-on
-blur
') === null && ($inputEl.dataset().validate || $inputEl.attr('validate
') !== null)) {
19923 e.preventDefault();
19924 app.input.validate($inputEl);
19927 function clearInput() {
19928 var $clicked = $(this);
19929 var $inputEl = $clicked.siblings('input
, textarea
').eq(0);
19930 var previousValue = $inputEl.val();
19933 .trigger('input change
')
19935 .trigger('input
:clear
', previousValue);
19937 $(doc).on('click
', '.input
-clear
-button
', clearInput);
19938 $(doc).on('change input
', 'input
, textarea
, select
', onChange, true);
19939 $(doc).on('focus
', 'input
, textarea
, select
', onFocus, true);
19940 $(doc).on('blur
', 'input
, textarea
, select
', onBlur, true);
19941 $(doc).on('invalid
', 'input
, textarea
, select
', onInvalid, true);
19949 scrollIntoViewOnFocus: Device.android,
19950 scrollIntoViewCentered: false,
19951 scrollIntoViewDuration: 0,
19952 scrollIntoViewAlways: false,
19955 create: function create() {
19957 Utils.extend(app, {
19959 scrollIntoView: Input.scrollIntoView.bind(app),
19960 focus: Input.focus.bind(app),
19961 blur: Input.blur.bind(app),
19962 validate: Input.validate.bind(app),
19963 validateInputs: Input.validateInputs.bind(app),
19964 checkEmptyState: Input.checkEmptyState.bind(app),
19965 resizeTextarea: Input.resizeTextarea.bind(app),
19966 init: Input.init.bind(app),
19971 init: function init() {
19975 tabMounted: function tabMounted(tabEl) {
19977 var $tabEl = $(tabEl);
19978 $tabEl.find('.item
-input
, .input
').each(function (itemInputIndex, itemInputEl) {
19979 var $itemInputEl = $(itemInputEl);
19980 $itemInputEl.find('input
, select
, textarea
').each(function (inputIndex, inputEl) {
19981 var $inputEl = $(inputEl);
19982 if (Input.ignoreTypes.indexOf($inputEl.attr('type
')) >= 0) { return; }
19983 app.input.checkEmptyState($inputEl);
19986 $tabEl.find('textarea
.resizable
').each(function (textareaIndex, textareaEl) {
19987 app.input.resizeTextarea(textareaEl);
19990 pageInit: function pageInit(page) {
19992 var $pageEl = page.$el;
19993 $pageEl.find('.item
-input
, .input
').each(function (itemInputIndex, itemInputEl) {
19994 var $itemInputEl = $(itemInputEl);
19995 $itemInputEl.find('input
, select
, textarea
').each(function (inputIndex, inputEl) {
19996 var $inputEl = $(inputEl);
19997 if (Input.ignoreTypes.indexOf($inputEl.attr('type
')) >= 0) { return; }
19998 app.input.checkEmptyState($inputEl);
20001 $pageEl.find('textarea
.resizable
').each(function (textareaIndex, textareaEl) {
20002 app.input.resizeTextarea(textareaEl);
20016 var Toggle = /*@__PURE__*/(function (Framework7Class) {
20017 function Toggle(app, params) {
20018 if ( params === void 0 ) params = {};
20020 Framework7Class.call(this, params, [app]);
20025 // Extend defaults with modules params
20026 toggle.useModulesParams(defaults);
20028 toggle.params = Utils.extend(defaults, params);
20030 var el = toggle.params.el;
20031 if (!el) { return toggle; }
20034 if ($el.length === 0) { return toggle; }
20036 if ($el[0].f7Toggle) { return $el[0].f7Toggle; }
20038 var $inputEl = $el.children('input
[type
="checkbox"]');
20040 Utils.extend(toggle, {
20044 $inputEl: $inputEl,
20045 inputEl: $inputEl[0],
20046 disabled: $el.hasClass('disabled
') || $inputEl.hasClass('disabled
') || $inputEl.attr('disabled
') || $inputEl[0].disabled,
20049 Object.defineProperty(toggle, 'checked
', {
20051 configurable: true,
20052 set: function set(checked) {
20053 if (!toggle || typeof toggle.$inputEl === 'undefined') { return; }
20054 if (toggle.checked === checked) { return; }
20055 $inputEl[0].checked = checked;
20056 toggle.$inputEl.trigger('change
');
20058 get: function get() {
20059 return $inputEl[0].checked;
20063 $el[0].f7Toggle = toggle;
20066 var touchesStart = {};
20070 var touchStartTime;
20071 var touchStartChecked;
20072 function handleTouchStart(e) {
20073 if (isTouched || toggle.disabled) { return; }
20074 touchesStart.x = e.type === 'touchstart
' ? e.targetTouches[0].pageX : e.pageX;
20075 touchesStart.y = e.type === 'touchstart
' ? e.targetTouches[0].pageY : e.pageY;
20079 isScrolling = undefined;
20080 touchStartTime = Utils.now();
20081 touchStartChecked = toggle.checked;
20083 toggleWidth = $el[0].offsetWidth;
20084 Utils.nextTick(function () {
20086 $el.addClass('toggle
-active
-state
');
20090 function handleTouchMove(e) {
20091 if (!isTouched || toggle.disabled) { return; }
20092 var pageX = e.type === 'touchmove
' ? e.targetTouches[0].pageX : e.pageX;
20093 var pageY = e.type === 'touchmove
' ? e.targetTouches[0].pageY : e.pageY;
20094 var inverter = app.rtl ? -1 : 1;
20096 if (typeof isScrolling === 'undefined') {
20097 isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x));
20103 e.preventDefault();
20105 touchesDiff = pageX - touchesStart.x;
20109 if (touchesDiff * inverter < 0 && Math.abs(touchesDiff) > toggleWidth / 3 && touchStartChecked) {
20112 if (touchesDiff * inverter > 0 && Math.abs(touchesDiff) > toggleWidth / 3 && !touchStartChecked) {
20116 touchesStart.x = pageX;
20117 toggle.checked = !touchStartChecked;
20118 touchStartChecked = !touchStartChecked;
20121 function handleTouchEnd() {
20122 if (!isTouched || toggle.disabled) {
20123 if (isScrolling) { $el.removeClass('toggle
-active
-state
'); }
20127 var inverter = app.rtl ? -1 : 1;
20130 $el.removeClass('toggle
-active
-state
');
20133 if ((Utils.now() - touchStartTime) < 300) {
20134 if (touchesDiff * inverter < 0 && touchStartChecked) {
20137 if (touchesDiff * inverter > 0 && !touchStartChecked) {
20141 toggle.checked = !touchStartChecked;
20145 function handleInputChange() {
20146 toggle.$el.trigger('toggle
:change
', toggle);
20147 toggle.emit('local
::change toggleChange
', toggle);
20149 toggle.attachEvents = function attachEvents() {
20150 if ( Support.touch) {
20151 var passive = Support.passiveListener ? { passive: true } : false;
20152 $el.on(app.touchEvents.start, handleTouchStart, passive);
20153 app.on('touchmove
', handleTouchMove);
20154 app.on('touchend
:passive
', handleTouchEnd);
20156 toggle.$inputEl.on('change
', handleInputChange);
20158 toggle.detachEvents = function detachEvents() {
20159 if ( Support.touch) {
20160 var passive = Support.passiveListener ? { passive: true } : false;
20161 $el.off(app.touchEvents.start, handleTouchStart, passive);
20162 app.off('touchmove
', handleTouchMove);
20163 app.off('touchend
:passive
', handleTouchEnd);
20165 toggle.$inputEl.off('change
', handleInputChange);
20169 toggle.useModules();
20175 if ( Framework7Class ) Toggle.__proto__ = Framework7Class;
20176 Toggle.prototype = Object.create( Framework7Class && Framework7Class.prototype );
20177 Toggle.prototype.constructor = Toggle;
20179 Toggle.prototype.toggle = function toggle () {
20181 toggle.checked = !toggle.checked;
20184 Toggle.prototype.init = function init () {
20186 toggle.attachEvents();
20189 Toggle.prototype.destroy = function destroy () {
20191 toggle.$el.trigger('toggle
:beforedestroy
', toggle);
20192 toggle.emit('local
::beforeDestroy toggleBeforeDestroy
', toggle);
20193 delete toggle.$el[0].f7Toggle;
20194 toggle.detachEvents();
20195 Utils.deleteProps(toggle);
20200 }(Framework7Class));
20204 create: function create() {
20206 app.toggle = ConstructorMethods({
20207 defaultSelector: '.toggle
',
20208 constructor: Toggle,
20210 domProp: 'f7Toggle
',
20217 tabMounted: function tabMounted(tabEl) {
20219 $(tabEl).find('.toggle
-init
').each(function (index, toggleEl) { return app.toggle.create({ el: toggleEl }); });
20221 tabBeforeRemove: function tabBeforeRemove(tabEl) {
20222 $(tabEl).find('.toggle
-init
').each(function (index, toggleEl) {
20223 if (toggleEl.f7Toggle) { toggleEl.f7Toggle.destroy(); }
20226 pageInit: function pageInit(page) {
20228 page.$el.find('.toggle
-init
').each(function (index, toggleEl) { return app.toggle.create({ el: toggleEl }); });
20230 pageBeforeRemove: function pageBeforeRemove(page) {
20231 page.$el.find('.toggle
-init
').each(function (index, toggleEl) {
20232 if (toggleEl.f7Toggle) { toggleEl.f7Toggle.destroy(); }
20238 insert: function insert(vnode) {
20240 var toggleEl = vnode.elm;
20241 app.toggle.create({ el: toggleEl });
20243 destroy: function destroy(vnode) {
20244 var toggleEl = vnode.elm;
20245 if (toggleEl.f7Toggle) { toggleEl.f7Toggle.destroy(); }
20251 var Range = /*@__PURE__*/(function (Framework7Class) {
20252 function Range(app, params) {
20253 Framework7Class.call(this, params, [app]);
20266 draggableBar: true,
20268 verticalReversed: false,
20273 formatScaleLabel: null,
20274 limitKnobPosition: app.theme === 'ios
',
20277 // Extend defaults with modules params
20278 range.useModulesParams(defaults);
20280 range.params = Utils.extend(defaults, params);
20282 var el = range.params.el;
20283 if (!el) { return range; }
20286 if ($el.length === 0) { return range; }
20288 if ($el[0].f7Range) { return $el[0].f7Range; }
20290 var dataset = $el.dataset();
20292 ('step min max value scaleSteps scaleSubSteps
').split(' ').forEach(function (paramName) {
20293 if (typeof params[paramName] === 'undefined' && typeof dataset[paramName] !== 'undefined') {
20294 range.params[paramName] = parseFloat(dataset[paramName]);
20297 ('dual label vertical verticalReversed scale
').split(' ').forEach(function (paramName) {
20298 if (typeof params[paramName] === 'undefined' && typeof dataset[paramName] !== 'undefined') {
20299 range.params[paramName] = dataset[paramName];
20303 if (!range.params.value) {
20304 if (typeof dataset.value !== 'undefined') { range.params.value = dataset.value; }
20305 if (typeof dataset.valueLeft !== 'undefined' && typeof dataset.valueRight !== 'undefined') {
20306 range.params.value = [parseFloat(dataset.valueLeft), parseFloat(dataset.valueRight)];
20311 if (!range.params.dual) {
20312 if (range.params.inputEl) {
20313 $inputEl = $(range.params.inputEl);
20314 } else if ($el.find('input
[type
="range"]').length) {
20315 $inputEl = $el.find('input
[type
="range"]').eq(0);
20319 var ref = range.params;
20320 var dual = ref.dual;
20321 var step = ref.step;
20322 var label = ref.label;
20325 var value = ref.value;
20326 var vertical = ref.vertical;
20327 var verticalReversed = ref.verticalReversed;
20328 var scale = ref.scale;
20329 var scaleSteps = ref.scaleSteps;
20330 var scaleSubSteps = ref.scaleSubSteps;
20331 var limitKnobPosition = ref.limitKnobPosition;
20333 Utils.extend(range, {
20337 $inputEl: $inputEl,
20338 inputEl: $inputEl ? $inputEl[0] : undefined,
20345 previousValue: value,
20346 vertical: vertical,
20347 verticalReversed: verticalReversed,
20349 scaleSteps: scaleSteps,
20350 scaleSubSteps: scaleSubSteps,
20351 limitKnobPosition: limitKnobPosition,
20355 ('step min max
').split(' ').forEach(function (paramName) {
20356 if (!params[paramName] && $inputEl.attr(paramName)) {
20357 range.params[paramName] = parseFloat($inputEl.attr(paramName));
20358 range[paramName] = parseFloat($inputEl.attr(paramName));
20361 if (typeof $inputEl.val() !== 'undefined') {
20362 range.params.value = parseFloat($inputEl.val());
20363 range.value = parseFloat($inputEl.val());
20369 $el.addClass('range
-slider
-dual
');
20372 $el.addClass('range
-slider
-label
');
20376 if (range.vertical) {
20377 $el.addClass('range
-slider
-vertical
');
20378 if (range.verticalReversed) {
20379 $el.addClass('range
-slider
-vertical
-reversed
');
20382 $el.addClass('range
-slider
-horizontal
');
20385 // Check for layout
20386 var $barEl = $('<div
class="range-bar"></div
>');
20387 var $barActiveEl = $('<div
class="range-bar-active"></div
>');
20388 $barEl.append($barActiveEl);
20391 var knobHTML = "\n <div class=\"range-knob-wrap\">\n <div class=\"range-knob\"></div>\n " + (range.label ? '<div
class="range-knob-label"></div
>' : '') + "\n </div>\n ";
20392 var knobs = [$(knobHTML)];
20395 knobs.push($(knobHTML));
20398 $el.append($barEl);
20399 knobs.forEach(function ($knobEl) {
20400 $el.append($knobEl);
20406 labels.push(knobs[0].find('.range
-knob
-label
'));
20408 labels.push(knobs[1].find('.range
-knob
-label
'));
20414 if (range.scale && range.scaleSteps > 1) {
20415 $scaleEl = $(("\n <div class=\"range-scale\">\n " + (range.renderScale()) + "\n </div>\n "));
20416 $el.append($scaleEl);
20419 Utils.extend(range, {
20423 $barActiveEl: $barActiveEl,
20424 $scaleEl: $scaleEl,
20427 $el[0].f7Range = range;
20431 var touchesStart = {};
20434 var rangeOffsetLeft;
20435 var rangeOffsetTop;
20436 var $touchedKnobEl;
20437 var dualValueIndex;
20438 var valueChangedByTouch;
20439 var targetTouchIdentifier;
20440 function onTouchChange() {
20441 valueChangedByTouch = true;
20443 function handleTouchStart(e) {
20444 if (isTouched) { return; }
20445 if (!range.params.draggableBar) {
20446 if ($(e.target).closest('.range
-knob
').length === 0) {
20450 valueChangedByTouch = false;
20451 touchesStart.x = e.type === 'touchstart
' ? e.targetTouches[0].pageX : e.pageX;
20452 touchesStart.y = e.type === 'touchstart
' ? e.targetTouches[0].pageY : e.pageY;
20453 if (e.type === 'touchstart
') {
20454 targetTouchIdentifier = e.targetTouches[0].identifier;
20458 isScrolling = undefined;
20459 rangeOffset = $el.offset();
20460 rangeOffsetLeft = rangeOffset.left;
20461 rangeOffsetTop = rangeOffset.top;
20464 if (range.vertical) {
20465 progress = (touchesStart.y - rangeOffsetTop) / range.rangeHeight;
20466 if (!range.verticalReversed) { progress = 1 - progress; }
20467 } else if (range.app.rtl) {
20468 progress = ((rangeOffsetLeft + range.rangeWidth) - touchesStart.x) / range.rangeWidth;
20470 progress = (touchesStart.x - rangeOffsetLeft) / range.rangeWidth;
20473 var newValue = (progress * (range.max - range.min)) + range.min;
20475 if (Math.abs(range.value[0] - newValue) < Math.abs(range.value[1] - newValue)) {
20476 dualValueIndex = 0;
20477 $touchedKnobEl = range.knobs[0];
20478 newValue = [newValue, range.value[1]];
20480 dualValueIndex = 1;
20481 $touchedKnobEl = range.knobs[1];
20482 newValue = [range.value[0], newValue];
20485 $touchedKnobEl = range.knobs[0];
20486 newValue = (progress * (range.max - range.min)) + range.min;
20488 Utils.nextTick(function () {
20489 if (isTouched) { $touchedKnobEl.addClass('range
-knob
-active
-state
'); }
20491 range.on('change
', onTouchChange);
20492 range.setValue(newValue, true);
20494 function handleTouchMove(e) {
20495 if (!isTouched) { return; }
20498 if (e.type === 'touchmove
') {
20499 for (var i = 0; i < e.targetTouches.length; i += 1) {
20500 if (e.targetTouches[i].identifier === targetTouchIdentifier) {
20501 pageX = e.targetTouches[i].pageX;
20502 pageY = e.targetTouches[i].pageY;
20509 if (typeof pageX === 'undefined' && typeof pageY === 'undefined') { return; }
20511 if (typeof isScrolling === 'undefined' && !range.vertical) {
20512 isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x));
20518 e.preventDefault();
20521 if (range.vertical) {
20522 progress = (pageY - rangeOffsetTop) / range.rangeHeight;
20523 if (!range.verticalReversed) { progress = 1 - progress; }
20524 } else if (range.app.rtl) {
20525 progress = ((rangeOffsetLeft + range.rangeWidth) - pageX) / range.rangeWidth;
20527 progress = (pageX - rangeOffsetLeft) / range.rangeWidth;
20530 var newValue = (progress * (range.max - range.min)) + range.min;
20534 if (dualValueIndex === 0) {
20535 leftValue = newValue;
20536 rightValue = range.value[1];
20537 if (leftValue > rightValue) {
20538 rightValue = leftValue;
20541 leftValue = range.value[0];
20542 rightValue = newValue;
20543 if (rightValue < leftValue) {
20544 leftValue = rightValue;
20547 newValue = [leftValue, rightValue];
20549 range.setValue(newValue, true);
20551 function handleTouchEnd(e) {
20552 if (e.type === 'touchend
') {
20554 for (var i = 0; i < e.changedTouches.length; i += 1) {
20555 if (e.changedTouches[i].identifier === targetTouchIdentifier) { touchEnded = true; }
20557 if (!touchEnded) { return; }
20560 if (isScrolling) { $touchedKnobEl.removeClass('range
-knob
-active
-state
'); }
20564 range.off('change
', onTouchChange);
20566 $touchedKnobEl.removeClass('range
-knob
-active
-state
');
20567 if (valueChangedByTouch && range.$inputEl && !range.dual) {
20568 range.$inputEl.trigger('change
');
20570 valueChangedByTouch = false;
20571 if (typeof range.previousValue !== 'undefined') {
20576 range.previousValue[0] !== range.value[0]
20577 || range.previousValue[1] !== range.value[1]
20582 && range.previousValue !== range.value
20585 range.$el.trigger('range
:changed
', range, range.value);
20586 range.emit('local
::changed rangeChanged
', range, range.value);
20591 function handleResize() {
20598 range.attachEvents = function attachEvents() {
20599 var passive = Support.passiveListener ? { passive: true } : false;
20600 range.$el.on(app.touchEvents.start, handleTouchStart, passive);
20601 app.on('touchmove
', handleTouchMove);
20602 app.on('touchend
:passive
', handleTouchEnd);
20603 app.on('tabShow
', handleResize);
20604 app.on('resize
', handleResize);
20605 parentModals = range.$el.parents('.sheet
-modal
, .actions
-modal
, .popup
, .popover
, .login
-screen
, .dialog
, .toast
');
20606 parentModals.on('modal
:open
', handleResize);
20607 parentPanel = range.$el.parents('.panel
');
20608 parentPanel.on('panel
:open
', handleResize);
20609 parentPage = range.$el.parents('.page
').eq(0);
20610 parentPage.on('page
:reinit
', handleResize);
20612 range.detachEvents = function detachEvents() {
20613 var passive = Support.passiveListener ? { passive: true } : false;
20614 range.$el.off(app.touchEvents.start, handleTouchStart, passive);
20615 app.off('touchmove
', handleTouchMove);
20616 app.off('touchend
:passive
', handleTouchEnd);
20617 app.off('tabShow
', handleResize);
20618 app.off('resize
', handleResize);
20619 if (parentModals) {
20620 parentModals.off('modal
:open
', handleResize);
20623 parentPanel.off('panel
:open
', handleResize);
20626 parentPage.off('page
:reinit
', handleResize);
20628 parentModals = null;
20629 parentPanel = null;
20634 range.useModules();
20642 if ( Framework7Class ) Range.__proto__ = Framework7Class;
20643 Range.prototype = Object.create( Framework7Class && Framework7Class.prototype );
20644 Range.prototype.constructor = Range;
20646 Range.prototype.calcSize = function calcSize () {
20648 if (range.vertical) {
20649 var height = range.$el.outerHeight();
20650 if (height === 0) { return; }
20651 range.rangeHeight = height;
20652 range.knobHeight = range.knobs[0].outerHeight();
20654 var width = range.$el.outerWidth();
20655 if (width === 0) { return; }
20656 range.rangeWidth = width;
20657 range.knobWidth = range.knobs[0].outerWidth();
20661 Range.prototype.layout = function layout () {
20665 var app = range.app;
20666 var knobWidth = range.knobWidth;
20667 var knobHeight = range.knobHeight;
20668 var rangeWidth = range.rangeWidth;
20669 var rangeHeight = range.rangeHeight;
20670 var min = range.min;
20671 var max = range.max;
20672 var knobs = range.knobs;
20673 var $barActiveEl = range.$barActiveEl;
20674 var value = range.value;
20675 var label = range.label;
20676 var labels = range.labels;
20677 var vertical = range.vertical;
20678 var verticalReversed = range.verticalReversed;
20679 var limitKnobPosition = range.limitKnobPosition;
20680 var knobSize = vertical ? knobHeight : knobWidth;
20681 var rangeSize = vertical ? rangeHeight : rangeWidth;
20682 // eslint-disable-next-line
20683 var positionProperty = vertical
20684 ? (verticalReversed ? 'top
' : 'bottom
')
20685 : (app.rtl ? 'right
' : 'left
');
20687 var progress = [((value[0] - min) / (max - min)), ((value[1] - min) / (max - min))];
20688 $barActiveEl.css(( obj = {}, obj[positionProperty] = ((progress[0] * 100) + "%"), obj[vertical ? 'height
' : 'width
'] = (((progress[1] - progress[0]) * 100) + "%"), obj ));
20689 knobs.forEach(function ($knobEl, knobIndex) {
20690 var startPos = rangeSize * progress[knobIndex];
20691 if (limitKnobPosition) {
20692 var realStartPos = (rangeSize * progress[knobIndex]) - (knobSize / 2);
20693 if (realStartPos < 0) { startPos = knobSize / 2; }
20694 if ((realStartPos + knobSize) > rangeSize) { startPos = rangeSize - (knobSize / 2); }
20696 $knobEl.css(positionProperty, (startPos + "px"));
20697 if (label) { labels[knobIndex].text(range.formatLabel(value[knobIndex], labels[knobIndex][0])); }
20700 var progress$1 = ((value - min) / (max - min));
20701 $barActiveEl.css(vertical ? 'height
' : 'width
', ((progress$1 * 100) + "%"));
20703 var startPos = rangeSize * progress$1;
20704 if (limitKnobPosition) {
20705 var realStartPos = (rangeSize * progress$1) - (knobSize / 2);
20706 if (realStartPos < 0) { startPos = knobSize / 2; }
20707 if ((realStartPos + knobSize) > rangeSize) { startPos = rangeSize - (knobSize / 2); }
20709 knobs[0].css(positionProperty, (startPos + "px"));
20710 if (label) { labels[0].text(range.formatLabel(value, labels[0][0])); }
20712 if ((range.dual && value.indexOf(min) >= 0) || (!range.dual && value === min)) {
20713 range.$el.addClass('range
-slider
-min
');
20715 range.$el.removeClass('range
-slider
-min
');
20717 if ((range.dual && value.indexOf(max) >= 0) || (!range.dual && value === max)) {
20718 range.$el.addClass('range
-slider
-max
');
20720 range.$el.removeClass('range
-slider
-max
');
20724 Range.prototype.setValue = function setValue (newValue, byTouchMove) {
20726 var step = range.step;
20727 var min = range.min;
20728 var max = range.max;
20732 oldValue = [range.value[0], range.value[1]];
20733 var newValues = newValue;
20734 if (!Array.isArray(newValues)) { newValues = [newValue, newValue]; }
20735 if (newValue[0] > newValue[1]) {
20736 newValues = [newValues[0], newValues[0]];
20738 newValues = newValues.map(function (value) { return Math.max(Math.min(Math.round(value / step) * step, max), min); });
20739 if (newValues[0] === range.value[0] && newValues[1] === range.value[1]) {
20742 newValues.forEach(function (value, valueIndex) {
20743 range.value[valueIndex] = value;
20745 valueChanged = oldValue[0] !== newValues[0] || oldValue[1] !== newValues[1];
20748 oldValue = range.value;
20749 var value = Math.max(Math.min(Math.round(newValue / step) * step, max), min);
20750 range.value = value;
20752 valueChanged = oldValue !== value;
20755 if (valueChanged) {
20756 range.previousValue = oldValue;
20759 if (!valueChanged) { return range; }
20760 range.$el.trigger('range
:change
', range, range.value);
20761 if (range.$inputEl && !range.dual) {
20762 range.$inputEl.val(range.value);
20763 if (!byTouchMove) {
20764 range.$inputEl.trigger('input change
');
20766 range.$inputEl.trigger('input
');
20769 if (!byTouchMove) {
20770 range.$el.trigger('range
:changed
', range, range.value);
20771 range.emit('local
::changed rangeChanged
', range, range.value);
20773 range.emit('local
::change rangeChange
', range, range.value);
20777 Range.prototype.getValue = function getValue () {
20781 Range.prototype.formatLabel = function formatLabel (value, labelEl) {
20783 if (range.params.formatLabel) { return range.params.formatLabel.call(range, value, labelEl); }
20787 Range.prototype.formatScaleLabel = function formatScaleLabel (value) {
20789 if (range.params.formatScaleLabel) { return range.params.formatScaleLabel.call(range, value); }
20793 Range.prototype.renderScale = function renderScale () {
20795 var app = range.app;
20796 var verticalReversed = range.verticalReversed;
20797 var vertical = range.vertical;
20799 // eslint-disable-next-line
20800 var positionProperty = vertical
20801 ? (verticalReversed ? 'top
' : 'bottom
')
20802 : (app.rtl ? 'right
' : 'left
');
20807 .from({ length: range.scaleSteps + 1 })
20808 .forEach(function (scaleEl, index) {
20809 var scaleStepValue = (range.max - range.min) / range.scaleSteps;
20810 var scaleValue = range.min + scaleStepValue * index;
20811 var progress = ((scaleValue - range.min) / (range.max - range.min));
20812 html += "<div class=\"range-scale-step\" style=\"" + positionProperty + ": " + (progress * 100) + "%\">" + (range.formatScaleLabel(scaleValue)) + "</div>";
20814 if (range.scaleSubSteps && range.scaleSubSteps > 1 && index < range.scaleSteps) {
20816 .from({ length: range.scaleSubSteps - 1 })
20817 .forEach(function (subStepEl, subIndex) {
20818 var subStep = scaleStepValue / range.scaleSubSteps;
20819 var scaleSubValue = scaleValue + subStep * (subIndex + 1);
20820 var subProgress = ((scaleSubValue - range.min) / (range.max - range.min));
20821 html += "<div class=\"range-scale-step range-scale-substep\" style=\"" + positionProperty + ": " + (subProgress * 100) + "%\"></div>";
20829 Range.prototype.updateScale = function updateScale () {
20831 if (!range.scale || range.scaleSteps < 2) {
20832 if (range.$scaleEl) { range.$scaleEl.remove(); }
20833 delete range.$scaleEl;
20836 if (!range.$scaleEl) {
20837 range.$scaleEl = $('<div
class="range-scale"></div
>');
20838 range.$el.append(range.$scaleEl);
20841 range.$scaleEl.html(range.renderScale());
20844 Range.prototype.init = function init () {
20848 range.attachEvents();
20852 Range.prototype.destroy = function destroy () {
20854 range.$el.trigger('range
:beforedestroy
', range);
20855 range.emit('local
::beforeDestroy rangeBeforeDestroy
', range);
20856 delete range.$el[0].f7Range;
20857 range.detachEvents();
20858 Utils.deleteProps(range);
20863 }(Framework7Class));
20867 create: function create() {
20869 app.range = Utils.extend(
20870 ConstructorMethods({
20871 defaultSelector: '.range
-slider
',
20872 constructor: Range,
20874 domProp: 'f7Range
',
20877 getValue: function getValue(el) {
20878 if ( el === void 0 ) el = '.range
-slider
';
20880 var range = app.range.get(el);
20881 if (range) { return range.getValue(); }
20884 setValue: function setValue(el, value) {
20885 if ( el === void 0 ) el = '.range
-slider
';
20887 var range = app.range.get(el);
20888 if (range) { return range.setValue(value); }
20898 tabMounted: function tabMounted(tabEl) {
20900 $(tabEl).find('.range
-slider
-init
').each(function (index, rangeEl) { return new Range(app, {
20904 tabBeforeRemove: function tabBeforeRemove(tabEl) {
20905 $(tabEl).find('.range
-slider
-init
').each(function (index, rangeEl) {
20906 if (rangeEl.f7Range) { rangeEl.f7Range.destroy(); }
20909 pageInit: function pageInit(page) {
20911 page.$el.find('.range
-slider
-init
').each(function (index, rangeEl) { return new Range(app, {
20915 pageBeforeRemove: function pageBeforeRemove(page) {
20916 page.$el.find('.range
-slider
-init
').each(function (index, rangeEl) {
20917 if (rangeEl.f7Range) { rangeEl.f7Range.destroy(); }
20922 'range
-slider
-init
': {
20923 insert: function insert(vnode) {
20924 var rangeEl = vnode.elm;
20926 app.range.create({ el: rangeEl });
20928 destroy: function destroy(vnode) {
20929 var rangeEl = vnode.elm;
20930 if (rangeEl.f7Range) { rangeEl.f7Range.destroy(); }
20936 var Stepper = /*@__PURE__*/(function (Framework7Class) {
20937 function Stepper(app, params) {
20938 Framework7Class.call(this, params, [app]);
20939 var stepper = this;
20952 autorepeatDynamic: false,
20954 manualInputMode: false,
20956 buttonsEndInputMode: true,
20959 // Extend defaults with modules params
20960 stepper.useModulesParams(defaults);
20962 stepper.params = Utils.extend(defaults, params);
20963 if (stepper.params.value < stepper.params.min) {
20964 stepper.params.value = stepper.params.min;
20966 if (stepper.params.value > stepper.params.max) {
20967 stepper.params.value = stepper.params.max;
20970 var el = stepper.params.el;
20971 if (!el) { return stepper; }
20974 if ($el.length === 0) { return stepper; }
20976 if ($el[0].f7Stepper) { return $el[0].f7Stepper; }
20979 if (stepper.params.inputEl) {
20980 $inputEl = $(stepper.params.inputEl);
20981 } else if ($el.find('.stepper
-input
-wrap
').find('input
, textarea
').length) {
20982 $inputEl = $el.find('.stepper
-input
-wrap
').find('input
, textarea
').eq(0);
20985 if ($inputEl && $inputEl.length) {
20986 ('step min max
').split(' ').forEach(function (paramName) {
20987 if (!params[paramName] && $inputEl.attr(paramName)) {
20988 stepper.params[paramName] = parseFloat($inputEl.attr(paramName));
20992 var decimalPoint$1 = parseInt(stepper.params.decimalPoint, 10);
20993 if (Number.isNaN(decimalPoint$1)) {
20994 stepper.params.decimalPoint = 0;
20996 stepper.params.decimalPoint = decimalPoint$1;
20999 var inputValue = parseFloat($inputEl.val());
21000 if (typeof params.value === 'undefined' && !Number.isNaN(inputValue) && (inputValue || inputValue === 0)) {
21001 stepper.params.value = inputValue;
21006 if (stepper.params.valueEl) {
21007 $valueEl = $(stepper.params.valueEl);
21008 } else if ($el.find('.stepper
-value
').length) {
21009 $valueEl = $el.find('.stepper
-value
').eq(0);
21012 var $buttonPlusEl = $el.find('.stepper
-button
-plus
');
21013 var $buttonMinusEl = $el.find('.stepper
-button
-minus
');
21015 var ref = stepper.params;
21016 var step = ref.step;
21019 var value = ref.value;
21020 var decimalPoint = ref.decimalPoint;
21022 Utils.extend(stepper, {
21026 $buttonPlusEl: $buttonPlusEl,
21027 buttonPlusEl: $buttonPlusEl[0],
21028 $buttonMinusEl: $buttonMinusEl,
21029 buttonMinusEl: $buttonMinusEl[0],
21030 $inputEl: $inputEl,
21031 inputEl: $inputEl ? $inputEl[0] : undefined,
21032 $valueEl: $valueEl,
21033 valueEl: $valueEl ? $valueEl[0] : undefined,
21038 decimalPoint: decimalPoint,
21039 typeModeChanged: false,
21042 $el[0].f7Stepper = stepper;
21045 var touchesStart = {};
21048 var preventButtonClick;
21051 var autorepeatAction = null;
21052 var autorepeatInAction = false;
21053 var manualInput = false;
21055 function dynamicRepeat(current, progressions, startsIn, progressionStep, repeatEvery, action) {
21056 clearTimeout(timeoutId);
21057 timeoutId = setTimeout(function () {
21058 if (current === 1) {
21059 preventButtonClick = true;
21060 autorepeatInAction = true;
21062 clearInterval(intervalId);
21064 intervalId = setInterval(function () {
21067 if (current < progressions) {
21068 dynamicRepeat(current + 1, progressions, startsIn, progressionStep, repeatEvery / 2, action);
21070 }, current === 1 ? startsIn : progressionStep);
21073 function onTouchStart(e) {
21074 if (isTouched) { return; }
21075 if (manualInput) { return; }
21076 if ($(e.target).closest($buttonPlusEl).length) {
21077 autorepeatAction = 'increment
';
21078 } else if ($(e.target).closest($buttonMinusEl).length) {
21079 autorepeatAction = 'decrement
';
21081 if (!autorepeatAction) { return; }
21083 touchesStart.x = e.type === 'touchstart
' ? e.targetTouches[0].pageX : e.pageX;
21084 touchesStart.y = e.type === 'touchstart
' ? e.targetTouches[0].pageY : e.pageY;
21086 isScrolling = undefined;
21088 var progressions = stepper.params.autorepeatDynamic ? 4 : 1;
21089 dynamicRepeat(1, progressions, 500, 1000, 300, function () {
21090 stepper[autorepeatAction]();
21093 function onTouchMove(e) {
21094 if (!isTouched) { return; }
21095 if (manualInput) { return; }
21096 var pageX = e.type === 'touchmove
' ? e.targetTouches[0].pageX : e.pageX;
21097 var pageY = e.type === 'touchmove
' ? e.targetTouches[0].pageY : e.pageY;
21099 if (typeof isScrolling === 'undefined' && !autorepeatInAction) {
21100 isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x));
21102 var distance = Math.pow( ((Math.pow( (pageX - touchesStart.x), 2 )) + (Math.pow( (pageY - touchesStart.y), 2 ))), 0.5 );
21104 if (isScrolling || distance > 20) {
21106 clearTimeout(timeoutId);
21107 clearInterval(intervalId);
21110 function onTouchEnd() {
21111 clearTimeout(timeoutId);
21112 clearInterval(intervalId);
21113 autorepeatAction = null;
21114 autorepeatInAction = false;
21118 function onMinusClick() {
21120 if (stepper.params.buttonsEndInputMode) {
21121 manualInput = false;
21122 stepper.endTypeMode(true);
21126 if (preventButtonClick) {
21127 preventButtonClick = false;
21130 stepper.decrement(true);
21132 function onPlusClick() {
21134 if (stepper.params.buttonsEndInputMode) {
21135 manualInput = false;
21136 stepper.endTypeMode(true);
21140 if (preventButtonClick) {
21141 preventButtonClick = false;
21144 stepper.increment(true);
21146 function onInputClick(e) {
21147 if (!e.target.readOnly && stepper.params.manualInputMode) {
21148 manualInput = true;
21149 if (typeof e.target.selectionStart === 'number
') {
21150 e.target.selectionStart = e.target.value.length;
21151 e.target.selectionEnd = e.target.value.length;
21155 function onInputKey(e) {
21156 if (e.keyCode === 13 || e.which === 13) {
21157 e.preventDefault();
21158 manualInput = false;
21159 stepper.endTypeMode();
21162 function onInputBlur() {
21163 manualInput = false;
21164 stepper.endTypeMode(true);
21166 function onInput(e) {
21168 stepper.typeValue(e.target.value);
21171 if (e.detail && e.detail.sentByF7Stepper) { return; }
21172 stepper.setValue(e.target.value, true);
21174 stepper.attachEvents = function attachEvents() {
21175 $buttonMinusEl.on('click
', onMinusClick);
21176 $buttonPlusEl.on('click
', onPlusClick);
21177 if (stepper.params.watchInput && $inputEl && $inputEl.length) {
21178 $inputEl.on('input
', onInput);
21179 $inputEl.on('click
', onInputClick);
21180 $inputEl.on('blur
', onInputBlur);
21181 $inputEl.on('keyup
', onInputKey);
21183 if (stepper.params.autorepeat) {
21184 app.on('touchstart
:passive
', onTouchStart);
21185 app.on('touchmove
:active
', onTouchMove);
21186 app.on('touchend
:passive
', onTouchEnd);
21189 stepper.detachEvents = function detachEvents() {
21190 $buttonMinusEl.off('click
', onMinusClick);
21191 $buttonPlusEl.off('click
', onPlusClick);
21192 if (stepper.params.watchInput && $inputEl && $inputEl.length) {
21193 $inputEl.off('input
', onInput);
21194 $inputEl.off('click
', onInputClick);
21195 $inputEl.off('blur
', onInputBlur);
21196 $inputEl.off('keyup
', onInputKey);
21201 stepper.useModules();
21209 if ( Framework7Class ) Stepper.__proto__ = Framework7Class;
21210 Stepper.prototype = Object.create( Framework7Class && Framework7Class.prototype );
21211 Stepper.prototype.constructor = Stepper;
21213 Stepper.prototype.minus = function minus () {
21214 return this.decrement();
21217 Stepper.prototype.plus = function plus () {
21218 return this.increment();
21221 Stepper.prototype.decrement = function decrement () {
21222 var stepper = this;
21223 return stepper.setValue(stepper.value - stepper.step, false, true);
21226 Stepper.prototype.increment = function increment () {
21227 var stepper = this;
21228 return stepper.setValue(stepper.value + stepper.step, false, true);
21231 Stepper.prototype.setValue = function setValue (newValue, forceUpdate, withWraps) {
21232 var stepper = this;
21233 var step = stepper.step;
21234 var min = stepper.min;
21235 var max = stepper.max;
21237 var oldValue = stepper.value;
21239 var value = Math.round(newValue / step) * step;
21240 if (stepper.params.wraps && withWraps) {
21241 if (value > max) { value = min; }
21242 if (value < min) { value = max; }
21244 value = Math.max(Math.min(value, max), min);
21247 if (Number.isNaN(value)) {
21250 stepper.value = value;
21252 var valueChanged = oldValue !== value;
21255 if (!valueChanged && !forceUpdate) { return stepper; }
21257 stepper.$el.trigger('stepper
:change
', stepper, stepper.value);
21258 var formattedValue = stepper.formatValue(stepper.value);
21259 if (stepper.$inputEl && stepper.$inputEl.length) {
21260 stepper.$inputEl.val(formattedValue);
21261 stepper.$inputEl.trigger('input change
', { sentByF7Stepper: true });
21263 if (stepper.$valueEl && stepper.$valueEl.length) {
21264 stepper.$valueEl.html(formattedValue);
21266 stepper.emit('local
::change stepperChange
', stepper, stepper.value);
21270 Stepper.prototype.endTypeMode = function endTypeMode (noBlur) {
21271 var stepper = this;
21272 var min = stepper.min;
21273 var max = stepper.max;
21274 var value = parseFloat(stepper.value);
21276 if (Number.isNaN(value)) { value = 0; }
21278 value = Math.max(Math.min(value, max), min);
21280 stepper.value = value;
21281 if (!stepper.typeModeChanged) {
21282 if (stepper.$inputEl && stepper.$inputEl.length && !noBlur) {
21283 stepper.$inputEl.blur();
21287 stepper.typeModeChanged = false;
21289 stepper.$el.trigger('stepper
:change
', stepper, stepper.value);
21290 var formattedValue = stepper.formatValue(stepper.value);
21291 if (stepper.$inputEl && stepper.$inputEl.length) {
21292 stepper.$inputEl.val(formattedValue);
21293 stepper.$inputEl.trigger('input change
', { sentByF7Stepper: true });
21294 if (!noBlur) { stepper.$inputEl.blur(); }
21296 if (stepper.$valueEl && stepper.$valueEl.length) {
21297 stepper.$valueEl.html(formattedValue);
21299 stepper.emit('local
::change stepperChange
', stepper, stepper.value);
21303 Stepper.prototype.typeValue = function typeValue (value) {
21304 var stepper = this;
21305 stepper.typeModeChanged = true;
21306 var inputTxt = String(value);
21307 if (inputTxt.lastIndexOf('.') + 1 === inputTxt.length || inputTxt.lastIndexOf(',') + 1 === inputTxt.length) {
21308 if (inputTxt.lastIndexOf('.') !== inputTxt.indexOf('.') || inputTxt.lastIndexOf(',') !== inputTxt.indexOf(',')) {
21309 inputTxt = inputTxt.slice(0, -1);
21310 stepper.value = inputTxt;
21311 stepper.$inputEl.val(stepper.value);
21315 var newValue = parseFloat(inputTxt.replace(',', '.'));
21316 if (newValue === 0) {
21317 stepper.value = inputTxt.replace(',', '.');
21318 stepper.$inputEl.val(stepper.value);
21321 if (Number.isNaN(newValue)) {
21323 stepper.$inputEl.val(stepper.value);
21326 var powVal = Math.pow( 10, stepper.params.decimalPoint );
21327 newValue = (Math.round((newValue) * powVal)).toFixed(stepper.params.decimalPoint + 1) / powVal;
21328 stepper.value = parseFloat(String(newValue).replace(',', '.'));
21329 stepper.$inputEl.val(stepper.value);
21332 stepper.value = inputTxt;
21333 stepper.$inputEl.val(inputTxt);
21337 Stepper.prototype.getValue = function getValue () {
21341 Stepper.prototype.formatValue = function formatValue (value) {
21342 var stepper = this;
21343 if (!stepper.params.formatValue) { return value; }
21344 return stepper.params.formatValue.call(stepper, value);
21347 Stepper.prototype.init = function init () {
21348 var stepper = this;
21349 stepper.attachEvents();
21350 if (stepper.$valueEl && stepper.$valueEl.length) {
21351 var formattedValue = stepper.formatValue(stepper.value);
21352 stepper.$valueEl.html(formattedValue);
21357 Stepper.prototype.destroy = function destroy () {
21358 var stepper = this;
21359 stepper.$el.trigger('stepper
:beforedestroy
', stepper);
21360 stepper.emit('local
::beforeDestroy stepperBeforeDestroy
', stepper);
21361 delete stepper.$el[0].f7Stepper;
21362 stepper.detachEvents();
21363 Utils.deleteProps(stepper);
21368 }(Framework7Class));
21372 create: function create() {
21374 app.stepper = Utils.extend(
21375 ConstructorMethods({
21376 defaultSelector: '.stepper
',
21377 constructor: Stepper,
21379 domProp: 'f7Stepper
',
21382 getValue: function getValue(el) {
21383 if ( el === void 0 ) el = '.stepper
';
21385 var stepper = app.stepper.get(el);
21386 if (stepper) { return stepper.getValue(); }
21389 setValue: function setValue(el, value) {
21390 if ( el === void 0 ) el = '.stepper
';
21392 var stepper = app.stepper.get(el);
21393 if (stepper) { return stepper.setValue(value); }
21403 tabMounted: function tabMounted(tabEl) {
21405 $(tabEl).find('.stepper
-init
').each(function (index, stepperEl) {
21406 var dataset = $(stepperEl).dataset();
21407 app.stepper.create(Utils.extend({ el: stepperEl }, dataset || {}));
21410 tabBeforeRemove: function tabBeforeRemove(tabEl) {
21411 $(tabEl).find('.stepper
-init
').each(function (index, stepperEl) {
21412 if (stepperEl.f7Stepper) { stepperEl.f7Stepper.destroy(); }
21415 pageInit: function pageInit(page) {
21417 page.$el.find('.stepper
-init
').each(function (index, stepperEl) {
21418 var dataset = $(stepperEl).dataset();
21419 app.stepper.create(Utils.extend({ el: stepperEl }, dataset || {}));
21422 pageBeforeRemove: function pageBeforeRemove(page) {
21423 page.$el.find('.stepper
-init
').each(function (index, stepperEl) {
21424 if (stepperEl.f7Stepper) { stepperEl.f7Stepper.destroy(); }
21430 insert: function insert(vnode) {
21432 var stepperEl = vnode.elm;
21433 var dataset = $(stepperEl).dataset();
21434 app.stepper.create(Utils.extend({ el: stepperEl }, dataset || {}));
21436 destroy: function destroy(vnode) {
21437 var stepperEl = vnode.elm;
21438 if (stepperEl.f7Stepper) { stepperEl.f7Stepper.destroy(); }
21444 var SmartSelect = /*@__PURE__*/(function (Framework7Class) {
21445 function SmartSelect(app, params) {
21446 if ( params === void 0 ) params = {};
21448 Framework7Class.call(this, params, [app]);
21451 var defaults = Utils.extend({
21453 }, app.params.smartSelect);
21455 if (typeof defaults.searchbarDisableButton === 'undefined') {
21456 defaults.searchbarDisableButton = app.theme !== 'aurora
';
21459 // Extend defaults with modules params
21460 ss.useModulesParams(defaults);
21462 ss.params = Utils.extend({}, defaults, params);
21466 var $el = $(ss.params.el).eq(0);
21467 if ($el.length === 0) { return ss; }
21469 if ($el[0].f7SmartSelect) { return $el[0].f7SmartSelect; }
21471 var $selectEl = $el.find('select
').eq(0);
21472 if ($selectEl.length === 0) { return ss; }
21474 var $valueEl = $(ss.params.valueEl);
21475 if ($valueEl.length === 0) {
21476 $valueEl = $el.find('.item
-after
');
21478 if ($valueEl.length === 0) {
21479 $valueEl = $('<div
class="item-after"></div
>');
21480 $valueEl.insertAfter($el.find('.item
-title
'));
21487 var url = params.url;
21489 if ($el.attr('href
') && $el.attr('href
') !== '#') { url = $el.attr('href
'); }
21490 else if ($selectEl.attr('name
')) { url = ($selectEl.attr('name
').toLowerCase()) + "-select/"; }
21492 if (!url) { url = ss.params.url; }
21494 var multiple = $selectEl[0].multiple;
21495 var inputType = multiple ? 'checkbox
' : 'radio
';
21496 var id = Utils.id();
21501 $selectEl: $selectEl,
21502 selectEl: $selectEl[0],
21503 $valueEl: $valueEl,
21504 valueEl: $valueEl[0],
21506 multiple: multiple,
21507 inputType: inputType,
21510 inputName: (inputType + "-" + id),
21511 selectName: $selectEl.attr('name
'),
21512 maxLength: $selectEl.attr('maxlength
') || params.maxLength,
21515 $el[0].f7SmartSelect = ss;
21518 function onClick() {
21521 function onChange() {
21522 var value = ss.$selectEl.val();
21523 ss.$el.trigger('smartselect
:change
', ss, value);
21524 ss.emit('local
::change smartSelectChange
', ss, value);
21527 ss.attachEvents = function attachEvents() {
21528 $el.on('click
', onClick);
21529 $el.on('change
', 'select
', onChange);
21531 ss.detachEvents = function detachEvents() {
21532 $el.off('click
', onClick);
21533 $el.off('change
', 'select
', onChange);
21536 function handleInputChange() {
21539 var inputEl = this;
21540 var value = inputEl.value;
21541 var optionText = [];
21543 if (inputEl.type === 'checkbox
') {
21544 for (var i = 0; i < ss.selectEl.options.length; i += 1) {
21545 optionEl = ss.selectEl.options[i];
21546 if (optionEl.value === value) {
21547 optionEl.selected = inputEl.checked;
21549 if (optionEl.selected) {
21550 displayAs = optionEl.dataset ? optionEl.dataset.displayAs : $(optionEl).data('display
-value
-as
');
21551 text = displayAs && typeof displayAs !== 'undefined' ? displayAs : optionEl.textContent;
21552 optionText.push(text.trim());
21555 if (ss.maxLength) {
21556 ss.checkMaxLength();
21559 optionEl = ss.$selectEl.find(("option[value=\"" + value + "\"]"))[0];
21560 displayAs = optionEl.dataset ? optionEl.dataset.displayAs : $(optionEl).data('display
-as
');
21561 text = displayAs && typeof displayAs !== 'undefined' ? displayAs : optionEl.textContent;
21562 optionText = [text];
21563 ss.selectEl.value = value;
21566 ss.$selectEl.trigger('change
');
21567 ss.$valueEl.text(optionText.join(', '));
21568 if (ss.params.closeOnSelect && ss.inputType === 'radio
') {
21573 ss.attachInputsEvents = function attachInputsEvents() {
21574 ss.$containerEl.on('change
', 'input
[type
="checkbox"], input
[type
="radio"]', handleInputChange);
21576 ss.detachInputsEvents = function detachInputsEvents() {
21577 ss.$containerEl.off('change
', 'input
[type
="checkbox"], input
[type
="radio"]', handleInputChange);
21589 if ( Framework7Class ) SmartSelect.__proto__ = Framework7Class;
21590 SmartSelect.prototype = Object.create( Framework7Class && Framework7Class.prototype );
21591 SmartSelect.prototype.constructor = SmartSelect;
21593 SmartSelect.prototype.setValue = function setValue (value) {
21595 var newValue = value;
21596 var optionText = [];
21601 if (!Array.isArray(newValue)) { newValue = [newValue]; }
21602 for (var i = 0; i < ss.selectEl.options.length; i += 1) {
21603 optionEl = ss.selectEl.options[i];
21604 if (newValue.indexOf(optionEl.value) >= 0) {
21605 optionEl.selected = true;
21607 optionEl.selected = false;
21609 if (optionEl.selected) {
21610 displayAs = optionEl.dataset ? optionEl.dataset.displayAs : $(optionEl).data('display
-value
-as
');
21611 text = displayAs && typeof displayAs !== 'undefined' ? displayAs : optionEl.textContent;
21612 optionText.push(text.trim());
21616 optionEl = ss.$selectEl.find(("option[value=\"" + newValue + "\"]"))[0];
21618 displayAs = optionEl.dataset ? optionEl.dataset.displayAs : $(optionEl).data('display
-as
');
21619 text = displayAs && typeof displayAs !== 'undefined' ? displayAs : optionEl.textContent;
21620 optionText = [text];
21622 ss.selectEl.value = newValue;
21624 ss.$valueEl.text(optionText.join(', '));
21628 SmartSelect.prototype.getValue = function getValue () {
21630 return ss.$selectEl.val();
21633 SmartSelect.prototype.getView = function getView () {
21635 var view = ss.view || ss.params.view;
21637 view = ss.$el.parents('.view
').length && ss.$el.parents('.view
')[0].f7View;
21640 throw Error('Smart Select requires initialized View
');
21646 SmartSelect.prototype.checkMaxLength = function checkMaxLength () {
21648 var $containerEl = ss.$containerEl;
21649 if (ss.selectEl.selectedOptions.length >= ss.maxLength) {
21650 $containerEl.find('input
[type
="checkbox"]').each(function (index, inputEl) {
21651 if (!inputEl.checked) {
21652 $(inputEl).parents('li
').addClass('disabled
');
21654 $(inputEl).parents('li
').removeClass('disabled
');
21658 $containerEl.find('.disabled
').removeClass('disabled
');
21662 SmartSelect.prototype.setTextValue = function setTextValue (value) {
21664 var valueArray = [];
21665 if (typeof value !== 'undefined') {
21666 if (Array.isArray(value)) {
21667 valueArray = value;
21669 valueArray = [value];
21672 ss.$selectEl.find('option
').each(function (optionIndex, optionEl) {
21673 var $optionEl = $(optionEl);
21674 if (optionEl.selected) {
21675 var displayAs = optionEl.dataset ? optionEl.dataset.displayAs : $optionEl.data('display
-value
-as
');
21676 if (displayAs && typeof displayAs !== 'undefined') {
21677 valueArray.push(displayAs);
21679 valueArray.push(optionEl.textContent.trim());
21684 ss.$valueEl.text(valueArray.join(', '));
21687 SmartSelect.prototype.getItemsData = function getItemsData () {
21690 var previousGroupEl;
21691 ss.$selectEl.find('option
').each(function (index, optionEl) {
21692 var $optionEl = $(optionEl);
21693 var optionData = $optionEl.dataset();
21694 var optionImage = optionData.optionImage || ss.params.optionImage;
21695 var optionIcon = optionData.optionIcon || ss.params.optionIcon;
21696 var optionHasMedia = optionImage || optionIcon;
21697 // if (material) optionHasMedia = optionImage || optionIcon;
21698 var optionColor = optionData.optionColor;
21700 var optionClassName = optionData.optionClass || '';
21701 if ($optionEl[0].disabled) { optionClassName += ' disabled
'; }
21703 var optionGroupEl = $optionEl.parent('optgroup
')[0];
21704 var optionGroupLabel = optionGroupEl && optionGroupEl.label;
21705 var optionIsLabel = false;
21706 if (optionGroupEl && optionGroupEl !== previousGroupEl) {
21707 optionIsLabel = true;
21708 previousGroupEl = optionGroupEl;
21710 groupLabel: optionGroupLabel,
21711 isLabel: optionIsLabel,
21715 value: $optionEl[0].value,
21716 text: $optionEl[0].textContent.trim(),
21717 selected: $optionEl[0].selected,
21718 groupEl: optionGroupEl,
21719 groupLabel: optionGroupLabel,
21720 image: optionImage,
21722 color: optionColor,
21723 className: optionClassName,
21724 disabled: $optionEl[0].disabled,
21726 hasMedia: optionHasMedia,
21727 checkbox: ss.inputType === 'checkbox
',
21728 radio: ss.inputType === 'radio
',
21729 inputName: ss.inputName,
21730 inputType: ss.inputType,
21737 SmartSelect.prototype.renderSearchbar = function renderSearchbar () {
21739 if (ss.params.renderSearchbar) { return ss.params.renderSearchbar.call(ss); }
21740 var searchbarHTML = "\n <form class=\"searchbar\">\n <div class=\"searchbar-inner\">\n <div class=\"searchbar-input-wrap\">\n <input type=\"search\" placeholder=\"" + (ss.params.searchbarPlaceholder) + "\"/>\n <i class=\"searchbar-icon\"></i>\n <span class=\"input-clear-button\"></span>\n </div>\n " + (ss.params.searchbarDisableButton ? ("\n <span class=\"searchbar-disable-button\">" + (ss.params.searchbarDisableText) + "</span>\n ") : '') + "\n </div>\n </form>\n ";
21741 return searchbarHTML;
21744 SmartSelect.prototype.renderItem = function renderItem (item, index) {
21746 if (ss.params.renderItem) { return ss.params.renderItem.call(ss, item, index); }
21748 if (item.isLabel) {
21749 itemHtml = "<li class=\"item-divider\">" + (item.groupLabel) + "</li>";
21751 itemHtml = "\n <li class=\"" + (item.className || '') + "\">\n <label class=\"item-" + (item.inputType) + " item-content\">\n <input type=\"" + (item.inputType) + "\" name=\"" + (item.inputName) + "\" value=\"" + (item.value) + "\" " + (item.selected ? 'checked
' : '') + "/>\n <i class=\"icon icon-" + (item.inputType) + "\"></i>\n " + (item.hasMedia ? ("\n <div class=\"item-media\">\n " + (item.icon ? ("<i class=\"icon " + (item.icon) + "\"></i>") : '') + "\n " + (item.image ? ("<img src=\"" + (item.image) + "\">") : '') + "\n </div>\n ") : '') + "\n <div class=\"item-inner\">\n <div class=\"item-title" + (item.color ? (" color-" + (item.color)) : '') + "\">" + (item.text) + "</div>\n </div>\n </label>\n </li>\n ";
21756 SmartSelect.prototype.renderItems = function renderItems () {
21758 if (ss.params.renderItems) { return ss.params.renderItems.call(ss, ss.items); }
21759 var itemsHtml = "\n " + (ss.items.map(function (item, index) { return ("" + (ss.renderItem(item, index))); }).join('')) + "\n ";
21763 SmartSelect.prototype.renderPage = function renderPage () {
21765 if (ss.params.renderPage) { return ss.params.renderPage.call(ss, ss.items); }
21766 var pageTitle = ss.params.pageTitle;
21767 if (typeof pageTitle === 'undefined') {
21768 var $itemTitleEl = ss.$el.find('.item
-title
');
21769 pageTitle = $itemTitleEl.length ? $itemTitleEl.text().trim() : '';
21771 var cssClass = ss.params.cssClass;
21772 var pageHtml = "\n <div class=\"page smart-select-page " + cssClass + "\" data-name=\"smart-select-page\" data-select-name=\"" + (ss.selectName) + "\">\n <div class=\"navbar " + (ss.params.navbarColorTheme ? ("color-" + (ss.params.navbarColorTheme)) : '') + "\">\n <div class=\"navbar-inner sliding " + (ss.params.navbarColorTheme ? ("color-" + (ss.params.navbarColorTheme)) : '') + "\">\n <div class=\"left\">\n <a class=\"link back\">\n <i class=\"icon icon-back\"></i>\n <span class=\"if-not-md\">" + (ss.params.pageBackLinkText) + "</span>\n </a>\n </div>\n " + (pageTitle ? ("<div class=\"title\">" + pageTitle + "</div>") : '') + "\n " + (ss.params.searchbar ? ("<div class=\"subnavbar\">" + (ss.renderSearchbar()) + "</div>") : '') + "\n </div>\n </div>\n " + (ss.params.searchbar ? '<div
class="searchbar-backdrop"></div>' : '') + "\n <div class=\"page-content\">\n <div class=\"list smart-select-list-" + (ss.id) + " " + (ss.params.virtualList ? ' virtual-list' : '') + " " + (ss.params.formColorTheme ? ("color-" + (ss.params.formColorTheme)) : '') + "\">\n <ul>" + (!ss.params.virtualList && ss.renderItems(ss.items)) + "</ul>\n </div>\n </div>\n </div
>\n ";
21776 SmartSelect.prototype.renderPopup = function renderPopup () {
21778 if (ss.params.renderPopup) { return ss.params.renderPopup.call(ss, ss.items); }
21779 var pageTitle = ss.params.pageTitle;
21780 if (typeof pageTitle === 'undefined') {
21781 var $itemTitleEl = ss.$el.find('.item-title');
21782 pageTitle = $itemTitleEl.length ? $itemTitleEl.text().trim() : '';
21784 var cssClass = ss.params.cssClass || '';
21785 var popupHtml = "\n <div
class=\"popup smart
-select
-popup
" + cssClass + " " + (ss.params.popupTabletFullscreen ? 'popup-tablet-fullscreen' : '') + "\" data
-select
-name
=\"" + (ss.selectName) + "\">\n <div
class=\"view
\">\n <div
class=\"page smart
-select
-page
" + (ss.params.searchbar ? 'page-with-subnavbar' : '') + "\" data
-name
=\"smart
-select
-page
\">\n <div
class=\"navbar
" + (ss.params.navbarColorTheme ? ("color
-" + (ss.params.navbarColorTheme)) : '') + "\">\n <div
class=\"navbar
-inner sliding
\">\n " + (pageTitle ? ("<div
class=\"title
\">" + pageTitle + "</div>") : '') + "\n <div class=\"right\">\n <a class=\"link popup-close\" data-popup=\".smart-select-popup[data-select-name='" + (ss.selectName) + "']\">" + (ss.params.popupCloseLinkText) + "</span></a>\n </div>\n " + (ss.params.searchbar ? ("<div
class=\"subnavbar
\">" + (ss.renderSearchbar()) + "</div>") : '') + "\n </div>\n </div>\n " + (ss.params.searchbar ? '<div class="searchbar-backdrop"></div>' : '') + "\n <div class=\"page-content\">\n <div class=\"list smart-select-list-" + (ss.id) + " " + (ss.params.virtualList ? ' virtual
-list
' : '') + " " + (ss.params.formColorTheme ? ("color-" + (ss.params.formColorTheme)) : '') + "\">\n <ul>" + (!ss.params.virtualList && ss.renderItems(ss.items)) + "</ul>\n </div>\n </div>\n </div>\n </div>\n </div>\n ";
21789 SmartSelect.prototype.renderSheet = function renderSheet () {
21791 if (ss.params.renderSheet) { return ss.params.renderSheet.call(ss, ss.items); }
21792 var cssClass = ss.params.cssClass;
21793 var sheetHtml = "\n <div class=\"sheet-modal smart-select-sheet " + cssClass + "\" data-select-name=\"" + (ss.selectName) + "\">\n <div class=\"toolbar toolbar-top " + (ss.params.toolbarColorTheme ? ("color-" + (ss.params.toolbarColorTheme)) : '') + "\">\n <div class=\"toolbar-inner\">\n <div class=\"left\"></div>\n <div class=\"right\">\n <a class=\"link sheet-close\">" + (ss.params.sheetCloseLinkText) + "</a>\n </div>\n </div>\n </div>\n <div class=\"sheet-modal-inner\">\n <div class=\"page-content\">\n <div class=\"list smart-select-list-" + (ss.id) + " " + (ss.params.virtualList ? ' virtual
-list
' : '') + " " + (ss.params.formColorTheme ? ("color-" + (ss.params.formColorTheme)) : '') + "\">\n <ul>" + (!ss.params.virtualList && ss.renderItems(ss.items)) + "</ul>\n </div>\n </div>\n </div>\n </div>\n ";
21797 SmartSelect.prototype.renderPopover = function renderPopover () {
21799 if (ss.params.renderPopover) { return ss.params.renderPopover.call(ss, ss.items); }
21800 var cssClass = ss.params.cssClass;
21801 var popoverHtml = "\n <div class=\"popover smart-select-popover " + cssClass + "\" data-select-name=\"" + (ss.selectName) + "\">\n <div class=\"popover-inner\">\n <div class=\"list smart-select-list-" + (ss.id) + " " + (ss.params.virtualList ? ' virtual
-list
' : '') + " " + (ss.params.formColorTheme ? ("color-" + (ss.params.formColorTheme)) : '') + "\">\n <ul>" + (!ss.params.virtualList && ss.renderItems(ss.items)) + "</ul>\n </div>\n </div>\n </div>\n ";
21802 return popoverHtml;
21805 SmartSelect.prototype.scrollToSelectedItem = function scrollToSelectedItem () {
21807 var params = ss.params;
21808 var $containerEl = ss.$containerEl;
21809 if (!ss.opened) { return ss; }
21810 if (params.virtualList) {
21812 ss.vl.items.forEach(function (item, index) {
21813 if (typeof selectedIndex === 'undefined' && item.selected) {
21814 selectedIndex = index;
21817 if (typeof selectedIndex !== 'undefined') {
21818 ss.vl.scrollToItem(selectedIndex);
21821 var $selectedItemEl = $containerEl.find('input
:checked
').parents('li
');
21822 var $pageContentEl = $containerEl.find('.page
-content
');
21823 $pageContentEl.scrollTop($selectedItemEl.offset().top - $pageContentEl.offset().top - parseInt($pageContentEl.css('padding
-top
'), 10));
21828 SmartSelect.prototype.onOpen = function onOpen (type, containerEl) {
21831 var $containerEl = $(containerEl);
21832 ss.$containerEl = $containerEl;
21833 ss.openedIn = type;
21837 if (ss.params.virtualList) {
21838 ss.vl = app.virtualList.create({
21839 el: $containerEl.find('.virtual
-list
'),
21841 renderItem: ss.renderItem.bind(ss),
21842 height: ss.params.virtualListHeight,
21843 searchByItem: function searchByItem(query, item) {
21844 if (item.text && item.text.toLowerCase().indexOf(query.trim().toLowerCase()) >= 0) { return true; }
21849 if (ss.params.scrollToSelectedItem) {
21850 ss.scrollToSelectedItem();
21854 if (ss.params.searchbar) {
21855 var $searchbarEl = $containerEl.find('.searchbar
');
21856 if (type === 'page
' && app.theme === 'ios
') {
21857 $searchbarEl = $(app.navbar.getElByPage($containerEl)).find('.searchbar
');
21860 if (ss.params.appendSearchbarNotFound && (type === 'page
' || type === 'popup
')) {
21861 var $notFoundEl = null;
21863 if (typeof ss.params.appendSearchbarNotFound === 'string
') {
21864 $notFoundEl = $(("<div class=\"block searchbar-not-found\">" + (ss.params.appendSearchbarNotFound) + "</div>"));
21865 } else if (typeof ss.params.appendSearchbarNotFound === 'boolean') {
21866 $notFoundEl = $('<div
class="block searchbar-not-found">Nothing found
</div
>');
21868 $notFoundEl = ss.params.appendSearchbarNotFound;
21872 $containerEl.find('.page
-content
').append($notFoundEl[0]);
21876 var searchbarParams = Utils.extend({
21878 backdropEl: $containerEl.find('.searchbar
-backdrop
'),
21879 searchContainer: (".smart-select-list-" + (ss.id)),
21880 searchIn: '.item
-title
',
21881 }, typeof ss.params.searchbar === 'object
' ? ss.params.searchbar : {});
21883 ss.searchbar = app.searchbar.create(searchbarParams);
21886 // Check for max length
21887 if (ss.maxLength) {
21888 ss.checkMaxLength();
21892 if (ss.params.closeOnSelect) {
21893 ss.$containerEl.find(("input[type=\"radio\"][name=\"" + (ss.inputName) + "\"]:checked")).parents('label
').once('click
', function () {
21898 // Attach input events
21899 ss.attachInputsEvents();
21901 ss.$el.trigger('smartselect
:open
', ss);
21902 ss.emit('local
::open smartSelectOpen
', ss);
21905 SmartSelect.prototype.onOpened = function onOpened () {
21908 ss.$el.trigger('smartselect
:opened
', ss);
21909 ss.emit('local
::opened smartSelectOpened
', ss);
21912 SmartSelect.prototype.onClose = function onClose () {
21914 if (ss.destroyed) { return; }
21917 if (ss.vl && ss.vl.destroy) {
21924 if (ss.searchbar && ss.searchbar.destroy) {
21925 ss.searchbar.destroy();
21926 ss.searchbar = null;
21927 delete ss.searchbar;
21930 ss.detachInputsEvents();
21932 ss.$el.trigger('smartselect
:close
', ss);
21933 ss.emit('local
::close smartSelectClose
', ss);
21936 SmartSelect.prototype.onClosed = function onClosed () {
21938 if (ss.destroyed) { return; }
21940 ss.$containerEl = null;
21941 delete ss.$containerEl;
21943 ss.$el.trigger('smartselect
:closed
', ss);
21944 ss.emit('local
::closed smartSelectClosed
', ss);
21947 SmartSelect.prototype.openPage = function openPage () {
21949 if (ss.opened) { return ss; }
21951 var pageHtml = ss.renderPage(ss.items);
21952 var view = ss.getView();
21954 view.router.navigate({
21960 pageBeforeIn: function pageBeforeIn(e, page) {
21961 ss.onOpen('page
', page.el);
21963 pageAfterIn: function pageAfterIn(e, page) {
21964 ss.onOpened('page
', page.el);
21966 pageBeforeOut: function pageBeforeOut(e, page) {
21967 ss.onClose('page
', page.el);
21969 pageAfterOut: function pageAfterOut(e, page) {
21970 ss.onClosed('page
', page.el);
21978 SmartSelect.prototype.openPopup = function openPopup () {
21980 if (ss.opened) { return ss; }
21982 var popupHtml = ss.renderPopup(ss.items);
21984 var popupParams = {
21985 content: popupHtml,
21987 popupOpen: function popupOpen(popup) {
21988 ss.onOpen('popup
', popup.el);
21990 popupOpened: function popupOpened(popup) {
21991 ss.onOpened('popup
', popup.el);
21993 popupClose: function popupClose(popup) {
21994 ss.onClose('popup
', popup.el);
21996 popupClosed: function popupClosed(popup) {
21997 ss.onClosed('popup
', popup.el);
22002 if (ss.params.routableModals) {
22003 var view = ss.getView();
22004 view.router.navigate({
22008 popup: popupParams,
22012 ss.modal = ss.app.popup.create(popupParams).open();
22017 SmartSelect.prototype.openSheet = function openSheet () {
22019 if (ss.opened) { return ss; }
22021 var sheetHtml = ss.renderSheet(ss.items);
22023 var sheetParams = {
22024 content: sheetHtml,
22026 scrollToEl: ss.$el,
22027 closeByOutsideClick: true,
22029 sheetOpen: function sheetOpen(sheet) {
22030 ss.onOpen('sheet
', sheet.el);
22032 sheetOpened: function sheetOpened(sheet) {
22033 ss.onOpened('sheet
', sheet.el);
22035 sheetClose: function sheetClose(sheet) {
22036 ss.onClose('sheet
', sheet.el);
22038 sheetClosed: function sheetClosed(sheet) {
22039 ss.onClosed('sheet
', sheet.el);
22044 if (ss.params.routableModals) {
22045 var view = ss.getView();
22046 view.router.navigate({
22050 sheet: sheetParams,
22054 ss.modal = ss.app.sheet.create(sheetParams).open();
22059 SmartSelect.prototype.openPopover = function openPopover () {
22061 if (ss.opened) { return ss; }
22063 var popoverHtml = ss.renderPopover(ss.items);
22064 var popoverParams = {
22065 content: popoverHtml,
22068 popoverOpen: function popoverOpen(popover) {
22069 ss.onOpen('popover
', popover.el);
22071 popoverOpened: function popoverOpened(popover) {
22072 ss.onOpened('popover
', popover.el);
22074 popoverClose: function popoverClose(popover) {
22075 ss.onClose('popover
', popover.el);
22077 popoverClosed: function popoverClosed(popover) {
22078 ss.onClosed('popover
', popover.el);
22082 if (ss.params.routableModals) {
22083 var view = ss.getView();
22084 view.router.navigate({
22088 popover: popoverParams,
22092 ss.modal = ss.app.popover.create(popoverParams).open();
22097 SmartSelect.prototype.open = function open (type) {
22099 if (ss.opened) { return ss; }
22100 var openIn = type || ss.params.openIn;
22101 ss[("open" + (openIn.split('').map(function (el, index) {
22102 if (index === 0) { return el.toUpperCase(); }
22108 SmartSelect.prototype.close = function close () {
22110 if (!ss.opened) { return ss; }
22111 if (ss.params.routableModals || ss.openedIn === 'page
') {
22112 var view = ss.getView();
22113 view.router.back();
22115 ss.modal.once('modalClosed
', function () {
22116 Utils.nextTick(function () {
22117 ss.modal.destroy();
22126 SmartSelect.prototype.init = function init () {
22132 SmartSelect.prototype.destroy = function destroy () {
22134 ss.emit('local
::beforeDestroy smartSelectBeforeDestroy
', ss);
22135 ss.$el.trigger('smartselect
:beforedestroy
', ss);
22137 delete ss.$el[0].f7SmartSelect;
22138 Utils.deleteProps(ss);
22139 ss.destroyed = true;
22142 return SmartSelect;
22143 }(Framework7Class));
22145 var SmartSelect$1 = {
22146 name: 'smartSelect
',
22150 valueEl: undefined,
22151 openIn: 'page
', // or 'popup
' or 'sheet
' or 'popover
'
22152 pageTitle: undefined,
22153 pageBackLinkText: 'Back
',
22154 popupCloseLinkText: 'Close
',
22155 popupTabletFullscreen: false,
22156 sheetCloseLinkText: 'Done
',
22158 searchbarPlaceholder: 'Search
',
22159 searchbarDisableText: 'Cancel
',
22160 searchbarDisableButton: undefined,
22161 closeOnSelect: false,
22162 virtualList: false,
22163 virtualListHeight: undefined,
22164 scrollToSelectedItem: false,
22165 formColorTheme: undefined,
22166 navbarColorTheme: undefined,
22167 routableModals: true,
22171 Custom render functions
22173 renderPage: undefined,
22174 renderPopup: undefined,
22175 renderSheet: undefined,
22176 renderPopover: undefined,
22177 renderItems: undefined,
22178 renderItem: undefined,
22179 renderSearchbar: undefined,
22183 SmartSelect: SmartSelect,
22185 create: function create() {
22187 app.smartSelect = Utils.extend(
22188 ConstructorMethods({
22189 defaultSelector: '.smart
-select
',
22190 constructor: SmartSelect,
22192 domProp: 'f7SmartSelect
',
22195 open: function open(smartSelectEl) {
22196 var ss = app.smartSelect.get(smartSelectEl);
22197 if (ss && ss.open) { return ss.open(); }
22200 close: function close(smartSelectEl) {
22201 var ss = app.smartSelect.get(smartSelectEl);
22202 if (ss && ss.close) { return ss.close(); }
22210 tabMounted: function tabMounted(tabEl) {
22212 $(tabEl).find('.smart
-select
-init
').each(function (index, smartSelectEl) {
22213 app.smartSelect.create(Utils.extend({ el: smartSelectEl }, $(smartSelectEl).dataset()));
22216 tabBeforeRemove: function tabBeforeRemove(tabEl) {
22217 $(tabEl).find('.smart
-select
-init
').each(function (index, smartSelectEl) {
22218 if (smartSelectEl.f7SmartSelect && smartSelectEl.f7SmartSelect.destroy) {
22219 smartSelectEl.f7SmartSelect.destroy();
22223 pageInit: function pageInit(page) {
22225 page.$el.find('.smart
-select
-init
').each(function (index, smartSelectEl) {
22226 app.smartSelect.create(Utils.extend({ el: smartSelectEl }, $(smartSelectEl).dataset()));
22229 pageBeforeRemove: function pageBeforeRemove(page) {
22230 page.$el.find('.smart
-select
-init
').each(function (index, smartSelectEl) {
22231 if (smartSelectEl.f7SmartSelect && smartSelectEl.f7SmartSelect.destroy) {
22232 smartSelectEl.f7SmartSelect.destroy();
22238 '.smart
-select
': function open($clickedEl, data) {
22240 if (!$clickedEl[0].f7SmartSelect) {
22241 var ss = app.smartSelect.create(Utils.extend({ el: $clickedEl }, data));
22247 'smart
-select
-init
': {
22248 insert: function insert(vnode) {
22250 var smartSelectEl = vnode.elm;
22251 app.smartSelect.create(Utils.extend({ el: smartSelectEl }, $(smartSelectEl).dataset()));
22253 destroy: function destroy(vnode) {
22254 var smartSelectEl = vnode.elm;
22255 if (smartSelectEl.f7SmartSelect && smartSelectEl.f7SmartSelect.destroy) {
22256 smartSelectEl.f7SmartSelect.destroy();
22268 Converts a Gregorian date to Jalaali.
22270 function toJalaali (gy, gm, gd) {
22271 if (Object.prototype.toString.call(gy) === '[object Date
]') {
22273 gm = gy.getMonth() + 1;
22274 gy = gy.getFullYear();
22276 return d2j(g2d(gy, gm, gd))
22280 Converts a Jalaali date to Gregorian.
22282 function toGregorian (jy, jm, jd) {
22283 return d2g(j2d(jy, jm, jd))
22287 // Checks whether a Jalaali date is valid or not.
22289 // function isValidJalaaliDate (jy, jm, jd) {
22290 // return jy >= -61 && jy <= 3177 &&
22291 // jm >= 1 && jm <= 12 &&
22292 // jd >= 1 && jd <= monthLength(jy, jm)
22296 Is this a leap year or not?
22298 function isLeapJalaaliYear (jy) {
22299 return jalCal(jy).leap === 0
22303 Number of days in a given month in a Jalaali year.
22305 function monthLength (jy, jm) {
22306 if (jm <= 6) { return 31 }
22307 if (jm <= 11) { return 30 }
22308 if (isLeapJalaaliYear(jy)) { return 30 }
22313 This function determines if the Jalaali (Persian) year is
22314 leap (366-day long) or is the common year (365 days), and
22315 finds the day in March (Gregorian calendar) of the first
22316 day of the Jalaali year (jy).
22317 @param jy Jalaali calendar year (-61 to 3177)
22319 leap: number of years since the last leap year (0 to 4)
22320 gy: Gregorian year of the beginning of Jalaali year
22321 march: the March day of Farvardin the 1st (1st day of jy)
22322 @see: http://www.astro.uni.torun.pl/~kb/Papers/EMP/PersianC-EMP.htm
22323 @see: http://www.fourmilab.ch/documents/calendar/
22325 function jalCal (jy) {
22326 // Jalaali years starting the 33-year rule.
22327 var breaks = [-61, 9, 38, 199, 426, 686, 756, 818, 1111, 1181, 1210, 1635, 2060, 2097, 2192, 2262, 2324, 2394, 2456, 3178];
22328 var bl = breaks.length;
22331 var jp = breaks[0];
22340 if (jy < jp || jy >= breaks[bl - 1]) { throw new Error('Invalid Jalaali year
' + jy) }
22342 // Find the limiting years for the Jalaali year jy.
22343 for (i = 1; i < bl; i += 1) {
22346 if (jy < jm) { break }
22347 leapJ = leapJ + div(jump, 33) * 8 + div(mod(jump, 33), 4);
22352 // Find the number of leap years from AD 621 to the beginning
22353 // of the current Jalaali year in the Persian calendar.
22354 leapJ = leapJ + div(n, 33) * 8 + div(mod(n, 33) + 3, 4);
22355 if (mod(jump, 33) === 4 && jump - n === 4) { leapJ += 1; }
22357 // And the same in the Gregorian calendar (until the year gy).
22358 leapG = div(gy, 4) - div((div(gy, 100) + 1) * 3, 4) - 150;
22360 // Determine the Gregorian date of Farvardin the 1st.
22361 march = 20 + leapJ - leapG;
22363 // Find how many years have passed since the last leap year.
22364 if (jump - n < 6) { n = n - jump + div(jump + 4, 33) * 33; }
22365 leap = mod(mod(n + 1, 33) - 1, 4);
22370 return { leap: leap,
22377 Converts a date of the Jalaali calendar to the Julian Day number.
22378 @param jy Jalaali year (1 to 3100)
22379 @param jm Jalaali month (1 to 12)
22380 @param jd Jalaali day (1 to 29/31)
22381 @return Julian Day number
22383 function j2d (jy, jm, jd) {
22384 var r = jalCal(jy);
22385 return g2d(r.gy, 3, r.march) + (jm - 1) * 31 - div(jm, 7) * (jm - 7) + jd - 1
22389 Converts the Julian Day number to a date in the Jalaali calendar.
22390 @param jdn Julian Day number
22392 jy: Jalaali year (1 to 3100)
22393 jm: Jalaali month (1 to 12)
22394 jd: Jalaali day (1 to 29/31)
22396 function d2j (jdn) {
22397 var gy = d2g(jdn).gy; // Calculate Gregorian year (gy).
22399 var r = jalCal(jy);
22400 var jdn1f = g2d(gy, 3, r.march);
22405 // Find number of days that passed since 1 Farvardin.
22409 // The first 6 months.
22410 jm = 1 + div(k, 31);
22411 jd = mod(k, 31) + 1;
22417 // The remaining months.
22421 // Previous Jalaali year.
22424 if (r.leap === 1) { k += 1; }
22426 jm = 7 + div(k, 30);
22427 jd = mod(k, 30) + 1;
22435 Calculates the Julian Day number from Gregorian or Julian
22436 calendar dates. This integer number corresponds to the noon of
22437 the date (i.e. 12 hours of Universal Time).
22438 The procedure was tested to be good since 1 March, -100100 (of both
22439 calendars) up to a few million years into the future.
22440 @param gy Calendar year (years BC numbered 0, -1, -2, ...)
22441 @param gm Calendar month (1 to 12)
22442 @param gd Calendar day of the month (1 to 28/29/30/31)
22443 @return Julian Day number
22445 function g2d (gy, gm, gd) {
22446 var d = div((gy + div(gm - 8, 6) + 100100) * 1461, 4) +
22447 div(153 * mod(gm + 9, 12) + 2, 5) +
22449 d = d - div(div(gy + 100100 + div(gm - 8, 6), 100) * 3, 4) + 752;
22454 Calculates Gregorian and Julian calendar dates from the Julian Day number
22455 (jdn) for the period since jdn=-34839655 (i.e. the year -100100 of both
22456 calendars) to some millions years ahead of the present.
22457 @param jdn Julian Day number
22459 gy: Calendar year (years BC numbered 0, -1, -2, ...)
22460 gm: Calendar month (1 to 12)
22461 gd: Calendar day of the month M (1 to 28/29/30/31)
22463 function d2g (jdn) {
22469 j = 4 * jdn + 139361631;
22470 j = j + div(div(4 * jdn + 183187720, 146097) * 3, 4) * 4 - 3908;
22471 i = div(mod(j, 1461), 4) * 5 + 308;
22472 gd = div(mod(i, 153), 5) + 1;
22473 gm = mod(div(i, 153), 12) + 1;
22474 gy = div(j, 1461) - 100100 + div(8 - gm, 6);
22482 Utility helper functions.
22485 function div (a, b) {
22489 function mod (a, b) {
22490 return a - ~~(a / b) * b
22493 function fixDate (y, m, d) {
22495 y += Math.floor(m / 12);
22502 while (d > monthLength(y, m + 1)) {
22503 m = m !== 11 ? m + 1 : 0;
22504 y = m === 0 ? y + 1 : y;
22505 d -= monthLength(y, m + 1);
22508 m = m !== 0 ? m - 1 : 11;
22509 y = m === 11 ? y - 1 : y;
22510 d += monthLength(y, m + 1);
22512 return [y, m || 0, d || 1]
22516 Copyright nainemom <nainemom@gmail.com>
22517 https://github.com/nainemom/idate/blob/dev/package.json
22526 'getTimezoneOffset
',
22531 'getUTCMilliseconds
',
22545 'setUTCMilliseconds
',
22552 'toLocaleDateString
',
22553 'toLocaleTimeString
',
22561 var DAY_NAMES = ['Shanbe
', 'Yekshanbe
', 'Doshanbe
', 'Seshanbe
', 'Chaharshanbe
', 'Panjshanbe
', 'Jom
\'e
'];
22562 var PERSIAN_DAY_NAMES = ['شنبه', 'یکشنبه', 'دوشنبه', 'سهشنبه', 'چهارشنبه', 'پنجشنبه', 'جمعه'];
22563 var MONTH_NAMES = ['Farvardin
', 'Ordibehesht
', 'Khordad
', 'Tir
', 'Mordad
', 'Shahrivar
', 'Mehr
', 'Aban
', 'Azar
', 'Dey
', 'Bahman
', 'Esfand
'];
22564 var PERSIAN_MONTH_NAMES = ['فروردین', 'اردیبهشت', 'خرداد', 'تیر', 'مرداد', 'شهریور', 'مهر', 'آبان', 'آذر', 'دی', 'بهمن', 'اسفند'];
22565 var PERSIAN_NUMBERS = ['۰', '۱', '۲', '۳', '۴', '۵', '۶', '۷', '۸', '۹'];
22567 var IDate = /*@__PURE__*/(function (Date) {
22568 function IDate () {
22569 var args = [], len = arguments.length;
22570 while ( len-- ) args[ len ] = arguments[ len ];
22575 if (args.length === 0) {
22577 } else if (args.length === 1) {
22578 date = args[0] instanceof Date ? args[0].getTime() : args[0];
22580 var fixed = fixDate(
22583 typeof args[2] === 'undefined' ? 1 : args[2]);
22584 var converted$1 = toGregorian(fixed[0], fixed[1] + 1, fixed[2]);
22585 date = [converted$1.gy, converted$1.gm - 1, converted$1.gd].concat([args[3] || 0, args[4] || 0, args[5] || 0, args[6] || 0]);
22588 if (Array.isArray(date)) {
22589 this.gdate = new (Function.prototype.bind.apply( Date, [ null ].concat( date) ));
22591 this.gdate = new Date(date);
22594 var converted = toJalaali(this.gdate.getFullYear(), this.gdate.getMonth() + 1, this.gdate.getDate());
22595 this.jdate = [converted.jy, converted.jm - 1, converted.jd];
22597 methods.forEach(function (method) {
22598 IDate.prototype[method] = function () {
22601 return (ref = this.gdate)[method].apply(ref, arguments)
22606 if ( Date ) IDate.__proto__ = Date;
22607 IDate.prototype = Object.create( Date && Date.prototype );
22608 IDate.prototype.constructor = IDate;
22610 IDate.prototype.getFullYear = function getFullYear () {
22611 return this.jdate[0]
22614 IDate.prototype.setFullYear = function setFullYear (value) {
22615 this.jdate = fixDate(value, this.jdate[1], this.jdate[2]);
22617 return this.gdate.getTime()
22620 IDate.prototype.getMonth = function getMonth () {
22621 return this.jdate[1]
22624 IDate.prototype.setMonth = function setMonth (value) {
22625 this.jdate = fixDate(this.jdate[0], value, this.jdate[2]);
22627 return this.gdate.getTime()
22630 IDate.prototype.getDate = function getDate () {
22631 return this.jdate[2]
22634 IDate.prototype.setDate = function setDate (value) {
22635 this.jdate = fixDate(this.jdate[0], this.jdate[1], value);
22637 return this.gdate.getTime()
22640 IDate.prototype.getDay = function getDay () {
22641 return (this.gdate.getDay() + 1) % 7
22644 IDate.prototype.syncDate = function syncDate () {
22645 var converted = toGregorian(this.jdate[0], this.jdate[1] + 1, this.jdate[2]);
22646 this.gdate.setFullYear(converted.gy);
22647 this.gdate.setMonth(converted.gm - 1);
22648 this.gdate.setDate(converted.gd);
22650 IDate.prototype.toString = function toString (persianString) {
22651 if ( persianString === void 0 ) persianString = true;
22653 var replaceNums = function (str) {
22654 return str.replace(/./g, function (c) { return PERSIAN_NUMBERS[c] || c; })
22656 var padNumber = function (num) { return num.toString().length === 1 ? ("0" + num) : num.toString(); };
22657 var time = (padNumber(this.getHours())) + ":" + (padNumber(this.getMinutes())) + ":" + (padNumber(this.getSeconds()));
22658 if (persianString) {
22659 return replaceNums(((PERSIAN_DAY_NAMES[this.getDay()]) + " " + (this.getDate()) + " " + (PERSIAN_MONTH_NAMES[this.getMonth()]) + " " + (this.getFullYear()) + " ساعت " + time))
22661 return ((DAY_NAMES[this.getDay()]) + " " + (this.getDate()) + " " + (MONTH_NAMES[this.getMonth()]) + " " + (this.getFullYear()) + " " + time)
22667 var Calendar = /*@__PURE__*/(function (Framework7Class) {
22668 function Calendar(app, params) {
22669 if ( params === void 0 ) params = {};
22671 Framework7Class.call(this, params, [app]);
22672 var calendar = this;
22674 calendar.params = Utils.extend({}, app.params.calendar, params);
22676 if (calendar.params.calendarType === 'jalali
') {
22677 Object.keys(calendar.params.jalali).forEach(function (param) {
22678 if (!params[param]) {
22679 calendar.params[param] = calendar.params.jalali[param];
22684 if (calendar.params.calendarType === 'jalali
') {
22685 calendar.DateHandleClass = IDate;
22687 calendar.DateHandleClass = Date;
22691 if (calendar.params.containerEl) {
22692 $containerEl = $(calendar.params.containerEl);
22693 if ($containerEl.length === 0) { return calendar; }
22697 if (calendar.params.inputEl) {
22698 $inputEl = $(calendar.params.inputEl);
22703 view = $inputEl.parents('.view
').length && $inputEl.parents('.view
')[0].f7View;
22705 if (!view) { view = app.views.main; }
22707 var isHorizontal = calendar.params.direction === 'horizontal
';
22710 if (isHorizontal) {
22711 inverter = app.rtl ? -1 : 1;
22714 Utils.extend(calendar, {
22716 $containerEl: $containerEl,
22717 containerEl: $containerEl && $containerEl[0],
22718 inline: $containerEl && $containerEl.length > 0,
22719 $inputEl: $inputEl,
22720 inputEl: $inputEl && $inputEl[0],
22721 initialized: false,
22723 url: calendar.params.url,
22724 isHorizontal: isHorizontal,
22725 inverter: inverter,
22730 function onInputClick() {
22733 function onInputFocus(e) {
22734 e.preventDefault();
22736 function onHtmlClick(e) {
22737 var $targetEl = $(e.target);
22738 if (calendar.isPopover()) { return; }
22739 if (!calendar.opened || calendar.closing) { return; }
22740 if ($targetEl.closest('[class*="backdrop"]').length) { return; }
22741 if ($inputEl && $inputEl.length > 0) {
22742 if ($targetEl[0] !== $inputEl[0] && $targetEl.closest('.sheet
-modal
, .calendar
-modal
').length === 0) {
22745 } else if ($(e.target).closest('.sheet
-modal
, .calendar
-modal
').length === 0) {
22751 Utils.extend(calendar, {
22752 attachInputEvents: function attachInputEvents() {
22753 calendar.$inputEl.on('click
', onInputClick);
22754 if (calendar.params.inputReadOnly) {
22755 calendar.$inputEl.on('focus mousedown
', onInputFocus);
22758 detachInputEvents: function detachInputEvents() {
22759 calendar.$inputEl.off('click
', onInputClick);
22760 if (calendar.params.inputReadOnly) {
22761 calendar.$inputEl.off('focus mousedown
', onInputFocus);
22764 attachHtmlEvents: function attachHtmlEvents() {
22765 app.on('click
', onHtmlClick);
22767 detachHtmlEvents: function detachHtmlEvents() {
22768 app.off('click
', onHtmlClick);
22771 calendar.attachCalendarEvents = function attachCalendarEvents() {
22772 var allowItemClick = true;
22779 var touchStartTime;
22781 var currentTranslate;
22788 var $el = calendar.$el;
22789 var $wrapperEl = calendar.$wrapperEl;
22791 function handleTouchStart(e) {
22792 if (isMoved || isTouched) { return; }
22794 touchStartX = e.type === 'touchstart
' ? e.targetTouches[0].pageX : e.pageX;
22795 touchCurrentX = touchStartX;
22796 touchStartY = e.type === 'touchstart
' ? e.targetTouches[0].pageY : e.pageY;
22797 touchCurrentY = touchStartY;
22798 touchStartTime = (new calendar.DateHandleClass()).getTime();
22800 allowItemClick = true;
22801 isScrolling = undefined;
22802 currentTranslate = calendar.monthsTranslate;
22804 function handleTouchMove(e) {
22805 if (!isTouched) { return; }
22806 var isH = calendar.isHorizontal;
22808 touchCurrentX = e.type === 'touchmove
' ? e.targetTouches[0].pageX : e.pageX;
22809 touchCurrentY = e.type === 'touchmove
' ? e.targetTouches[0].pageY : e.pageY;
22810 if (typeof isScrolling === 'undefined') {
22811 isScrolling = !!(isScrolling || Math.abs(touchCurrentY - touchStartY) > Math.abs(touchCurrentX - touchStartX));
22813 if (isH && isScrolling) {
22817 e.preventDefault();
22818 if (calendar.animating) {
22822 allowItemClick = false;
22826 wrapperWidth = $wrapperEl[0].offsetWidth;
22827 wrapperHeight = $wrapperEl[0].offsetHeight;
22828 $wrapperEl.transition(0);
22831 touchesDiff = isH ? touchCurrentX - touchStartX : touchCurrentY - touchStartY;
22832 percentage = touchesDiff / (isH ? wrapperWidth : wrapperHeight);
22833 currentTranslate = ((calendar.monthsTranslate * calendar.inverter) + percentage) * 100;
22835 // Transform wrapper
22836 $wrapperEl.transform(("translate3d(" + (isH ? currentTranslate : 0) + "%, " + (isH ? 0 : currentTranslate) + "%, 0)"));
22838 function handleTouchEnd() {
22839 if (!isTouched || !isMoved) {
22847 touchEndTime = new calendar.DateHandleClass().getTime();
22848 if (touchEndTime - touchStartTime < 300) {
22849 if (Math.abs(touchesDiff) < 10) {
22850 calendar.resetMonth();
22851 } else if (touchesDiff >= 10) {
22852 if (app.rtl) { calendar.nextMonth(); }
22853 else { calendar.prevMonth(); }
22854 } else if (app.rtl) { calendar.prevMonth(); }
22855 else { calendar.nextMonth(); }
22856 } else if (percentage <= -0.5) {
22857 if (app.rtl) { calendar.prevMonth(); }
22858 else { calendar.nextMonth(); }
22859 } else if (percentage >= 0.5) {
22860 if (app.rtl) { calendar.nextMonth(); }
22861 else { calendar.prevMonth(); }
22863 calendar.resetMonth();
22867 setTimeout(function () {
22868 allowItemClick = true;
22872 function handleDayClick(e) {
22873 if (!allowItemClick) { return; }
22874 var $dayEl = $(e.target).parents('.calendar
-day
');
22875 if ($dayEl.length === 0 && $(e.target).hasClass('calendar
-day
')) {
22876 $dayEl = $(e.target);
22878 if ($dayEl.length === 0) { return; }
22879 if ($dayEl.hasClass('calendar
-day
-disabled
')) { return; }
22880 if (!calendar.params.rangePicker) {
22881 if ($dayEl.hasClass('calendar
-day
-next
')) { calendar.nextMonth(); }
22882 if ($dayEl.hasClass('calendar
-day
-prev
')) { calendar.prevMonth(); }
22884 var dateYear = parseInt($dayEl.attr('data
-year
'), 10);
22885 var dateMonth = parseInt($dayEl.attr('data
-month
'), 10);
22886 var dateDay = parseInt($dayEl.attr('data
-day
'), 10);
22888 'local
::dayClick calendarDayClick
',
22895 if (!$dayEl.hasClass('calendar
-day
-selected
') || calendar.params.multiple || calendar.params.rangePicker) {
22896 calendar.addValue(new calendar.DateHandleClass(dateYear, dateMonth, dateDay, 0, 0, 0));
22898 if (calendar.params.closeOnSelect) {
22900 (calendar.params.rangePicker && calendar.value.length === 2)
22901 || !calendar.params.rangePicker
22908 function onNextMonthClick() {
22909 calendar.nextMonth();
22912 function onPrevMonthClick() {
22913 calendar.prevMonth();
22916 function onNextYearClick() {
22917 calendar.nextYear();
22920 function onPrevYearClick() {
22921 calendar.prevYear();
22924 var passiveListener = app.touchEvents.start === 'touchstart
' && app.support.passiveListener ? { passive: true, capture: false } : false;
22925 // Selectors clicks
22926 $el.find('.calendar
-prev
-month
-button
').on('click
', onPrevMonthClick);
22927 $el.find('.calendar
-next
-month
-button
').on('click
', onNextMonthClick);
22928 $el.find('.calendar
-prev
-year
-button
').on('click
', onPrevYearClick);
22929 $el.find('.calendar
-next
-year
-button
').on('click
', onNextYearClick);
22931 $wrapperEl.on('click
', handleDayClick);
22934 if (calendar.params.touchMove) {
22935 $wrapperEl.on(app.touchEvents.start, handleTouchStart, passiveListener);
22936 app.on('touchmove
:active
', handleTouchMove);
22937 app.on('touchend
:passive
', handleTouchEnd);
22941 calendar.detachCalendarEvents = function detachCalendarEvents() {
22942 $el.find('.calendar
-prev
-month
-button
').off('click
', onPrevMonthClick);
22943 $el.find('.calendar
-next
-month
-button
').off('click
', onNextMonthClick);
22944 $el.find('.calendar
-prev
-year
-button
').off('click
', onPrevYearClick);
22945 $el.find('.calendar
-next
-year
-button
').off('click
', onNextYearClick);
22946 $wrapperEl.off('click
', handleDayClick);
22948 if (calendar.params.touchMove) {
22949 $wrapperEl.off(app.touchEvents.start, handleTouchStart, passiveListener);
22950 app.off('touchmove
:active
', handleTouchMove);
22951 app.off('touchend
:passive
', handleTouchEnd);
22962 if ( Framework7Class ) Calendar.__proto__ = Framework7Class;
22963 Calendar.prototype = Object.create( Framework7Class && Framework7Class.prototype );
22964 Calendar.prototype.constructor = Calendar;
22965 // eslint-disable-next-line
22966 Calendar.prototype.normalizeDate = function normalizeDate (date) {
22967 var calendar = this;
22968 var d = new calendar.DateHandleClass(date);
22969 return new calendar.DateHandleClass(d.getFullYear(), d.getMonth(), d.getDate());
22972 Calendar.prototype.normalizeValues = function normalizeValues (values) {
22973 var calendar = this;
22974 var newValues = [];
22975 if (values && Array.isArray(values)) {
22976 newValues = values.map(function (val) { return calendar.normalizeDate(val); });
22981 Calendar.prototype.initInput = function initInput () {
22982 var calendar = this;
22983 if (!calendar.$inputEl) { return; }
22984 if (calendar.params.inputReadOnly) { calendar.$inputEl.prop('readOnly
', true); }
22987 Calendar.prototype.isPopover = function isPopover () {
22988 var calendar = this;
22989 var app = calendar.app;
22990 var modal = calendar.modal;
22991 var params = calendar.params;
22992 if (params.openIn === 'sheet
') { return false; }
22993 if (modal && modal.type !== 'popover
') { return false; }
22995 if (!calendar.inline && calendar.inputEl) {
22996 if (params.openIn === 'popover
') { return true; }
22997 if (app.device.ios) {
22998 return !!app.device.ipad;
23000 if (app.width >= 768) {
23003 if (app.device.desktop && app.theme === 'aurora
') {
23010 Calendar.prototype.formatDate = function formatDate (d) {
23011 var calendar = this;
23012 var date = new calendar.DateHandleClass(d);
23013 var year = date.getFullYear();
23014 var month = date.getMonth();
23015 var month1 = month + 1;
23016 var day = date.getDate();
23017 var weekDay = date.getDay();
23018 var ref = calendar.params;
23019 var dateFormat = ref.dateFormat;
23020 var monthNames = ref.monthNames;
23021 var monthNamesShort = ref.monthNamesShort;
23022 var dayNames = ref.dayNames;
23023 var dayNamesShort = ref.dayNamesShort;
23026 .replace(/yyyy/g, year)
23027 .replace(/yy/g, String(year).substring(2))
23028 .replace(/mm/g, month1 < 10 ? ("0" + month1) : month1)
23029 .replace(/m(\W+)/g, (month1 + "$1"))
23030 .replace(/MM/g, monthNames[month])
23031 .replace(/M(\W+)/g, ((monthNamesShort[month]) + "$1"))
23032 .replace(/dd/g, day < 10 ? ("0" + day) : day)
23033 .replace(/d(\W+)/g, (day + "$1"))
23034 .replace(/DD/g, dayNames[weekDay])
23035 .replace(/D(\W+)/g, ((dayNamesShort[weekDay]) + "$1"));
23038 Calendar.prototype.formatValue = function formatValue () {
23039 var calendar = this;
23040 var value = calendar.value;
23041 if (calendar.params.formatValue) {
23042 return calendar.params.formatValue.call(calendar, value);
23045 .map(function (v) { return calendar.formatDate(v); })
23046 .join(calendar.params.rangePicker ? ' - ' : ', ');
23049 Calendar.prototype.addValue = function addValue (newValue) {
23050 var calendar = this;
23051 var ref = calendar.params;
23052 var multiple = ref.multiple;
23053 var rangePicker = ref.rangePicker;
23054 var rangePickerMinDays = ref.rangePickerMinDays;
23055 var rangePickerMaxDays = ref.rangePickerMaxDays;
23057 if (!calendar.value) { calendar.value = []; }
23059 for (var i = 0; i < calendar.value.length; i += 1) {
23060 if (new calendar.DateHandleClass(newValue).getTime() === new calendar.DateHandleClass(calendar.value[i]).getTime()) {
23064 if (typeof inValuesIndex === 'undefined') {
23065 calendar.value.push(newValue);
23067 calendar.value.splice(inValuesIndex, 1);
23069 calendar.updateValue();
23070 } else if (rangePicker) {
23071 if (!calendar.value) { calendar.value = []; }
23072 if (calendar.value.length === 2 || calendar.value.length === 0) {
23073 calendar.value = [];
23076 if ((calendar.value.length === 0
23077 || ((Math.abs(calendar.value[0].getTime() - newValue.getTime()) >= (rangePickerMinDays - 1) * 60 * 60 * 24 * 1000) && (rangePickerMaxDays === 0 || Math.abs(calendar.value[0].getTime() - newValue.getTime()) <= (rangePickerMaxDays - 1) * 60 * 60 * 24 * 1000)))) { calendar.value.push(newValue); }
23078 else { calendar.value = []; }
23080 calendar.value.sort(function (a, b) { return a - b; });
23081 calendar.updateValue();
23083 calendar.value = [newValue];
23084 calendar.updateValue();
23088 Calendar.prototype.setValue = function setValue (values) {
23089 var calendar = this;
23090 var currentValue = calendar.value;
23091 if (Array.isArray(currentValue) && Array.isArray(values) && currentValue.length === values.length) {
23093 currentValue.forEach(function (v, index) {
23094 if (v !== values[index]) { equal = false; }
23096 if (equal) { return; }
23098 calendar.value = values;
23099 calendar.updateValue();
23102 Calendar.prototype.getValue = function getValue () {
23103 var calendar = this;
23104 return calendar.value;
23107 Calendar.prototype.updateValue = function updateValue (onlyHeader) {
23108 var calendar = this;
23109 var $el = calendar.$el;
23110 var $wrapperEl = calendar.$wrapperEl;
23111 var $inputEl = calendar.$inputEl;
23112 var value = calendar.value;
23113 var params = calendar.params;
23115 if ($el && $el.length > 0) {
23116 $wrapperEl.find('.calendar
-day
-selected
').removeClass('calendar
-day
-selected
');
23118 if (params.rangePicker && value.length === 2) {
23119 for (i = new calendar.DateHandleClass(value[0]).getTime(); i <= new calendar.DateHandleClass(value[1]).getTime(); i += 24 * 60 * 60 * 1000) {
23120 valueDate = new calendar.DateHandleClass(i);
23121 $wrapperEl.find((".calendar-day[data-date=\"" + (valueDate.getFullYear()) + "-" + (valueDate.getMonth()) + "-" + (valueDate.getDate()) + "\"]")).addClass('calendar
-day
-selected
');
23124 for (i = 0; i < calendar.value.length; i += 1) {
23125 valueDate = new calendar.DateHandleClass(value[i]);
23126 $wrapperEl.find((".calendar-day[data-date=\"" + (valueDate.getFullYear()) + "-" + (valueDate.getMonth()) + "-" + (valueDate.getDate()) + "\"]")).addClass('calendar
-day
-selected
');
23131 calendar.emit('local
::change calendarChange
', calendar, value);
23135 if (($inputEl && $inputEl.length) || params.header) {
23136 var inputValue = calendar.formatValue(value);
23137 if (params.header && $el && $el.length) {
23138 $el.find('.calendar
-selected
-date
').text(inputValue);
23140 if ($inputEl && $inputEl.length && !onlyHeader) {
23141 $inputEl.val(inputValue);
23142 $inputEl.trigger('change
');
23147 Calendar.prototype.updateCurrentMonthYear = function updateCurrentMonthYear (dir) {
23148 var calendar = this;
23149 var $months = calendar.$months;
23150 var $el = calendar.$el;
23151 var params = calendar.params;
23152 if (typeof dir === 'undefined') {
23153 calendar.currentMonth = parseInt($months.eq(1).attr('data
-month
'), 10);
23154 calendar.currentYear = parseInt($months.eq(1).attr('data
-year
'), 10);
23156 calendar.currentMonth = parseInt($months.eq(dir === 'next
' ? ($months.length - 1) : 0).attr('data
-month
'), 10);
23157 calendar.currentYear = parseInt($months.eq(dir === 'next
' ? ($months.length - 1) : 0).attr('data
-year
'), 10);
23159 $el.find('.current
-month
-value
').text(params.monthNames[calendar.currentMonth]);
23160 $el.find('.current
-year
-value
').text(calendar.currentYear);
23163 Calendar.prototype.update = function update () {
23164 var calendar = this;
23165 var currentYear = calendar.currentYear;
23166 var currentMonth = calendar.currentMonth;
23167 var $wrapperEl = calendar.$wrapperEl;
23168 var currentDate = new calendar.DateHandleClass(currentYear, currentMonth);
23169 var prevMonthHtml = calendar.renderMonth(currentDate, 'prev
');
23170 var currentMonthHtml = calendar.renderMonth(currentDate);
23171 var nextMonthHtml = calendar.renderMonth(currentDate, 'next
');
23175 .html(("" + prevMonthHtml + currentMonthHtml + nextMonthHtml))
23176 .transform('translate3d(0,0,0)');
23177 calendar.$months = $wrapperEl.find('.calendar
-month
');
23178 calendar.monthsTranslate = 0;
23179 calendar.setMonthsTranslate();
23180 calendar.$months.each(function (index, monthEl) {
23182 'local
::monthAdd calendarMonthAdd
',
23188 Calendar.prototype.onMonthChangeStart = function onMonthChangeStart (dir) {
23189 var calendar = this;
23190 var $months = calendar.$months;
23191 var currentYear = calendar.currentYear;
23192 var currentMonth = calendar.currentMonth;
23193 calendar.updateCurrentMonthYear(dir);
23194 $months.removeClass('calendar
-month
-current calendar
-month
-prev calendar
-month
-next
');
23195 var currentIndex = dir === 'next
' ? $months.length - 1 : 0;
23197 $months.eq(currentIndex).addClass('calendar
-month
-current
');
23198 $months.eq(dir === 'next
' ? currentIndex - 1 : currentIndex + 1).addClass(dir === 'next
' ? 'calendar
-month
-prev
' : 'calendar
-month
-next
');
23201 'local
::monthYearChangeStart calendarMonthYearChangeStart
',
23208 Calendar.prototype.onMonthChangeEnd = function onMonthChangeEnd (dir, rebuildBoth) {
23209 var calendar = this;
23210 var currentYear = calendar.currentYear;
23211 var currentMonth = calendar.currentMonth;
23212 var $wrapperEl = calendar.$wrapperEl;
23213 var monthsTranslate = calendar.monthsTranslate;
23214 calendar.animating = false;
23217 var currentMonthHtml;
23219 .find('.calendar
-month
:not(.calendar
-month
-prev
):not(.calendar
-month
-current
):not(.calendar
-month
-next
)')
23222 if (typeof dir === 'undefined') {
23223 dir = 'next
'; // eslint-disable-line
23224 rebuildBoth = true; // eslint-disable-line
23226 if (!rebuildBoth) {
23227 currentMonthHtml = calendar.renderMonth(new calendar.DateHandleClass(currentYear, currentMonth), dir);
23229 $wrapperEl.find('.calendar
-month
-next
, .calendar
-month
-prev
').remove();
23230 prevMonthHtml = calendar.renderMonth(new calendar.DateHandleClass(currentYear, currentMonth), 'prev
');
23231 nextMonthHtml = calendar.renderMonth(new calendar.DateHandleClass(currentYear, currentMonth), 'next
');
23233 if (dir === 'next
' || rebuildBoth) {
23234 $wrapperEl.append(currentMonthHtml || nextMonthHtml);
23236 if (dir === 'prev
' || rebuildBoth) {
23237 $wrapperEl.prepend(currentMonthHtml || prevMonthHtml);
23239 var $months = $wrapperEl.find('.calendar
-month
');
23240 calendar.$months = $months;
23241 calendar.setMonthsTranslate(monthsTranslate);
23243 'local
::monthAdd calendarMonthAdd
',
23245 dir === 'next
' ? $months.eq($months.length - 1)[0] : $months.eq(0)[0]
23248 'local
::monthYearChangeEnd calendarMonthYearChangeEnd
',
23255 Calendar.prototype.setMonthsTranslate = function setMonthsTranslate (translate) {
23256 var calendar = this;
23257 var $months = calendar.$months;
23258 var isH = calendar.isHorizontal;
23259 var inverter = calendar.inverter;
23260 // eslint-disable-next-line
23261 translate = translate || calendar.monthsTranslate || 0;
23262 if (typeof calendar.monthsTranslate === 'undefined') {
23263 calendar.monthsTranslate = translate;
23265 $months.removeClass('calendar
-month
-current calendar
-month
-prev calendar
-month
-next
');
23266 var prevMonthTranslate = -(translate + 1) * 100 * inverter;
23267 var currentMonthTranslate = -translate * 100 * inverter;
23268 var nextMonthTranslate = -(translate - 1) * 100 * inverter;
23270 .transform(("translate3d(" + (isH ? prevMonthTranslate : 0) + "%, " + (isH ? 0 : prevMonthTranslate) + "%, 0)"))
23271 .addClass('calendar
-month
-prev
');
23273 .transform(("translate3d(" + (isH ? currentMonthTranslate : 0) + "%, " + (isH ? 0 : currentMonthTranslate) + "%, 0)"))
23274 .addClass('calendar
-month
-current
');
23276 .transform(("translate3d(" + (isH ? nextMonthTranslate : 0) + "%, " + (isH ? 0 : nextMonthTranslate) + "%, 0)"))
23277 .addClass('calendar
-month
-next
');
23280 Calendar.prototype.nextMonth = function nextMonth (transition) {
23281 var calendar = this;
23282 var params = calendar.params;
23283 var $wrapperEl = calendar.$wrapperEl;
23284 var inverter = calendar.inverter;
23285 var isH = calendar.isHorizontal;
23286 if (typeof transition === 'undefined' || typeof transition === 'object
') {
23287 transition = ''; // eslint-disable-line
23288 if (!params.animate) { transition = 0; } // eslint-disable-line
23290 var nextMonth = parseInt(calendar.$months.eq(calendar.$months.length - 1).attr('data
-month
'), 10);
23291 var nextYear = parseInt(calendar.$months.eq(calendar.$months.length - 1).attr('data
-year
'), 10);
23292 var nextDate = new calendar.DateHandleClass(nextYear, nextMonth);
23293 var nextDateTime = nextDate.getTime();
23294 var transitionEndCallback = !calendar.animating;
23295 if (params.maxDate) {
23296 if (nextDateTime > new calendar.DateHandleClass(params.maxDate).getTime()) {
23297 calendar.resetMonth();
23301 calendar.monthsTranslate -= 1;
23302 if (nextMonth === calendar.currentMonth) {
23303 var nextMonthTranslate = -(calendar.monthsTranslate) * 100 * inverter;
23304 var nextMonthHtml = $(calendar.renderMonth(nextDateTime, 'next
'))
23305 .transform(("translate3d(" + (isH ? nextMonthTranslate : 0) + "%, " + (isH ? 0 : nextMonthTranslate) + "%, 0)"))
23306 .addClass('calendar
-month
-next
');
23307 $wrapperEl.append(nextMonthHtml[0]);
23308 calendar.$months = $wrapperEl.find('.calendar
-month
');
23310 'local
::monthAdd calendarMonthAdd
',
23311 calendar.$months.eq(calendar.$months.length - 1)[0]
23314 calendar.animating = true;
23315 calendar.onMonthChangeStart('next
');
23316 var translate = (calendar.monthsTranslate * 100) * inverter;
23318 $wrapperEl.transition(transition).transform(("translate3d(" + (isH ? translate : 0) + "%, " + (isH ? 0 : translate) + "%, 0)"));
23319 if (transitionEndCallback) {
23320 $wrapperEl.transitionEnd(function () {
23321 calendar.onMonthChangeEnd('next
');
23324 if (!params.animate) {
23325 calendar.onMonthChangeEnd('next
');
23329 Calendar.prototype.prevMonth = function prevMonth (transition) {
23330 var calendar = this;
23331 var params = calendar.params;
23332 var $wrapperEl = calendar.$wrapperEl;
23333 var inverter = calendar.inverter;
23334 var isH = calendar.isHorizontal;
23335 if (typeof transition === 'undefined' || typeof transition === 'object
') {
23336 transition = ''; // eslint-disable-line
23337 if (!params.animate) { transition = 0; } // eslint-disable-line
23339 var prevMonth = parseInt(calendar.$months.eq(0).attr('data
-month
'), 10);
23340 var prevYear = parseInt(calendar.$months.eq(0).attr('data
-year
'), 10);
23341 var prevDate = new calendar.DateHandleClass(prevYear, prevMonth + 1, -1);
23342 var prevDateTime = prevDate.getTime();
23343 var transitionEndCallback = !calendar.animating;
23344 if (params.minDate) {
23345 var minDate = new calendar.DateHandleClass(params.minDate);
23346 minDate = new calendar.DateHandleClass(minDate.getFullYear(), minDate.getMonth(), 1);
23347 if (prevDateTime < minDate.getTime()) {
23348 calendar.resetMonth();
23352 calendar.monthsTranslate += 1;
23353 if (prevMonth === calendar.currentMonth) {
23354 var prevMonthTranslate = -(calendar.monthsTranslate) * 100 * inverter;
23355 var prevMonthHtml = $(calendar.renderMonth(prevDateTime, 'prev
'))
23356 .transform(("translate3d(" + (isH ? prevMonthTranslate : 0) + "%, " + (isH ? 0 : prevMonthTranslate) + "%, 0)"))
23357 .addClass('calendar
-month
-prev
');
23358 $wrapperEl.prepend(prevMonthHtml[0]);
23359 calendar.$months = $wrapperEl.find('.calendar
-month
');
23361 'local
::monthAdd calendarMonthAdd
',
23362 calendar.$months.eq(0)[0]
23365 calendar.animating = true;
23366 calendar.onMonthChangeStart('prev
');
23367 var translate = (calendar.monthsTranslate * 100) * inverter;
23369 .transition(transition)
23370 .transform(("translate3d(" + (isH ? translate : 0) + "%, " + (isH ? 0 : translate) + "%, 0)"));
23371 if (transitionEndCallback) {
23372 $wrapperEl.transitionEnd(function () {
23373 calendar.onMonthChangeEnd('prev
');
23376 if (!params.animate) {
23377 calendar.onMonthChangeEnd('prev
');
23381 Calendar.prototype.resetMonth = function resetMonth (transition) {
23382 if ( transition === void 0 ) transition = '';
23384 var calendar = this;
23385 var $wrapperEl = calendar.$wrapperEl;
23386 var inverter = calendar.inverter;
23387 var isH = calendar.isHorizontal;
23388 var monthsTranslate = calendar.monthsTranslate;
23389 var translate = (monthsTranslate * 100) * inverter;
23391 .transition(transition)
23392 .transform(("translate3d(" + (isH ? translate : 0) + "%, " + (isH ? 0 : translate) + "%, 0)"));
23394 // eslint-disable-next-line
23395 Calendar.prototype.setYearMonth = function setYearMonth (year, month, transition) {
23396 var calendar = this;
23397 var params = calendar.params;
23398 var isH = calendar.isHorizontal;
23399 var $wrapperEl = calendar.$wrapperEl;
23400 var inverter = calendar.inverter;
23401 // eslint-disable-next-line
23402 if (typeof year === 'undefined') { year = calendar.currentYear; }
23403 // eslint-disable-next-line
23404 if (typeof month === 'undefined') { month = calendar.currentMonth; }
23405 if (typeof transition === 'undefined' || typeof transition === 'object
') {
23406 // eslint-disable-next-line
23408 // eslint-disable-next-line
23409 if (!params.animate) { transition = 0; }
23412 if (year < calendar.currentYear) {
23413 targetDate = new calendar.DateHandleClass(year, month + 1, -1).getTime();
23415 targetDate = new calendar.DateHandleClass(year, month).getTime();
23417 if (params.maxDate && targetDate > new calendar.DateHandleClass(params.maxDate).getTime()) {
23420 if (params.minDate) {
23421 var minDate = new calendar.DateHandleClass(params.minDate);
23422 minDate = new calendar.DateHandleClass(minDate.getFullYear(), minDate.getMonth(), 1);
23423 if (targetDate < minDate.getTime()) {
23427 var currentDate = new calendar.DateHandleClass(calendar.currentYear, calendar.currentMonth).getTime();
23428 var dir = targetDate > currentDate ? 'next
' : 'prev
';
23429 var newMonthHTML = calendar.renderMonth(new calendar.DateHandleClass(year, month));
23430 calendar.monthsTranslate = calendar.monthsTranslate || 0;
23431 var prevTranslate = calendar.monthsTranslate;
23432 var monthTranslate;
23433 var transitionEndCallback = !calendar.animating;
23434 if (targetDate > currentDate) {
23436 calendar.monthsTranslate -= 1;
23437 if (!calendar.animating) { calendar.$months.eq(calendar.$months.length - 1).remove(); }
23438 $wrapperEl.append(newMonthHTML);
23439 calendar.$months = $wrapperEl.find('.calendar
-month
');
23440 monthTranslate = -(prevTranslate - 1) * 100 * inverter;
23442 .eq(calendar.$months.length - 1)
23443 .transform(("translate3d(" + (isH ? monthTranslate : 0) + "%, " + (isH ? 0 : monthTranslate) + "%, 0)"))
23444 .addClass('calendar
-month
-next
');
23447 calendar.monthsTranslate += 1;
23448 if (!calendar.animating) { calendar.$months.eq(0).remove(); }
23449 $wrapperEl.prepend(newMonthHTML);
23450 calendar.$months = $wrapperEl.find('.calendar
-month
');
23451 monthTranslate = -(prevTranslate + 1) * 100 * inverter;
23454 .transform(("translate3d(" + (isH ? monthTranslate : 0) + "%, " + (isH ? 0 : monthTranslate) + "%, 0)"))
23455 .addClass('calendar
-month
-prev
');
23458 'local
::monthAdd calendarMonthAdd
',
23460 ? calendar.$months.eq(calendar.$months.length - 1)[0]
23461 : calendar.$months.eq(0)[0]
23464 calendar.animating = true;
23465 calendar.onMonthChangeStart(dir);
23466 var wrapperTranslate = (calendar.monthsTranslate * 100) * inverter;
23468 .transition(transition)
23469 .transform(("translate3d(" + (isH ? wrapperTranslate : 0) + "%, " + (isH ? 0 : wrapperTranslate) + "%, 0)"));
23470 if (transitionEndCallback) {
23471 $wrapperEl.transitionEnd(function () {
23472 calendar.onMonthChangeEnd(dir, true);
23475 if (!params.animate) {
23476 calendar.onMonthChangeEnd(dir);
23480 Calendar.prototype.nextYear = function nextYear () {
23481 var calendar = this;
23482 calendar.setYearMonth(calendar.currentYear + 1);
23485 Calendar.prototype.prevYear = function prevYear () {
23486 var calendar = this;
23487 calendar.setYearMonth(calendar.currentYear - 1);
23489 // eslint-disable-next-line
23490 Calendar.prototype.dateInRange = function dateInRange (dayDate, range) {
23491 var calendar = this;
23494 if (!range) { return false; }
23495 if (Array.isArray(range)) {
23496 for (i = 0; i < range.length; i += 1) {
23497 if (range[i].from || range[i].to) {
23498 if (range[i].from && range[i].to) {
23499 if ((dayDate <= new calendar.DateHandleClass(range[i].to).getTime()) && (dayDate >= new calendar.DateHandleClass(range[i].from).getTime())) {
23502 } else if (range[i].from) {
23503 if (dayDate >= new calendar.DateHandleClass(range[i].from).getTime()) {
23506 } else if (range[i].to) {
23507 if (dayDate <= new calendar.DateHandleClass(range[i].to).getTime()) {
23511 } else if (range[i].date) {
23512 if (dayDate === new calendar.DateHandleClass(range[i].date).getTime()) {
23515 } else if (dayDate === new calendar.DateHandleClass(range[i]).getTime()) {
23519 } else if (range.from || range.to) {
23520 if (range.from && range.to) {
23521 if ((dayDate <= new calendar.DateHandleClass(range.to).getTime()) && (dayDate >= new calendar.DateHandleClass(range.from).getTime())) {
23524 } else if (range.from) {
23525 if (dayDate >= new calendar.DateHandleClass(range.from).getTime()) {
23528 } else if (range.to) {
23529 if (dayDate <= new calendar.DateHandleClass(range.to).getTime()) {
23533 } else if (range.date) {
23534 match = dayDate === new calendar.DateHandleClass(range.date).getTime();
23535 } else if (typeof range === 'function') {
23536 match = range(new calendar.DateHandleClass(dayDate));
23540 // eslint-disable-next-line
23541 Calendar.prototype.daysInMonth = function daysInMonth (date) {
23542 var calendar = this;
23543 var d = new calendar.DateHandleClass(date);
23544 return new calendar.DateHandleClass(d.getFullYear(), d.getMonth() + 1, 0).getDate();
23547 Calendar.prototype.renderMonths = function renderMonths (date) {
23548 var calendar = this;
23549 if (calendar.params.renderMonths) {
23550 return calendar.params.renderMonths.call(calendar, date);
23552 return ("\n <div class=\"calendar-months-wrapper\">\n " + (calendar.renderMonth(date, 'prev
')) + "\n " + (calendar.renderMonth(date)) + "\n " + (calendar.renderMonth(date, 'next
')) + "\n </div>\n ").trim();
23555 Calendar.prototype.renderMonth = function renderMonth (d, offset) {
23556 var calendar = this;
23557 var params = calendar.params;
23558 var value = calendar.value;
23559 if (params.renderMonth) {
23560 return params.renderMonth.call(calendar, d, offset);
23562 var date = new calendar.DateHandleClass(d);
23563 var year = date.getFullYear();
23564 var month = date.getMonth();
23566 if (offset === 'next
') {
23567 if (month === 11) { date = new calendar.DateHandleClass(year + 1, 0); }
23568 else { date = new calendar.DateHandleClass(year, month + 1, 1); }
23570 if (offset === 'prev
') {
23571 if (month === 0) { date = new calendar.DateHandleClass(year - 1, 11); }
23572 else { date = new calendar.DateHandleClass(year, month - 1, 1); }
23574 if (offset === 'next
' || offset === 'prev
') {
23575 month = date.getMonth();
23576 year = date.getFullYear();
23579 var currentValues = [];
23580 var today = new calendar.DateHandleClass().setHours(0, 0, 0, 0);
23581 var minDate = params.minDate ? new calendar.DateHandleClass(params.minDate).getTime() : null;
23582 var maxDate = params.maxDate ? new calendar.DateHandleClass(params.maxDate).getTime() : null;
23585 var daysInPrevMonth = calendar.daysInMonth(new calendar.DateHandleClass(date.getFullYear(), date.getMonth()).getTime() - (10 * 24 * 60 * 60 * 1000));
23586 var daysInMonth = calendar.daysInMonth(date);
23587 var minDayNumber = params.firstDay === 6 ? 0 : 1;
23589 var monthHtml = '';
23590 var dayIndex = 0 + (params.firstDay - 1);
23593 var firstDayOfMonthIndex = new calendar.DateHandleClass(date.getFullYear(), date.getMonth()).getDay();
23594 if (firstDayOfMonthIndex === 0) { firstDayOfMonthIndex = 7; }
23596 if (value && value.length) {
23597 for (var i = 0; i < value.length; i += 1) {
23598 currentValues.push(new calendar.DateHandleClass(value[i]).setHours(0, 0, 0, 0));
23602 for (var row = 1; row <= rows; row += 1) {
23604 var loop = function ( col ) {
23606 var dayDate = (void 0);
23607 var dayNumber = dayIndex - firstDayOfMonthIndex;
23609 if (row === 1 && col === 1 && dayNumber > minDayNumber && params.firstDay !== 1) {
23611 dayNumber = dayIndex - firstDayOfMonthIndex;
23614 var weekDayIndex = ((col - 1) + params.firstDay > 6)
23615 ? ((col - 1 - 7) + params.firstDay)
23616 : ((col - 1) + params.firstDay);
23618 if (dayNumber < 0) {
23619 dayNumber = daysInPrevMonth + dayNumber + 1;
23620 addClass += ' calendar
-day
-prev
';
23621 dayDate = new calendar.DateHandleClass(month - 1 < 0 ? year - 1 : year, month - 1 < 0 ? 11 : month - 1, dayNumber).getTime();
23624 if (dayNumber > daysInMonth) {
23625 dayNumber -= daysInMonth;
23626 addClass += ' calendar
-day
-next
';
23627 dayDate = new calendar.DateHandleClass(month + 1 > 11 ? year + 1 : year, month + 1 > 11 ? 0 : month + 1, dayNumber).getTime();
23629 dayDate = new calendar.DateHandleClass(year, month, dayNumber).getTime();
23633 if (dayDate === today) { addClass += ' calendar
-day
-today
'; }
23636 if (params.rangePicker && currentValues.length === 2) {
23637 if (dayDate >= currentValues[0] && dayDate <= currentValues[1]) { addClass += ' calendar
-day
-selected
'; }
23638 } else if (currentValues.indexOf(dayDate) >= 0) { addClass += ' calendar
-day
-selected
'; }
23640 if (params.weekendDays.indexOf(weekDayIndex) >= 0) {
23641 addClass += ' calendar
-day
-weekend
';
23644 var eventsHtml = '';
23646 if (params.events) {
23647 if (calendar.dateInRange(dayDate, params.events)) {
23652 addClass += ' calendar
-day
-has
-events
';
23653 eventsHtml = "\n <span class=\"calendar-day-events\">\n <span class=\"calendar-day-event\"></span>\n </span>\n ";
23654 if (Array.isArray(params.events)) {
23655 var eventDots = [];
23656 params.events.forEach(function (ev) {
23657 var color = ev.color || '';
23658 if (eventDots.indexOf(color) < 0 && calendar.dateInRange(dayDate, ev)) {
23659 eventDots.push(color);
23662 eventsHtml = "\n <span class=\"calendar-day-events\">\n " + (eventDots.map(function (color) { return ("\n <span class=\"calendar-day-event\" style=\"" + (color ? ("background-color: " + color) : '') + "\"></span>\n ").trim(); }).join('')) + "\n </span>\n ";
23666 if (params.rangesClasses) {
23667 for (var k = 0; k < params.rangesClasses.length; k += 1) {
23668 if (calendar.dateInRange(dayDate, params.rangesClasses[k].range)) {
23669 addClass += " " + (params.rangesClasses[k].cssClass);
23675 if ((minDate && dayDate < minDate) || (maxDate && dayDate > maxDate)) {
23678 if (params.disabled) {
23679 if (calendar.dateInRange(dayDate, params.disabled)) {
23684 addClass += ' calendar
-day
-disabled
';
23687 dayDate = new calendar.DateHandleClass(dayDate);
23688 var dayYear = dayDate.getFullYear();
23689 var dayMonth = dayDate.getMonth();
23690 rowHtml += ("\n <div data-year=\"" + dayYear + "\" data-month=\"" + dayMonth + "\" data-day=\"" + dayNumber + "\" class=\"calendar-day" + addClass + "\" data-date=\"" + dayYear + "-" + dayMonth + "-" + dayNumber + "\">\n <span class=\"calendar-day-number\">" + dayNumber + eventsHtml + "</span>\n </div>").trim();
23693 for (var col = 1; col <= cols; col += 1) loop( col );
23694 monthHtml += "<div class=\"calendar-row\">" + rowHtml + "</div>";
23696 monthHtml = "<div class=\"calendar-month\" data-year=\"" + year + "\" data-month=\"" + month + "\">" + monthHtml + "</div>";
23700 Calendar.prototype.renderWeekHeader = function renderWeekHeader () {
23701 var calendar = this;
23702 if (calendar.params.renderWeekHeader) {
23703 return calendar.params.renderWeekHeader.call(calendar);
23705 var params = calendar.params;
23706 var weekDaysHtml = '';
23707 for (var i = 0; i < 7; i += 1) {
23708 var dayIndex = (i + params.firstDay > 6)
23709 ? ((i - 7) + params.firstDay)
23710 : (i + params.firstDay);
23711 var dayName = params.dayNamesShort[dayIndex];
23712 weekDaysHtml += "<div class=\"calendar-week-day\">" + dayName + "</div>";
23714 return ("\n <div class=\"calendar-week-header\">\n " + weekDaysHtml + "\n </div>\n ").trim();
23717 Calendar.prototype.renderMonthSelector = function renderMonthSelector () {
23718 var calendar = this;
23719 if (calendar.params.renderMonthSelector) {
23720 return calendar.params.renderMonthSelector.call(calendar);
23723 return "\n <div class=\"calendar-month-selector\">\n <a class=\"link icon-only calendar-prev-month-button\">\n <i class=\"icon icon-prev\"></i>\n </a>\n <span class=\"current-month-value\"></span>\n <a class=\"link icon-only calendar-next-month-button\">\n <i class=\"icon icon-next\"></i>\n </a>\n </div>\n ".trim();
23726 Calendar.prototype.renderYearSelector = function renderYearSelector () {
23727 var calendar = this;
23728 if (calendar.params.renderYearSelector) {
23729 return calendar.params.renderYearSelector.call(calendar);
23731 return "\n <div class=\"calendar-year-selector\">\n <a class=\"link icon-only calendar-prev-year-button\">\n <i class=\"icon icon-prev\"></i>\n </a>\n <span class=\"current-year-value\"></span>\n <a class=\"link icon-only calendar-next-year-button\">\n <i class=\"icon icon-next\"></i>\n </a>\n </div>\n ".trim();
23734 Calendar.prototype.renderHeader = function renderHeader () {
23735 var calendar = this;
23736 if (calendar.params.renderHeader) {
23737 return calendar.params.renderHeader.call(calendar);
23739 return ("\n <div class=\"calendar-header\">\n <div class=\"calendar-selected-date\">" + (calendar.params.headerPlaceholder) + "</div>\n </div>\n ").trim();
23742 Calendar.prototype.renderFooter = function renderFooter () {
23743 var calendar = this;
23744 var app = calendar.app;
23745 if (calendar.params.renderFooter) {
23746 return calendar.params.renderFooter.call(calendar);
23748 return ("\n <div class=\"calendar-footer\">\n <a class=\"" + (app.theme === 'md
' ? 'button
' : 'link
') + " calendar-close sheet-close popover-close\">" + (calendar.params.toolbarCloseText) + "</a>\n </div>\n ").trim();
23751 Calendar.prototype.renderToolbar = function renderToolbar () {
23752 var calendar = this;
23753 if (calendar.params.renderToolbar) {
23754 return calendar.params.renderToolbar.call(calendar, calendar);
23756 return ("\n <div class=\"toolbar toolbar-top no-shadow\">\n <div class=\"toolbar-inner\">\n " + (calendar.params.monthSelector ? calendar.renderMonthSelector() : '') + "\n " + (calendar.params.yearSelector ? calendar.renderYearSelector() : '') + "\n </div>\n </div>\n ").trim();
23758 // eslint-disable-next-line
23759 Calendar.prototype.renderInline = function renderInline () {
23760 var calendar = this;
23761 var ref = calendar.params;
23762 var cssClass = ref.cssClass;
23763 var toolbar = ref.toolbar;
23764 var header = ref.header;
23765 var footer = ref.footer;
23766 var rangePicker = ref.rangePicker;
23767 var weekHeader = ref.weekHeader;
23768 var value = calendar.value;
23769 var date = value && value.length ? value[0] : new calendar.DateHandleClass().setHours(0, 0, 0);
23770 var inlineHtml = ("\n <div class=\"calendar calendar-inline " + (rangePicker ? 'calendar
-range
' : '') + " " + (cssClass || '') + "\">\n " + (header ? calendar.renderHeader() : '') + "\n " + (toolbar ? calendar.renderToolbar() : '') + "\n " + (weekHeader ? calendar.renderWeekHeader() : '') + "\n <div class=\"calendar-months\">\n " + (calendar.renderMonths(date)) + "\n </div>\n " + (footer ? calendar.renderFooter() : '') + "\n </div>\n ").trim();
23775 Calendar.prototype.renderCustomModal = function renderCustomModal () {
23776 var calendar = this;
23777 var ref = calendar.params;
23778 var cssClass = ref.cssClass;
23779 var toolbar = ref.toolbar;
23780 var header = ref.header;
23781 var footer = ref.footer;
23782 var rangePicker = ref.rangePicker;
23783 var weekHeader = ref.weekHeader;
23784 var value = calendar.value;
23785 var date = value && value.length ? value[0] : new calendar.DateHandleClass().setHours(0, 0, 0);
23786 var sheetHtml = ("\n <div class=\"calendar calendar-modal " + (rangePicker ? 'calendar
-range
' : '') + " " + (cssClass || '') + "\">\n " + (header ? calendar.renderHeader() : '') + "\n " + (toolbar ? calendar.renderToolbar() : '') + "\n " + (weekHeader ? calendar.renderWeekHeader() : '') + "\n <div class=\"calendar-months\">\n " + (calendar.renderMonths(date)) + "\n </div>\n " + (footer ? calendar.renderFooter() : '') + "\n </div>\n ").trim();
23791 Calendar.prototype.renderSheet = function renderSheet () {
23792 var calendar = this;
23793 var ref = calendar.params;
23794 var cssClass = ref.cssClass;
23795 var toolbar = ref.toolbar;
23796 var header = ref.header;
23797 var footer = ref.footer;
23798 var rangePicker = ref.rangePicker;
23799 var weekHeader = ref.weekHeader;
23800 var value = calendar.value;
23801 var date = value && value.length ? value[0] : new calendar.DateHandleClass().setHours(0, 0, 0);
23802 var sheetHtml = ("\n <div class=\"sheet-modal calendar calendar-sheet " + (rangePicker ? 'calendar
-range
' : '') + " " + (cssClass || '') + "\">\n " + (header ? calendar.renderHeader() : '') + "\n " + (toolbar ? calendar.renderToolbar() : '') + "\n " + (weekHeader ? calendar.renderWeekHeader() : '') + "\n <div class=\"sheet-modal-inner calendar-months\">\n " + (calendar.renderMonths(date)) + "\n </div>\n " + (footer ? calendar.renderFooter() : '') + "\n </div>\n ").trim();
23807 Calendar.prototype.renderPopover = function renderPopover () {
23808 var calendar = this;
23809 var ref = calendar.params;
23810 var cssClass = ref.cssClass;
23811 var toolbar = ref.toolbar;
23812 var header = ref.header;
23813 var footer = ref.footer;
23814 var rangePicker = ref.rangePicker;
23815 var weekHeader = ref.weekHeader;
23816 var value = calendar.value;
23817 var date = value && value.length ? value[0] : new calendar.DateHandleClass().setHours(0, 0, 0);
23818 var popoverHtml = ("\n <div class=\"popover calendar-popover\">\n <div class=\"popover-inner\">\n <div class=\"calendar " + (rangePicker ? 'calendar
-range
' : '') + " " + (cssClass || '') + "\">\n " + (header ? calendar.renderHeader() : '') + "\n " + (toolbar ? calendar.renderToolbar() : '') + "\n " + (weekHeader ? calendar.renderWeekHeader() : '') + "\n <div class=\"calendar-months\">\n " + (calendar.renderMonths(date)) + "\n </div>\n " + (footer ? calendar.renderFooter() : '') + "\n </div>\n </div>\n </div>\n ").trim();
23820 return popoverHtml;
23823 Calendar.prototype.render = function render () {
23824 var calendar = this;
23825 var params = calendar.params;
23826 if (params.render) { return params.render.call(calendar); }
23827 if (!calendar.inline) {
23828 var modalType = params.openIn;
23829 if (modalType === 'auto
') { modalType = calendar.isPopover() ? 'popover
' : 'sheet
'; }
23831 if (modalType === 'popover
') { return calendar.renderPopover(); }
23832 if (modalType === 'sheet
') { return calendar.renderSheet(); }
23833 return calendar.renderCustomModal();
23835 return calendar.renderInline();
23838 Calendar.prototype.onOpen = function onOpen () {
23839 var calendar = this;
23840 var initialized = calendar.initialized;
23841 var $el = calendar.$el;
23842 var app = calendar.app;
23843 var $inputEl = calendar.$inputEl;
23844 var inline = calendar.inline;
23845 var value = calendar.value;
23846 var params = calendar.params;
23847 calendar.closing = false;
23848 calendar.opened = true;
23849 calendar.opening = true;
23851 // Init main events
23852 calendar.attachCalendarEvents();
23854 var updateValue = !value && params.value;
23857 if (!initialized) {
23858 if (value) { calendar.setValue(value, 0); }
23859 else if (params.value) {
23860 calendar.setValue(calendar.normalizeValues(params.value), 0);
23862 } else if (value) {
23863 calendar.setValue(value, 0);
23866 // Update current month and year
23867 calendar.updateCurrentMonthYear();
23869 // Set initial translate
23870 calendar.monthsTranslate = 0;
23871 calendar.setMonthsTranslate();
23873 // Update input value
23874 if (updateValue) { calendar.updateValue(); }
23875 else if (params.header && value) {
23876 calendar.updateValue(true);
23880 if (!inline && $inputEl && $inputEl.length && app.theme === 'md
') {
23881 $inputEl.trigger('focus
');
23884 calendar.initialized = true;
23886 calendar.$months.each(function (index, monthEl) {
23887 calendar.emit('local
::monthAdd calendarMonthAdd
', monthEl);
23892 $el.trigger('calendar
:open
', calendar);
23895 $inputEl.trigger('calendar
:open
', calendar);
23897 calendar.emit('local
::open calendarOpen
', calendar);
23900 Calendar.prototype.onOpened = function onOpened () {
23901 var calendar = this;
23902 calendar.opening = false;
23903 if (calendar.$el) {
23904 calendar.$el.trigger('calendar
:opened
', calendar);
23906 if (calendar.$inputEl) {
23907 calendar.$inputEl.trigger('calendar
:opened
', calendar);
23909 calendar.emit('local
::opened calendarOpened
', calendar);
23912 Calendar.prototype.onClose = function onClose () {
23913 var calendar = this;
23914 var app = calendar.app;
23915 calendar.opening = false;
23916 calendar.closing = true;
23918 if (calendar.$inputEl && app.theme === 'md
') {
23919 calendar.$inputEl.trigger('blur
');
23921 if (calendar.detachCalendarEvents) {
23922 calendar.detachCalendarEvents();
23925 if (calendar.$el) {
23926 calendar.$el.trigger('calendar
:close
', calendar);
23928 if (calendar.$inputEl) {
23929 calendar.$inputEl.trigger('calendar
:close
', calendar);
23931 calendar.emit('local
::close calendarClose
', calendar);
23934 Calendar.prototype.onClosed = function onClosed () {
23935 var calendar = this;
23936 calendar.opened = false;
23937 calendar.closing = false;
23939 if (!calendar.inline) {
23940 Utils.nextTick(function () {
23941 if (calendar.modal && calendar.modal.el && calendar.modal.destroy) {
23942 if (!calendar.params.routableModals) {
23943 calendar.modal.destroy();
23946 delete calendar.modal;
23949 if (calendar.$el) {
23950 calendar.$el.trigger('calendar
:closed
', calendar);
23952 if (calendar.$inputEl) {
23953 calendar.$inputEl.trigger('calendar
:closed
', calendar);
23955 calendar.emit('local
::closed calendarClosed
', calendar);
23958 Calendar.prototype.open = function open () {
23961 var calendar = this;
23962 var app = calendar.app;
23963 var opened = calendar.opened;
23964 var inline = calendar.inline;
23965 var $inputEl = calendar.$inputEl;
23966 var params = calendar.params;
23967 if (opened) { return; }
23970 calendar.$el = $(calendar.render());
23971 calendar.$el[0].f7Calendar = calendar;
23972 calendar.$wrapperEl = calendar.$el.find('.calendar
-months
-wrapper
');
23973 calendar.$months = calendar.$wrapperEl.find('.calendar
-month
');
23974 calendar.$containerEl.append(calendar.$el);
23976 calendar.onOpened();
23979 var modalType = params.openIn;
23980 if (modalType === 'auto
') {
23981 modalType = calendar.isPopover() ? 'popover
' : 'sheet
';
23983 var modalContent = calendar.render();
23985 var modalParams = {
23986 targetEl: $inputEl,
23987 scrollToEl: calendar.params.scrollToInput ? $inputEl : undefined,
23988 content: modalContent,
23989 backdrop: calendar.params.backdrop === true || (modalType === 'popover
' && app.params.popover.backdrop !== false && calendar.params.backdrop !== false),
23990 closeByBackdropClick: calendar.params.closeByBackdropClick,
23992 open: function open() {
23994 calendar.modal = modal;
23995 calendar.$el = modalType === 'popover
' ? modal.$el.find('.calendar
') : modal.$el;
23996 calendar.$wrapperEl = calendar.$el.find('.calendar
-months
-wrapper
');
23997 calendar.$months = calendar.$wrapperEl.find('.calendar
-month
');
23998 calendar.$el[0].f7Calendar = calendar;
23999 if (modalType === 'customModal
') {
24000 $(calendar.$el).find('.calendar
-close
').once('click
', function () {
24006 opened: function opened() { calendar.onOpened(); },
24007 close: function close() { calendar.onClose(); },
24008 closed: function closed() { calendar.onClosed(); },
24011 if (calendar.params.routableModals) {
24012 calendar.view.router.navigate({
24016 }, obj[modalType] = modalParams, obj ),
24019 calendar.modal = app[modalType].create(modalParams);
24020 calendar.modal.open();
24024 Calendar.prototype.close = function close () {
24025 var calendar = this;
24026 var opened = calendar.opened;
24027 var inline = calendar.inline;
24028 if (!opened) { return; }
24030 calendar.onClose();
24031 calendar.onClosed();
24034 if (calendar.params.routableModals) {
24035 calendar.view.router.back();
24037 calendar.modal.close();
24041 Calendar.prototype.init = function init () {
24042 var calendar = this;
24044 calendar.initInput();
24046 if (calendar.inline) {
24048 calendar.emit('local
::init calendarInit
', calendar);
24052 if (!calendar.initialized && calendar.params.value) {
24053 calendar.setValue(calendar.normalizeValues(calendar.params.value));
24056 // Attach input Events
24057 if (calendar.$inputEl) {
24058 calendar.attachInputEvents();
24060 if (calendar.params.closeByOutsideClick) {
24061 calendar.attachHtmlEvents();
24063 calendar.emit('local
::init calendarInit
', calendar);
24066 Calendar.prototype.destroy = function destroy () {
24067 var calendar = this;
24068 if (calendar.destroyed) { return; }
24069 var $el = calendar.$el;
24070 calendar.emit('local
::beforeDestroy calendarBeforeDestroy
', calendar);
24071 if ($el) { $el.trigger('calendar
:beforedestroy
', calendar); }
24076 if (calendar.$inputEl) {
24077 calendar.detachInputEvents();
24079 if (calendar.params.closeByOutsideClick) {
24080 calendar.detachHtmlEvents();
24083 if ($el && $el.length) { delete calendar.$el[0].f7Calendar; }
24084 Utils.deleteProps(calendar);
24085 calendar.destroyed = true;
24089 }(Framework7Class));
24094 Calendar: Calendar,
24096 create: function create() {
24098 app.calendar = ConstructorMethods({
24099 defaultSelector: '.calendar
',
24100 constructor: Calendar,
24102 domProp: 'f7Calendar
',
24104 app.calendar.close = function close(el) {
24105 if ( el === void 0 ) el = '.calendar
';
24108 if ($el.length === 0) { return; }
24109 var calendar = $el[0].f7Calendar;
24110 if (!calendar || (calendar && !calendar.opened)) { return; }
24116 // Calendar settings
24117 calendarType: 'gregorian
', // or 'jalali
'
24118 monthNames: ['January
', 'February
', 'March
', 'April
', 'May
', 'June
', 'July
', 'August
', 'September
', 'October
', 'November
', 'December
'],
24119 monthNamesShort: ['Jan
', 'Feb
', 'Mar
', 'Apr
', 'May
', 'Jun
', 'Jul
', 'Aug
', 'Sep
', 'Oct
', 'Nov
', 'Dec
'],
24120 dayNames: ['Sunday
', 'Monday
', 'Tuesday
', 'Wednesday
', 'Thursday
', 'Friday
', 'Saturday
'],
24121 dayNamesShort: ['Sun
', 'Mon
', 'Tue
', 'Wed
', 'Thu
', 'Fri
', 'Sat
'],
24122 firstDay: 1, // First day of the week, Monday
24123 weekendDays: [0, 6], // Sunday and Saturday
24125 monthNames: ['فروردین', 'اردیبهشت', 'خرداد', 'تیر', 'مرداد', 'شهریور', 'مهر', 'آبان', 'آذر', 'دی', 'بهمن', 'اسفند'],
24126 monthNamesShort: ['فَر', 'اُر', 'خُر', 'تیر', 'مُر', 'شَه', 'مهر', 'آب', 'آذر', 'دی', 'بَه', 'اِس'],
24127 dayNames: ['یکشنبه', 'دوشنبه', 'سهشنبه', 'چهارشنبه', 'پنجشنبه', 'جمعه', 'شنبه'],
24128 dayNamesShort: ['1ش', '۲ش', '۳ش', '۴ش', '۵ش', 'ج', 'ش'],
24129 firstDay: 6, // Saturday
24130 weekendDays: [5], // Friday
24133 rangePicker: false,
24134 rangePickerMinDays: 1, // when calendar is used as rangePicker
24135 rangePickerMaxDays: 0, // when calendar is used as rangePicker, 0 means unlimited
24136 dateFormat: 'yyyy
-mm
-dd
',
24137 direction: 'horizontal
', // or 'vertical
'
24140 disabled: null, // dates range of disabled days
24141 events: null, // dates range of days with events
24142 rangesClasses: null, // array with custom classes date ranges
24145 closeOnSelect: false,
24146 monthSelector: true,
24147 yearSelector: true,
24150 // Common opener settings
24152 openIn: 'auto
', // or 'popover
' or 'sheet
' or 'customModal
'
24155 inputReadOnly: true,
24156 closeByOutsideClick: true,
24157 scrollToInput: true,
24159 headerPlaceholder: 'Select date
',
24162 toolbarCloseText: 'Done
',
24164 routableModals: true,
24168 closeByBackdropClick: true,
24169 // Render functions
24170 renderWeekHeader: null,
24171 renderMonths: null,
24173 renderMonthSelector: null,
24174 renderYearSelector: null,
24175 renderHeader: null,
24176 renderFooter: null,
24177 renderToolbar: null,
24178 renderInline: null,
24179 renderPopover: null,
24186 function pickerColumn (colEl, updateItems) {
24188 var app = picker.app;
24189 var $colEl = $(colEl);
24190 var colIndex = $colEl.index();
24191 var col = picker.cols[colIndex];
24192 if (col.divider) { return; }
24195 col.el = $colEl[0];
24196 col.$itemsEl = col.$el.find('.picker
-items
');
24197 col.items = col.$itemsEl.find('.picker
-item
');
24203 var animationFrameId;
24205 function updateDuringScroll() {
24206 animationFrameId = Utils.requestAnimationFrame(function () {
24207 col.updateItems(undefined, undefined, 0);
24208 updateDuringScroll();
24212 col.replaceValues = function replaceColValues(values, displayValues) {
24213 col.detachEvents();
24214 col.values = values;
24215 col.displayValues = displayValues;
24216 col.$itemsEl.html(picker.renderColumn(col, true));
24217 col.items = col.$itemsEl.find('.picker
-item
');
24219 col.setValue(col.values[0], 0, true);
24220 col.attachEvents();
24222 col.calcSize = function calcColSize() {
24223 if (picker.params.rotateEffect) {
24224 col.$el.removeClass('picker
-column
-absolute
');
24225 if (!col.width) { col.$el.css({ width: '' }); }
24228 var colHeight = col.$el[0].offsetHeight;
24229 itemHeight = col.items[0].offsetHeight;
24230 itemsHeight = itemHeight * col.items.length;
24231 minTranslate = ((colHeight / 2) - itemsHeight) + (itemHeight / 2);
24232 maxTranslate = (colHeight / 2) - (itemHeight / 2);
24234 colWidth = col.width;
24235 if (parseInt(colWidth, 10) === colWidth) { colWidth += 'px
'; }
24236 col.$el.css({ width: colWidth });
24238 if (picker.params.rotateEffect) {
24240 col.items.each(function (index, itemEl) {
24241 var item = $(itemEl).children('span
');
24242 colWidth = Math.max(colWidth, item[0].offsetWidth);
24244 col.$el.css({ width: ((colWidth + 2) + "px") });
24246 col.$el.addClass('picker
-column
-absolute
');
24250 col.setValue = function setColValue(newValue, transition, valueCallbacks) {
24251 if ( transition === void 0 ) transition = '';
24253 var newActiveIndex = col.$itemsEl.find((".picker-item[data-picker-value=\"" + newValue + "\"]")).index();
24254 if (typeof newActiveIndex === 'undefined' || newActiveIndex === -1) {
24257 var newTranslate = (-newActiveIndex * itemHeight) + maxTranslate;
24259 col.$itemsEl.transition(transition);
24260 col.$itemsEl.transform(("translate3d(0," + newTranslate + "px,0)"));
24263 if (picker.params.updateValuesOnMomentum && col.activeIndex && col.activeIndex !== newActiveIndex) {
24264 Utils.cancelAnimationFrame(animationFrameId);
24265 col.$itemsEl.transitionEnd(function () {
24266 Utils.cancelAnimationFrame(animationFrameId);
24268 updateDuringScroll();
24272 col.updateItems(newActiveIndex, newTranslate, transition, valueCallbacks);
24275 col.updateItems = function updateColItems(activeIndex, translate, transition, valueCallbacks) {
24276 if (typeof translate === 'undefined') {
24277 // eslint-disable-next-line
24278 translate = Utils.getTranslate(col.$itemsEl[0], 'y
');
24280 // eslint-disable-next-line
24281 if (typeof activeIndex === 'undefined') { activeIndex = -Math.round((translate - maxTranslate) / itemHeight); }
24282 // eslint-disable-next-line
24283 if (activeIndex < 0) { activeIndex = 0; }
24284 // eslint-disable-next-line
24285 if (activeIndex >= col.items.length) { activeIndex = col.items.length - 1; }
24286 var previousActiveIndex = col.activeIndex;
24287 col.activeIndex = activeIndex;
24288 col.$itemsEl.find('.picker
-item
-selected
').removeClass('picker
-item
-selected
');
24290 col.items.transition(transition);
24292 var selectedItem = col.items.eq(activeIndex).addClass('picker
-item
-selected
').transform('');
24294 // Set 3D rotate effect
24295 if (picker.params.rotateEffect) {
24296 col.items.each(function (index, itemEl) {
24297 var $itemEl = $(itemEl);
24298 var itemOffsetTop = $itemEl.index() * itemHeight;
24299 var translateOffset = maxTranslate - translate;
24300 var itemOffset = itemOffsetTop - translateOffset;
24301 var percentage = itemOffset / itemHeight;
24302 var itemsFit = Math.ceil(col.height / itemHeight / 2) + 1;
24304 var angle = (-18 * percentage);
24305 if (angle > 180) { angle = 180; }
24306 if (angle < -180) { angle = -180; }
24307 if (Math.abs(percentage) > itemsFit) {
24308 $itemEl.addClass('picker
-item
-far
');
24310 $itemEl.removeClass('picker
-item
-far
');
24312 $itemEl.transform(("translate3d(0, " + (-translate + maxTranslate) + "px, " + (picker.needsOriginFix ? -110 : 0) + "px) rotateX(" + angle + "deg)"));
24316 if (valueCallbacks || typeof valueCallbacks === 'undefined') {
24318 col.value = selectedItem.attr('data
-picker
-value
');
24319 col.displayValue = col.displayValues ? col.displayValues[activeIndex] : col.value;
24320 // On change callback
24321 if (previousActiveIndex !== activeIndex) {
24322 if (col.onChange) {
24323 col.onChange(picker, col.value, col.displayValue);
24325 picker.updateValue();
24330 var allowItemClick = true;
24335 var touchStartTime;
24337 var startTranslate;
24339 var currentTranslate;
24341 var velocityTranslate;
24342 function handleTouchStart(e) {
24343 if (isMoved || isTouched) { return; }
24344 e.preventDefault();
24346 touchStartY = e.type === 'touchstart
' ? e.targetTouches[0].pageY : e.pageY;
24347 touchCurrentY = touchStartY;
24348 touchStartTime = (new Date()).getTime();
24350 allowItemClick = true;
24351 startTranslate = Utils.getTranslate(col.$itemsEl[0], 'y
');
24352 currentTranslate = startTranslate;
24354 function handleTouchMove(e) {
24355 if (!isTouched) { return; }
24356 e.preventDefault();
24357 allowItemClick = false;
24358 touchCurrentY = e.type === 'touchmove
' ? e.targetTouches[0].pageY : e.pageY;
24361 Utils.cancelAnimationFrame(animationFrameId);
24363 startTranslate = Utils.getTranslate(col.$itemsEl[0], 'y
');
24364 currentTranslate = startTranslate;
24365 col.$itemsEl.transition(0);
24368 var diff = touchCurrentY - touchStartY;
24369 currentTranslate = startTranslate + diff;
24370 returnTo = undefined;
24372 // Normalize translate
24373 if (currentTranslate < minTranslate) {
24374 currentTranslate = minTranslate - (Math.pow( (minTranslate - currentTranslate), 0.8 ));
24377 if (currentTranslate > maxTranslate) {
24378 currentTranslate = maxTranslate + (Math.pow( (currentTranslate - maxTranslate), 0.8 ));
24381 // Transform wrapper
24382 col.$itemsEl.transform(("translate3d(0," + currentTranslate + "px,0)"));
24385 col.updateItems(undefined, currentTranslate, 0, picker.params.updateValuesOnTouchmove);
24388 velocityTranslate = currentTranslate - prevTranslate || currentTranslate;
24389 prevTranslate = currentTranslate;
24391 function handleTouchEnd() {
24392 if (!isTouched || !isMoved) {
24399 col.$itemsEl.transition('');
24401 if (returnTo === 'min
') {
24402 col.$itemsEl.transform(("translate3d(0," + minTranslate + "px,0)"));
24404 col.$itemsEl.transform(("translate3d(0," + maxTranslate + "px,0)"));
24407 touchEndTime = new Date().getTime();
24409 if (touchEndTime - touchStartTime > 300) {
24410 newTranslate = currentTranslate;
24412 newTranslate = currentTranslate + (velocityTranslate * picker.params.momentumRatio);
24415 newTranslate = Math.max(Math.min(newTranslate, maxTranslate), minTranslate);
24418 var activeIndex = Math.round(Math.abs(((newTranslate - maxTranslate) / itemHeight)));
24420 // Normalize translate
24421 if (!picker.params.freeMode) { newTranslate = (-activeIndex * itemHeight) + maxTranslate; }
24423 // Transform wrapper
24424 col.$itemsEl.transform(("translate3d(0," + (parseInt(newTranslate, 10)) + "px,0)"));
24427 col.updateItems(activeIndex, newTranslate, '', true);
24430 if (picker.params.updateValuesOnMomentum) {
24431 updateDuringScroll();
24432 col.$itemsEl.transitionEnd(function () {
24433 Utils.cancelAnimationFrame(animationFrameId);
24438 setTimeout(function () {
24439 allowItemClick = true;
24443 var mousewheelTimeout;
24444 function handleMouseWheel(e) {
24445 var deltaX = e.deltaX;
24446 var deltaY = e.deltaY;
24447 if (Math.abs(deltaX) > Math.abs(deltaY)) { return; }
24448 clearTimeout(mousewheelTimeout);
24450 e.preventDefault();
24452 Utils.cancelAnimationFrame(animationFrameId);
24453 startTranslate = Utils.getTranslate(col.$itemsEl[0], 'y
');
24454 col.$itemsEl.transition(0);
24456 currentTranslate = startTranslate - deltaY;
24457 returnTo = undefined;
24459 // Normalize translate
24460 if (currentTranslate < minTranslate) {
24461 currentTranslate = minTranslate;
24464 if (currentTranslate > maxTranslate) {
24465 currentTranslate = maxTranslate;
24468 // Transform wrapper
24469 col.$itemsEl.transform(("translate3d(0," + currentTranslate + "px,0)"));
24472 col.updateItems(undefined, currentTranslate, 0, picker.params.updateValuesOnMousewheel);
24475 mousewheelTimeout = setTimeout(function () {
24476 col.$itemsEl.transition('');
24478 if (returnTo === 'min
') {
24479 col.$itemsEl.transform(("translate3d(0," + minTranslate + "px,0)"));
24481 col.$itemsEl.transform(("translate3d(0," + maxTranslate + "px,0)"));
24484 touchEndTime = new Date().getTime();
24485 var newTranslate = currentTranslate;
24486 newTranslate = Math.max(Math.min(newTranslate, maxTranslate), minTranslate);
24489 var activeIndex = Math.round(Math.abs(((newTranslate - maxTranslate) / itemHeight)));
24491 // Normalize translate
24492 if (!picker.params.freeMode) { newTranslate = (-activeIndex * itemHeight) + maxTranslate; }
24494 // Transform wrapper
24495 col.$itemsEl.transform(("translate3d(0," + (parseInt(newTranslate, 10)) + "px,0)"));
24498 col.updateItems(activeIndex, newTranslate, '', true);
24502 function handleClick() {
24503 if (!allowItemClick) { return; }
24504 Utils.cancelAnimationFrame(animationFrameId);
24505 var value = $(this).attr('data
-picker
-value
');
24506 col.setValue(value);
24509 var activeListener = app.support.passiveListener ? { passive: false, capture: false } : false;
24510 col.attachEvents = function attachColEvents() {
24511 col.$el.on(app.touchEvents.start, handleTouchStart, activeListener);
24512 app.on('touchmove
:active
', handleTouchMove);
24513 app.on('touchend
:passive
', handleTouchEnd);
24514 if (picker.params.mousewheel) {
24515 col.$el.on('wheel
', handleMouseWheel);
24517 col.items.on('click
', handleClick);
24519 col.detachEvents = function detachColEvents() {
24520 col.$el.off(app.touchEvents.start, handleTouchStart, activeListener);
24521 app.off('touchmove
:active
', handleTouchMove);
24522 app.off('touchend
:passive
', handleTouchEnd);
24523 if (picker.params.mousewheel) {
24524 col.$el.off('wheel
', handleMouseWheel);
24526 col.items.off('click
', handleClick);
24529 col.init = function initCol() {
24531 col.$itemsEl.transform(("translate3d(0," + maxTranslate + "px,0)")).transition(0);
24532 if (colIndex === 0) { col.$el.addClass('picker
-column
-first
'); }
24533 if (colIndex === picker.cols.length - 1) { col.$el.addClass('picker
-column
-last
'); }
24534 // Update items on init
24535 if (updateItems) { col.updateItems(0, maxTranslate, 0); }
24537 col.attachEvents();
24540 col.destroy = function destroyCol() {
24541 col.detachEvents();
24547 var Picker = /*@__PURE__*/(function (Framework7Class) {
24548 function Picker(app, params) {
24549 if ( params === void 0 ) params = {};
24551 Framework7Class.call(this, params, [app]);
24553 picker.params = Utils.extend({}, app.params.picker, params);
24556 if (picker.params.containerEl) {
24557 $containerEl = $(picker.params.containerEl);
24558 if ($containerEl.length === 0) { return picker; }
24562 if (picker.params.inputEl) {
24563 $inputEl = $(picker.params.inputEl);
24568 view = $inputEl.parents('.view
').length && $inputEl.parents('.view
')[0].f7View;
24570 if (!view) { view = app.views.main; }
24572 Utils.extend(picker, {
24574 $containerEl: $containerEl,
24575 containerEl: $containerEl && $containerEl[0],
24576 inline: $containerEl && $containerEl.length > 0,
24577 needsOriginFix: app.device.ios || ((win.navigator.userAgent.toLowerCase().indexOf('safari
') >= 0 && win.navigator.userAgent.toLowerCase().indexOf('chrome
') < 0) && !app.device.android),
24579 $inputEl: $inputEl,
24580 inputEl: $inputEl && $inputEl[0],
24581 initialized: false,
24583 url: picker.params.url,
24587 function onResize() {
24588 picker.resizeCols();
24590 function onInputClick() {
24593 function onInputFocus(e) {
24594 e.preventDefault();
24596 function onHtmlClick(e) {
24597 var $targetEl = $(e.target);
24598 if (picker.isPopover()) { return; }
24599 if (!picker.opened || picker.closing) { return; }
24600 if ($targetEl.closest('[class*="backdrop"]').length) { return; }
24601 if ($inputEl && $inputEl.length > 0) {
24602 if ($targetEl[0] !== $inputEl[0] && $targetEl.closest('.sheet
-modal
').length === 0) {
24605 } else if ($(e.target).closest('.sheet
-modal
').length === 0) {
24611 Utils.extend(picker, {
24612 attachResizeEvent: function attachResizeEvent() {
24613 app.on('resize
', onResize);
24615 detachResizeEvent: function detachResizeEvent() {
24616 app.off('resize
', onResize);
24618 attachInputEvents: function attachInputEvents() {
24619 picker.$inputEl.on('click
', onInputClick);
24620 if (picker.params.inputReadOnly) {
24621 picker.$inputEl.on('focus mousedown
', onInputFocus);
24624 detachInputEvents: function detachInputEvents() {
24625 picker.$inputEl.off('click
', onInputClick);
24626 if (picker.params.inputReadOnly) {
24627 picker.$inputEl.off('focus mousedown
', onInputFocus);
24630 attachHtmlEvents: function attachHtmlEvents() {
24631 app.on('click
', onHtmlClick);
24633 detachHtmlEvents: function detachHtmlEvents() {
24634 app.off('click
', onHtmlClick);
24643 if ( Framework7Class ) Picker.__proto__ = Framework7Class;
24644 Picker.prototype = Object.create( Framework7Class && Framework7Class.prototype );
24645 Picker.prototype.constructor = Picker;
24647 Picker.prototype.initInput = function initInput () {
24649 if (!picker.$inputEl) { return; }
24650 if (picker.params.inputReadOnly) { picker.$inputEl.prop('readOnly
', true); }
24653 Picker.prototype.resizeCols = function resizeCols () {
24655 if (!picker.opened) { return; }
24656 for (var i = 0; i < picker.cols.length; i += 1) {
24657 if (!picker.cols[i].divider) {
24658 picker.cols[i].calcSize();
24659 picker.cols[i].setValue(picker.cols[i].value, 0, false);
24664 Picker.prototype.isPopover = function isPopover () {
24666 var app = picker.app;
24667 var modal = picker.modal;
24668 var params = picker.params;
24669 if (params.openIn === 'sheet
') { return false; }
24670 if (modal && modal.type !== 'popover
') { return false; }
24672 if (!picker.inline && picker.inputEl) {
24673 if (params.openIn === 'popover
') { return true; }
24674 if (app.device.ios) {
24675 return !!app.device.ipad;
24677 if (app.width >= 768) {
24680 if (app.device.desktop && app.theme === 'aurora
') {
24687 Picker.prototype.formatValue = function formatValue () {
24689 var value = picker.value;
24690 var displayValue = picker.displayValue;
24691 if (picker.params.formatValue) {
24692 return picker.params.formatValue.call(picker, value, displayValue);
24694 return value.join(' ');
24697 Picker.prototype.setValue = function setValue (values, transition) {
24699 var valueIndex = 0;
24700 if (picker.cols.length === 0) {
24701 picker.value = values;
24702 picker.updateValue(values);
24705 for (var i = 0; i < picker.cols.length; i += 1) {
24706 if (picker.cols[i] && !picker.cols[i].divider) {
24707 picker.cols[i].setValue(values[valueIndex], transition);
24713 Picker.prototype.getValue = function getValue () {
24715 return picker.value;
24718 Picker.prototype.updateValue = function updateValue (forceValues) {
24720 var newValue = forceValues || [];
24721 var newDisplayValue = [];
24723 if (picker.cols.length === 0) {
24724 var noDividerColumns = picker.params.cols.filter(function (c) { return !c.divider; });
24725 for (var i = 0; i < noDividerColumns.length; i += 1) {
24726 column = noDividerColumns[i];
24727 if (column.displayValues !== undefined && column.values !== undefined && column.values.indexOf(newValue[i]) !== -1) {
24728 newDisplayValue.push(column.displayValues[column.values.indexOf(newValue[i])]);
24730 newDisplayValue.push(newValue[i]);
24734 for (var i$1 = 0; i$1 < picker.cols.length; i$1 += 1) {
24735 if (!picker.cols[i$1].divider) {
24736 newValue.push(picker.cols[i$1].value);
24737 newDisplayValue.push(picker.cols[i$1].displayValue);
24742 if (newValue.indexOf(undefined) >= 0) {
24745 picker.value = newValue;
24746 picker.displayValue = newDisplayValue;
24747 picker.emit('local
::change pickerChange
', picker, picker.value, picker.displayValue);
24748 if (picker.inputEl) {
24749 picker.$inputEl.val(picker.formatValue());
24750 picker.$inputEl.trigger('change
');
24754 Picker.prototype.initColumn = function initColumn (colEl, updateItems) {
24756 pickerColumn.call(picker, colEl, updateItems);
24758 // eslint-disable-next-line
24759 Picker.prototype.destroyColumn = function destroyColumn (colEl) {
24761 var $colEl = $(colEl);
24762 var index = $colEl.index();
24763 if (picker.cols[index] && picker.cols[index].destroy) {
24764 picker.cols[index].destroy();
24768 Picker.prototype.renderToolbar = function renderToolbar () {
24770 if (picker.params.renderToolbar) { return picker.params.renderToolbar.call(picker, picker); }
24771 return ("\n <div class=\"toolbar toolbar-top no-shadow\">\n <div class=\"toolbar-inner\">\n <div class=\"left\"></div>\n <div class=\"right\">\n <a class=\"link sheet-close popover-close\">" + (picker.params.toolbarCloseText) + "</a>\n </div>\n </div>\n </div>\n ").trim();
24773 // eslint-disable-next-line
24774 Picker.prototype.renderColumn = function renderColumn (col, onlyItems) {
24775 var colClasses = "picker-column " + (col.textAlign ? ("picker-column-" + (col.textAlign)) : '') + " " + (col.cssClass || '');
24777 var columnItemsHtml;
24780 columnHtml = "\n <div class=\"" + colClasses + " picker-column-divider\">" + (col.content) + "</div>\n ";
24782 columnItemsHtml = col.values.map(function (value, index) { return ("\n <div class=\"picker-item\" data-picker-value=\"" + value + "\">\n <span>" + (col.displayValues ? col.displayValues[index] : value) + "</span>\n </div>\n "); }).join('');
24783 columnHtml = "\n <div class=\"" + colClasses + "\">\n <div class=\"picker-items\">" + columnItemsHtml + "</div>\n </div>\n ";
24786 return onlyItems ? columnItemsHtml.trim() : columnHtml.trim();
24789 Picker.prototype.renderInline = function renderInline () {
24791 var ref = picker.params;
24792 var rotateEffect = ref.rotateEffect;
24793 var cssClass = ref.cssClass;
24794 var toolbar = ref.toolbar;
24795 var inlineHtml = ("\n <div class=\"picker picker-inline " + (rotateEffect ? 'picker
-3d
' : '') + " " + (cssClass || '') + "\">\n " + (toolbar ? picker.renderToolbar() : '') + "\n <div class=\"picker-columns\">\n " + (picker.cols.map(function (col) { return picker.renderColumn(col); }).join('')) + "\n <div class=\"picker-center-highlight\"></div>\n </div>\n </div>\n ").trim();
24800 Picker.prototype.renderSheet = function renderSheet () {
24802 var ref = picker.params;
24803 var rotateEffect = ref.rotateEffect;
24804 var cssClass = ref.cssClass;
24805 var toolbar = ref.toolbar;
24806 var sheetHtml = ("\n <div class=\"sheet-modal picker picker-sheet " + (rotateEffect ? 'picker
-3d
' : '') + " " + (cssClass || '') + "\">\n " + (toolbar ? picker.renderToolbar() : '') + "\n <div class=\"sheet-modal-inner picker-columns\">\n " + (picker.cols.map(function (col) { return picker.renderColumn(col); }).join('')) + "\n <div class=\"picker-center-highlight\"></div>\n </div>\n </div>\n ").trim();
24811 Picker.prototype.renderPopover = function renderPopover () {
24813 var ref = picker.params;
24814 var rotateEffect = ref.rotateEffect;
24815 var cssClass = ref.cssClass;
24816 var toolbar = ref.toolbar;
24817 var popoverHtml = ("\n <div class=\"popover picker-popover\">\n <div class=\"popover-inner\">\n <div class=\"picker " + (rotateEffect ? 'picker
-3d
' : '') + " " + (cssClass || '') + "\">\n " + (toolbar ? picker.renderToolbar() : '') + "\n <div class=\"picker-columns\">\n " + (picker.cols.map(function (col) { return picker.renderColumn(col); }).join('')) + "\n <div class=\"picker-center-highlight\"></div>\n </div>\n </div>\n </div>\n </div>\n ").trim();
24819 return popoverHtml;
24822 Picker.prototype.render = function render () {
24824 if (picker.params.render) { return picker.params.render.call(picker); }
24825 if (!picker.inline) {
24826 if (picker.isPopover()) { return picker.renderPopover(); }
24827 return picker.renderSheet();
24829 return picker.renderInline();
24832 Picker.prototype.onOpen = function onOpen () {
24834 var initialized = picker.initialized;
24835 var $el = picker.$el;
24836 var app = picker.app;
24837 var $inputEl = picker.$inputEl;
24838 var inline = picker.inline;
24839 var value = picker.value;
24840 var params = picker.params;
24841 picker.opened = true;
24842 picker.closing = false;
24843 picker.opening = true;
24845 // Init main events
24846 picker.attachResizeEvent();
24849 $el.find('.picker
-column
').each(function (index, colEl) {
24850 var updateItems = true;
24852 (!initialized && params.value)
24853 || (initialized && value)
24855 updateItems = false;
24857 picker.initColumn(colEl, updateItems);
24861 if (!initialized) {
24862 if (value) { picker.setValue(value, 0); }
24863 else if (params.value) {
24864 picker.setValue(params.value, 0);
24866 } else if (value) {
24867 picker.setValue(value, 0);
24871 if (!inline && $inputEl && $inputEl.length && app.theme === 'md
') {
24872 $inputEl.trigger('focus
');
24875 picker.initialized = true;
24879 $el.trigger('picker
:open
', picker);
24882 $inputEl.trigger('picker
:open
', picker);
24884 picker.emit('local
::open pickerOpen
', picker);
24887 Picker.prototype.onOpened = function onOpened () {
24889 picker.opening = false;
24892 picker.$el.trigger('picker
:opened
', picker);
24894 if (picker.$inputEl) {
24895 picker.$inputEl.trigger('picker
:opened
', picker);
24897 picker.emit('local
::opened pickerOpened
', picker);
24900 Picker.prototype.onClose = function onClose () {
24902 var app = picker.app;
24903 picker.opening = false;
24904 picker.closing = true;
24907 picker.detachResizeEvent();
24909 picker.cols.forEach(function (col) {
24910 if (col.destroy) { col.destroy(); }
24912 if (picker.$inputEl && app.theme === 'md
') {
24913 picker.$inputEl.trigger('blur
');
24917 picker.$el.trigger('picker
:close
', picker);
24919 if (picker.$inputEl) {
24920 picker.$inputEl.trigger('picker
:close
', picker);
24922 picker.emit('local
::close pickerClose
', picker);
24925 Picker.prototype.onClosed = function onClosed () {
24927 picker.opened = false;
24928 picker.closing = false;
24930 if (!picker.inline) {
24931 Utils.nextTick(function () {
24932 if (picker.modal && picker.modal.el && picker.modal.destroy) {
24933 if (!picker.params.routableModals) {
24934 picker.modal.destroy();
24937 delete picker.modal;
24942 picker.$el.trigger('picker
:closed
', picker);
24944 if (picker.$inputEl) {
24945 picker.$inputEl.trigger('picker
:closed
', picker);
24947 picker.emit('local
::closed pickerClosed
', picker);
24950 Picker.prototype.open = function open () {
24954 var app = picker.app;
24955 var opened = picker.opened;
24956 var inline = picker.inline;
24957 var $inputEl = picker.$inputEl;
24958 if (opened) { return; }
24959 if (picker.cols.length === 0 && picker.params.cols.length) {
24960 picker.params.cols.forEach(function (col) {
24961 picker.cols.push(col);
24965 picker.$el = $(picker.render());
24966 picker.$el[0].f7Picker = picker;
24967 picker.$containerEl.append(picker.$el);
24972 var isPopover = picker.isPopover();
24973 var modalType = isPopover ? 'popover
' : 'sheet
';
24974 var modalParams = {
24975 targetEl: $inputEl,
24976 scrollToEl: picker.params.scrollToInput ? $inputEl : undefined,
24977 content: picker.render(),
24978 backdrop: isPopover,
24980 open: function open() {
24982 picker.modal = modal;
24983 picker.$el = isPopover ? modal.$el.find('.picker
') : modal.$el;
24984 picker.$el[0].f7Picker = picker;
24987 opened: function opened() { picker.onOpened(); },
24988 close: function close() { picker.onClose(); },
24989 closed: function closed() { picker.onClosed(); },
24992 if (picker.params.routableModals) {
24993 picker.view.router.navigate({
24997 }, obj[modalType] = modalParams, obj ),
25000 picker.modal = app[modalType].create(modalParams);
25001 picker.modal.open();
25005 Picker.prototype.close = function close () {
25007 var opened = picker.opened;
25008 var inline = picker.inline;
25009 if (!opened) { return; }
25015 if (picker.params.routableModals) {
25016 picker.view.router.back();
25018 picker.modal.close();
25022 Picker.prototype.init = function init () {
25025 picker.initInput();
25027 if (picker.inline) {
25029 picker.emit('local
::init pickerInit
', picker);
25033 if (!picker.initialized && picker.params.value) {
25034 picker.setValue(picker.params.value);
25037 // Attach input Events
25038 if (picker.$inputEl) {
25039 picker.attachInputEvents();
25041 if (picker.params.closeByOutsideClick) {
25042 picker.attachHtmlEvents();
25044 picker.emit('local
::init pickerInit
', picker);
25047 Picker.prototype.destroy = function destroy () {
25049 if (picker.destroyed) { return; }
25050 var $el = picker.$el;
25051 picker.emit('local
::beforeDestroy pickerBeforeDestroy
', picker);
25052 if ($el) { $el.trigger('picker
:beforedestroy
', picker); }
25057 if (picker.$inputEl) {
25058 picker.detachInputEvents();
25060 if (picker.params.closeByOutsideClick) {
25061 picker.detachHtmlEvents();
25064 if ($el && $el.length) { delete picker.$el[0].f7Picker; }
25065 Utils.deleteProps(picker);
25066 picker.destroyed = true;
25070 }(Framework7Class));
25077 create: function create() {
25079 app.picker = ConstructorMethods({
25080 defaultSelector: '.picker
',
25081 constructor: Picker,
25083 domProp: 'f7Picker
',
25085 app.picker.close = function close(el) {
25086 if ( el === void 0 ) el = '.picker
';
25089 if ($el.length === 0) { return; }
25090 var picker = $el[0].f7Picker;
25091 if (!picker || (picker && !picker.opened)) { return; }
25098 updateValuesOnMomentum: false,
25099 updateValuesOnTouchmove: true,
25100 updateValuesOnMousewheel: true,
25102 rotateEffect: false,
25106 // Common opener settings
25108 openIn: 'auto
', // or 'popover
' or 'sheet
'
25111 inputReadOnly: true,
25112 closeByOutsideClick: true,
25113 scrollToInput: true,
25115 toolbarCloseText: 'Done
',
25117 routableModals: true,
25120 // Render functions
25121 renderToolbar: null,
25127 var InfiniteScroll = {
25128 handleScroll: function handleScroll(el, e) {
25131 var scrollTop = $el[0].scrollTop;
25132 var scrollHeight = $el[0].scrollHeight;
25133 var height = $el[0].offsetHeight;
25134 var distance = $el[0].getAttribute('data
-infinite
-distance
');
25136 var virtualListContainer = $el.find('.virtual
-list
');
25139 var onTop = $el.hasClass('infinite
-scroll
-top
');
25140 if (!distance) { distance = 50; }
25141 if (typeof distance === 'string
' && distance.indexOf('%') >= 0) {
25142 distance = (parseInt(distance, 10) / 100) * height;
25144 if (distance > height) { distance = height; }
25146 if (scrollTop < distance) {
25147 $el.trigger('infinite
', e);
25148 app.emit('infinite
', $el[0], e);
25150 } else if (scrollTop + height >= scrollHeight - distance) {
25151 if (virtualListContainer.length > 0) {
25152 virtualList = virtualListContainer.eq(-1)[0].f7VirtualList;
25153 if (virtualList && !virtualList.reachEnd && !virtualList.params.updatableScroll) {
25157 $el.trigger('infinite
', e);
25158 app.emit('infinite
', $el[0], e);
25161 create: function create(el) {
25164 $el.on('scroll
', function handle(e) {
25165 app.infiniteScroll.handle(this, e);
25168 destroy: function destroy(el) {
25173 var InfiniteScroll$1 = {
25174 name: 'infiniteScroll
',
25175 create: function create() {
25177 Utils.extend(app, {
25179 handle: InfiniteScroll.handleScroll.bind(app),
25180 create: InfiniteScroll.create.bind(app),
25181 destroy: InfiniteScroll.destroy.bind(app),
25186 tabMounted: function tabMounted(tabEl) {
25188 var $tabEl = $(tabEl);
25189 $tabEl.find('.infinite
-scroll
-content
').each(function (index, el) {
25190 app.infiniteScroll.create(el);
25193 tabBeforeRemove: function tabBeforeRemove(tabEl) {
25194 var $tabEl = $(tabEl);
25196 $tabEl.find('.infinite
-scroll
-content
').each(function (index, el) {
25197 app.infiniteScroll.destroy(el);
25200 pageInit: function pageInit(page) {
25202 page.$el.find('.infinite
-scroll
-content
').each(function (index, el) {
25203 app.infiniteScroll.create(el);
25206 pageBeforeRemove: function pageBeforeRemove(page) {
25208 page.$el.find('.infinite
-scroll
-content
').each(function (index, el) {
25209 app.infiniteScroll.destroy(el);
25215 var PullToRefresh = /*@__PURE__*/(function (Framework7Class) {
25216 function PullToRefresh(app, el) {
25217 Framework7Class.call(this, {}, [app]);
25220 var $preloaderEl = $el.find('.ptr
-preloader
');
25226 ptr.bottom = ptr.$el.hasClass('ptr
-bottom
');
25228 // Extend defaults with modules params
25229 ptr.useModulesParams({});
25231 var isMaterial = app.theme === 'md
';
25232 var isIos = app.theme === 'ios
';
25233 var isAurora = app.theme === 'aurora
';
25236 ptr.done = function done() {
25237 var $transitionTarget = isMaterial ? $preloaderEl : $el;
25238 $transitionTarget.transitionEnd(function () {
25239 $el.removeClass('ptr
-transitioning ptr
-pull
-up ptr
-pull
-down
');
25240 $el.trigger('ptr
:done
');
25241 ptr.emit('local
::done ptrDone
', $el[0]);
25243 $el.removeClass('ptr
-refreshing
').addClass('ptr
-transitioning
');
25247 ptr.refresh = function refresh() {
25248 if ($el.hasClass('ptr
-refreshing
')) { return ptr; }
25249 $el.addClass('ptr
-transitioning ptr
-refreshing
');
25250 $el.trigger('ptr
:refresh
', ptr.done);
25251 ptr.emit('local
::refresh ptrRefresh
', $el[0], ptr.done);
25256 ptr.mousewheel = $el.attr('data
-ptr
-mousewheel
') === 'true';
25262 var touchesStart = {};
25265 var refresh = false;
25266 var useTranslate = false;
25267 var forceUseTranslate = false;
25268 var startTranslate = 0;
25272 var triggerDistance;
25273 var dynamicTriggerDistance;
25275 var hasNavbar = false;
25279 var $pageEl = $el.parents('.page
');
25281 if ($pageEl.find('.navbar
').length > 0 || $pageEl.parents('.view
').children('.navbar
').length > 0) { hasNavbar = true; }
25282 if ($pageEl.hasClass('no
-navbar
')) { hasNavbar = false; }
25283 if (!hasNavbar && !ptr.bottom) { $el.addClass('ptr
-no
-navbar
'); }
25285 // Define trigger distance
25286 if ($el.attr('data
-ptr
-distance
')) {
25287 dynamicTriggerDistance = true;
25288 } else if (isMaterial) {
25289 triggerDistance = 66;
25290 } else if (isIos) {
25291 triggerDistance = 44;
25292 } else if (isAurora) {
25293 triggerDistance = 38;
25296 function handleTouchStart(e) {
25298 if (Device.os === 'android
') {
25299 if ('targetTouches
' in e && e.targetTouches.length > 1) { return; }
25303 if ($el.hasClass('ptr
-refreshing
')) {
25306 if ($(e.target).closest('.sortable
-handler
, .ptr
-ignore
, .card
-expandable
.card
-opened
').length) { return; }
25309 pullStarted = false;
25311 isScrolling = undefined;
25312 wasScrolled = undefined;
25313 if (e.type === 'touchstart
') { touchId = e.targetTouches[0].identifier; }
25314 touchesStart.x = e.type === 'touchstart
' ? e.targetTouches[0].pageX : e.pageX;
25315 touchesStart.y = e.type === 'touchstart
' ? e.targetTouches[0].pageY : e.pageY;
25318 function handleTouchMove(e) {
25319 if (!isTouched) { return; }
25323 if (e.type === 'touchmove
') {
25324 if (touchId && e.touches) {
25325 for (var i = 0; i < e.touches.length; i += 1) {
25326 if (e.touches[i].identifier === touchId) {
25327 touch = e.touches[i];
25331 if (!touch) { touch = e.targetTouches[0]; }
25332 pageX = touch.pageX;
25333 pageY = touch.pageY;
25338 if (!pageX || !pageY) { return; }
25341 if (typeof isScrolling === 'undefined') {
25342 isScrolling = !!(isScrolling || Math.abs(pageY - touchesStart.y) > Math.abs(pageX - touchesStart.x));
25344 if (!isScrolling) {
25349 scrollTop = $el[0].scrollTop;
25352 $el.removeClass('ptr
-transitioning
');
25353 var targetIsScrollable;
25354 scrollHeight = $el[0].scrollHeight;
25355 offsetHeight = $el[0].offsetHeight;
25357 maxScrollTop = scrollHeight - offsetHeight;
25359 if (scrollTop > scrollHeight) {
25363 var $ptrWatchScrollable = $(e.target).closest('.ptr
-watch
-scroll
');
25364 if ($ptrWatchScrollable.length) {
25365 $ptrWatchScrollable.each(function (ptrScrollableIndex, ptrScrollableEl) {
25366 if (ptrScrollableEl === el) { return; }
25368 (ptrScrollableEl.scrollHeight > ptrScrollableEl.offsetHeight)
25369 && $(ptrScrollableEl).css('overflow
') === 'auto
'
25371 (!ptr.bottom && ptrScrollableEl.scrollTop > 0)
25372 || (ptr.bottom && ptrScrollableEl.scrollTop < ptrScrollableEl.scrollHeight - ptrScrollableEl.offsetHeight)
25375 targetIsScrollable = true;
25379 if (targetIsScrollable) {
25383 if (dynamicTriggerDistance) {
25384 triggerDistance = $el.attr('data
-ptr
-distance
');
25385 if (triggerDistance.indexOf('%') >= 0) { triggerDistance = (scrollHeight * parseInt(triggerDistance, 10)) / 100; }
25387 startTranslate = $el.hasClass('ptr
-refreshing
') ? triggerDistance : 0;
25388 if (scrollHeight === offsetHeight || Device.os !== 'ios
' || isMaterial) {
25389 useTranslate = true;
25391 useTranslate = false;
25393 forceUseTranslate = false;
25396 touchesDiff = pageY - touchesStart.y;
25398 if (typeof wasScrolled === 'undefined' && (ptr.bottom ? scrollTop !== maxScrollTop : scrollTop !== 0)) { wasScrolled = true; }
25400 var ptrStarted = ptr.bottom
25401 ? (touchesDiff < 0 && scrollTop >= maxScrollTop) || scrollTop > maxScrollTop
25402 : (touchesDiff > 0 && scrollTop <= 0) || scrollTop < 0;
25406 if (Device.os === 'ios
' && parseInt(Device.osVersion.split('.')[0], 10) > 7) {
25407 if (!ptr.bottom && scrollTop === 0 && !wasScrolled) { useTranslate = true; }
25408 if (ptr.bottom && scrollTop === maxScrollTop && !wasScrolled) { useTranslate = true; }
25411 if (!useTranslate && ptr.bottom && !isMaterial) {
25412 $el.css('-webkit
-overflow
-scrolling
', 'auto
');
25413 $el.scrollTop(maxScrollTop);
25414 forceUseTranslate = true;
25417 if (useTranslate || forceUseTranslate) {
25418 if (e.cancelable) {
25419 e.preventDefault();
25421 translate = (ptr.bottom ? -1 * (Math.pow( Math.abs(touchesDiff), 0.85 )) : Math.pow( touchesDiff, 0.85 )) + startTranslate;
25423 $preloaderEl.transform(("translate3d(0," + translate + "px,0)"))
25424 .find('.ptr
-arrow
').transform(("rotate(" + ((180 * (Math.abs(touchesDiff) / 66)) + 100) + "deg)"));
25426 // eslint-disable-next-line
25428 $el.children().transform(("translate3d(0," + translate + "px,0)"));
25430 $el.transform(("translate3d(0," + translate + "px,0)"));
25435 if (((useTranslate || forceUseTranslate) && (Math.pow( Math.abs(touchesDiff), 0.85 )) > triggerDistance) || (!useTranslate && Math.abs(touchesDiff) >= triggerDistance * 2)) {
25437 $el.addClass('ptr
-pull
-up
').removeClass('ptr
-pull
-down
');
25440 $el.removeClass('ptr
-pull
-up
').addClass('ptr
-pull
-down
');
25442 if (!pullStarted) {
25443 $el.trigger('ptr
:pullstart
');
25444 ptr.emit('local
::pullStart ptrPullStart
', $el[0]);
25445 pullStarted = true;
25447 $el.trigger('ptr
:pullmove
', {
25449 scrollTop: scrollTop,
25450 translate: translate,
25451 touchesDiff: touchesDiff,
25453 ptr.emit('local
::pullMove ptrPullMove
', $el[0], {
25455 scrollTop: scrollTop,
25456 translate: translate,
25457 touchesDiff: touchesDiff,
25460 pullStarted = false;
25461 $el.removeClass('ptr
-pull
-up ptr
-pull
-down
');
25465 function handleTouchEnd(e) {
25466 if (e.type === 'touchend
' && e.changedTouches && e.changedTouches.length > 0 && touchId) {
25467 if (e.changedTouches[0].identifier !== touchId) {
25469 isScrolling = false;
25475 if (!isTouched || !isMoved) {
25481 $el.addClass('ptr
-transitioning
');
25485 $preloaderEl.transform('')
25486 .find('.ptr
-arrow
').transform('');
25488 // eslint-disable-next-line
25490 $el.children().transform('');
25496 if (!useTranslate && ptr.bottom && !isMaterial) {
25497 $el.css('-webkit
-overflow
-scrolling
', '');
25501 $el.addClass('ptr
-refreshing
');
25502 $el.trigger('ptr
:refresh
', ptr.done);
25503 ptr.emit('local
::refresh ptrRefresh
', $el[0], ptr.done);
25505 $el.removeClass('ptr
-pull
-down
');
25510 $el.trigger('ptr
:pullend
');
25511 ptr.emit('local
::pullEnd ptrPullEnd
', $el[0]);
25515 var mousewheelTimeout;
25516 var mousewheelMoved;
25517 var mousewheelAllow = true;
25518 var mousewheelTranslate = 0;
25520 function handleMouseWheelRelease() {
25521 mousewheelAllow = true;
25522 mousewheelMoved = false;
25523 mousewheelTranslate = 0;
25525 $el.addClass('ptr
-transitioning
');
25529 $preloaderEl.transform('')
25530 .find('.ptr
-arrow
').transform('');
25532 // eslint-disable-next-line
25534 $el.children().transform('');
25541 $el.addClass('ptr
-refreshing
');
25542 $el.trigger('ptr
:refresh
', ptr.done);
25543 ptr.emit('local
::refresh ptrRefresh
', $el[0], ptr.done);
25545 $el.removeClass('ptr
-pull
-down
');
25548 $el.trigger('ptr
:pullend
');
25549 ptr.emit('local
::pullEnd ptrPullEnd
', $el[0]);
25552 function handleMouseWheel(e) {
25553 if (!mousewheelAllow) { return; }
25554 var deltaX = e.deltaX;
25555 var deltaY = e.deltaY;
25556 if (Math.abs(deltaX) > Math.abs(deltaY)) { return; }
25557 if ($el.hasClass('ptr
-refreshing
')) {
25560 if ($(e.target).closest('.sortable
-handler
, .ptr
-ignore
, .card
-expandable
.card
-opened
').length) { return; }
25562 clearTimeout(mousewheelTimeout);
25564 scrollTop = $el[0].scrollTop;
25566 if (!mousewheelMoved) {
25567 $el.removeClass('ptr
-transitioning
');
25568 var targetIsScrollable;
25569 scrollHeight = $el[0].scrollHeight;
25570 offsetHeight = $el[0].offsetHeight;
25572 maxScrollTop = scrollHeight - offsetHeight;
25574 if (scrollTop > scrollHeight) {
25575 mousewheelAllow = false;
25578 var $ptrWatchScrollable = $(e.target).closest('.ptr
-watch
-scroll
');
25579 if ($ptrWatchScrollable.length) {
25580 $ptrWatchScrollable.each(function (ptrScrollableIndex, ptrScrollableEl) {
25581 if (ptrScrollableEl === el) { return; }
25583 (ptrScrollableEl.scrollHeight > ptrScrollableEl.offsetHeight)
25584 && $(ptrScrollableEl).css('overflow
') === 'auto
'
25586 (!ptr.bottom && ptrScrollableEl.scrollTop > 0)
25587 || (ptr.bottom && ptrScrollableEl.scrollTop < ptrScrollableEl.scrollHeight - ptrScrollableEl.offsetHeight)
25590 targetIsScrollable = true;
25594 if (targetIsScrollable) {
25595 mousewheelAllow = false;
25598 if (dynamicTriggerDistance) {
25599 triggerDistance = $el.attr('data
-ptr
-distance
');
25600 if (triggerDistance.indexOf('%') >= 0) { triggerDistance = (scrollHeight * parseInt(triggerDistance, 10)) / 100; }
25604 mousewheelTranslate -= deltaY;
25605 touchesDiff = mousewheelTranslate; // pageY - touchesStart.y;
25607 if (typeof wasScrolled === 'undefined' && (ptr.bottom ? scrollTop !== maxScrollTop : scrollTop !== 0)) { wasScrolled = true; }
25609 var ptrStarted = ptr.bottom
25610 ? (touchesDiff < 0 && scrollTop >= maxScrollTop) || scrollTop > maxScrollTop
25611 : (touchesDiff > 0 && scrollTop <= 0) || scrollTop < 0;
25614 if (e.cancelable) {
25615 e.preventDefault();
25618 translate = touchesDiff;
25619 if (Math.abs(translate) > triggerDistance) {
25620 translate = triggerDistance + (Math.pow( (Math.abs(translate) - triggerDistance), 0.7 ));
25621 if (ptr.bottom) { translate = -translate; }
25625 $preloaderEl.transform(("translate3d(0," + translate + "px,0)"))
25626 .find('.ptr
-arrow
').transform(("rotate(" + ((180 * (Math.abs(touchesDiff) / 66)) + 100) + "deg)"));
25628 // eslint-disable-next-line
25630 $el.children().transform(("translate3d(0," + translate + "px,0)"));
25632 $el.transform(("translate3d(0," + translate + "px,0)"));
25636 if (Math.abs(translate) > triggerDistance) {
25638 $el.addClass('ptr
-pull
-up
').removeClass('ptr
-pull
-down
');
25641 $el.removeClass('ptr
-pull
-up
').addClass('ptr
-pull
-down
');
25643 if (!pullStarted) {
25644 $el.trigger('ptr
:pullstart
');
25645 ptr.emit('local
::pullStart ptrPullStart
', $el[0]);
25646 pullStarted = true;
25648 $el.trigger('ptr
:pullmove
', {
25650 scrollTop: scrollTop,
25651 translate: translate,
25652 touchesDiff: touchesDiff,
25654 ptr.emit('local
::pullMove ptrPullMove
', $el[0], {
25656 scrollTop: scrollTop,
25657 translate: translate,
25658 touchesDiff: touchesDiff,
25661 pullStarted = false;
25662 $el.removeClass('ptr
-pull
-up ptr
-pull
-down
');
25666 mousewheelTimeout = setTimeout(handleMouseWheelRelease, 300);
25669 if (!$pageEl.length || !$el.length) { return ptr; }
25671 $el[0].f7PullToRefresh = ptr;
25674 ptr.attachEvents = function attachEvents() {
25675 var passive = Support.passiveListener ? { passive: true } : false;
25676 $el.on(app.touchEvents.start, handleTouchStart, passive);
25677 app.on('touchmove
:active
', handleTouchMove);
25678 app.on('touchend
:passive
', handleTouchEnd);
25679 if (ptr.mousewheel && !ptr.bottom) {
25680 $el.on('wheel
', handleMouseWheel);
25683 ptr.detachEvents = function detachEvents() {
25684 var passive = Support.passiveListener ? { passive: true } : false;
25685 $el.off(app.touchEvents.start, handleTouchStart, passive);
25686 app.off('touchmove
:active
', handleTouchMove);
25687 app.off('touchend
:passive
', handleTouchEnd);
25688 if (ptr.mousewheel && !ptr.bottom) {
25689 $el.off('wheel
', handleMouseWheel);
25702 if ( Framework7Class ) PullToRefresh.__proto__ = Framework7Class;
25703 PullToRefresh.prototype = Object.create( Framework7Class && Framework7Class.prototype );
25704 PullToRefresh.prototype.constructor = PullToRefresh;
25706 PullToRefresh.prototype.init = function init () {
25708 ptr.attachEvents();
25711 PullToRefresh.prototype.destroy = function destroy () {
25713 ptr.emit('local
::beforeDestroy ptrBeforeDestroy
', ptr);
25714 ptr.$el.trigger('ptr
:beforedestroy
', ptr);
25715 delete ptr.el.f7PullToRefresh;
25716 ptr.detachEvents();
25717 Utils.deleteProps(ptr);
25721 return PullToRefresh;
25722 }(Framework7Class));
25724 var PullToRefresh$1 = {
25725 name: 'pullToRefresh
',
25726 create: function create() {
25728 app.ptr = Utils.extend(
25729 ConstructorMethods({
25730 defaultSelector: '.ptr
-content
',
25731 constructor: PullToRefresh,
25733 domProp: 'f7PullToRefresh
',
25736 done: function done(el) {
25737 var ptr = app.ptr.get(el);
25738 if (ptr) { return ptr.done(); }
25741 refresh: function refresh(el) {
25742 var ptr = app.ptr.get(el);
25743 if (ptr) { return ptr.refresh(); }
25750 PullToRefresh: PullToRefresh,
25753 tabMounted: function tabMounted(tabEl) {
25755 var $tabEl = $(tabEl);
25756 $tabEl.find('.ptr
-content
').each(function (index, el) {
25757 app.ptr.create(el);
25760 tabBeforeRemove: function tabBeforeRemove(tabEl) {
25761 var $tabEl = $(tabEl);
25763 $tabEl.find('.ptr
-content
').each(function (index, el) {
25764 app.ptr.destroy(el);
25767 pageInit: function pageInit(page) {
25769 page.$el.find('.ptr
-content
').each(function (index, el) {
25770 app.ptr.create(el);
25773 pageBeforeRemove: function pageBeforeRemove(page) {
25775 page.$el.find('.ptr
-content
').each(function (index, el) {
25776 app.ptr.destroy(el);
25783 destroy: function destroy(pageEl) {
25784 var $pageEl = $(pageEl).closest('.page
');
25785 if (!$pageEl.length) { return; }
25786 if ($pageEl[0].f7LazyDestroy) {
25787 $pageEl[0].f7LazyDestroy();
25790 create: function create(pageEl) {
25792 var $pageEl = $(pageEl).closest('.page
').eq(0);
25795 var $lazyLoadImages = $pageEl.find('.lazy
');
25796 if ($lazyLoadImages.length === 0 && !$pageEl.hasClass('lazy
')) { return; }
25799 var placeholderSrc = app.params.lazy.placeholder;
25801 if (placeholderSrc !== false) {
25802 $lazyLoadImages.each(function (index, lazyEl) {
25803 if ($(lazyEl).attr('data
-src
') && !$(lazyEl).attr('src
')) { $(lazyEl).attr('src
', placeholderSrc); }
25808 var imagesSequence = [];
25809 var imageIsLoading = false;
25811 function onImageComplete(lazyEl) {
25812 if (imagesSequence.indexOf(lazyEl) >= 0) {
25813 imagesSequence.splice(imagesSequence.indexOf(lazyEl), 1);
25815 imageIsLoading = false;
25816 if (app.params.lazy.sequential && imagesSequence.length > 0) {
25817 imageIsLoading = true;
25818 app.lazy.loadImage(imagesSequence[0], onImageComplete);
25822 function observerCallback(entries, observer) {
25823 entries.forEach(function (entry) {
25824 if (entry.isIntersecting) {
25825 if (app.params.lazy.sequential && imageIsLoading) {
25826 if (imagesSequence.indexOf(entry.target) < 0) { imagesSequence.push(entry.target); }
25830 imageIsLoading = true;
25831 app.lazy.loadImage(entry.target, onImageComplete);
25833 observer.unobserve(entry.target);
25837 if (app.params.lazy.observer && Support.intersectionObserver) {
25838 var observer = $pageEl[0].f7LazyObserver;
25840 observer = new win.IntersectionObserver(observerCallback, {
25844 $lazyLoadImages.each(function (index, el) {
25845 if (el.f7LazyObserverAdded) { return; }
25846 el.f7LazyObserverAdded = true;
25847 observer.observe(el);
25849 if (!$pageEl[0].f7LazyDestroy) {
25850 $pageEl[0].f7LazyDestroy = function () {
25851 observer.disconnect();
25852 delete $pageEl[0].f7LazyDestroy;
25853 delete $pageEl[0].f7LazyObserver;
25859 function lazyHandler() {
25860 app.lazy.load($pageEl, function (lazyEl) {
25861 if (app.params.lazy.sequential && imageIsLoading) {
25862 if (imagesSequence.indexOf(lazyEl) < 0) { imagesSequence.push(lazyEl); }
25865 imageIsLoading = true;
25866 app.lazy.loadImage(lazyEl, onImageComplete);
25870 function attachEvents() {
25871 $pageEl[0].f7LazyAttached = true;
25872 $pageEl.on('lazy
', lazyHandler);
25873 $pageEl.on('scroll
', lazyHandler, true);
25874 $pageEl.find('.tab
').on('tab
:mounted tab
:show
', lazyHandler);
25875 app.on('resize
', lazyHandler);
25877 function detachEvents() {
25878 $pageEl[0].f7LazyAttached = false;
25879 delete $pageEl[0].f7LazyAttached;
25880 $pageEl.off('lazy
', lazyHandler);
25881 $pageEl.off('scroll
', lazyHandler, true);
25882 $pageEl.find('.tab
').off('tab
:mounted tab
:show
', lazyHandler);
25883 app.off('resize
', lazyHandler);
25886 // Store detach function
25887 if (!$pageEl[0].f7LazyDestroy) {
25888 $pageEl[0].f7LazyDestroy = detachEvents;
25892 if (!$pageEl[0].f7LazyAttached) {
25896 // Run loader on page load/init
25899 isInViewport: function isInViewport(lazyEl) {
25901 var rect = lazyEl.getBoundingClientRect();
25902 var threshold = app.params.lazy.threshold || 0;
25905 rect.top >= (0 - threshold)
25906 && rect.left >= (0 - threshold)
25907 && rect.top <= (app.height + threshold)
25908 && rect.left <= (app.width + threshold)
25911 loadImage: function loadImage(imageEl, callback) {
25913 var $imageEl = $(imageEl);
25915 var bg = $imageEl.attr('data
-background
');
25916 var src = bg || $imageEl.attr('data
-src
');
25917 if (!src) { return; }
25918 function onLoad() {
25919 $imageEl.removeClass('lazy
').addClass('lazy
-loaded
');
25921 $imageEl.css('background
-image
', ("url(" + src + ")"));
25923 $imageEl.attr('src
', src);
25925 if (callback) { callback(imageEl); }
25926 $imageEl.trigger('lazy
:loaded
');
25927 app.emit('lazyLoaded
', $imageEl[0]);
25930 function onError() {
25931 $imageEl.removeClass('lazy
').addClass('lazy
-loaded
');
25933 $imageEl.css('background
-image
', ("url(" + (app.params.lazy.placeholder || '') + ")"));
25935 $imageEl.attr('src
', app.params.lazy.placeholder || '');
25937 if (callback) { callback(imageEl); }
25938 $imageEl.trigger('lazy
:error
');
25939 app.emit('lazyError
', $imageEl[0]);
25941 var image = new win.Image();
25942 image.onload = onLoad;
25943 image.onerror = onError;
25946 $imageEl.removeAttr('data
-src
').removeAttr('data
-background
');
25948 // Add loaded callback and events
25949 $imageEl.trigger('lazy
:load
');
25950 app.emit('lazyLoad
', $imageEl[0]);
25952 load: function load(pageEl, callback) {
25954 var $pageEl = $(pageEl);
25955 if (!$pageEl.hasClass('page
')) { $pageEl = $pageEl.parents('.page
').eq(0); }
25956 if ($pageEl.length === 0) {
25959 $pageEl.find('.lazy
').each(function (index, lazyEl) {
25960 var $lazyEl = $(lazyEl);
25961 if ($lazyEl.parents('.tab
:not(.tab
-active
)').length > 0) {
25964 if (app.lazy.isInViewport(lazyEl)) {
25965 if (callback) { callback(lazyEl); }
25966 else { app.lazy.loadImage(lazyEl); }
25976 placeholder: 'data
:image
/png
;base64
,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABAQMAAAAl21bKAAAAA1BMVEXCwsK592mkAAAACklEQVQI12NgAAAAAgAB4iG8MwAAAABJRU5ErkJggg
==',
25982 create: function create() {
25984 Utils.extend(app, {
25986 create: Lazy.create.bind(app),
25987 destroy: Lazy.destroy.bind(app),
25988 loadImage: Lazy.loadImage.bind(app),
25989 load: Lazy.load.bind(app),
25990 isInViewport: Lazy.isInViewport.bind(app),
25995 pageInit: function pageInit(page) {
25997 if (page.$el.find('.lazy
').length > 0 || page.$el.hasClass('lazy
')) {
25998 app.lazy.create(page.$el);
26001 pageAfterIn: function pageAfterIn(page) {
26003 if (app.params.lazy.observer && Support.intersectionObserver) { return; }
26004 if (page.$el.find('.lazy
').length > 0 || page.$el.hasClass('lazy
')) {
26005 app.lazy.create(page.$el);
26008 pageBeforeRemove: function pageBeforeRemove(page) {
26010 if (page.$el.find('.lazy
').length > 0 || page.$el.hasClass('lazy
')) {
26011 app.lazy.destroy(page.$el);
26014 tabMounted: function tabMounted(tabEl) {
26016 var $tabEl = $(tabEl);
26017 if ($tabEl.find('.lazy
').length > 0 || $tabEl.hasClass('lazy
')) {
26018 app.lazy.create($tabEl);
26021 tabBeforeRemove: function tabBeforeRemove(tabEl) {
26023 if (app.params.lazy.observer && Support.intersectionObserver) { return; }
26024 var $tabEl = $(tabEl);
26025 if ($tabEl.find('.lazy
').length > 0 || $tabEl.hasClass('lazy
')) {
26026 app.lazy.destroy($tabEl);
26032 var DataTable = /*@__PURE__*/(function (Framework7Class) {
26033 function DataTable(app, params) {
26034 if ( params === void 0 ) params = {};
26036 Framework7Class.call(this, params, [app]);
26044 // Extend defaults with modules params
26045 table.useModulesParams(defaults);
26047 table.params = Utils.extend(defaults, params);
26050 var $el = $(table.params.el);
26051 if ($el.length === 0) { return undefined; }
26056 if (table.$el[0].f7DataTable) {
26057 var instance = table.$el[0].f7DataTable;
26062 table.$el[0].f7DataTable = table;
26064 Utils.extend(table, {
26065 collapsible: $el.hasClass('data
-table
-collapsible
'),
26067 $headerEl: $el.find('.data
-table
-header
'),
26068 $headerSelectedEl: $el.find('.data
-table
-header
-selected
'),
26072 function handleChange(e) {
26073 if (e.detail && e.detail.sentByF7DataTable) {
26074 // Scripted event, don't
do anything
26077 var $inputEl
= $(this);
26078 var checked
= $inputEl
[0].checked
;
26079 var columnIndex
= $inputEl
.parents('td,th').index();
26081 if ($inputEl
.parents('thead').length
> 0) {
26082 if (columnIndex
=== 0) {
26084 .find('tbody tr')[checked
? 'addClass' : 'removeClass']('data-table-row-selected');
26087 .find(("tbody tr td:nth-child(" + (columnIndex
+ 1) + ") input"))
26088 .prop('checked', checked
)
26089 .trigger('change', { sentByF7DataTable
: true });
26090 $inputEl
.prop('indeterminate', false);
26092 if (columnIndex
=== 0) {
26093 $inputEl
.parents('tr')[checked
? 'addClass' : 'removeClass']('data-table-row-selected');
26095 var checkedRows
= $el
.find(("tbody .checkbox-cell:nth-child(" + (columnIndex
+ 1) + ") input[type=\"checkbox\"]:checked")).length
;
26096 var totalRows
= $el
.find('tbody tr').length
;
26097 var $headCheckboxEl
= $el
.find(("thead .checkbox-cell:nth-child(" + (columnIndex
+ 1) + ") input[type=\"checkbox\"]"));
26099 $headCheckboxEl
.prop('checked', false);
26100 } else if (checkedRows
=== totalRows
) {
26101 $headCheckboxEl
.prop('checked', true).trigger('change', { sentByF7DataTable
: true });
26103 $headCheckboxEl
.prop('indeterminate', checkedRows
> 0 && checkedRows
< totalRows
);
26105 table
.checkSelectedHeader();
26107 function handleSortableClick() {
26108 var $cellEl
= $(this);
26109 var isActive
= $cellEl
.hasClass('sortable-cell-active');
26110 var currentSort
= $cellEl
.hasClass('sortable-desc') ? 'desc' : 'asc';
26113 newSort
= currentSort
=== 'desc' ? 'asc' : 'desc';
26114 $cellEl
.removeClass('sortable-desc sortable-asc').addClass(("sortable-" + newSort
));
26116 $el
.find('thead .sortable-cell-active').removeClass('sortable-cell-active');
26117 $cellEl
.addClass('sortable-cell-active');
26118 newSort
= currentSort
;
26120 $cellEl
.trigger('datatable:sort', newSort
);
26121 table
.emit('local::sort dataTableSort', table
, newSort
);
26123 table
.attachEvents
= function attachEvents() {
26124 table
.$el
.on('change', '.checkbox-cell input[type="checkbox"]', handleChange
);
26125 table
.$el
.find('thead .sortable-cell').on('click', handleSortableClick
);
26127 table
.detachEvents
= function detachEvents() {
26128 table
.$el
.off('change', '.checkbox-cell input[type="checkbox"]', handleChange
);
26129 table
.$el
.find('thead .sortable-cell').off('click', handleSortableClick
);
26133 table
.useModules();
26141 if ( Framework7Class
) DataTable
.__proto__
= Framework7Class
;
26142 DataTable
.prototype = Object
.create( Framework7Class
&& Framework7Class
.prototype );
26143 DataTable
.prototype.constructor = DataTable
;
26145 DataTable
.prototype.setCollapsibleLabels
= function setCollapsibleLabels () {
26147 if (!table
.collapsible
) { return; }
26148 table
.$el
.find('tbody td:not(.checkbox-cell)').each(function (index
, el
) {
26150 var elIndex
= $el
.index();
26151 var collpsibleTitle
= $el
.attr('data-collapsible-title');
26152 if (!collpsibleTitle
&& collpsibleTitle
!== '') {
26153 $el
.attr('data-collapsible-title', table
.$el
.find('thead th').eq(elIndex
).text());
26158 DataTable
.prototype.checkSelectedHeader
= function checkSelectedHeader () {
26160 if (table
.$headerEl
.length
> 0 && table
.$headerSelectedEl
.length
> 0) {
26161 var checkedItems
= table
.$el
.find('tbody .checkbox-cell input:checked').length
;
26162 table
.$el
[checkedItems
> 0 ? 'addClass' : 'removeClass']('data-table-has-checked');
26163 table
.$headerSelectedEl
.find('.data-table-selected-count').text(checkedItems
);
26167 DataTable
.prototype.init
= function init () {
26169 table
.attachEvents();
26170 table
.setCollapsibleLabels();
26171 table
.checkSelectedHeader();
26174 DataTable
.prototype.destroy
= function destroy () {
26177 table
.$el
.trigger('datatable:beforedestroy', table
);
26178 table
.emit('local::beforeDestroy dataTableBeforeDestroy', table
);
26180 table
.attachEvents();
26182 if (table
.$el
[0]) {
26183 table
.$el
[0].f7DataTable
= null;
26184 delete table
.$el
[0].f7DataTable
;
26186 Utils
.deleteProps(table
);
26191 }(Framework7Class
));
26193 var DataTable
$1 = {
26196 DataTable
: DataTable
,
26198 create
: function create() {
26200 app
.dataTable
= ConstructorMethods({
26201 defaultSelector
: '.data-table',
26202 constructor: DataTable
,
26204 domProp
: 'f7DataTable',
26208 tabBeforeRemove
: function tabBeforeRemove(tabEl
) {
26210 $(tabEl
).find('.data-table-init').each(function (index
, tableEl
) {
26211 app
.dataTable
.destroy(tableEl
);
26214 tabMounted
: function tabMounted(tabEl
) {
26216 $(tabEl
).find('.data-table-init').each(function (index
, tableEl
) {
26217 app
.dataTable
.create({ el
: tableEl
});
26220 pageBeforeRemove
: function pageBeforeRemove(page
) {
26222 page
.$el
.find('.data-table-init').each(function (index
, tableEl
) {
26223 app
.dataTable
.destroy(tableEl
);
26226 pageInit
: function pageInit(page
) {
26228 page
.$el
.find('.data-table-init').each(function (index
, tableEl
) {
26229 app
.dataTable
.create({ el
: tableEl
});
26234 'data-table-init': {
26235 insert
: function insert(vnode
) {
26237 var tableEl
= vnode
.elm
;
26238 app
.dataTable
.create({ el
: tableEl
});
26240 destroy
: function destroy(vnode
) {
26242 var tableEl
= vnode
.elm
;
26243 app
.dataTable
.destroy(tableEl
);
26250 morphOpen
: function morphOpen(fabEl
, targetEl
) {
26252 var $fabEl
= $(fabEl
);
26253 var $targetEl
= $(targetEl
);
26254 if ($targetEl
.length
=== 0) { return; }
26256 $targetEl
.transition(0).addClass('fab-morph-target-visible');
26258 width
: $targetEl
[0].offsetWidth
,
26259 height
: $targetEl
[0].offsetHeight
,
26260 offset
: $targetEl
.offset(),
26261 borderRadius
: $targetEl
.css('border-radius'),
26262 zIndex
: $targetEl
.css('z-index'),
26265 width
: $fabEl
[0].offsetWidth
,
26266 height
: $fabEl
[0].offsetHeight
,
26267 offset
: $fabEl
.offset(),
26268 translateX
: Utils
.getTranslate($fabEl
[0], 'x'),
26269 translateY
: Utils
.getTranslate($fabEl
[0], 'y'),
26272 $fabEl
[0].f7FabMorphData
= {
26273 $targetEl
: $targetEl
,
26278 var diffX
= (fab
.offset
.left
+ (fab
.width
/ 2))
26279 - (target
.offset
.left
+ (target
.width
/ 2))
26281 var diffY
= (fab
.offset
.top
+ (fab
.height
/ 2))
26282 - (target
.offset
.top
+ (target
.height
/ 2))
26284 var scaleX
= target
.width
/ fab
.width
;
26285 var scaleY
= target
.height
/ fab
.height
;
26287 var borderRadius
= Math
.ceil(parseInt(target
.borderRadius
, 10) / Math
.max(scaleX
, scaleY
));
26288 if (borderRadius
> 0) { borderRadius
+= 2; }
26290 $fabEl
[0].f7FabMorphResizeHandler
= function resizeHandler() {
26291 $fabEl
.transition(0).transform('');
26292 $targetEl
.transition(0);
26293 target
.width
= $targetEl
[0].offsetWidth
;
26294 target
.height
= $targetEl
[0].offsetHeight
;
26295 target
.offset
= $targetEl
.offset();
26296 fab
.offset
= $fabEl
.offset();
26298 var diffXNew
= (fab
.offset
.left
+ (fab
.width
/ 2))
26299 - (target
.offset
.left
+ (target
.width
/ 2))
26301 var diffYNew
= (fab
.offset
.top
+ (fab
.height
/ 2))
26302 - (target
.offset
.top
+ (target
.height
/ 2))
26304 var scaleXNew
= target
.width
/ fab
.width
;
26305 var scaleYNew
= target
.height
/ fab
.height
;
26307 $fabEl
.transform(("translate3d(" + (-diffXNew
) + "px, " + (-diffYNew
) + "px, 0) scale(" + scaleXNew
+ ", " + scaleYNew
+ ")"));
26312 .transform(("scale(" + (1 / scaleX
) + ", " + (1 / scaleY
) + ")"));
26314 .addClass('fab-opened')
26315 .css('z-index', target
.zIndex
- 1)
26316 .transform(("translate3d(" + (-diffX
) + "px, " + (-diffY
) + "px, 0)"));
26317 $fabEl
.transitionEnd(function () {
26318 $targetEl
.transition('');
26319 Utils
.nextFrame(function () {
26320 $targetEl
.css('opacity', 1).transform('scale(1,1)');
26322 .transform(("translate3d(" + (-diffX
) + "px, " + (-diffY
) + "px, 0) scale(" + scaleX
+ ", " + scaleY
+ ")"))
26323 .css('border-radius', (borderRadius
+ "px"))
26324 .css('box-shadow', 'none');
26326 app
.on('resize', $fabEl
[0].f7FabMorphResizeHandler
);
26327 if ($targetEl
.parents('.page-content').length
> 0) {
26328 $targetEl
.parents('.page-content').on('scroll', $fabEl
[0].f7FabMorphResizeHandler
);
26332 morphClose
: function morphClose(fabEl
) {
26334 var $fabEl
= $(fabEl
);
26335 var morphData
= $fabEl
[0].f7FabMorphData
;
26336 if (!morphData
) { return; }
26337 var $targetEl
= morphData
.$targetEl
;
26338 var target
= morphData
.target
;
26339 var fab
= morphData
.fab
;
26340 if ($targetEl
.length
=== 0) { return; }
26342 var diffX
= (fab
.offset
.left
+ (fab
.width
/ 2))
26343 - (target
.offset
.left
+ (target
.width
/ 2))
26345 var diffY
= (fab
.offset
.top
+ (fab
.height
/ 2))
26346 - (target
.offset
.top
+ (target
.height
/ 2))
26348 var scaleX
= target
.width
/ fab
.width
;
26349 var scaleY
= target
.height
/ fab
.height
;
26351 app
.off('resize', $fabEl
[0].f7FabMorphResizeHandler
);
26352 if ($targetEl
.parents('.page-content').length
> 0) {
26353 $targetEl
.parents('.page-content').off('scroll', $fabEl
[0].f7FabMorphResizeHandler
);
26358 .transform(("scale(" + (1 / scaleX
) + ", " + (1 / scaleY
) + ")"));
26361 .css('box-shadow', '')
26362 .css('border-radius', '')
26363 .transform(("translate3d(" + (-diffX
) + "px, " + (-diffY
) + "px, 0)"));
26364 $fabEl
.transitionEnd(function () {
26366 .css('z-index', '')
26367 .removeClass('fab-opened')
26369 Utils
.nextFrame(function () {
26370 $fabEl
.transitionEnd(function () {
26372 .removeClass('fab-morph-target-visible')
26373 .css('opacity', '')
26380 open
: function open(fabEl
, targetEl
) {
26382 var $fabEl
= $(fabEl
).eq(0);
26383 var $buttonsEl
= $fabEl
.find('.fab-buttons');
26384 if (!$fabEl
.length
) { return; }
26385 if ($fabEl
.hasClass('fab-opened')) { return; }
26386 if (!$buttonsEl
.length
&& !$fabEl
.hasClass('fab-morph')) { return; }
26388 if (app
.fab
.openedEl
) {
26389 if (app
.fab
.openedEl
=== $fabEl
[0]) { return; }
26390 app
.fab
.close(app
.fab
.openedEl
);
26392 app
.fab
.openedEl
= $fabEl
[0];
26393 if ($fabEl
.hasClass('fab-morph')) {
26394 app
.fab
.morphOpen($fabEl
, targetEl
|| $fabEl
.attr('data-morph-to'));
26396 $fabEl
.addClass('fab-opened');
26398 $fabEl
.trigger('fab:open');
26400 close
: function close(fabEl
) {
26401 if ( fabEl
=== void 0 ) fabEl
= '.fab-opened';
26404 var $fabEl
= $(fabEl
).eq(0);
26405 var $buttonsEl
= $fabEl
.find('.fab-buttons');
26406 if (!$fabEl
.length
) { return; }
26407 if (!$fabEl
.hasClass('fab-opened')) { return; }
26408 if (!$buttonsEl
.length
&& !$fabEl
.hasClass('fab-morph')) { return; }
26409 app
.fab
.openedEl
= null;
26410 if ($fabEl
.hasClass('fab-morph')) {
26411 app
.fab
.morphClose($fabEl
);
26413 $fabEl
.removeClass('fab-opened');
26415 $fabEl
.trigger('fab:close');
26417 toggle
: function toggle(fabEl
) {
26419 var $fabEl
= $(fabEl
);
26420 if (!$fabEl
.hasClass('fab-opened')) { app
.fab
.open(fabEl
); }
26421 else { app
.fab
.close(fabEl
); }
26427 create
: function create() {
26429 Utils
.extend(app
, {
26432 morphOpen
: Fab
.morphOpen
.bind(app
),
26433 morphClose
: Fab
.morphClose
.bind(app
),
26434 open
: Fab
.open
.bind(app
),
26435 close
: Fab
.close
.bind(app
),
26436 toggle
: Fab
.toggle
.bind(app
),
26441 '.fab > a': function open($clickedEl
) {
26443 app
.fab
.toggle($clickedEl
.parents('.fab'));
26445 '.fab-open': function open($clickedEl
, data
) {
26446 if ( data
=== void 0 ) data
= {};
26449 app
.fab
.open(data
.fab
);
26451 '.fab-close': function close($clickedEl
, data
) {
26452 if ( data
=== void 0 ) data
= {};
26455 app
.fab
.close(data
.fab
);
26460 var Searchbar
= /*@__PURE__*/(function (FrameworkClass
) {
26461 function Searchbar(app
, params
) {
26462 if ( params
=== void 0 ) params
= {};
26464 FrameworkClass
.call(this, params
, [app
]);
26470 inputEl
: undefined,
26471 inputEvents
: 'change input compositionend',
26472 disableButton
: true,
26473 disableButtonEl
: undefined,
26474 backdropEl
: undefined,
26475 searchContainer
: undefined, // container to search, HTMLElement or CSS selector
26476 searchItem
: 'li', // single item selector, CSS selector
26477 searchIn
: undefined, // where to search in item, CSS selector
26478 searchGroup
: '.list-group',
26479 searchGroupTitle
: '.item-divider, .list-group-title',
26480 ignore
: '.searchbar-ignore',
26481 foundEl
: '.searchbar-found',
26482 notFoundEl
: '.searchbar-not-found',
26483 hideOnEnableEl
: '.searchbar-hide-on-enable',
26484 hideOnSearchEl
: '.searchbar-hide-on-search',
26485 backdrop
: undefined,
26486 removeDiacritics
: true,
26487 customSearch
: false,
26488 hideDividers
: true,
26490 disableOnBackdropClick
: true,
26495 // Extend defaults with modules params
26496 sb
.useModulesParams(defaults
);
26498 sb
.params
= Utils
.extend(defaults
, params
);
26500 var $el
= $(sb
.params
.el
);
26501 if ($el
.length
=== 0) { return sb
; }
26503 if ($el
[0].f7Searchbar
) { return $el
[0].f7Searchbar
; }
26505 $el
[0].f7Searchbar
= sb
;
26508 var $navbarEl
= $el
.parents('.navbar-inner');
26509 if ($el
.parents('.page').length
> 0) {
26510 $pageEl
= $el
.parents('.page');
26511 } else if ($navbarEl
.length
> 0) {
26512 $pageEl
= $(app
.navbar
.getPageByEl($navbarEl
[0]));
26513 if (!$pageEl
.length
) {
26514 var $currentPageEl
= $el
.parents('.view').find('.page-current');
26515 if ($currentPageEl
[0] && $currentPageEl
[0].f7Page
&& $currentPageEl
[0].f7Page
.navbarEl
=== $navbarEl
[0]) {
26516 $pageEl
= $currentPageEl
;
26522 if (params
.foundEl
) {
26523 $foundEl
= $(params
.foundEl
);
26524 } else if (typeof sb
.params
.foundEl
=== 'string' && $pageEl
) {
26525 $foundEl
= $pageEl
.find(sb
.params
.foundEl
);
26529 if (params
.notFoundEl
) {
26530 $notFoundEl
= $(params
.notFoundEl
);
26531 } else if (typeof sb
.params
.notFoundEl
=== 'string' && $pageEl
) {
26532 $notFoundEl
= $pageEl
.find(sb
.params
.notFoundEl
);
26535 var $hideOnEnableEl
;
26536 if (params
.hideOnEnableEl
) {
26537 $hideOnEnableEl
= $(params
.hideOnEnableEl
);
26538 } else if (typeof sb
.params
.hideOnEnableEl
=== 'string' && $pageEl
) {
26539 $hideOnEnableEl
= $pageEl
.find(sb
.params
.hideOnEnableEl
);
26542 var $hideOnSearchEl
;
26543 if (params
.hideOnSearchEl
) {
26544 $hideOnSearchEl
= $(params
.hideOnSearchEl
);
26545 } else if (typeof sb
.params
.hideOnSearchEl
=== 'string' && $pageEl
) {
26546 $hideOnSearchEl
= $pageEl
.find(sb
.params
.hideOnSearchEl
);
26550 var expandable
= sb
.params
.expandable
|| $el
.hasClass('searchbar-expandable');
26551 var inline
= sb
.params
.inline
|| $el
.hasClass('searchbar-inline');
26553 if (typeof sb
.params
.backdrop
=== 'undefined') {
26554 if (!inline
) { sb
.params
.backdrop
= app
.theme
!== 'aurora'; }
26555 else { sb
.params
.backdrop
= false; }
26559 if (sb
.params
.backdrop
) {
26560 if (sb
.params
.backdropEl
) {
26561 $backdropEl
= $(sb
.params
.backdropEl
);
26562 } else if ($pageEl
&& $pageEl
.length
> 0) {
26563 $backdropEl
= $pageEl
.find('.searchbar-backdrop');
26565 $backdropEl
= $el
.siblings('.searchbar-backdrop');
26567 if ($backdropEl
.length
=== 0) {
26568 $backdropEl
= $('<div class="searchbar-backdrop"></div>');
26569 if ($pageEl
&& $pageEl
.length
) {
26570 if ($el
.parents($pageEl
).length
> 0 && $navbarEl
&& $el
.parents($navbarEl
).length
=== 0) {
26571 $backdropEl
.insertBefore($el
);
26573 $backdropEl
.insertBefore($pageEl
.find('.page-content').eq(0));
26576 $backdropEl
.insertBefore($el
);
26581 var $searchContainer
;
26582 if (sb
.params
.searchContainer
) {
26583 $searchContainer
= $(sb
.params
.searchContainer
);
26587 if (sb
.params
.inputEl
) {
26588 $inputEl
= $(sb
.params
.inputEl
);
26590 $inputEl
= $el
.find('input[type="search"]').eq(0);
26593 var $disableButtonEl
;
26594 if (sb
.params
.disableButton
) {
26595 if (sb
.params
.disableButtonEl
) {
26596 $disableButtonEl
= $(sb
.params
.disableButtonEl
);
26598 $disableButtonEl
= $el
.find('.searchbar-disable-button');
26604 view
: app
.views
.get($el
.parents('.view')),
26607 $backdropEl
: $backdropEl
,
26608 backdropEl
: $backdropEl
&& $backdropEl
[0],
26609 $searchContainer
: $searchContainer
,
26610 searchContainer
: $searchContainer
&& $searchContainer
[0],
26611 $inputEl
: $inputEl
,
26612 inputEl
: $inputEl
[0],
26613 $disableButtonEl
: $disableButtonEl
,
26614 disableButtonEl
: $disableButtonEl
&& $disableButtonEl
[0],
26615 disableButtonHasMargin
: false,
26617 pageEl
: $pageEl
&& $pageEl
[0],
26618 $navbarEl
: $navbarEl
,
26619 navbarEl
: $navbarEl
&& $navbarEl
[0],
26620 $foundEl
: $foundEl
,
26621 foundEl
: $foundEl
&& $foundEl
[0],
26622 $notFoundEl
: $notFoundEl
,
26623 notFoundEl
: $notFoundEl
&& $notFoundEl
[0],
26624 $hideOnEnableEl
: $hideOnEnableEl
,
26625 hideOnEnableEl
: $hideOnEnableEl
&& $hideOnEnableEl
[0],
26626 $hideOnSearchEl
: $hideOnSearchEl
,
26627 hideOnSearchEl
: $hideOnSearchEl
&& $hideOnSearchEl
[0],
26630 isVirtualList
: $searchContainer
&& $searchContainer
.hasClass('virtual-list'),
26631 virtualList
: undefined,
26633 expandable
: expandable
,
26638 function preventSubmit(e
) {
26639 e
.preventDefault();
26641 function onInputFocus(e
) {
26643 sb
.$el
.addClass('searchbar-focused');
26645 function onInputBlur() {
26646 sb
.$el
.removeClass('searchbar-focused');
26647 if (app
.theme
=== 'aurora' && (!$disableButtonEl
|| !$disableButtonEl
.length
|| !sb
.params
.disableButton
) && !sb
.query
) {
26651 function onInputChange() {
26652 var value
= sb
.$inputEl
.val().trim();
26655 (sb
.$searchContainer
&& sb
.$searchContainer
.length
> 0)
26656 && (sb
.params
.searchIn
|| sb
.isVirtualList
|| sb
.params
.searchIn
=== sb
.params
.searchItem
)
26658 || sb
.params
.customSearch
26660 sb
.search(value
, true);
26663 function onInputClear(e
, previousValue
) {
26664 sb
.$el
.trigger('searchbar:clear', previousValue
);
26665 sb
.emit('local::clear searchbarClear', sb
, previousValue
);
26667 function disableOnClick(e
) {
26670 function onPageBeforeOut() {
26671 if (!sb
|| (sb
&& !sb
.$el
)) { return; }
26673 sb
.$el
.removeClass('searchbar-enabled');
26674 if (sb
.expandable
) {
26675 sb
.$el
.parents('.navbar-inner').removeClass('with-searchbar-expandable-enabled');
26679 function onPageBeforeIn() {
26680 if (!sb
|| (sb
&& !sb
.$el
)) { return; }
26682 sb
.$el
.addClass('searchbar-enabled');
26683 if (sb
.expandable
) {
26684 sb
.$el
.parents('.navbar-inner').addClass('with-searchbar-expandable-enabled');
26688 sb
.attachEvents
= function attachEvents() {
26689 $el
.on('submit', preventSubmit
);
26690 if (sb
.params
.disableButton
) {
26691 sb
.$disableButtonEl
.on('click', disableOnClick
);
26693 if (sb
.params
.disableOnBackdropClick
&& sb
.$backdropEl
) {
26694 sb
.$backdropEl
.on('click', disableOnClick
);
26696 if (sb
.expandable
&& app
.theme
=== 'ios' && sb
.view
&& $navbarEl
.length
&& sb
.$pageEl
) {
26697 sb
.$pageEl
.on('page:beforeout', onPageBeforeOut
);
26698 sb
.$pageEl
.on('page:beforein', onPageBeforeIn
);
26700 sb
.$inputEl
.on('focus', onInputFocus
);
26701 sb
.$inputEl
.on('blur', onInputBlur
);
26702 sb
.$inputEl
.on(sb
.params
.inputEvents
, onInputChange
);
26703 sb
.$inputEl
.on('input:clear', onInputClear
);
26705 sb
.detachEvents
= function detachEvents() {
26706 $el
.off('submit', preventSubmit
);
26707 if (sb
.params
.disableButton
) {
26708 sb
.$disableButtonEl
.off('click', disableOnClick
);
26710 if (sb
.params
.disableOnBackdropClick
&& sb
.$backdropEl
) {
26711 sb
.$backdropEl
.off('click', disableOnClick
);
26713 if (sb
.expandable
&& app
.theme
=== 'ios' && sb
.view
&& $navbarEl
.length
&& sb
.$pageEl
) {
26714 sb
.$pageEl
.off('page:beforeout', onPageBeforeOut
);
26715 sb
.$pageEl
.off('page:beforein', onPageBeforeIn
);
26717 sb
.$inputEl
.off('focus', onInputFocus
);
26718 sb
.$inputEl
.off('blur', onInputBlur
);
26719 sb
.$inputEl
.off(sb
.params
.inputEvents
, onInputChange
);
26720 sb
.$inputEl
.off('input:clear', onInputClear
);
26732 if ( FrameworkClass
) Searchbar
.__proto__
= FrameworkClass
;
26733 Searchbar
.prototype = Object
.create( FrameworkClass
&& FrameworkClass
.prototype );
26734 Searchbar
.prototype.constructor = Searchbar
;
26736 Searchbar
.prototype.clear
= function clear (e
) {
26738 if (!sb
.query
&& e
&& $(e
.target
).hasClass('searchbar-clear')) {
26742 var previousQuery
= sb
.value
;
26743 sb
.$inputEl
.val('').trigger('change').focus();
26744 sb
.$el
.trigger('searchbar:clear', previousQuery
);
26745 sb
.emit('local::clear searchbarClear', sb
, previousQuery
);
26749 Searchbar
.prototype.setDisableButtonMargin
= function setDisableButtonMargin () {
26751 if (sb
.expandable
) { return; }
26753 sb
.$disableButtonEl
.transition(0).show();
26754 sb
.$disableButtonEl
.css(("margin-" + (app
.rtl
? 'left' : 'right')), ((-sb
.disableButtonEl
.offsetWidth
) + "px"));
26755 /* eslint no-underscore-dangle: ["error", { "allow": ["_clientLeft"] }] */
26756 sb
._clientLeft
= sb
.$disableButtonEl
[0].clientLeft
;
26757 sb
.$disableButtonEl
.transition('');
26758 sb
.disableButtonHasMargin
= true;
26761 Searchbar
.prototype.enable
= function enable (setFocus
) {
26763 if (sb
.enabled
) { return sb
; }
26766 function enable() {
26767 if (sb
.$backdropEl
&& ((sb
.$searchContainer
&& sb
.$searchContainer
.length
) || sb
.params
.customSearch
) && !sb
.$el
.hasClass('searchbar-enabled') && !sb
.query
) {
26770 sb
.$el
.addClass('searchbar-enabled');
26771 if (!sb
.$disableButtonEl
|| (sb
.$disableButtonEl
&& sb
.$disableButtonEl
.length
=== 0)) {
26772 sb
.$el
.addClass('searchbar-enabled-no-disable-button');
26774 if (!sb
.expandable
&& sb
.$disableButtonEl
&& sb
.$disableButtonEl
.length
> 0 && app
.theme
!== 'md') {
26775 if (!sb
.disableButtonHasMargin
) {
26776 sb
.setDisableButtonMargin();
26778 sb
.$disableButtonEl
.css(("margin-" + (app
.rtl
? 'left' : 'right')), '0px');
26780 if (sb
.expandable
) {
26781 if (sb
.$el
.parents('.navbar-inner').hasClass('navbar-inner-large') && sb
.$pageEl
) {
26782 sb
.$pageEl
.find('.page-content').addClass('with-searchbar-expandable-enabled');
26784 if (app
.theme
=== 'md' && sb
.$el
.parent('.navbar-inner').parent('.navbar').length
) {
26785 sb
.$el
.parent('.navbar-inner').parent('.navbar').addClass('with-searchbar-expandable-enabled');
26787 sb
.$el
.parent('.navbar-inner').addClass('with-searchbar-expandable-enabled');
26788 sb
.$el
.parent('.navbar-inner-large').addClass('navbar-inner-large-collapsed');
26791 if (sb
.$hideOnEnableEl
) { sb
.$hideOnEnableEl
.addClass('hidden-by-searchbar'); }
26792 sb
.$el
.trigger('searchbar:enable');
26793 sb
.emit('local::enable searchbarEnable', sb
);
26795 var needsFocus
= false;
26796 if (setFocus
=== true) {
26797 if (doc
.activeElement
!== sb
.inputEl
) {
26801 var isIos
= app
.device
.ios
&& app
.theme
=== 'ios';
26803 if (sb
.expandable
) {
26804 if (needsFocus
) { sb
.$inputEl
.focus(); }
26807 if (needsFocus
) { sb
.$inputEl
.focus(); }
26808 if (setFocus
&& (setFocus
.type
=== 'focus' || setFocus
=== true)) {
26809 Utils
.nextTick(function () {
26817 if (needsFocus
) { sb
.$inputEl
.focus(); }
26818 if (app
.theme
=== 'md' && sb
.expandable
) {
26819 sb
.$el
.parents('.page, .view, .navbar-inner').scrollLeft(0);
26826 Searchbar
.prototype.disable
= function disable () {
26828 if (!sb
.enabled
) { return sb
; }
26830 sb
.$inputEl
.val('').trigger('change');
26831 sb
.$el
.removeClass('searchbar-enabled searchbar-focused searchbar-enabled-no-disable-button');
26832 if (sb
.expandable
) {
26833 if (sb
.$el
.parents('.navbar-inner').hasClass('navbar-inner-large') && sb
.$pageEl
) {
26834 sb
.$pageEl
.find('.page-content').removeClass('with-searchbar-expandable-enabled');
26836 if (app
.theme
=== 'md' && sb
.$el
.parent('.navbar-inner').parent('.navbar').length
) {
26837 sb
.$el
.parent('.navbar-inner').parent('.navbar').removeClass('with-searchbar-expandable-enabled');
26839 sb
.$el
.parent('.navbar-inner').removeClass('with-searchbar-expandable-enabled');
26841 sb
.$pageEl
.find('.page-content').trigger('scroll');
26845 if (!sb
.expandable
&& sb
.$disableButtonEl
&& sb
.$disableButtonEl
.length
> 0 && app
.theme
!== 'md') {
26846 sb
.$disableButtonEl
.css(("margin-" + (app
.rtl
? 'left' : 'right')), ((-sb
.disableButtonEl
.offsetWidth
) + "px"));
26848 if (sb
.$backdropEl
&& ((sb
.$searchContainer
&& sb
.$searchContainer
.length
) || sb
.params
.customSearch
)) {
26852 sb
.enabled
= false;
26854 sb
.$inputEl
.blur();
26856 if (sb
.$hideOnEnableEl
) { sb
.$hideOnEnableEl
.removeClass('hidden-by-searchbar'); }
26858 sb
.$el
.trigger('searchbar:disable');
26859 sb
.emit('local::disable searchbarDisable', sb
);
26863 Searchbar
.prototype.toggle
= function toggle () {
26865 if (sb
.enabled
) { sb
.disable(); }
26866 else { sb
.enable(true); }
26870 Searchbar
.prototype.backdropShow
= function backdropShow () {
26872 if (sb
.$backdropEl
) {
26873 sb
.$backdropEl
.addClass('searchbar-backdrop-in');
26878 Searchbar
.prototype.backdropHide
= function backdropHide () {
26880 if (sb
.$backdropEl
) {
26881 sb
.$backdropEl
.removeClass('searchbar-backdrop-in');
26886 Searchbar
.prototype.search
= function search (query
, internal) {
26888 sb
.previousQuery
= sb
.query
|| '';
26889 if (query
=== sb
.previousQuery
) { return sb
; }
26895 sb
.$inputEl
.val(query
);
26896 sb
.$inputEl
.trigger('input');
26901 var $searchContainer
= sb
.$searchContainer
;
26903 var $foundEl
= sb
.$foundEl
;
26904 var $notFoundEl
= sb
.$notFoundEl
;
26905 var $hideOnSearchEl
= sb
.$hideOnSearchEl
;
26906 var isVirtualList
= sb
.isVirtualList
;
26908 // Hide on search element
26909 if (query
.length
> 0 && $hideOnSearchEl
) {
26910 $hideOnSearchEl
.addClass('hidden-by-searchbar');
26911 } else if ($hideOnSearchEl
) {
26912 $hideOnSearchEl
.removeClass('hidden-by-searchbar');
26914 // Add active/inactive classes on overlay
26916 ($searchContainer
&& $searchContainer
.length
&& $el
.hasClass('searchbar-enabled'))
26917 || (sb
.params
.customSearch
&& $el
.hasClass('searchbar-enabled'))
26919 if (query
.length
=== 0) {
26926 if (sb
.params
.customSearch
) {
26927 $el
.trigger('searchbar:search', query
, sb
.previousQuery
);
26928 sb
.emit('local::search searchbarSearch', sb
, query
, sb
.previousQuery
);
26932 var foundItems
= [];
26934 if (isVirtualList
) {
26935 sb
.virtualList
= $searchContainer
[0].f7VirtualList
;
26936 if (query
.trim() === '') {
26937 sb
.virtualList
.resetFilter();
26938 if ($notFoundEl
) { $notFoundEl
.hide(); }
26939 if ($foundEl
) { $foundEl
.show(); }
26940 $el
.trigger('searchbar:search', query
, sb
.previousQuery
);
26941 sb
.emit('local::search searchbarSearch', sb
, query
, sb
.previousQuery
);
26944 vlQuery
= sb
.params
.removeDiacritics
? Utils
.removeDiacritics(query
) : query
;
26945 if (sb
.virtualList
.params
.searchAll
) {
26946 foundItems
= sb
.virtualList
.params
.searchAll(vlQuery
, sb
.virtualList
.items
) || [];
26947 } else if (sb
.virtualList
.params
.searchByItem
) {
26948 for (var i
= 0; i
< sb
.virtualList
.items
.length
; i
+= 1) {
26949 if (sb
.virtualList
.params
.searchByItem(vlQuery
, sb
.virtualList
.params
.items
[i
], i
)) {
26950 foundItems
.push(i
);
26956 if (sb
.params
.removeDiacritics
) { values
= Utils
.removeDiacritics(query
.trim().toLowerCase()).split(' '); }
26958 values
= query
.trim().toLowerCase().split(' ');
26960 $searchContainer
.find(sb
.params
.searchItem
).removeClass('hidden-by-searchbar').each(function (itemIndex
, itemEl
) {
26961 var $itemEl
= $(itemEl
);
26962 var compareWithText
= [];
26963 var $searchIn
= sb
.params
.searchIn
? $itemEl
.find(sb
.params
.searchIn
) : $itemEl
;
26964 if (sb
.params
.searchIn
=== sb
.params
.searchItem
) {
26965 $searchIn
= $itemEl
;
26967 $searchIn
.each(function (searchInIndex
, searchInEl
) {
26968 var itemText
= $(searchInEl
).text().trim().toLowerCase();
26969 if (sb
.params
.removeDiacritics
) { itemText
= Utils
.removeDiacritics(itemText
); }
26970 compareWithText
.push(itemText
);
26972 compareWithText
= compareWithText
.join(' ');
26973 var wordsMatch
= 0;
26974 for (var i
= 0; i
< values
.length
; i
+= 1) {
26975 if (compareWithText
.indexOf(values
[i
]) >= 0) { wordsMatch
+= 1; }
26977 if (wordsMatch
!== values
.length
&& !(sb
.params
.ignore
&& $itemEl
.is(sb
.params
.ignore
))) {
26978 $itemEl
.addClass('hidden-by-searchbar');
26980 foundItems
.push($itemEl
[0]);
26984 if (sb
.params
.hideDividers
) {
26985 $searchContainer
.find(sb
.params
.searchGroupTitle
).each(function (titleIndex
, titleEl
) {
26986 var $titleEl
= $(titleEl
);
26987 var $nextElements
= $titleEl
.nextAll(sb
.params
.searchItem
);
26989 for (var i
= 0; i
< $nextElements
.length
; i
+= 1) {
26990 var $nextEl
= $nextElements
.eq(i
);
26991 if ($nextEl
.is(sb
.params
.searchGroupTitle
)) { break; }
26992 if (!$nextEl
.hasClass('hidden-by-searchbar')) {
26996 var ignore
= sb
.params
.ignore
&& $titleEl
.is(sb
.params
.ignore
);
26997 if (hide
&& !ignore
) { $titleEl
.addClass('hidden-by-searchbar'); }
26998 else { $titleEl
.removeClass('hidden-by-searchbar'); }
27001 if (sb
.params
.hideGroups
) {
27002 $searchContainer
.find(sb
.params
.searchGroup
).each(function (groupIndex
, groupEl
) {
27003 var $groupEl
= $(groupEl
);
27004 var ignore
= sb
.params
.ignore
&& $groupEl
.is(sb
.params
.ignore
);
27005 // eslint-disable-next-line
27006 var notHidden
= $groupEl
.find(sb
.params
.searchItem
).filter(function (index
, el
) {
27007 return !$(el
).hasClass('hidden-by-searchbar');
27009 if (notHidden
.length
=== 0 && !ignore
) {
27010 $groupEl
.addClass('hidden-by-searchbar');
27012 $groupEl
.removeClass('hidden-by-searchbar');
27018 if (foundItems
.length
=== 0) {
27019 if ($notFoundEl
) { $notFoundEl
.show(); }
27020 if ($foundEl
) { $foundEl
.hide(); }
27022 if ($notFoundEl
) { $notFoundEl
.hide(); }
27023 if ($foundEl
) { $foundEl
.show(); }
27025 if (isVirtualList
&& sb
.virtualList
) {
27026 sb
.virtualList
.filterItems(foundItems
);
27029 $el
.trigger('searchbar:search', query
, sb
.previousQuery
, foundItems
);
27030 sb
.emit('local::search searchbarSearch', sb
, query
, sb
.previousQuery
, foundItems
);
27035 Searchbar
.prototype.init
= function init () {
27037 if (sb
.expandable
&& sb
.$el
) { sb
.$el
.addClass('searchbar-expandable'); }
27038 if (sb
.inline
&& sb
.$el
) { sb
.$el
.addClass('searchbar-inline'); }
27042 Searchbar
.prototype.destroy
= function destroy () {
27044 sb
.emit('local::beforeDestroy searchbarBeforeDestroy', sb
);
27045 sb
.$el
.trigger('searchbar:beforedestroy', sb
);
27048 sb
.$el
[0].f7Searchbar
= null;
27049 delete sb
.$el
[0].f7Searchbar
;
27051 Utils
.deleteProps(sb
);
27055 }(Framework7Class
));
27057 var Searchbar
$1 = {
27060 Searchbar
: Searchbar
,
27062 create
: function create() {
27064 app
.searchbar
= ConstructorMethods({
27065 defaultSelector
: '.searchbar',
27066 constructor: Searchbar
,
27068 domProp
: 'f7Searchbar',
27069 addMethods
: 'clear enable disable toggle search'.split(' '),
27073 tabMounted
: function tabMounted(tabEl
) {
27075 $(tabEl
).find('.searchbar-init').each(function (index
, searchbarEl
) {
27076 var $searchbarEl
= $(searchbarEl
);
27077 app
.searchbar
.create(Utils
.extend($searchbarEl
.dataset(), { el
: searchbarEl
}));
27080 tabBeforeRemove
: function tabBeforeRemove(tabEl
) {
27081 $(tabEl
).find('.searchbar-init').each(function (index
, searchbarEl
) {
27082 if (searchbarEl
.f7Searchbar
&& searchbarEl
.f7Searchbar
.destroy
) {
27083 searchbarEl
.f7Searchbar
.destroy();
27087 pageInit
: function pageInit(page
) {
27089 page
.$el
.find('.searchbar-init').each(function (index
, searchbarEl
) {
27090 var $searchbarEl
= $(searchbarEl
);
27091 app
.searchbar
.create(Utils
.extend($searchbarEl
.dataset(), { el
: searchbarEl
}));
27093 if (app
.theme
=== 'ios' && page
.view
&& page
.view
.router
.separateNavbar
&& page
.$navbarEl
&& page
.$navbarEl
.length
> 0) {
27094 page
.$navbarEl
.find('.searchbar-init').each(function (index
, searchbarEl
) {
27095 var $searchbarEl
= $(searchbarEl
);
27096 app
.searchbar
.create(Utils
.extend($searchbarEl
.dataset(), { el
: searchbarEl
}));
27100 pageBeforeRemove
: function pageBeforeRemove(page
) {
27102 page
.$el
.find('.searchbar-init').each(function (index
, searchbarEl
) {
27103 if (searchbarEl
.f7Searchbar
&& searchbarEl
.f7Searchbar
.destroy
) {
27104 searchbarEl
.f7Searchbar
.destroy();
27107 if (app
.theme
=== 'ios' && page
.view
&& page
.view
.router
.separateNavbar
&& page
.$navbarEl
&& page
.$navbarEl
.length
> 0) {
27108 page
.$navbarEl
.find('.searchbar-init').each(function (index
, searchbarEl
) {
27109 if (searchbarEl
.f7Searchbar
&& searchbarEl
.f7Searchbar
.destroy
) {
27110 searchbarEl
.f7Searchbar
.destroy();
27117 '.searchbar-clear': function clear($clickedEl
, data
) {
27118 if ( data
=== void 0 ) data
= {};
27121 var sb
= app
.searchbar
.get(data
.searchbar
);
27122 if (sb
) { sb
.clear(); }
27124 '.searchbar-enable': function enable($clickedEl
, data
) {
27125 if ( data
=== void 0 ) data
= {};
27128 var sb
= app
.searchbar
.get(data
.searchbar
);
27129 if (sb
) { sb
.enable(true); }
27131 '.searchbar-disable': function disable($clickedEl
, data
) {
27132 if ( data
=== void 0 ) data
= {};
27135 var sb
= app
.searchbar
.get(data
.searchbar
);
27136 if (sb
) { sb
.disable(); }
27138 '.searchbar-toggle': function toggle($clickedEl
, data
) {
27139 if ( data
=== void 0 ) data
= {};
27142 var sb
= app
.searchbar
.get(data
.searchbar
);
27143 if (sb
) { sb
.toggle(); }
27147 'searchbar-init': {
27148 insert
: function insert(vnode
) {
27150 var searchbarEl
= vnode
.elm
;
27151 var $searchbarEl
= $(searchbarEl
);
27152 app
.searchbar
.create(Utils
.extend($searchbarEl
.dataset(), { el
: searchbarEl
}));
27154 destroy
: function destroy(vnode
) {
27155 var searchbarEl
= vnode
.elm
;
27156 if (searchbarEl
.f7Searchbar
&& searchbarEl
.f7Searchbar
.destroy
) {
27157 searchbarEl
.f7Searchbar
.destroy();
27164 var Messages
= /*@__PURE__*/(function (Framework7Class
) {
27165 function Messages(app
, params
) {
27166 if ( params
=== void 0 ) params
= {};
27168 Framework7Class
.call(this, params
, [app
]);
27175 newMessagesFirst
: false,
27176 scrollMessages
: true,
27177 scrollMessagesOnEdge
: true,
27178 firstMessageRule
: undefined,
27179 lastMessageRule
: undefined,
27180 tailMessageRule
: undefined,
27181 sameNameMessageRule
: undefined,
27182 sameHeaderMessageRule
: undefined,
27183 sameFooterMessageRule
: undefined,
27184 sameAvatarMessageRule
: undefined,
27185 customClassMessageRule
: undefined,
27186 renderMessage
: undefined,
27189 // Extend defaults with modules params
27190 m
.useModulesParams(defaults
);
27192 m
.params
= Utils
.extend(defaults
, params
);
27194 var $el
= $(params
.el
).eq(0);
27195 if ($el
.length
=== 0) { return m
; }
27197 if ($el
[0].f7Messages
) { return $el
[0].f7Messages
; }
27199 $el
[0].f7Messages
= m
;
27201 var $pageContentEl
= $el
.closest('.page-content').eq(0);
27204 messages
: m
.params
.messages
,
27207 $pageContentEl
: $pageContentEl
,
27208 pageContentEl
: $pageContentEl
[0],
27220 if ( Framework7Class
) Messages
.__proto__
= Framework7Class
;
27221 Messages
.prototype = Object
.create( Framework7Class
&& Framework7Class
.prototype );
27222 Messages
.prototype.constructor = Messages
;
27223 // eslint-disable-next-line
27224 Messages
.prototype.getMessageData
= function getMessageData (messageEl
) {
27225 var $messageEl
= $(messageEl
);
27227 name
: $messageEl
.find('.message-name').html(),
27228 header
: $messageEl
.find('.message-header').html(),
27229 textHeader
: $messageEl
.find('.message-text-header').html(),
27230 textFooter
: $messageEl
.find('.message-text-footer').html(),
27231 footer
: $messageEl
.find('.message-footer').html(),
27232 isTitle
: $messageEl
.hasClass('messages-title'),
27233 type
: $messageEl
.hasClass('message-sent') ? 'sent' : 'received',
27234 text
: $messageEl
.find('.message-text').html(),
27235 image
: $messageEl
.find('.message-image').html(),
27236 imageSrc
: $messageEl
.find('.message-image img').attr('src'),
27237 typing
: $messageEl
.hasClass('message-typing'),
27239 if (data
.isTitle
) {
27240 data
.text
= $messageEl
.html();
27242 if (data
.text
&& data
.textHeader
) {
27243 data
.text
= data
.text
.replace(("<div class=\"message-text-header\">" + (data
.textHeader
) + "</div>"), '');
27245 if (data
.text
&& data
.textFooter
) {
27246 data
.text
= data
.text
.replace(("<div class=\"message-text-footer\">" + (data
.textFooter
) + "</div>"), '');
27248 var avatar
= $messageEl
.find('.message-avatar').css('background-image');
27249 if (avatar
=== 'none' || avatar
=== '') { avatar
= undefined; }
27250 if (avatar
&& typeof avatar
=== 'string') {
27251 avatar
= avatar
.replace('url(', '').replace(')', '').replace(/"/g, '').replace(/'/g, '');
27253 avatar = undefined;
27255 data.avatar = avatar;
27260 Messages.prototype.getMessagesData = function getMessagesData () {
27263 m.$el.find('.message
, .messages
-title
').each(function (index, messageEl) {
27264 data.push(m.getMessageData(messageEl));
27269 Messages.prototype.renderMessage = function renderMessage (messageToRender) {
27271 var message = Utils.extend({
27274 }, messageToRender);
27275 if (m.params.renderMessage) {
27276 return m.params.renderMessage.call(m, message);
27278 if (message.isTitle) {
27279 return ("<div class=\"messages-title\">" + (message.text) + "</div>");
27281 var attrs = Object.keys(message.attrs).map(function (attr) { return (attr + "=\"" + (message.attrs[attr]) + "\""); }).join(' ');
27282 return ("\n <div class=\"message message-" + (message.type) + " " + (message.isTyping ? 'message
-typing
' : '') + " " + (message.cssClass || '') + "\" " + attrs + ">\n " + (message.avatar ? ("\n <div class=\"message-avatar\" style=\"background-image:url(" + (message.avatar) + ")\"></div>\n ") : '') + "\n <div class=\"message-content\">\n " + (message.name ? ("<div class=\"message-name\">" + (message.name) + "</div>") : '') + "\n " + (message.header ? ("<div class=\"message-header\">" + (message.header) + "</div>") : '') + "\n <div class=\"message-bubble\">\n " + (message.textHeader ? ("<div class=\"message-text-header\">" + (message.textHeader) + "</div>") : '') + "\n " + (message.image ? ("<div class=\"message-image\">" + (message.image) + "</div>") : '') + "\n " + (message.imageSrc && !message.image ? ("<div class=\"message-image\"><img src=\"" + (message.imageSrc) + "\"></div>") : '') + "\n " + (message.text || message.isTyping ? ("<div class=\"message-text\">" + (message.text || '') + (message.isTyping ? '<div
class="message-typing-indicator"><div
></div><div></div><div
></div></div>' : '') + "</div>") : '') + "\n " + (message.textFooter ? ("<div class=\"message-text-footer\">" + (message.textFooter) + "</div>") : '') + "\n </div>\n " + (message.footer ? ("<div class=\"message-footer\">" + (message.footer) + "</div>") : '') + "\n </div>\n </div>\n ");
27285 Messages.prototype.renderMessages = function renderMessages (messagesToRender, method) {
27286 if ( messagesToRender === void 0 ) messagesToRender = this.messages;
27287 if ( method === void 0 ) method = this.params.newMessagesFirst ? 'prepend
' : 'append
';
27290 var html = messagesToRender.map(function (message) { return m.renderMessage(message); }).join('');
27291 m.$el[method](html);
27294 Messages.prototype.isFirstMessage = function isFirstMessage () {
27297 var args = [], len = arguments.length;
27298 while ( len-- ) args[ len ] = arguments[ len ];
27300 if (m.params.firstMessageRule) { return (ref = m.params).firstMessageRule.apply(ref, args); }
27304 Messages.prototype.isLastMessage = function isLastMessage () {
27307 var args = [], len = arguments.length;
27308 while ( len-- ) args[ len ] = arguments[ len ];
27310 if (m.params.lastMessageRule) { return (ref = m.params).lastMessageRule.apply(ref, args); }
27314 Messages.prototype.isTailMessage = function isTailMessage () {
27317 var args = [], len = arguments.length;
27318 while ( len-- ) args[ len ] = arguments[ len ];
27320 if (m.params.tailMessageRule) { return (ref = m.params).tailMessageRule.apply(ref, args); }
27324 Messages.prototype.isSameNameMessage = function isSameNameMessage () {
27327 var args = [], len = arguments.length;
27328 while ( len-- ) args[ len ] = arguments[ len ];
27330 if (m.params.sameNameMessageRule) { return (ref = m.params).sameNameMessageRule.apply(ref, args); }
27334 Messages.prototype.isSameHeaderMessage = function isSameHeaderMessage () {
27337 var args = [], len = arguments.length;
27338 while ( len-- ) args[ len ] = arguments[ len ];
27340 if (m.params.sameHeaderMessageRule) { return (ref = m.params).sameHeaderMessageRule.apply(ref, args); }
27344 Messages.prototype.isSameFooterMessage = function isSameFooterMessage () {
27347 var args = [], len = arguments.length;
27348 while ( len-- ) args[ len ] = arguments[ len ];
27350 if (m.params.sameFooterMessageRule) { return (ref = m.params).sameFooterMessageRule.apply(ref, args); }
27354 Messages.prototype.isSameAvatarMessage = function isSameAvatarMessage () {
27357 var args = [], len = arguments.length;
27358 while ( len-- ) args[ len ] = arguments[ len ];
27360 if (m.params.sameAvatarMessageRule) { return (ref = m.params).sameAvatarMessageRule.apply(ref, args); }
27364 Messages.prototype.isCustomClassMessage = function isCustomClassMessage () {
27367 var args = [], len = arguments.length;
27368 while ( len-- ) args[ len ] = arguments[ len ];
27370 if (m.params.customClassMessageRule) { return (ref = m.params).customClassMessageRule.apply(ref, args); }
27374 Messages.prototype.layout = function layout () {
27376 m.$el.find('.message
, .messages
-title
').each(function (index, messageEl) {
27377 var $messageEl = $(messageEl);
27379 m.messages = m.getMessagesData();
27382 var message = m.messages[index];
27383 var previousMessage = m.messages[index - 1];
27384 var nextMessage = m.messages[index + 1];
27385 if (m.isFirstMessage(message, previousMessage, nextMessage)) {
27386 classes.push('message
-first
');
27388 if (m.isLastMessage(message, previousMessage, nextMessage)) {
27389 classes.push('message
-last
');
27391 if (m.isTailMessage(message, previousMessage, nextMessage)) {
27392 classes.push('message
-tail
');
27394 if (m.isSameNameMessage(message, previousMessage, nextMessage)) {
27395 classes.push('message
-same
-name
');
27397 if (m.isSameHeaderMessage(message, previousMessage, nextMessage)) {
27398 classes.push('message
-same
-header
');
27400 if (m.isSameFooterMessage(message, previousMessage, nextMessage)) {
27401 classes.push('message
-same
-footer
');
27403 if (m.isSameAvatarMessage(message, previousMessage, nextMessage)) {
27404 classes.push('message
-same
-avatar
');
27406 var customMessageClasses = m.isCustomClassMessage(message, previousMessage, nextMessage);
27407 if (customMessageClasses && customMessageClasses.length) {
27408 if (typeof customMessageClasses === 'string
') {
27409 customMessageClasses = customMessageClasses.split(' ');
27411 customMessageClasses.forEach(function (customClass) {
27412 classes.push(customClass);
27415 $messageEl.removeClass('message
-first message
-last message
-tail message
-same
-name message
-same
-header message
-same
-footer message
-same
-avatar
');
27416 classes.forEach(function (className) {
27417 $messageEl.addClass(className);
27422 Messages.prototype.clear = function clear () {
27428 Messages.prototype.removeMessage = function removeMessage (messageToRemove, layout) {
27429 if ( layout === void 0 ) layout = true;
27435 if (typeof messageToRemove === 'number
') {
27436 index = messageToRemove;
27437 $el = m.$el.find('.message
, .messages
-title
').eq(index);
27438 } else if (m.messages && m.messages.indexOf(messageToRemove) >= 0) {
27439 index = m.messages.indexOf(messageToRemove);
27440 $el = m.$el.children().eq(index);
27442 $el = $(messageToRemove);
27443 index = $el.index();
27445 if ($el.length === 0) {
27449 m.messages.splice(index, 1);
27450 if (m.params.autoLayout && layout) { m.layout(); }
27454 Messages.prototype.removeMessages = function removeMessages (messagesToRemove, layout) {
27455 if ( layout === void 0 ) layout = true;
27458 if (Array.isArray(messagesToRemove)) {
27459 var messagesToRemoveEls = [];
27460 messagesToRemove.forEach(function (messageToRemoveIndex) {
27461 messagesToRemoveEls.push(m.$el.find('.message
, .messages
-title
').eq(messageToRemoveIndex));
27463 messagesToRemoveEls.forEach(function (messageToRemove) {
27464 m.removeMessage(messageToRemove, false);
27467 $(messagesToRemove).each(function (index, messageToRemove) {
27468 m.removeMessage(messageToRemove, false);
27471 if (m.params.autoLayout && layout) { m.layout(); }
27475 Messages.prototype.addMessage = function addMessage () {
27476 var assign, assign$1;
27478 var args = [], len = arguments.length;
27479 while ( len-- ) args[ len ] = arguments[ len ];
27484 if (typeof args[1] === 'boolean') {
27485 (assign = args, messageToAdd = assign[0], animate = assign[1], method = assign[2]);
27487 (assign$1 = args, messageToAdd = assign$1[0], method = assign$1[1], animate = assign$1[2]);
27489 if (typeof animate === 'undefined') {
27492 if (typeof method === 'undefined') {
27493 method = m.params.newMessagesFirst ? 'prepend
' : 'append
';
27496 return m.addMessages([messageToAdd], animate, method);
27499 Messages.prototype.addMessages = function addMessages () {
27500 var assign, assign$1;
27502 var args = [], len = arguments.length;
27503 while ( len-- ) args[ len ] = arguments[ len ];
27508 if (typeof args[1] === 'boolean') {
27509 (assign = args, messagesToAdd = assign[0], animate = assign[1], method = assign[2]);
27511 (assign$1 = args, messagesToAdd = assign$1[0], method = assign$1[1], animate = assign$1[2]);
27513 if (typeof animate === 'undefined') {
27516 if (typeof method === 'undefined') {
27517 method = m.params.newMessagesFirst ? 'prepend
' : 'append
';
27520 // Define scroll positions before new messages added
27521 var scrollHeightBefore = m.pageContentEl.scrollHeight;
27522 var heightBefore = m.pageContentEl.offsetHeight;
27523 var scrollBefore = m.pageContentEl.scrollTop;
27525 // Add message to DOM and data
27526 var messagesHTML = '';
27527 var typingMessage = m.messages.filter(function (el) { return el.isTyping; })[0];
27528 messagesToAdd.forEach(function (messageToAdd) {
27529 if (typingMessage) {
27530 if (method === 'append
') {
27531 m.messages.splice(m.messages.indexOf(typingMessage), 0, messageToAdd);
27533 m.messages.splice(m.messages.indexOf(typingMessage) + 1, 0, messageToAdd);
27536 m.messages[method === 'append
' ? 'push
' : 'unshift
'](messageToAdd);
27538 messagesHTML += m.renderMessage(messageToAdd);
27540 var $messagesEls = $(messagesHTML);
27542 if (method === 'append
' && !m.params.newMessagesFirst) {
27543 $messagesEls.addClass('message
-appear
-from-bottom
');
27545 if (method === 'prepend
' && m.params.newMessagesFirst) {
27546 $messagesEls.addClass('message
-appear
-from-top
');
27549 if (typingMessage) {
27550 if (method === 'append
') {
27551 $messagesEls.insertBefore(m.$el.find('.message
-typing
'));
27553 $messagesEls.insertAfter(m.$el.find('.message
-typing
'));
27556 m.$el[method]($messagesEls);
27560 if (m.params.autoLayout) { m.layout(); }
27562 if (method === 'prepend
' && !typingMessage) {
27563 m.pageContentEl.scrollTop = scrollBefore + (m.pageContentEl.scrollHeight - scrollHeightBefore);
27566 if (m.params.scrollMessages && ((method === 'append
' && !m.params.newMessagesFirst) || (method === 'prepend
' && m.params.newMessagesFirst && !typingMessage))) {
27567 if (m.params.scrollMessagesOnEdge) {
27568 var onEdge = false;
27569 if (m.params.newMessagesFirst && scrollBefore === 0) {
27572 if (!m.params.newMessagesFirst && (scrollBefore - (scrollHeightBefore - heightBefore) >= -10)) {
27575 if (onEdge) { m.scroll(animate ? undefined : 0); }
27577 m.scroll(animate ? undefined : 0);
27584 Messages.prototype.showTyping = function showTyping (message) {
27585 if ( message === void 0 ) message = {};
27588 var typingMessage = m.messages.filter(function (el) { return el.isTyping; })[0];
27589 if (typingMessage) {
27590 m.removeMessage(m.messages.indexOf(typingMessage));
27592 m.addMessage(Utils.extend({
27599 Messages.prototype.hideTyping = function hideTyping () {
27601 var typingMessageIndex;
27603 m.messages.forEach(function (message, index) {
27604 if (message.isTyping) { typingMessageIndex = index; }
27606 if (typeof typingMessageIndex !== 'undefined') {
27607 if (m.$el.find('.message
').eq(typingMessageIndex).hasClass('message
-typing
')) {
27608 typingFound = true;
27609 m.removeMessage(typingMessageIndex);
27612 if (!typingFound) {
27613 var $typingMessageEl = m.$el.find('.message
-typing
');
27614 if ($typingMessageEl.length) {
27615 m.removeMessage($typingMessageEl);
27621 Messages.prototype.scroll = function scroll (duration, scrollTop) {
27622 if ( duration === void 0 ) duration = 300;
27625 var currentScroll = m.pageContentEl.scrollTop;
27627 if (typeof scrollTop !== 'undefined') { newScrollTop = scrollTop; }
27629 newScrollTop = m.params.newMessagesFirst ? 0 : m.pageContentEl.scrollHeight - m.pageContentEl.offsetHeight;
27630 if (newScrollTop === currentScroll) { return m; }
27632 m.$pageContentEl.scrollTop(newScrollTop, duration);
27636 Messages.prototype.init = function init () {
27638 if (!m.messages || m.messages.length === 0) {
27639 m.messages = m.getMessagesData();
27641 if (m.params.messages && m.params.messages.length) {
27642 m.renderMessages();
27644 if (m.params.autoLayout) { m.layout(); }
27645 if (m.params.scrollMessages) { m.scroll(0); }
27648 Messages.prototype.destroy = function destroy () {
27650 m.emit('local
::beforeDestroy messagesBeforeDestroy
', m);
27651 m.$el.trigger('messages
:beforedestroy
', m);
27653 m.$el[0].f7Messages = null;
27654 delete m.$el[0].f7Messages;
27656 Utils.deleteProps(m);
27660 }(Framework7Class));
27665 Messages: Messages,
27667 create: function create() {
27669 app.messages = ConstructorMethods({
27670 defaultSelector: '.messages
',
27671 constructor: Messages,
27673 domProp: 'f7Messages
',
27674 addMethods: 'renderMessages layout scroll clear removeMessage removeMessages addMessage addMessages
'.split(' '),
27678 tabBeforeRemove: function tabBeforeRemove(tabEl) {
27680 $(tabEl).find('.messages
-init
').each(function (index, messagesEl) {
27681 app.messages.destroy(messagesEl);
27684 tabMounted: function tabMounted(tabEl) {
27686 $(tabEl).find('.messages
-init
').each(function (index, messagesEl) {
27687 app.messages.create({ el: messagesEl });
27690 pageBeforeRemove: function pageBeforeRemove(page) {
27692 page.$el.find('.messages
-init
').each(function (index, messagesEl) {
27693 app.messages.destroy(messagesEl);
27696 pageInit: function pageInit(page) {
27698 page.$el.find('.messages
-init
').each(function (index, messagesEl) {
27699 app.messages.create({ el: messagesEl });
27705 insert: function insert(vnode) {
27707 var messagesEl = vnode.elm;
27708 app.messages.create({ el: messagesEl });
27710 destroy: function destroy(vnode) {
27712 var messagesEl = vnode.elm;
27713 app.messages.destroy(messagesEl);
27719 var Messagebar = /*@__PURE__*/(function (Framework7Class) {
27720 function Messagebar(app, params) {
27721 if ( params === void 0 ) params = {};
27723 Framework7Class.call(this, params, [app]);
27725 var messagebar = this;
27732 renderAttachments: undefined,
27733 renderAttachment: undefined,
27738 // Extend defaults with modules params
27739 messagebar.useModulesParams(defaults);
27741 messagebar.params = Utils.extend(defaults, params);
27744 var $el = $(messagebar.params.el);
27745 if ($el.length === 0) { return messagebar; }
27747 if ($el[0].f7Messagebar) { return $el[0].f7Messagebar; }
27749 $el[0].f7Messagebar = messagebar;
27751 // Page and PageContent
27752 var $pageEl = $el.parents('.page
').eq(0);
27753 var $pageContentEl = $pageEl.find('.page
-content
').eq(0);
27756 var $areaEl = $el.find('.messagebar
-area
');
27760 if (messagebar.params.textareaEl) {
27761 $textareaEl = $(messagebar.params.textareaEl);
27763 $textareaEl = $el.find('textarea
');
27766 // Attachments & Library
27767 var $attachmentsEl = $el.find('.messagebar
-attachments
');
27768 var $sheetEl = $el.find('.messagebar
-sheet
');
27770 if (messagebar.params.top) {
27771 $el.addClass('messagebar
-top
');
27774 Utils.extend(messagebar, {
27778 areaEl: $areaEl[0],
27779 $textareaEl: $textareaEl,
27780 textareaEl: $textareaEl[0],
27781 $attachmentsEl: $attachmentsEl,
27782 attachmentsEl: $attachmentsEl[0],
27783 attachmentsVisible: $attachmentsEl.hasClass('messagebar
-attachments
-visible
'),
27784 $sheetEl: $sheetEl,
27785 sheetEl: $sheetEl[0],
27786 sheetVisible: $sheetEl.hasClass('messagebar
-sheet
-visible
'),
27788 pageEl: $pageEl[0],
27789 $pageContentEl: $pageContentEl,
27790 pageContentEl: $pageContentEl,
27791 top: $el.hasClass('messagebar
-top
') || messagebar.params.top,
27796 function onAppResize() {
27797 if (messagebar.params.resizePage) {
27798 messagebar.resizePage();
27801 function onSubmit(e) {
27802 e.preventDefault();
27804 function onAttachmentClick(e) {
27805 var index = $(this).index();
27806 if ($(e.target).closest('.messagebar
-attachment
-delete').length) {
27807 $(this).trigger('messagebar
:attachmentdelete
', index);
27808 messagebar.emit('local
::attachmentDelete messagebarAttachmentDelete
', messagebar, this, index);
27810 $(this).trigger('messagebar
:attachmentclick
', index);
27811 messagebar.emit('local
::attachmentClick messagebarAttachmentClick
', messagebar, this, index);
27814 function onTextareaChange() {
27815 messagebar.checkEmptyState();
27816 messagebar.$el.trigger('messagebar
:change
');
27817 messagebar.emit('local
::change messagebarChange
', messagebar);
27819 function onTextareaFocus() {
27820 messagebar.sheetHide();
27821 messagebar.$el.addClass('messagebar
-focused
');
27822 messagebar.$el.trigger('messagebar
:focus
');
27823 messagebar.emit('local
::focus messagebarFocus
', messagebar);
27825 function onTextareaBlur() {
27826 messagebar.$el.removeClass('messagebar
-focused
');
27827 messagebar.$el.trigger('messagebar
:blur
');
27828 messagebar.emit('local
::blur messagebarBlur
', messagebar);
27831 messagebar.attachEvents = function attachEvents() {
27832 $el.on('textarea
:resize
', onAppResize);
27833 $el.on('submit
', onSubmit);
27834 $el.on('click
', '.messagebar
-attachment
', onAttachmentClick);
27835 $textareaEl.on('change input
', onTextareaChange);
27836 $textareaEl.on('focus
', onTextareaFocus);
27837 $textareaEl.on('blur
', onTextareaBlur);
27838 app.on('resize
', onAppResize);
27840 messagebar.detachEvents = function detachEvents() {
27841 $el.off('textarea
:resize
', onAppResize);
27842 $el.off('submit
', onSubmit);
27843 $el.off('click
', '.messagebar
-attachment
', onAttachmentClick);
27844 $textareaEl.off('change input
', onTextareaChange);
27845 $textareaEl.off('focus
', onTextareaFocus);
27846 $textareaEl.off('blur
', onTextareaBlur);
27847 app.off('resize
', onAppResize);
27852 messagebar.useModules();
27860 if ( Framework7Class ) Messagebar.__proto__ = Framework7Class;
27861 Messagebar.prototype = Object.create( Framework7Class && Framework7Class.prototype );
27862 Messagebar.prototype.constructor = Messagebar;
27864 Messagebar.prototype.focus = function focus () {
27865 var messagebar = this;
27866 messagebar.$textareaEl.focus();
27870 Messagebar.prototype.blur = function blur () {
27871 var messagebar = this;
27872 messagebar.$textareaEl.blur();
27876 Messagebar.prototype.clear = function clear () {
27877 var messagebar = this;
27878 messagebar.$textareaEl.val('').trigger('change
');
27882 Messagebar.prototype.getValue = function getValue () {
27883 var messagebar = this;
27884 return messagebar.$textareaEl.val().trim();
27887 Messagebar.prototype.setValue = function setValue (value) {
27888 var messagebar = this;
27889 messagebar.$textareaEl.val(value).trigger('change
');
27893 Messagebar.prototype.setPlaceholder = function setPlaceholder (placeholder) {
27894 var messagebar = this;
27895 messagebar.$textareaEl.attr('placeholder
', placeholder);
27899 Messagebar.prototype.resizePage = function resizePage () {
27900 var messagebar = this;
27901 var params = messagebar.params;
27902 var $el = messagebar.$el;
27903 var top = messagebar.top;
27904 var $pageEl = messagebar.$pageEl;
27905 var $pageContentEl = messagebar.$pageContentEl;
27906 var $areaEl = messagebar.$areaEl;
27907 var $textareaEl = messagebar.$textareaEl;
27908 var $sheetEl = messagebar.$sheetEl;
27909 var $attachmentsEl = messagebar.$attachmentsEl;
27910 var elHeight = $el[0].offsetHeight;
27911 var maxHeight = params.maxHeight;
27913 var currentPaddingBottom = parseInt($pageContentEl.css('padding
-bottom
'), 10);
27914 var requiredPaddingBottom = elHeight + params.bottomOffset;
27915 if (requiredPaddingBottom !== currentPaddingBottom && $pageContentEl.length) {
27916 var currentPaddingTop = parseInt($pageContentEl.css('padding
-top
'), 10);
27917 var pageScrollHeight = $pageContentEl[0].scrollHeight;
27918 var pageOffsetHeight = $pageContentEl[0].offsetHeight;
27919 var pageScrollTop = $pageContentEl[0].scrollTop;
27920 var scrollOnBottom = (pageScrollTop === pageScrollHeight - pageOffsetHeight);
27922 maxHeight = $pageEl[0].offsetHeight - currentPaddingTop - $sheetEl.outerHeight() - $attachmentsEl.outerHeight() - parseInt($areaEl.css('margin
-top
'), 10) - parseInt($areaEl.css('margin
-bottom
'), 10);
27924 $textareaEl.css('max
-height
', (maxHeight + "px"));
27925 $pageContentEl.css('padding
-bottom
', (requiredPaddingBottom + "px"));
27926 if (scrollOnBottom) {
27927 $pageContentEl.scrollTop($pageContentEl[0].scrollHeight - pageOffsetHeight);
27929 $el.trigger('messagebar
:resizepage
');
27930 messagebar.emit('local
::resizePage messagebarResizePage
', messagebar);
27935 Messagebar.prototype.checkEmptyState = function checkEmptyState () {
27936 var messagebar = this;
27937 var $el = messagebar.$el;
27938 var $textareaEl = messagebar.$textareaEl;
27939 var value = $textareaEl.val().trim();
27940 if (value && value.length) {
27941 $el.addClass('messagebar
-with-value
');
27943 $el.removeClass('messagebar
-with-value
');
27947 Messagebar.prototype.attachmentsCreate = function attachmentsCreate (innerHTML) {
27948 if ( innerHTML === void 0 ) innerHTML = '';
27950 var messagebar = this;
27951 var $attachmentsEl = $(("<div class=\"messagebar-attachments\">" + innerHTML + "</div>"));
27952 $attachmentsEl.insertBefore(messagebar.$textareaEl);
27953 Utils.extend(messagebar, {
27954 $attachmentsEl: $attachmentsEl,
27955 attachmentsEl: $attachmentsEl[0],
27960 Messagebar.prototype.attachmentsShow = function attachmentsShow (innerHTML) {
27961 if ( innerHTML === void 0 ) innerHTML = '';
27963 var messagebar = this;
27964 messagebar.$attachmentsEl = messagebar.$el.find('.messagebar
-attachments
');
27965 if (messagebar.$attachmentsEl.length === 0) {
27966 messagebar.attachmentsCreate(innerHTML);
27968 messagebar.$el.addClass('messagebar
-attachments
-visible
');
27969 messagebar.attachmentsVisible = true;
27970 if (messagebar.params.resizePage) {
27971 messagebar.resizePage();
27976 Messagebar.prototype.attachmentsHide = function attachmentsHide () {
27977 var messagebar = this;
27978 messagebar.$el.removeClass('messagebar
-attachments
-visible
');
27979 messagebar.attachmentsVisible = false;
27980 if (messagebar.params.resizePage) {
27981 messagebar.resizePage();
27986 Messagebar.prototype.attachmentsToggle = function attachmentsToggle () {
27987 var messagebar = this;
27988 if (messagebar.attachmentsVisible) {
27989 messagebar.attachmentsHide();
27991 messagebar.attachmentsShow();
27996 Messagebar.prototype.renderAttachment = function renderAttachment (attachment) {
27997 var messagebar = this;
27998 if (messagebar.params.renderAttachment) {
27999 return messagebar.params.renderAttachment.call(messagebar, attachment);
28001 return ("\n <div class=\"messagebar-attachment\">\n <img src=\"" + attachment + "\">\n <span class=\"messagebar-attachment-delete\"></span>\n </div>\n ");
28004 Messagebar.prototype.renderAttachments = function renderAttachments () {
28005 var messagebar = this;
28007 if (messagebar.params.renderAttachments) {
28008 html = messagebar.params.renderAttachments.call(messagebar, messagebar.attachments);
28010 html = "" + (messagebar.attachments.map(function (attachment) { return messagebar.renderAttachment(attachment); }).join(''));
28012 if (messagebar.$attachmentsEl.length === 0) {
28013 messagebar.attachmentsCreate(html);
28015 messagebar.$attachmentsEl.html(html);
28019 Messagebar.prototype.sheetCreate = function sheetCreate (innerHTML) {
28020 if ( innerHTML === void 0 ) innerHTML = '';
28022 var messagebar = this;
28023 var $sheetEl = $(("<div class=\"messagebar-sheet\">" + innerHTML + "</div>"));
28024 messagebar.$el.append($sheetEl);
28025 Utils.extend(messagebar, {
28026 $sheetEl: $sheetEl,
28027 sheetEl: $sheetEl[0],
28032 Messagebar.prototype.sheetShow = function sheetShow (innerHTML) {
28033 if ( innerHTML === void 0 ) innerHTML = '';
28035 var messagebar = this;
28036 messagebar.$sheetEl = messagebar.$el.find('.messagebar
-sheet
');
28037 if (messagebar.$sheetEl.length === 0) {
28038 messagebar.sheetCreate(innerHTML);
28040 messagebar.$el.addClass('messagebar
-sheet
-visible
');
28041 messagebar.sheetVisible = true;
28042 if (messagebar.params.resizePage) {
28043 messagebar.resizePage();
28048 Messagebar.prototype.sheetHide = function sheetHide () {
28049 var messagebar = this;
28050 messagebar.$el.removeClass('messagebar
-sheet
-visible
');
28051 messagebar.sheetVisible = false;
28052 if (messagebar.params.resizePage) {
28053 messagebar.resizePage();
28058 Messagebar.prototype.sheetToggle = function sheetToggle () {
28059 var messagebar = this;
28060 if (messagebar.sheetVisible) {
28061 messagebar.sheetHide();
28063 messagebar.sheetShow();
28068 Messagebar.prototype.init = function init () {
28069 var messagebar = this;
28070 messagebar.attachEvents();
28071 messagebar.checkEmptyState();
28075 Messagebar.prototype.destroy = function destroy () {
28076 var messagebar = this;
28077 messagebar.emit('local
::beforeDestroy messagebarBeforeDestroy
', messagebar);
28078 messagebar.$el.trigger('messagebar
:beforedestroy
', messagebar);
28079 messagebar.detachEvents();
28080 if (messagebar.$el[0]) {
28081 messagebar.$el[0].f7Messagebar = null;
28082 delete messagebar.$el[0].f7Messagebar;
28084 Utils.deleteProps(messagebar);
28088 }(Framework7Class));
28090 var Messagebar$1 = {
28091 name: 'messagebar
',
28093 Messagebar: Messagebar,
28095 create: function create() {
28097 app.messagebar = ConstructorMethods({
28098 defaultSelector: '.messagebar
',
28099 constructor: Messagebar,
28101 domProp: 'f7Messagebar
',
28102 addMethods: 'clear getValue setValue setPlaceholder resizePage focus blur attachmentsCreate attachmentsShow attachmentsHide attachmentsToggle renderAttachments sheetCreate sheetShow sheetHide sheetToggle
'.split(' '),
28106 tabBeforeRemove: function tabBeforeRemove(tabEl) {
28108 $(tabEl).find('.messagebar
-init
').each(function (index, messagebarEl) {
28109 app.messagebar.destroy(messagebarEl);
28112 tabMounted: function tabMounted(tabEl) {
28114 $(tabEl).find('.messagebar
-init
').each(function (index, messagebarEl) {
28115 app.messagebar.create(Utils.extend({ el: messagebarEl }, $(messagebarEl).dataset()));
28118 pageBeforeRemove: function pageBeforeRemove(page) {
28120 page.$el.find('.messagebar
-init
').each(function (index, messagebarEl) {
28121 app.messagebar.destroy(messagebarEl);
28124 pageInit: function pageInit(page) {
28126 page.$el.find('.messagebar
-init
').each(function (index, messagebarEl) {
28127 app.messagebar.create(Utils.extend({ el: messagebarEl }, $(messagebarEl).dataset()));
28132 'messagebar
-init
': {
28133 insert: function insert(vnode) {
28135 var messagebarEl = vnode.elm;
28136 app.messagebar.create(Utils.extend({ el: messagebarEl }, $(messagebarEl).dataset()));
28138 destroy: function destroy(vnode) {
28140 var messagebarEl = vnode.elm;
28141 app.messagebar.destroy(messagebarEl);
28147 var Browser = (function Browser() {
28148 function isSafari() {
28149 var ua = win.navigator.userAgent.toLowerCase();
28150 return (ua.indexOf('safari
') >= 0 && ua.indexOf('chrome
') < 0 && ua.indexOf('android
') < 0);
28153 isIE: !!win.navigator.userAgent.match(/Trident/g) || !!win.navigator.userAgent.match(/MSIE/g),
28154 isSafari: isSafari(),
28155 isUiWebView: /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/i.test(win.navigator.userAgent),
28159 function updateSize () {
28163 var $el = swiper.$el;
28164 if (typeof swiper.params.width !== 'undefined') {
28165 width = swiper.params.width;
28167 width = $el[0].clientWidth;
28169 if (typeof swiper.params.height !== 'undefined') {
28170 height = swiper.params.height;
28172 height = $el[0].clientHeight;
28174 if ((width === 0 && swiper.isHorizontal()) || (height === 0 && swiper.isVertical())) {
28178 // Subtract paddings
28179 width = width - parseInt($el.css('padding
-left
'), 10) - parseInt($el.css('padding
-right
'), 10);
28180 height = height - parseInt($el.css('padding
-top
'), 10) - parseInt($el.css('padding
-bottom
'), 10);
28182 Utils.extend(swiper, {
28185 size: swiper.isHorizontal() ? width : height,
28189 function updateSlides () {
28191 var params = swiper.params;
28193 var $wrapperEl = swiper.$wrapperEl;
28194 var swiperSize = swiper.size;
28195 var rtl = swiper.rtlTranslate;
28196 var wrongRTL = swiper.wrongRTL;
28197 var isVirtual = swiper.virtual && params.virtual.enabled;
28198 var previousSlidesLength = isVirtual ? swiper.virtual.slides.length : swiper.slides.length;
28199 var slides = $wrapperEl.children(("." + (swiper.params.slideClass)));
28200 var slidesLength = isVirtual ? swiper.virtual.slides.length : slides.length;
28202 var slidesGrid = [];
28203 var slidesSizesGrid = [];
28205 var offsetBefore = params.slidesOffsetBefore;
28206 if (typeof offsetBefore === 'function') {
28207 offsetBefore = params.slidesOffsetBefore.call(swiper);
28210 var offsetAfter = params.slidesOffsetAfter;
28211 if (typeof offsetAfter === 'function') {
28212 offsetAfter = params.slidesOffsetAfter.call(swiper);
28215 var previousSnapGridLength = swiper.snapGrid.length;
28216 var previousSlidesGridLength = swiper.snapGrid.length;
28218 var spaceBetween = params.spaceBetween;
28219 var slidePosition = -offsetBefore;
28220 var prevSlideSize = 0;
28222 if (typeof swiperSize === 'undefined') {
28225 if (typeof spaceBetween === 'string
' && spaceBetween.indexOf('%') >= 0) {
28226 spaceBetween = (parseFloat(spaceBetween.replace('%', '')) / 100) * swiperSize;
28229 swiper.virtualSize = -spaceBetween;
28232 if (rtl) { slides.css({ marginLeft: '', marginTop: '' }); }
28233 else { slides.css({ marginRight: '', marginBottom: '' }); }
28235 var slidesNumberEvenToRows;
28236 if (params.slidesPerColumn > 1) {
28237 if (Math.floor(slidesLength / params.slidesPerColumn) === slidesLength / swiper.params.slidesPerColumn) {
28238 slidesNumberEvenToRows = slidesLength;
28240 slidesNumberEvenToRows = Math.ceil(slidesLength / params.slidesPerColumn) * params.slidesPerColumn;
28242 if (params.slidesPerView !== 'auto
' && params.slidesPerColumnFill === 'row
') {
28243 slidesNumberEvenToRows = Math.max(slidesNumberEvenToRows, params.slidesPerView * params.slidesPerColumn);
28249 var slidesPerColumn = params.slidesPerColumn;
28250 var slidesPerRow = slidesNumberEvenToRows / slidesPerColumn;
28251 var numFullColumns = Math.floor(slidesLength / params.slidesPerColumn);
28252 for (var i = 0; i < slidesLength; i += 1) {
28254 var slide = slides.eq(i);
28255 if (params.slidesPerColumn > 1) {
28256 // Set slides order
28257 var newSlideOrderIndex = (void 0);
28258 var column = (void 0);
28259 var row = (void 0);
28260 if (params.slidesPerColumnFill === 'column
') {
28261 column = Math.floor(i / slidesPerColumn);
28262 row = i - (column * slidesPerColumn);
28263 if (column > numFullColumns || (column === numFullColumns && row === slidesPerColumn - 1)) {
28265 if (row >= slidesPerColumn) {
28270 newSlideOrderIndex = column + ((row * slidesNumberEvenToRows) / slidesPerColumn);
28273 '-webkit
-box
-ordinal
-group
': newSlideOrderIndex,
28274 '-moz
-box
-ordinal
-group
': newSlideOrderIndex,
28275 '-ms
-flex
-order
': newSlideOrderIndex,
28276 '-webkit
-order
': newSlideOrderIndex,
28277 order: newSlideOrderIndex,
28280 row = Math.floor(i / slidesPerRow);
28281 column = i - (row * slidesPerRow);
28285 ("margin-" + (swiper.isHorizontal() ? 'top
' : 'left
')),
28286 (row !== 0 && params.spaceBetween) && (((params.spaceBetween) + "px"))
28288 .attr('data
-swiper
-column
', column)
28289 .attr('data
-swiper
-row
', row);
28291 if (slide.css('display
') === 'none
') { continue; } // eslint-disable-line
28293 if (params.slidesPerView === 'auto
') {
28294 var slideStyles = win.getComputedStyle(slide[0], null);
28295 var currentTransform = slide[0].style.transform;
28296 var currentWebKitTransform = slide[0].style.webkitTransform;
28297 if (currentTransform) {
28298 slide[0].style.transform = 'none
';
28300 if (currentWebKitTransform) {
28301 slide[0].style.webkitTransform = 'none
';
28303 if (params.roundLengths) {
28304 slideSize = swiper.isHorizontal()
28305 ? slide.outerWidth(true)
28306 : slide.outerHeight(true);
28308 // eslint-disable-next-line
28309 if (swiper.isHorizontal()) {
28310 var width = parseFloat(slideStyles.getPropertyValue('width
'));
28311 var paddingLeft = parseFloat(slideStyles.getPropertyValue('padding
-left
'));
28312 var paddingRight = parseFloat(slideStyles.getPropertyValue('padding
-right
'));
28313 var marginLeft = parseFloat(slideStyles.getPropertyValue('margin
-left
'));
28314 var marginRight = parseFloat(slideStyles.getPropertyValue('margin
-right
'));
28315 var boxSizing = slideStyles.getPropertyValue('box
-sizing
');
28316 if (boxSizing && boxSizing === 'border
-box
') {
28317 slideSize = width + marginLeft + marginRight;
28319 slideSize = width + paddingLeft + paddingRight + marginLeft + marginRight;
28322 var height = parseFloat(slideStyles.getPropertyValue('height
'));
28323 var paddingTop = parseFloat(slideStyles.getPropertyValue('padding
-top
'));
28324 var paddingBottom = parseFloat(slideStyles.getPropertyValue('padding
-bottom
'));
28325 var marginTop = parseFloat(slideStyles.getPropertyValue('margin
-top
'));
28326 var marginBottom = parseFloat(slideStyles.getPropertyValue('margin
-bottom
'));
28327 var boxSizing$1 = slideStyles.getPropertyValue('box
-sizing
');
28328 if (boxSizing$1 && boxSizing$1 === 'border
-box
') {
28329 slideSize = height + marginTop + marginBottom;
28331 slideSize = height + paddingTop + paddingBottom + marginTop + marginBottom;
28335 if (currentTransform) {
28336 slide[0].style.transform = currentTransform;
28338 if (currentWebKitTransform) {
28339 slide[0].style.webkitTransform = currentWebKitTransform;
28341 if (params.roundLengths) { slideSize = Math.floor(slideSize); }
28343 slideSize = (swiperSize - ((params.slidesPerView - 1) * spaceBetween)) / params.slidesPerView;
28344 if (params.roundLengths) { slideSize = Math.floor(slideSize); }
28347 if (swiper.isHorizontal()) {
28348 slides[i].style.width = slideSize + "px";
28350 slides[i].style.height = slideSize + "px";
28355 slides[i].swiperSlideSize = slideSize;
28357 slidesSizesGrid.push(slideSize);
28360 if (params.centeredSlides) {
28361 slidePosition = slidePosition + (slideSize / 2) + (prevSlideSize / 2) + spaceBetween;
28362 if (prevSlideSize === 0 && i !== 0) { slidePosition = slidePosition - (swiperSize / 2) - spaceBetween; }
28363 if (i === 0) { slidePosition = slidePosition - (swiperSize / 2) - spaceBetween; }
28364 if (Math.abs(slidePosition) < 1 / 1000) { slidePosition = 0; }
28365 if (params.roundLengths) { slidePosition = Math.floor(slidePosition); }
28366 if ((index) % params.slidesPerGroup === 0) { snapGrid.push(slidePosition); }
28367 slidesGrid.push(slidePosition);
28369 if (params.roundLengths) { slidePosition = Math.floor(slidePosition); }
28370 if ((index) % params.slidesPerGroup === 0) { snapGrid.push(slidePosition); }
28371 slidesGrid.push(slidePosition);
28372 slidePosition = slidePosition + slideSize + spaceBetween;
28375 swiper.virtualSize += slideSize + spaceBetween;
28377 prevSlideSize = slideSize;
28381 swiper.virtualSize = Math.max(swiper.virtualSize, swiperSize) + offsetAfter;
28385 rtl && wrongRTL && (params.effect === 'slide
' || params.effect === 'coverflow
')) {
28386 $wrapperEl.css({ width: ((swiper.virtualSize + params.spaceBetween) + "px") });
28388 if (!Support.flexbox || params.setWrapperSize) {
28389 if (swiper.isHorizontal()) { $wrapperEl.css({ width: ((swiper.virtualSize + params.spaceBetween) + "px") }); }
28390 else { $wrapperEl.css({ height: ((swiper.virtualSize + params.spaceBetween) + "px") }); }
28393 if (params.slidesPerColumn > 1) {
28394 swiper.virtualSize = (slideSize + params.spaceBetween) * slidesNumberEvenToRows;
28395 swiper.virtualSize = Math.ceil(swiper.virtualSize / params.slidesPerColumn) - params.spaceBetween;
28396 if (swiper.isHorizontal()) { $wrapperEl.css({ width: ((swiper.virtualSize + params.spaceBetween) + "px") }); }
28397 else { $wrapperEl.css({ height: ((swiper.virtualSize + params.spaceBetween) + "px") }); }
28398 if (params.centeredSlides) {
28399 newSlidesGrid = [];
28400 for (var i$1 = 0; i$1 < snapGrid.length; i$1 += 1) {
28401 var slidesGridItem = snapGrid[i$1];
28402 if (params.roundLengths) { slidesGridItem = Math.floor(slidesGridItem); }
28403 if (snapGrid[i$1] < swiper.virtualSize + snapGrid[0]) { newSlidesGrid.push(slidesGridItem); }
28405 snapGrid = newSlidesGrid;
28409 // Remove last grid elements depending on width
28410 if (!params.centeredSlides) {
28411 newSlidesGrid = [];
28412 for (var i$2 = 0; i$2 < snapGrid.length; i$2 += 1) {
28413 var slidesGridItem$1 = snapGrid[i$2];
28414 if (params.roundLengths) { slidesGridItem$1 = Math.floor(slidesGridItem$1); }
28415 if (snapGrid[i$2] <= swiper.virtualSize - swiperSize) {
28416 newSlidesGrid.push(slidesGridItem$1);
28419 snapGrid = newSlidesGrid;
28420 if (Math.floor(swiper.virtualSize - swiperSize) - Math.floor(snapGrid[snapGrid.length - 1]) > 1) {
28421 snapGrid.push(swiper.virtualSize - swiperSize);
28424 if (snapGrid.length === 0) { snapGrid = [0]; }
28426 if (params.spaceBetween !== 0) {
28427 if (swiper.isHorizontal()) {
28428 if (rtl) { slides.css({ marginLeft: (spaceBetween + "px") }); }
28429 else { slides.css({ marginRight: (spaceBetween + "px") }); }
28430 } else { slides.css({ marginBottom: (spaceBetween + "px") }); }
28433 if (params.centerInsufficientSlides) {
28434 var allSlidesSize = 0;
28435 slidesSizesGrid.forEach(function (slideSizeValue) {
28436 allSlidesSize += slideSizeValue + (params.spaceBetween ? params.spaceBetween : 0);
28438 allSlidesSize -= params.spaceBetween;
28439 if (allSlidesSize < swiperSize) {
28440 var allSlidesOffset = (swiperSize - allSlidesSize) / 2;
28441 snapGrid.forEach(function (snap, snapIndex) {
28442 snapGrid[snapIndex] = snap - allSlidesOffset;
28444 slidesGrid.forEach(function (snap, snapIndex) {
28445 slidesGrid[snapIndex] = snap + allSlidesOffset;
28450 Utils.extend(swiper, {
28452 snapGrid: snapGrid,
28453 slidesGrid: slidesGrid,
28454 slidesSizesGrid: slidesSizesGrid,
28457 if (slidesLength !== previousSlidesLength) {
28458 swiper.emit('slidesLengthChange
');
28460 if (snapGrid.length !== previousSnapGridLength) {
28461 if (swiper.params.watchOverflow) { swiper.checkOverflow(); }
28462 swiper.emit('snapGridLengthChange
');
28464 if (slidesGrid.length !== previousSlidesGridLength) {
28465 swiper.emit('slidesGridLengthChange
');
28468 if (params.watchSlidesProgress || params.watchSlidesVisibility) {
28469 swiper.updateSlidesOffset();
28473 function updateAutoHeight (speed) {
28475 var activeSlides = [];
28478 if (typeof speed === 'number
') {
28479 swiper.setTransition(speed);
28480 } else if (speed === true) {
28481 swiper.setTransition(swiper.params.speed);
28483 // Find slides currently in view
28484 if (swiper.params.slidesPerView !== 'auto
' && swiper.params.slidesPerView > 1) {
28485 for (i = 0; i < Math.ceil(swiper.params.slidesPerView); i += 1) {
28486 var index = swiper.activeIndex + i;
28487 if (index > swiper.slides.length) { break; }
28488 activeSlides.push(swiper.slides.eq(index)[0]);
28491 activeSlides.push(swiper.slides.eq(swiper.activeIndex)[0]);
28494 // Find new height from highest slide in view
28495 for (i = 0; i < activeSlides.length; i += 1) {
28496 if (typeof activeSlides[i] !== 'undefined') {
28497 var height = activeSlides[i].offsetHeight;
28498 newHeight = height > newHeight ? height : newHeight;
28503 if (newHeight) { swiper.$wrapperEl.css('height
', (newHeight + "px")); }
28506 function updateSlidesOffset () {
28508 var slides = swiper.slides;
28509 for (var i = 0; i < slides.length; i += 1) {
28510 slides[i].swiperSlideOffset = swiper.isHorizontal() ? slides[i].offsetLeft : slides[i].offsetTop;
28514 function updateSlidesProgress (translate) {
28515 if ( translate === void 0 ) translate = (this && this.translate) || 0;
28518 var params = swiper.params;
28520 var slides = swiper.slides;
28521 var rtl = swiper.rtlTranslate;
28523 if (slides.length === 0) { return; }
28524 if (typeof slides[0].swiperSlideOffset === 'undefined') { swiper.updateSlidesOffset(); }
28526 var offsetCenter = -translate;
28527 if (rtl) { offsetCenter = translate; }
28530 slides.removeClass(params.slideVisibleClass);
28532 swiper.visibleSlidesIndexes = [];
28533 swiper.visibleSlides = [];
28535 for (var i = 0; i < slides.length; i += 1) {
28536 var slide = slides[i];
28537 var slideProgress = (
28538 (offsetCenter + (params.centeredSlides ? swiper.minTranslate() : 0)) - slide.swiperSlideOffset
28539 ) / (slide.swiperSlideSize + params.spaceBetween);
28540 if (params.watchSlidesVisibility) {
28541 var slideBefore = -(offsetCenter - slide.swiperSlideOffset);
28542 var slideAfter = slideBefore + swiper.slidesSizesGrid[i];
28543 var isVisible = (slideBefore >= 0 && slideBefore < swiper.size)
28544 || (slideAfter > 0 && slideAfter <= swiper.size)
28545 || (slideBefore <= 0 && slideAfter >= swiper.size);
28547 swiper.visibleSlides.push(slide);
28548 swiper.visibleSlidesIndexes.push(i);
28549 slides.eq(i).addClass(params.slideVisibleClass);
28552 slide.progress = rtl ? -slideProgress : slideProgress;
28554 swiper.visibleSlides = $(swiper.visibleSlides);
28557 function updateProgress (translate) {
28558 if ( translate === void 0 ) translate = (this && this.translate) || 0;
28561 var params = swiper.params;
28563 var translatesDiff = swiper.maxTranslate() - swiper.minTranslate();
28564 var progress = swiper.progress;
28565 var isBeginning = swiper.isBeginning;
28566 var isEnd = swiper.isEnd;
28567 var wasBeginning = isBeginning;
28568 var wasEnd = isEnd;
28569 if (translatesDiff === 0) {
28571 isBeginning = true;
28574 progress = (translate - swiper.minTranslate()) / (translatesDiff);
28575 isBeginning = progress <= 0;
28576 isEnd = progress >= 1;
28578 Utils.extend(swiper, {
28579 progress: progress,
28580 isBeginning: isBeginning,
28584 if (params.watchSlidesProgress || params.watchSlidesVisibility) { swiper.updateSlidesProgress(translate); }
28586 if (isBeginning && !wasBeginning) {
28587 swiper.emit('reachBeginning toEdge
');
28589 if (isEnd && !wasEnd) {
28590 swiper.emit('reachEnd toEdge
');
28592 if ((wasBeginning && !isBeginning) || (wasEnd && !isEnd)) {
28593 swiper.emit('fromEdge
');
28596 swiper.emit('progress
', progress);
28599 function updateSlidesClasses () {
28602 var slides = swiper.slides;
28603 var params = swiper.params;
28604 var $wrapperEl = swiper.$wrapperEl;
28605 var activeIndex = swiper.activeIndex;
28606 var realIndex = swiper.realIndex;
28607 var isVirtual = swiper.virtual && params.virtual.enabled;
28609 slides.removeClass(((params.slideActiveClass) + " " + (params.slideNextClass) + " " + (params.slidePrevClass) + " " + (params.slideDuplicateActiveClass) + " " + (params.slideDuplicateNextClass) + " " + (params.slideDuplicatePrevClass)));
28613 activeSlide = swiper.$wrapperEl.find(("." + (params.slideClass) + "[data-swiper-slide-index=\"" + activeIndex + "\"]"));
28615 activeSlide = slides.eq(activeIndex);
28619 activeSlide.addClass(params.slideActiveClass);
28622 // Duplicate to all looped slides
28623 if (activeSlide.hasClass(params.slideDuplicateClass)) {
28625 .children(("." + (params.slideClass) + ":not(." + (params.slideDuplicateClass) + ")[data-swiper-slide-index=\"" + realIndex + "\"]"))
28626 .addClass(params.slideDuplicateActiveClass);
28629 .children(("." + (params.slideClass) + "." + (params.slideDuplicateClass) + "[data-swiper-slide-index=\"" + realIndex + "\"]"))
28630 .addClass(params.slideDuplicateActiveClass);
28634 var nextSlide = activeSlide.nextAll(("." + (params.slideClass))).eq(0).addClass(params.slideNextClass);
28635 if (params.loop && nextSlide.length === 0) {
28636 nextSlide = slides.eq(0);
28637 nextSlide.addClass(params.slideNextClass);
28640 var prevSlide = activeSlide.prevAll(("." + (params.slideClass))).eq(0).addClass(params.slidePrevClass);
28641 if (params.loop && prevSlide.length === 0) {
28642 prevSlide = slides.eq(-1);
28643 prevSlide.addClass(params.slidePrevClass);
28646 // Duplicate to all looped slides
28647 if (nextSlide.hasClass(params.slideDuplicateClass)) {
28649 .children(("." + (params.slideClass) + ":not(." + (params.slideDuplicateClass) + ")[data-swiper-slide-index=\"" + (nextSlide.attr('data
-swiper
-slide
-index
')) + "\"]"))
28650 .addClass(params.slideDuplicateNextClass);
28653 .children(("." + (params.slideClass) + "." + (params.slideDuplicateClass) + "[data-swiper-slide-index=\"" + (nextSlide.attr('data
-swiper
-slide
-index
')) + "\"]"))
28654 .addClass(params.slideDuplicateNextClass);
28656 if (prevSlide.hasClass(params.slideDuplicateClass)) {
28658 .children(("." + (params.slideClass) + ":not(." + (params.slideDuplicateClass) + ")[data-swiper-slide-index=\"" + (prevSlide.attr('data
-swiper
-slide
-index
')) + "\"]"))
28659 .addClass(params.slideDuplicatePrevClass);
28662 .children(("." + (params.slideClass) + "." + (params.slideDuplicateClass) + "[data-swiper-slide-index=\"" + (prevSlide.attr('data
-swiper
-slide
-index
')) + "\"]"))
28663 .addClass(params.slideDuplicatePrevClass);
28668 function updateActiveIndex (newActiveIndex) {
28670 var translate = swiper.rtlTranslate ? swiper.translate : -swiper.translate;
28671 var slidesGrid = swiper.slidesGrid;
28672 var snapGrid = swiper.snapGrid;
28673 var params = swiper.params;
28674 var previousIndex = swiper.activeIndex;
28675 var previousRealIndex = swiper.realIndex;
28676 var previousSnapIndex = swiper.snapIndex;
28677 var activeIndex = newActiveIndex;
28679 if (typeof activeIndex === 'undefined') {
28680 for (var i = 0; i < slidesGrid.length; i += 1) {
28681 if (typeof slidesGrid[i + 1] !== 'undefined') {
28682 if (translate >= slidesGrid[i] && translate < slidesGrid[i + 1] - ((slidesGrid[i + 1] - slidesGrid[i]) / 2)) {
28684 } else if (translate >= slidesGrid[i] && translate < slidesGrid[i + 1]) {
28685 activeIndex = i + 1;
28687 } else if (translate >= slidesGrid[i]) {
28691 // Normalize slideIndex
28692 if (params.normalizeSlideIndex) {
28693 if (activeIndex < 0 || typeof activeIndex === 'undefined') { activeIndex = 0; }
28696 if (snapGrid.indexOf(translate) >= 0) {
28697 snapIndex = snapGrid.indexOf(translate);
28699 snapIndex = Math.floor(activeIndex / params.slidesPerGroup);
28701 if (snapIndex >= snapGrid.length) { snapIndex = snapGrid.length - 1; }
28702 if (activeIndex === previousIndex) {
28703 if (snapIndex !== previousSnapIndex) {
28704 swiper.snapIndex = snapIndex;
28705 swiper.emit('snapIndexChange
');
28711 var realIndex = parseInt(swiper.slides.eq(activeIndex).attr('data
-swiper
-slide
-index
') || activeIndex, 10);
28713 Utils.extend(swiper, {
28714 snapIndex: snapIndex,
28715 realIndex: realIndex,
28716 previousIndex: previousIndex,
28717 activeIndex: activeIndex,
28719 swiper.emit('activeIndexChange
');
28720 swiper.emit('snapIndexChange
');
28721 if (previousRealIndex !== realIndex) {
28722 swiper.emit('realIndexChange
');
28724 swiper.emit('slideChange
');
28727 function updateClickedSlide (e) {
28729 var params = swiper.params;
28730 var slide = $(e.target).closest(("." + (params.slideClass)))[0];
28731 var slideFound = false;
28733 for (var i = 0; i < swiper.slides.length; i += 1) {
28734 if (swiper.slides[i] === slide) { slideFound = true; }
28738 if (slide && slideFound) {
28739 swiper.clickedSlide = slide;
28740 if (swiper.virtual && swiper.params.virtual.enabled) {
28741 swiper.clickedIndex = parseInt($(slide).attr('data
-swiper
-slide
-index
'), 10);
28743 swiper.clickedIndex = $(slide).index();
28746 swiper.clickedSlide = undefined;
28747 swiper.clickedIndex = undefined;
28750 if (params.slideToClickedSlide && swiper.clickedIndex !== undefined && swiper.clickedIndex !== swiper.activeIndex) {
28751 swiper.slideToClickedSlide();
28756 updateSize: updateSize,
28757 updateSlides: updateSlides,
28758 updateAutoHeight: updateAutoHeight,
28759 updateSlidesOffset: updateSlidesOffset,
28760 updateSlidesProgress: updateSlidesProgress,
28761 updateProgress: updateProgress,
28762 updateSlidesClasses: updateSlidesClasses,
28763 updateActiveIndex: updateActiveIndex,
28764 updateClickedSlide: updateClickedSlide,
28767 function getTranslate (axis) {
28768 if ( axis === void 0 ) axis = this.isHorizontal() ? 'x
' : 'y
';
28772 var params = swiper.params;
28773 var rtl = swiper.rtlTranslate;
28774 var translate = swiper.translate;
28775 var $wrapperEl = swiper.$wrapperEl;
28777 if (params.virtualTranslate) {
28778 return rtl ? -translate : translate;
28781 var currentTranslate = Utils.getTranslate($wrapperEl[0], axis);
28782 if (rtl) { currentTranslate = -currentTranslate; }
28784 return currentTranslate || 0;
28787 function setTranslate (translate, byController) {
28789 var rtl = swiper.rtlTranslate;
28790 var params = swiper.params;
28791 var $wrapperEl = swiper.$wrapperEl;
28792 var progress = swiper.progress;
28797 if (swiper.isHorizontal()) {
28798 x = rtl ? -translate : translate;
28803 if (params.roundLengths) {
28808 if (!params.virtualTranslate) {
28809 if (Support.transforms3d) { $wrapperEl.transform(("translate3d(" + x + "px, " + y + "px, " + z + "px)")); }
28810 else { $wrapperEl.transform(("translate(" + x + "px, " + y + "px)")); }
28812 swiper.previousTranslate = swiper.translate;
28813 swiper.translate = swiper.isHorizontal() ? x : y;
28815 // Check if we need to update progress
28817 var translatesDiff = swiper.maxTranslate() - swiper.minTranslate();
28818 if (translatesDiff === 0) {
28821 newProgress = (translate - swiper.minTranslate()) / (translatesDiff);
28823 if (newProgress !== progress) {
28824 swiper.updateProgress(translate);
28827 swiper.emit('setTranslate
', swiper.translate, byController);
28830 function minTranslate () {
28831 return (-this.snapGrid[0]);
28834 function maxTranslate () {
28835 return (-this.snapGrid[this.snapGrid.length - 1]);
28839 getTranslate: getTranslate,
28840 setTranslate: setTranslate,
28841 minTranslate: minTranslate,
28842 maxTranslate: maxTranslate,
28845 function setTransition (duration, byController) {
28848 swiper.$wrapperEl.transition(duration);
28850 swiper.emit('setTransition
', duration, byController);
28853 function transitionStart (runCallbacks, direction) {
28854 if ( runCallbacks === void 0 ) runCallbacks = true;
28857 var activeIndex = swiper.activeIndex;
28858 var params = swiper.params;
28859 var previousIndex = swiper.previousIndex;
28860 if (params.autoHeight) {
28861 swiper.updateAutoHeight();
28864 var dir = direction;
28866 if (activeIndex > previousIndex) { dir = 'next
'; }
28867 else if (activeIndex < previousIndex) { dir = 'prev
'; }
28868 else { dir = 'reset
'; }
28871 swiper.emit('transitionStart
');
28873 if (runCallbacks && activeIndex !== previousIndex) {
28874 if (dir === 'reset
') {
28875 swiper.emit('slideResetTransitionStart
');
28878 swiper.emit('slideChangeTransitionStart
');
28879 if (dir === 'next
') {
28880 swiper.emit('slideNextTransitionStart
');
28882 swiper.emit('slidePrevTransitionStart
');
28887 function transitionEnd$1 (runCallbacks, direction) {
28888 if ( runCallbacks === void 0 ) runCallbacks = true;
28891 var activeIndex = swiper.activeIndex;
28892 var previousIndex = swiper.previousIndex;
28893 swiper.animating = false;
28894 swiper.setTransition(0);
28896 var dir = direction;
28898 if (activeIndex > previousIndex) { dir = 'next
'; }
28899 else if (activeIndex < previousIndex) { dir = 'prev
'; }
28900 else { dir = 'reset
'; }
28903 swiper.emit('transitionEnd
');
28905 if (runCallbacks && activeIndex !== previousIndex) {
28906 if (dir === 'reset
') {
28907 swiper.emit('slideResetTransitionEnd
');
28910 swiper.emit('slideChangeTransitionEnd
');
28911 if (dir === 'next
') {
28912 swiper.emit('slideNextTransitionEnd
');
28914 swiper.emit('slidePrevTransitionEnd
');
28919 var transition$1 = {
28920 setTransition: setTransition,
28921 transitionStart: transitionStart,
28922 transitionEnd: transitionEnd$1,
28925 function slideTo (index, speed, runCallbacks, internal) {
28926 if ( index === void 0 ) index = 0;
28927 if ( speed === void 0 ) speed = this.params.speed;
28928 if ( runCallbacks === void 0 ) runCallbacks = true;
28931 var slideIndex = index;
28932 if (slideIndex < 0) { slideIndex = 0; }
28934 var params = swiper.params;
28935 var snapGrid = swiper.snapGrid;
28936 var slidesGrid = swiper.slidesGrid;
28937 var previousIndex = swiper.previousIndex;
28938 var activeIndex = swiper.activeIndex;
28939 var rtl = swiper.rtlTranslate;
28940 if (swiper.animating && params.preventInteractionOnTransition) {
28944 var snapIndex = Math.floor(slideIndex / params.slidesPerGroup);
28945 if (snapIndex >= snapGrid.length) { snapIndex = snapGrid.length - 1; }
28947 if ((activeIndex || params.initialSlide || 0) === (previousIndex || 0) && runCallbacks) {
28948 swiper.emit('beforeSlideChangeStart
');
28951 var translate = -snapGrid[snapIndex];
28954 swiper.updateProgress(translate);
28956 // Normalize slideIndex
28957 if (params.normalizeSlideIndex) {
28958 for (var i = 0; i < slidesGrid.length; i += 1) {
28959 if (-Math.floor(translate * 100) >= Math.floor(slidesGrid[i] * 100)) {
28964 // Directions locks
28965 if (swiper.initialized && slideIndex !== activeIndex) {
28966 if (!swiper.allowSlideNext && translate < swiper.translate && translate < swiper.minTranslate()) {
28969 if (!swiper.allowSlidePrev && translate > swiper.translate && translate > swiper.maxTranslate()) {
28970 if ((activeIndex || 0) !== slideIndex) { return false; }
28975 if (slideIndex > activeIndex) { direction = 'next
'; }
28976 else if (slideIndex < activeIndex) { direction = 'prev
'; }
28977 else { direction = 'reset
'; }
28981 if ((rtl && -translate === swiper.translate) || (!rtl && translate === swiper.translate)) {
28982 swiper.updateActiveIndex(slideIndex);
28984 if (params.autoHeight) {
28985 swiper.updateAutoHeight();
28987 swiper.updateSlidesClasses();
28988 if (params.effect !== 'slide
') {
28989 swiper.setTranslate(translate);
28991 if (direction !== 'reset
') {
28992 swiper.transitionStart(runCallbacks, direction);
28993 swiper.transitionEnd(runCallbacks, direction);
28998 if (speed === 0 || !Support.transition) {
28999 swiper.setTransition(0);
29000 swiper.setTranslate(translate);
29001 swiper.updateActiveIndex(slideIndex);
29002 swiper.updateSlidesClasses();
29003 swiper.emit('beforeTransitionStart
', speed, internal);
29004 swiper.transitionStart(runCallbacks, direction);
29005 swiper.transitionEnd(runCallbacks, direction);
29007 swiper.setTransition(speed);
29008 swiper.setTranslate(translate);
29009 swiper.updateActiveIndex(slideIndex);
29010 swiper.updateSlidesClasses();
29011 swiper.emit('beforeTransitionStart
', speed, internal);
29012 swiper.transitionStart(runCallbacks, direction);
29013 if (!swiper.animating) {
29014 swiper.animating = true;
29015 if (!swiper.onSlideToWrapperTransitionEnd) {
29016 swiper.onSlideToWrapperTransitionEnd = function transitionEnd(e) {
29017 if (!swiper || swiper.destroyed) { return; }
29018 if (e.target !== this) { return; }
29019 swiper.$wrapperEl[0].removeEventListener('transitionend
', swiper.onSlideToWrapperTransitionEnd);
29020 swiper.$wrapperEl[0].removeEventListener('webkitTransitionEnd
', swiper.onSlideToWrapperTransitionEnd);
29021 swiper.onSlideToWrapperTransitionEnd = null;
29022 delete swiper.onSlideToWrapperTransitionEnd;
29023 swiper.transitionEnd(runCallbacks, direction);
29026 swiper.$wrapperEl[0].addEventListener('transitionend
', swiper.onSlideToWrapperTransitionEnd);
29027 swiper.$wrapperEl[0].addEventListener('webkitTransitionEnd
', swiper.onSlideToWrapperTransitionEnd);
29034 function slideToLoop (index, speed, runCallbacks, internal) {
29035 if ( index === void 0 ) index = 0;
29036 if ( speed === void 0 ) speed = this.params.speed;
29037 if ( runCallbacks === void 0 ) runCallbacks = true;
29040 var newIndex = index;
29041 if (swiper.params.loop) {
29042 newIndex += swiper.loopedSlides;
29045 return swiper.slideTo(newIndex, speed, runCallbacks, internal);
29048 /* eslint no-unused-vars: "off" */
29049 function slideNext (speed, runCallbacks, internal) {
29050 if ( speed === void 0 ) speed = this.params.speed;
29051 if ( runCallbacks === void 0 ) runCallbacks = true;
29054 var params = swiper.params;
29055 var animating = swiper.animating;
29057 if (animating) { return false; }
29059 // eslint-disable-next-line
29060 swiper._clientLeft = swiper.$wrapperEl[0].clientLeft;
29061 return swiper.slideTo(swiper.activeIndex + params.slidesPerGroup, speed, runCallbacks, internal);
29063 return swiper.slideTo(swiper.activeIndex + params.slidesPerGroup, speed, runCallbacks, internal);
29066 /* eslint no-unused-vars: "off" */
29067 function slidePrev (speed, runCallbacks, internal) {
29068 if ( speed === void 0 ) speed = this.params.speed;
29069 if ( runCallbacks === void 0 ) runCallbacks = true;
29072 var params = swiper.params;
29073 var animating = swiper.animating;
29074 var snapGrid = swiper.snapGrid;
29075 var slidesGrid = swiper.slidesGrid;
29076 var rtlTranslate = swiper.rtlTranslate;
29079 if (animating) { return false; }
29081 // eslint-disable-next-line
29082 swiper._clientLeft = swiper.$wrapperEl[0].clientLeft;
29084 var translate = rtlTranslate ? swiper.translate : -swiper.translate;
29085 function normalize(val) {
29086 if (val < 0) { return -Math.floor(Math.abs(val)); }
29087 return Math.floor(val);
29089 var normalizedTranslate = normalize(translate);
29090 var normalizedSnapGrid = snapGrid.map(function (val) { return normalize(val); });
29091 var normalizedSlidesGrid = slidesGrid.map(function (val) { return normalize(val); });
29093 var currentSnap = snapGrid[normalizedSnapGrid.indexOf(normalizedTranslate)];
29094 var prevSnap = snapGrid[normalizedSnapGrid.indexOf(normalizedTranslate) - 1];
29096 if (typeof prevSnap !== 'undefined') {
29097 prevIndex = slidesGrid.indexOf(prevSnap);
29098 if (prevIndex < 0) { prevIndex = swiper.activeIndex - 1; }
29100 return swiper.slideTo(prevIndex, speed, runCallbacks, internal);
29103 /* eslint no-unused-vars: "off" */
29104 function slideReset (speed, runCallbacks, internal) {
29105 if ( speed === void 0 ) speed = this.params.speed;
29106 if ( runCallbacks === void 0 ) runCallbacks = true;
29109 return swiper.slideTo(swiper.activeIndex, speed, runCallbacks, internal);
29112 /* eslint no-unused-vars: "off" */
29113 function slideToClosest (speed, runCallbacks, internal) {
29114 if ( speed === void 0 ) speed = this.params.speed;
29115 if ( runCallbacks === void 0 ) runCallbacks = true;
29118 var index = swiper.activeIndex;
29119 var snapIndex = Math.floor(index / swiper.params.slidesPerGroup);
29121 if (snapIndex < swiper.snapGrid.length - 1) {
29122 var translate = swiper.rtlTranslate ? swiper.translate : -swiper.translate;
29124 var currentSnap = swiper.snapGrid[snapIndex];
29125 var nextSnap = swiper.snapGrid[snapIndex + 1];
29127 if ((translate - currentSnap) > (nextSnap - currentSnap) / 2) {
29128 index = swiper.params.slidesPerGroup;
29132 return swiper.slideTo(index, speed, runCallbacks, internal);
29135 function slideToClickedSlide () {
29137 var params = swiper.params;
29138 var $wrapperEl = swiper.$wrapperEl;
29140 var slidesPerView = params.slidesPerView === 'auto
' ? swiper.slidesPerViewDynamic() : params.slidesPerView;
29141 var slideToIndex = swiper.clickedIndex;
29144 if (swiper.animating) { return; }
29145 realIndex = parseInt($(swiper.clickedSlide).attr('data
-swiper
-slide
-index
'), 10);
29146 if (params.centeredSlides) {
29148 (slideToIndex < swiper.loopedSlides - (slidesPerView / 2))
29149 || (slideToIndex > (swiper.slides.length - swiper.loopedSlides) + (slidesPerView / 2))
29152 slideToIndex = $wrapperEl
29153 .children(("." + (params.slideClass) + "[data-swiper-slide-index=\"" + realIndex + "\"]:not(." + (params.slideDuplicateClass) + ")"))
29157 Utils.nextTick(function () {
29158 swiper.slideTo(slideToIndex);
29161 swiper.slideTo(slideToIndex);
29163 } else if (slideToIndex > swiper.slides.length - slidesPerView) {
29165 slideToIndex = $wrapperEl
29166 .children(("." + (params.slideClass) + "[data-swiper-slide-index=\"" + realIndex + "\"]:not(." + (params.slideDuplicateClass) + ")"))
29170 Utils.nextTick(function () {
29171 swiper.slideTo(slideToIndex);
29174 swiper.slideTo(slideToIndex);
29177 swiper.slideTo(slideToIndex);
29183 slideToLoop: slideToLoop,
29184 slideNext: slideNext,
29185 slidePrev: slidePrev,
29186 slideReset: slideReset,
29187 slideToClosest: slideToClosest,
29188 slideToClickedSlide: slideToClickedSlide,
29191 function loopCreate () {
29193 var params = swiper.params;
29194 var $wrapperEl = swiper.$wrapperEl;
29195 // Remove duplicated slides
29196 $wrapperEl.children(("." + (params.slideClass) + "." + (params.slideDuplicateClass))).remove();
29198 var slides = $wrapperEl.children(("." + (params.slideClass)));
29200 if (params.loopFillGroupWithBlank) {
29201 var blankSlidesNum = params.slidesPerGroup - (slides.length % params.slidesPerGroup);
29202 if (blankSlidesNum !== params.slidesPerGroup) {
29203 for (var i = 0; i < blankSlidesNum; i += 1) {
29204 var blankNode = $(doc.createElement('div
')).addClass(((params.slideClass) + " " + (params.slideBlankClass)));
29205 $wrapperEl.append(blankNode);
29207 slides = $wrapperEl.children(("." + (params.slideClass)));
29211 if (params.slidesPerView === 'auto
' && !params.loopedSlides) { params.loopedSlides = slides.length; }
29213 swiper.loopedSlides = parseInt(params.loopedSlides || params.slidesPerView, 10);
29214 swiper.loopedSlides += params.loopAdditionalSlides;
29215 if (swiper.loopedSlides > slides.length) {
29216 swiper.loopedSlides = slides.length;
29219 var prependSlides = [];
29220 var appendSlides = [];
29221 slides.each(function (index, el) {
29223 if (index < swiper.loopedSlides) { appendSlides.push(el); }
29224 if (index < slides.length && index >= slides.length - swiper.loopedSlides) { prependSlides.push(el); }
29225 slide.attr('data
-swiper
-slide
-index
', index);
29227 for (var i$1 = 0; i$1 < appendSlides.length; i$1 += 1) {
29228 $wrapperEl.append($(appendSlides[i$1].cloneNode(true)).addClass(params.slideDuplicateClass));
29230 for (var i$2 = prependSlides.length - 1; i$2 >= 0; i$2 -= 1) {
29231 $wrapperEl.prepend($(prependSlides[i$2].cloneNode(true)).addClass(params.slideDuplicateClass));
29235 function loopFix () {
29237 var params = swiper.params;
29238 var activeIndex = swiper.activeIndex;
29239 var slides = swiper.slides;
29240 var loopedSlides = swiper.loopedSlides;
29241 var allowSlidePrev = swiper.allowSlidePrev;
29242 var allowSlideNext = swiper.allowSlideNext;
29243 var snapGrid = swiper.snapGrid;
29244 var rtl = swiper.rtlTranslate;
29246 swiper.allowSlidePrev = true;
29247 swiper.allowSlideNext = true;
29249 var snapTranslate = -snapGrid[activeIndex];
29250 var diff = snapTranslate - swiper.getTranslate();
29253 // Fix For Negative Oversliding
29254 if (activeIndex < loopedSlides) {
29255 newIndex = (slides.length - (loopedSlides * 3)) + activeIndex;
29256 newIndex += loopedSlides;
29257 var slideChanged = swiper.slideTo(newIndex, 0, false, true);
29258 if (slideChanged && diff !== 0) {
29259 swiper.setTranslate((rtl ? -swiper.translate : swiper.translate) - diff);
29261 } else if ((params.slidesPerView === 'auto
' && activeIndex >= loopedSlides * 2) || (activeIndex >= slides.length - loopedSlides)) {
29262 // Fix For Positive Oversliding
29263 newIndex = -slides.length + activeIndex + loopedSlides;
29264 newIndex += loopedSlides;
29265 var slideChanged$1 = swiper.slideTo(newIndex, 0, false, true);
29266 if (slideChanged$1 && diff !== 0) {
29267 swiper.setTranslate((rtl ? -swiper.translate : swiper.translate) - diff);
29270 swiper.allowSlidePrev = allowSlidePrev;
29271 swiper.allowSlideNext = allowSlideNext;
29274 function loopDestroy () {
29276 var $wrapperEl = swiper.$wrapperEl;
29277 var params = swiper.params;
29278 var slides = swiper.slides;
29279 $wrapperEl.children(("." + (params.slideClass) + "." + (params.slideDuplicateClass) + ",." + (params.slideClass) + "." + (params.slideBlankClass))).remove();
29280 slides.removeAttr('data
-swiper
-slide
-index
');
29284 loopCreate: loopCreate,
29286 loopDestroy: loopDestroy,
29289 function setGrabCursor (moving) {
29291 if (Support.touch || !swiper.params.simulateTouch || (swiper.params.watchOverflow && swiper.isLocked)) { return; }
29292 var el = swiper.el;
29293 el.style.cursor = 'move';
29294 el.style.cursor = moving ? '-webkit
-grabbing
' : '-webkit
-grab
';
29295 el.style.cursor = moving ? '-moz
-grabbin
' : '-moz
-grab
';
29296 el.style.cursor = moving ? 'grabbing
' : 'grab
';
29299 function unsetGrabCursor () {
29301 if (Support.touch || (swiper.params.watchOverflow && swiper.isLocked)) { return; }
29302 swiper.el.style.cursor = '';
29306 setGrabCursor: setGrabCursor,
29307 unsetGrabCursor: unsetGrabCursor,
29310 function appendSlide (slides) {
29312 var $wrapperEl = swiper.$wrapperEl;
29313 var params = swiper.params;
29315 swiper.loopDestroy();
29317 if (typeof slides === 'object
' && 'length
' in slides) {
29318 for (var i = 0; i < slides.length; i += 1) {
29319 if (slides[i]) { $wrapperEl.append(slides[i]); }
29322 $wrapperEl.append(slides);
29325 swiper.loopCreate();
29327 if (!(params.observer && Support.observer)) {
29332 function prependSlide (slides) {
29334 var params = swiper.params;
29335 var $wrapperEl = swiper.$wrapperEl;
29336 var activeIndex = swiper.activeIndex;
29339 swiper.loopDestroy();
29341 var newActiveIndex = activeIndex + 1;
29342 if (typeof slides === 'object
' && 'length
' in slides) {
29343 for (var i = 0; i < slides.length; i += 1) {
29344 if (slides[i]) { $wrapperEl.prepend(slides[i]); }
29346 newActiveIndex = activeIndex + slides.length;
29348 $wrapperEl.prepend(slides);
29351 swiper.loopCreate();
29353 if (!(params.observer && Support.observer)) {
29356 swiper.slideTo(newActiveIndex, 0, false);
29359 function addSlide (index, slides) {
29361 var $wrapperEl = swiper.$wrapperEl;
29362 var params = swiper.params;
29363 var activeIndex = swiper.activeIndex;
29364 var activeIndexBuffer = activeIndex;
29366 activeIndexBuffer -= swiper.loopedSlides;
29367 swiper.loopDestroy();
29368 swiper.slides = $wrapperEl.children(("." + (params.slideClass)));
29370 var baseLength = swiper.slides.length;
29372 swiper.prependSlide(slides);
29375 if (index >= baseLength) {
29376 swiper.appendSlide(slides);
29379 var newActiveIndex = activeIndexBuffer > index ? activeIndexBuffer + 1 : activeIndexBuffer;
29381 var slidesBuffer = [];
29382 for (var i = baseLength - 1; i >= index; i -= 1) {
29383 var currentSlide = swiper.slides.eq(i);
29384 currentSlide.remove();
29385 slidesBuffer.unshift(currentSlide);
29388 if (typeof slides === 'object
' && 'length
' in slides) {
29389 for (var i$1 = 0; i$1 < slides.length; i$1 += 1) {
29390 if (slides[i$1]) { $wrapperEl.append(slides[i$1]); }
29392 newActiveIndex = activeIndexBuffer > index ? activeIndexBuffer + slides.length : activeIndexBuffer;
29394 $wrapperEl.append(slides);
29397 for (var i$2 = 0; i$2 < slidesBuffer.length; i$2 += 1) {
29398 $wrapperEl.append(slidesBuffer[i$2]);
29402 swiper.loopCreate();
29404 if (!(params.observer && Support.observer)) {
29408 swiper.slideTo(newActiveIndex + swiper.loopedSlides, 0, false);
29410 swiper.slideTo(newActiveIndex, 0, false);
29414 function removeSlide (slidesIndexes) {
29416 var params = swiper.params;
29417 var $wrapperEl = swiper.$wrapperEl;
29418 var activeIndex = swiper.activeIndex;
29420 var activeIndexBuffer = activeIndex;
29422 activeIndexBuffer -= swiper.loopedSlides;
29423 swiper.loopDestroy();
29424 swiper.slides = $wrapperEl.children(("." + (params.slideClass)));
29426 var newActiveIndex = activeIndexBuffer;
29429 if (typeof slidesIndexes === 'object
' && 'length
' in slidesIndexes) {
29430 for (var i = 0; i < slidesIndexes.length; i += 1) {
29431 indexToRemove = slidesIndexes[i];
29432 if (swiper.slides[indexToRemove]) { swiper.slides.eq(indexToRemove).remove(); }
29433 if (indexToRemove < newActiveIndex) { newActiveIndex -= 1; }
29435 newActiveIndex = Math.max(newActiveIndex, 0);
29437 indexToRemove = slidesIndexes;
29438 if (swiper.slides[indexToRemove]) { swiper.slides.eq(indexToRemove).remove(); }
29439 if (indexToRemove < newActiveIndex) { newActiveIndex -= 1; }
29440 newActiveIndex = Math.max(newActiveIndex, 0);
29444 swiper.loopCreate();
29447 if (!(params.observer && Support.observer)) {
29451 swiper.slideTo(newActiveIndex + swiper.loopedSlides, 0, false);
29453 swiper.slideTo(newActiveIndex, 0, false);
29457 function removeAllSlides () {
29460 var slidesIndexes = [];
29461 for (var i = 0; i < swiper.slides.length; i += 1) {
29462 slidesIndexes.push(i);
29464 swiper.removeSlide(slidesIndexes);
29467 var manipulation = {
29468 appendSlide: appendSlide,
29469 prependSlide: prependSlide,
29470 addSlide: addSlide,
29471 removeSlide: removeSlide,
29472 removeAllSlides: removeAllSlides,
29475 function onTouchStart (event) {
29477 var data = swiper.touchEventsData;
29478 var params = swiper.params;
29479 var touches = swiper.touches;
29480 if (swiper.animating && params.preventInteractionOnTransition) {
29484 if (e.originalEvent) { e = e.originalEvent; }
29485 data.isTouchEvent = e.type === 'touchstart
';
29486 if (!data.isTouchEvent && 'which
' in e && e.which === 3) { return; }
29487 if (!data.isTouchEvent && 'button
' in e && e.button > 0) { return; }
29488 if (data.isTouched && data.isMoved) { return; }
29489 if (params.noSwiping && $(e.target).closest(params.noSwipingSelector ? params.noSwipingSelector : ("." + (params.noSwipingClass)))[0]) {
29490 swiper.allowClick = true;
29493 if (params.swipeHandler) {
29494 if (!$(e).closest(params.swipeHandler)[0]) { return; }
29497 touches.currentX = e.type === 'touchstart
' ? e.targetTouches[0].pageX : e.pageX;
29498 touches.currentY = e.type === 'touchstart
' ? e.targetTouches[0].pageY : e.pageY;
29499 var startX = touches.currentX;
29500 var startY = touches.currentY;
29502 // Do NOT start if iOS edge swipe is detected. Otherwise iOS app (UIWebView) cannot swipe-to-go-back anymore
29504 var edgeSwipeDetection = params.edgeSwipeDetection || params.iOSEdgeSwipeDetection;
29505 var edgeSwipeThreshold = params.edgeSwipeThreshold || params.iOSEdgeSwipeThreshold;
29508 && ((startX <= edgeSwipeThreshold)
29509 || (startX >= win.screen.width - edgeSwipeThreshold))
29514 Utils.extend(data, {
29517 allowTouchCallbacks: true,
29518 isScrolling: undefined,
29519 startMoving: undefined,
29522 touches.startX = startX;
29523 touches.startY = startY;
29524 data.touchStartTime = Utils.now();
29525 swiper.allowClick = true;
29526 swiper.updateSize();
29527 swiper.swipeDirection = undefined;
29528 if (params.threshold > 0) { data.allowThresholdMove = false; }
29529 if (e.type !== 'touchstart
') {
29530 var preventDefault = true;
29531 if ($(e.target).is(data.formElements)) { preventDefault = false; }
29534 && $(doc.activeElement).is(data.formElements)
29535 && doc.activeElement !== e.target
29537 doc.activeElement.blur();
29540 var shouldPreventDefault = preventDefault && swiper.allowTouchMove && params.touchStartPreventDefault;
29541 if (params.touchStartForcePreventDefault || shouldPreventDefault) {
29542 e.preventDefault();
29545 swiper.emit('touchStart
', e);
29548 function onTouchMove (event) {
29550 var data = swiper.touchEventsData;
29551 var params = swiper.params;
29552 var touches = swiper.touches;
29553 var rtl = swiper.rtlTranslate;
29555 if (e.originalEvent) { e = e.originalEvent; }
29556 if (!data.isTouched) {
29557 if (data.startMoving && data.isScrolling) {
29558 swiper.emit('touchMoveOpposite
', e);
29562 if (data.isTouchEvent && e.type === 'mousemove
') { return; }
29563 var pageX = e.type === 'touchmove
' ? e.targetTouches[0].pageX : e.pageX;
29564 var pageY = e.type === 'touchmove
' ? e.targetTouches[0].pageY : e.pageY;
29565 if (e.preventedByNestedSwiper) {
29566 touches.startX = pageX;
29567 touches.startY = pageY;
29570 if (!swiper.allowTouchMove) {
29572 swiper.allowClick = false;
29573 if (data.isTouched) {
29574 Utils.extend(touches, {
29580 data.touchStartTime = Utils.now();
29584 if (data.isTouchEvent && params.touchReleaseOnEdges && !params.loop) {
29585 if (swiper.isVertical()) {
29588 (pageY < touches.startY && swiper.translate <= swiper.maxTranslate())
29589 || (pageY > touches.startY && swiper.translate >= swiper.minTranslate())
29591 data.isTouched = false;
29592 data.isMoved = false;
29596 (pageX < touches.startX && swiper.translate <= swiper.maxTranslate())
29597 || (pageX > touches.startX && swiper.translate >= swiper.minTranslate())
29602 if (data.isTouchEvent && doc.activeElement) {
29603 if (e.target === doc.activeElement && $(e.target).is(data.formElements)) {
29604 data.isMoved = true;
29605 swiper.allowClick = false;
29609 if (data.allowTouchCallbacks) {
29610 swiper.emit('touchMove
', e);
29612 if (e.targetTouches && e.targetTouches.length > 1) { return; }
29614 touches.currentX = pageX;
29615 touches.currentY = pageY;
29617 var diffX = touches.currentX - touches.startX;
29618 var diffY = touches.currentY - touches.startY;
29619 if (swiper.params.threshold && Math.sqrt((Math.pow( diffX, 2 )) + (Math.pow( diffY, 2 ))) < swiper.params.threshold) { return; }
29621 if (typeof data.isScrolling === 'undefined') {
29623 if ((swiper.isHorizontal() && touches.currentY === touches.startY) || (swiper.isVertical() && touches.currentX === touches.startX)) {
29624 data.isScrolling = false;
29626 // eslint-disable-next-line
29627 if ((diffX * diffX) + (diffY * diffY) >= 25) {
29628 touchAngle = (Math.atan2(Math.abs(diffY), Math.abs(diffX)) * 180) / Math.PI;
29629 data.isScrolling = swiper.isHorizontal() ? touchAngle > params.touchAngle : (90 - touchAngle > params.touchAngle);
29633 if (data.isScrolling) {
29634 swiper.emit('touchMoveOpposite
', e);
29636 if (typeof data.startMoving === 'undefined') {
29637 if (touches.currentX !== touches.startX || touches.currentY !== touches.startY) {
29638 data.startMoving = true;
29641 if (data.isScrolling) {
29642 data.isTouched = false;
29645 if (!data.startMoving) {
29648 swiper.allowClick = false;
29649 e.preventDefault();
29650 if (params.touchMoveStopPropagation && !params.nested) {
29651 e.stopPropagation();
29654 if (!data.isMoved) {
29658 data.startTranslate = swiper.getTranslate();
29659 swiper.setTransition(0);
29660 if (swiper.animating) {
29661 swiper.$wrapperEl.trigger('webkitTransitionEnd transitionend
');
29663 data.allowMomentumBounce = false;
29665 if (params.grabCursor && (swiper.allowSlideNext === true || swiper.allowSlidePrev === true)) {
29666 swiper.setGrabCursor(true);
29668 swiper.emit('sliderFirstMove
', e);
29670 swiper.emit('sliderMove
', e);
29671 data.isMoved = true;
29673 var diff = swiper.isHorizontal() ? diffX : diffY;
29674 touches.diff = diff;
29676 diff *= params.touchRatio;
29677 if (rtl) { diff = -diff; }
29679 swiper.swipeDirection = diff > 0 ? 'prev
' : 'next
';
29680 data.currentTranslate = diff + data.startTranslate;
29682 var disableParentSwiper = true;
29683 var resistanceRatio = params.resistanceRatio;
29684 if (params.touchReleaseOnEdges) {
29685 resistanceRatio = 0;
29687 if ((diff > 0 && data.currentTranslate > swiper.minTranslate())) {
29688 disableParentSwiper = false;
29689 if (params.resistance) { data.currentTranslate = (swiper.minTranslate() - 1) + (Math.pow( (-swiper.minTranslate() + data.startTranslate + diff), resistanceRatio )); }
29690 } else if (diff < 0 && data.currentTranslate < swiper.maxTranslate()) {
29691 disableParentSwiper = false;
29692 if (params.resistance) { data.currentTranslate = (swiper.maxTranslate() + 1) - (Math.pow( (swiper.maxTranslate() - data.startTranslate - diff), resistanceRatio )); }
29695 if (disableParentSwiper) {
29696 e.preventedByNestedSwiper = true;
29699 // Directions locks
29700 if (!swiper.allowSlideNext && swiper.swipeDirection === 'next
' && data.currentTranslate < data.startTranslate) {
29701 data.currentTranslate = data.startTranslate;
29703 if (!swiper.allowSlidePrev && swiper.swipeDirection === 'prev
' && data.currentTranslate > data.startTranslate) {
29704 data.currentTranslate = data.startTranslate;
29709 if (params.threshold > 0) {
29710 if (Math.abs(diff) > params.threshold || data.allowThresholdMove) {
29711 if (!data.allowThresholdMove) {
29712 data.allowThresholdMove = true;
29713 touches.startX = touches.currentX;
29714 touches.startY = touches.currentY;
29715 data.currentTranslate = data.startTranslate;
29716 touches.diff = swiper.isHorizontal() ? touches.currentX - touches.startX : touches.currentY - touches.startY;
29720 data.currentTranslate = data.startTranslate;
29725 if (!params.followFinger) { return; }
29727 // Update active index in free mode
29728 if (params.freeMode || params.watchSlidesProgress || params.watchSlidesVisibility) {
29729 swiper.updateActiveIndex();
29730 swiper.updateSlidesClasses();
29732 if (params.freeMode) {
29734 if (data.velocities.length === 0) {
29735 data.velocities.push({
29736 position: touches[swiper.isHorizontal() ? 'startX
' : 'startY
'],
29737 time: data.touchStartTime,
29740 data.velocities.push({
29741 position: touches[swiper.isHorizontal() ? 'currentX
' : 'currentY
'],
29746 swiper.updateProgress(data.currentTranslate);
29747 // Update translate
29748 swiper.setTranslate(data.currentTranslate);
29751 function onTouchEnd (event) {
29753 var data = swiper.touchEventsData;
29755 var params = swiper.params;
29756 var touches = swiper.touches;
29757 var rtl = swiper.rtlTranslate;
29758 var $wrapperEl = swiper.$wrapperEl;
29759 var slidesGrid = swiper.slidesGrid;
29760 var snapGrid = swiper.snapGrid;
29762 if (e.originalEvent) { e = e.originalEvent; }
29763 if (data.allowTouchCallbacks) {
29764 swiper.emit('touchEnd
', e);
29766 data.allowTouchCallbacks = false;
29767 if (!data.isTouched) {
29768 if (data.isMoved && params.grabCursor) {
29769 swiper.setGrabCursor(false);
29771 data.isMoved = false;
29772 data.startMoving = false;
29775 // Return Grab Cursor
29776 if (params.grabCursor && data.isMoved && data.isTouched && (swiper.allowSlideNext === true || swiper.allowSlidePrev === true)) {
29777 swiper.setGrabCursor(false);
29781 var touchEndTime = Utils.now();
29782 var timeDiff = touchEndTime - data.touchStartTime;
29784 // Tap, doubleTap, Click
29785 if (swiper.allowClick) {
29786 swiper.updateClickedSlide(e);
29787 swiper.emit('tap
', e);
29788 if (timeDiff < 300 && (touchEndTime - data.lastClickTime) > 300) {
29789 if (data.clickTimeout) { clearTimeout(data.clickTimeout); }
29790 data.clickTimeout = Utils.nextTick(function () {
29791 if (!swiper || swiper.destroyed) { return; }
29792 swiper.emit('click
', e);
29795 if (timeDiff < 300 && (touchEndTime - data.lastClickTime) < 300) {
29796 if (data.clickTimeout) { clearTimeout(data.clickTimeout); }
29797 swiper.emit('doubleTap
', e);
29801 data.lastClickTime = Utils.now();
29802 Utils.nextTick(function () {
29803 if (!swiper.destroyed) { swiper.allowClick = true; }
29806 if (!data.isTouched || !data.isMoved || !swiper.swipeDirection || touches.diff === 0 || data.currentTranslate === data.startTranslate) {
29807 data.isTouched = false;
29808 data.isMoved = false;
29809 data.startMoving = false;
29812 data.isTouched = false;
29813 data.isMoved = false;
29814 data.startMoving = false;
29817 if (params.followFinger) {
29818 currentPos = rtl ? swiper.translate : -swiper.translate;
29820 currentPos = -data.currentTranslate;
29823 if (params.freeMode) {
29824 if (currentPos < -swiper.minTranslate()) {
29825 swiper.slideTo(swiper.activeIndex);
29828 if (currentPos > -swiper.maxTranslate()) {
29829 if (swiper.slides.length < snapGrid.length) {
29830 swiper.slideTo(snapGrid.length - 1);
29832 swiper.slideTo(swiper.slides.length - 1);
29837 if (params.freeModeMomentum) {
29838 if (data.velocities.length > 1) {
29839 var lastMoveEvent = data.velocities.pop();
29840 var velocityEvent = data.velocities.pop();
29842 var distance = lastMoveEvent.position - velocityEvent.position;
29843 var time = lastMoveEvent.time - velocityEvent.time;
29844 swiper.velocity = distance / time;
29845 swiper.velocity /= 2;
29846 if (Math.abs(swiper.velocity) < params.freeModeMinimumVelocity) {
29847 swiper.velocity = 0;
29849 // this implies that the user stopped moving a finger then released.
29850 // There would be no events with distance zero, so the last event is stale.
29851 if (time > 150 || (Utils.now() - lastMoveEvent.time) > 300) {
29852 swiper.velocity = 0;
29855 swiper.velocity = 0;
29857 swiper.velocity *= params.freeModeMomentumVelocityRatio;
29859 data.velocities.length = 0;
29860 var momentumDuration = 1000 * params.freeModeMomentumRatio;
29861 var momentumDistance = swiper.velocity * momentumDuration;
29863 var newPosition = swiper.translate + momentumDistance;
29864 if (rtl) { newPosition = -newPosition; }
29866 var doBounce = false;
29867 var afterBouncePosition;
29868 var bounceAmount = Math.abs(swiper.velocity) * 20 * params.freeModeMomentumBounceRatio;
29870 if (newPosition < swiper.maxTranslate()) {
29871 if (params.freeModeMomentumBounce) {
29872 if (newPosition + swiper.maxTranslate() < -bounceAmount) {
29873 newPosition = swiper.maxTranslate() - bounceAmount;
29875 afterBouncePosition = swiper.maxTranslate();
29877 data.allowMomentumBounce = true;
29879 newPosition = swiper.maxTranslate();
29881 if (params.loop && params.centeredSlides) { needsLoopFix = true; }
29882 } else if (newPosition > swiper.minTranslate()) {
29883 if (params.freeModeMomentumBounce) {
29884 if (newPosition - swiper.minTranslate() > bounceAmount) {
29885 newPosition = swiper.minTranslate() + bounceAmount;
29887 afterBouncePosition = swiper.minTranslate();
29889 data.allowMomentumBounce = true;
29891 newPosition = swiper.minTranslate();
29893 if (params.loop && params.centeredSlides) { needsLoopFix = true; }
29894 } else if (params.freeModeSticky) {
29896 for (var j = 0; j < snapGrid.length; j += 1) {
29897 if (snapGrid[j] > -newPosition) {
29903 if (Math.abs(snapGrid[nextSlide] - newPosition) < Math.abs(snapGrid[nextSlide - 1] - newPosition) || swiper.swipeDirection === 'next
') {
29904 newPosition = snapGrid[nextSlide];
29906 newPosition = snapGrid[nextSlide - 1];
29908 newPosition = -newPosition;
29910 if (needsLoopFix) {
29911 swiper.once('transitionEnd
', function () {
29916 if (swiper.velocity !== 0) {
29918 momentumDuration = Math.abs((-newPosition - swiper.translate) / swiper.velocity);
29920 momentumDuration = Math.abs((newPosition - swiper.translate) / swiper.velocity);
29922 } else if (params.freeModeSticky) {
29923 swiper.slideToClosest();
29927 if (params.freeModeMomentumBounce && doBounce) {
29928 swiper.updateProgress(afterBouncePosition);
29929 swiper.setTransition(momentumDuration);
29930 swiper.setTranslate(newPosition);
29931 swiper.transitionStart(true, swiper.swipeDirection);
29932 swiper.animating = true;
29933 $wrapperEl.transitionEnd(function () {
29934 if (!swiper || swiper.destroyed || !data.allowMomentumBounce) { return; }
29935 swiper.emit('momentumBounce
');
29937 swiper.setTransition(params.speed);
29938 swiper.setTranslate(afterBouncePosition);
29939 $wrapperEl.transitionEnd(function () {
29940 if (!swiper || swiper.destroyed) { return; }
29941 swiper.transitionEnd();
29944 } else if (swiper.velocity) {
29945 swiper.updateProgress(newPosition);
29946 swiper.setTransition(momentumDuration);
29947 swiper.setTranslate(newPosition);
29948 swiper.transitionStart(true, swiper.swipeDirection);
29949 if (!swiper.animating) {
29950 swiper.animating = true;
29951 $wrapperEl.transitionEnd(function () {
29952 if (!swiper || swiper.destroyed) { return; }
29953 swiper.transitionEnd();
29957 swiper.updateProgress(newPosition);
29960 swiper.updateActiveIndex();
29961 swiper.updateSlidesClasses();
29962 } else if (params.freeModeSticky) {
29963 swiper.slideToClosest();
29967 if (!params.freeModeMomentum || timeDiff >= params.longSwipesMs) {
29968 swiper.updateProgress();
29969 swiper.updateActiveIndex();
29970 swiper.updateSlidesClasses();
29975 // Find current slide
29977 var groupSize = swiper.slidesSizesGrid[0];
29978 for (var i = 0; i < slidesGrid.length; i += params.slidesPerGroup) {
29979 if (typeof slidesGrid[i + params.slidesPerGroup] !== 'undefined') {
29980 if (currentPos >= slidesGrid[i] && currentPos < slidesGrid[i + params.slidesPerGroup]) {
29982 groupSize = slidesGrid[i + params.slidesPerGroup] - slidesGrid[i];
29984 } else if (currentPos >= slidesGrid[i]) {
29986 groupSize = slidesGrid[slidesGrid.length - 1] - slidesGrid[slidesGrid.length - 2];
29990 // Find current slide size
29991 var ratio = (currentPos - slidesGrid[stopIndex]) / groupSize;
29993 if (timeDiff > params.longSwipesMs) {
29995 if (!params.longSwipes) {
29996 swiper.slideTo(swiper.activeIndex);
29999 if (swiper.swipeDirection === 'next
') {
30000 if (ratio >= params.longSwipesRatio) { swiper.slideTo(stopIndex + params.slidesPerGroup); }
30001 else { swiper.slideTo(stopIndex); }
30003 if (swiper.swipeDirection === 'prev
') {
30004 if (ratio > (1 - params.longSwipesRatio)) { swiper.slideTo(stopIndex + params.slidesPerGroup); }
30005 else { swiper.slideTo(stopIndex); }
30009 if (!params.shortSwipes) {
30010 swiper.slideTo(swiper.activeIndex);
30013 if (swiper.swipeDirection === 'next
') {
30014 swiper.slideTo(stopIndex + params.slidesPerGroup);
30016 if (swiper.swipeDirection === 'prev
') {
30017 swiper.slideTo(stopIndex);
30022 function onResize () {
30025 var params = swiper.params;
30026 var el = swiper.el;
30028 if (el && el.offsetWidth === 0) { return; }
30031 if (params.breakpoints) {
30032 swiper.setBreakpoint();
30036 var allowSlideNext = swiper.allowSlideNext;
30037 var allowSlidePrev = swiper.allowSlidePrev;
30038 var snapGrid = swiper.snapGrid;
30040 // Disable locks on resize
30041 swiper.allowSlideNext = true;
30042 swiper.allowSlidePrev = true;
30044 swiper.updateSize();
30045 swiper.updateSlides();
30047 if (params.freeMode) {
30048 var newTranslate = Math.min(Math.max(swiper.translate, swiper.maxTranslate()), swiper.minTranslate());
30049 swiper.setTranslate(newTranslate);
30050 swiper.updateActiveIndex();
30051 swiper.updateSlidesClasses();
30053 if (params.autoHeight) {
30054 swiper.updateAutoHeight();
30057 swiper.updateSlidesClasses();
30058 if ((params.slidesPerView === 'auto
' || params.slidesPerView > 1) && swiper.isEnd && !swiper.params.centeredSlides) {
30059 swiper.slideTo(swiper.slides.length - 1, 0, false, true);
30061 swiper.slideTo(swiper.activeIndex, 0, false, true);
30064 // Return locks after resize
30065 swiper.allowSlidePrev = allowSlidePrev;
30066 swiper.allowSlideNext = allowSlideNext;
30068 if (swiper.params.watchOverflow && snapGrid !== swiper.snapGrid) {
30069 swiper.checkOverflow();
30073 function onClick (e) {
30075 if (!swiper.allowClick) {
30076 if (swiper.params.preventClicks) { e.preventDefault(); }
30077 if (swiper.params.preventClicksPropagation && swiper.animating) {
30078 e.stopPropagation();
30079 e.stopImmediatePropagation();
30084 function attachEvents() {
30086 var params = swiper.params;
30087 var touchEvents = swiper.touchEvents;
30088 var el = swiper.el;
30089 var wrapperEl = swiper.wrapperEl;
30092 swiper.onTouchStart = onTouchStart.bind(swiper);
30093 swiper.onTouchMove = onTouchMove.bind(swiper);
30094 swiper.onTouchEnd = onTouchEnd.bind(swiper);
30097 swiper.onClick = onClick.bind(swiper);
30099 var target = params.touchEventsTarget === 'container
' ? el : wrapperEl;
30100 var capture = !!params.nested;
30104 if (!Support.touch && (Support.pointerEvents || Support.prefixedPointerEvents)) {
30105 target.addEventListener(touchEvents.start, swiper.onTouchStart, false);
30106 doc.addEventListener(touchEvents.move, swiper.onTouchMove, capture);
30107 doc.addEventListener(touchEvents.end, swiper.onTouchEnd, false);
30109 if (Support.touch) {
30110 var passiveListener = touchEvents.start === 'touchstart
' && Support.passiveListener && params.passiveListeners ? { passive: true, capture: false } : false;
30111 target.addEventListener(touchEvents.start, swiper.onTouchStart, passiveListener);
30112 target.addEventListener(touchEvents.move, swiper.onTouchMove, Support.passiveListener ? { passive: false, capture: capture } : capture);
30113 target.addEventListener(touchEvents.end, swiper.onTouchEnd, passiveListener);
30115 if ((params.simulateTouch && !Device.ios && !Device.android) || (params.simulateTouch && !Support.touch && Device.ios)) {
30116 target.addEventListener('mousedown
', swiper.onTouchStart, false);
30117 doc.addEventListener('mousemove
', swiper.onTouchMove, capture);
30118 doc.addEventListener('mouseup
', swiper.onTouchEnd, false);
30121 // Prevent Links Clicks
30122 if (params.preventClicks || params.preventClicksPropagation) {
30123 target.addEventListener('click
', swiper.onClick, true);
30128 swiper.on((Device.ios || Device.android ? 'resize orientationchange observerUpdate
' : 'resize observerUpdate
'), onResize, true);
30131 function detachEvents() {
30134 var params = swiper.params;
30135 var touchEvents = swiper.touchEvents;
30136 var el = swiper.el;
30137 var wrapperEl = swiper.wrapperEl;
30139 var target = params.touchEventsTarget === 'container
' ? el : wrapperEl;
30140 var capture = !!params.nested;
30144 if (!Support.touch && (Support.pointerEvents || Support.prefixedPointerEvents)) {
30145 target.removeEventListener(touchEvents.start, swiper.onTouchStart, false);
30146 doc.removeEventListener(touchEvents.move, swiper.onTouchMove, capture);
30147 doc.removeEventListener(touchEvents.end, swiper.onTouchEnd, false);
30149 if (Support.touch) {
30150 var passiveListener = touchEvents.start === 'onTouchStart
' && Support.passiveListener && params.passiveListeners ? { passive: true, capture: false } : false;
30151 target.removeEventListener(touchEvents.start, swiper.onTouchStart, passiveListener);
30152 target.removeEventListener(touchEvents.move, swiper.onTouchMove, capture);
30153 target.removeEventListener(touchEvents.end, swiper.onTouchEnd, passiveListener);
30155 if ((params.simulateTouch && !Device.ios && !Device.android) || (params.simulateTouch && !Support.touch && Device.ios)) {
30156 target.removeEventListener('mousedown
', swiper.onTouchStart, false);
30157 doc.removeEventListener('mousemove
', swiper.onTouchMove, capture);
30158 doc.removeEventListener('mouseup
', swiper.onTouchEnd, false);
30161 // Prevent Links Clicks
30162 if (params.preventClicks || params.preventClicksPropagation) {
30163 target.removeEventListener('click
', swiper.onClick, true);
30168 swiper.off((Device.ios || Device.android ? 'resize orientationchange observerUpdate
' : 'resize observerUpdate
'), onResize);
30172 attachEvents: attachEvents,
30173 detachEvents: detachEvents,
30176 function setBreakpoint () {
30178 var activeIndex = swiper.activeIndex;
30179 var initialized = swiper.initialized;
30180 var loopedSlides = swiper.loopedSlides; if ( loopedSlides === void 0 ) loopedSlides = 0;
30181 var params = swiper.params;
30182 var breakpoints = params.breakpoints;
30183 if (!breakpoints || (breakpoints && Object.keys(breakpoints).length === 0)) { return; }
30185 // Set breakpoint for window width and update parameters
30186 var breakpoint = swiper.getBreakpoint(breakpoints);
30188 if (breakpoint && swiper.currentBreakpoint !== breakpoint) {
30189 var breakpointOnlyParams = breakpoint in breakpoints ? breakpoints[breakpoint] : undefined;
30190 if (breakpointOnlyParams) {
30191 ['slidesPerView
', 'spaceBetween
', 'slidesPerGroup
'].forEach(function (param) {
30192 var paramValue = breakpointOnlyParams[param];
30193 if (typeof paramValue === 'undefined') { return; }
30194 if (param === 'slidesPerView
' && (paramValue === 'AUTO
' || paramValue === 'auto
')) {
30195 breakpointOnlyParams[param] = 'auto
';
30196 } else if (param === 'slidesPerView
') {
30197 breakpointOnlyParams[param] = parseFloat(paramValue);
30199 breakpointOnlyParams[param] = parseInt(paramValue, 10);
30204 var breakpointParams = breakpointOnlyParams || swiper.originalParams;
30205 var directionChanged = breakpointParams.direction && breakpointParams.direction !== params.direction;
30206 var needsReLoop = params.loop && (breakpointParams.slidesPerView !== params.slidesPerView || directionChanged);
30208 if (directionChanged && initialized) {
30209 swiper.changeDirection();
30212 Utils.extend(swiper.params, breakpointParams);
30214 Utils.extend(swiper, {
30215 allowTouchMove: swiper.params.allowTouchMove,
30216 allowSlideNext: swiper.params.allowSlideNext,
30217 allowSlidePrev: swiper.params.allowSlidePrev,
30220 swiper.currentBreakpoint = breakpoint;
30222 if (needsReLoop && initialized) {
30223 swiper.loopDestroy();
30224 swiper.loopCreate();
30225 swiper.updateSlides();
30226 swiper.slideTo((activeIndex - loopedSlides) + swiper.loopedSlides, 0, false);
30229 swiper.emit('breakpoint
', breakpointParams);
30233 function getBreakpoint (breakpoints) {
30235 // Get breakpoint for window width
30236 if (!breakpoints) { return undefined; }
30237 var breakpoint = false;
30239 Object.keys(breakpoints).forEach(function (point) {
30240 points.push(point);
30242 points.sort(function (a, b) { return parseInt(a, 10) - parseInt(b, 10); });
30243 for (var i = 0; i < points.length; i += 1) {
30244 var point = points[i];
30245 if (swiper.params.breakpointsInverse) {
30246 if (point <= win.innerWidth) {
30247 breakpoint = point;
30249 } else if (point >= win.innerWidth && !breakpoint) {
30250 breakpoint = point;
30253 return breakpoint || 'max
';
30256 var breakpoints = { setBreakpoint: setBreakpoint, getBreakpoint: getBreakpoint };
30258 function addClasses () {
30260 var classNames = swiper.classNames;
30261 var params = swiper.params;
30262 var rtl = swiper.rtl;
30263 var $el = swiper.$el;
30266 suffixes.push('initialized
');
30267 suffixes.push(params.direction);
30269 if (params.freeMode) {
30270 suffixes.push('free
-mode
');
30272 if (!Support.flexbox) {
30273 suffixes.push('no
-flexbox
');
30275 if (params.autoHeight) {
30276 suffixes.push('autoheight
');
30279 suffixes.push('rtl
');
30281 if (params.slidesPerColumn > 1) {
30282 suffixes.push('multirow
');
30284 if (Device.android) {
30285 suffixes.push('android
');
30288 suffixes.push('ios
');
30290 // WP8 Touch Events Fix
30291 if ((Browser.isIE || Browser.isEdge) && (Support.pointerEvents || Support.prefixedPointerEvents)) {
30292 suffixes.push(("wp8-" + (params.direction)));
30295 suffixes.forEach(function (suffix) {
30296 classNames.push(params.containerModifierClass + suffix);
30299 $el.addClass(classNames.join(' '));
30302 function removeClasses () {
30304 var $el = swiper.$el;
30305 var classNames = swiper.classNames;
30307 $el.removeClass(classNames.join(' '));
30310 var classes = { addClasses: addClasses, removeClasses: removeClasses };
30312 function loadImage (imageEl, src, srcset, sizes, checkForComplete, callback) {
30314 function onReady() {
30315 if (callback) { callback(); }
30317 if (!imageEl.complete || !checkForComplete) {
30319 image = new win.Image();
30320 image.onload = onReady;
30321 image.onerror = onReady;
30323 image.sizes = sizes;
30326 image.srcset = srcset;
30335 // image already loaded...
30340 function preloadImages () {
30342 swiper.imagesToLoad = swiper.$el.find('img
');
30343 function onReady() {
30344 if (typeof swiper === 'undefined' || swiper === null || !swiper || swiper.destroyed) { return; }
30345 if (swiper.imagesLoaded !== undefined) { swiper.imagesLoaded += 1; }
30346 if (swiper.imagesLoaded === swiper.imagesToLoad.length) {
30347 if (swiper.params.updateOnImagesReady) { swiper.update(); }
30348 swiper.emit('imagesReady
');
30351 for (var i = 0; i < swiper.imagesToLoad.length; i += 1) {
30352 var imageEl = swiper.imagesToLoad[i];
30355 imageEl.currentSrc || imageEl.getAttribute('src
'),
30356 imageEl.srcset || imageEl.getAttribute('srcset
'),
30357 imageEl.sizes || imageEl.getAttribute('sizes
'),
30365 loadImage: loadImage,
30366 preloadImages: preloadImages,
30369 function checkOverflow() {
30371 var wasLocked = swiper.isLocked;
30373 swiper.isLocked = swiper.snapGrid.length === 1;
30374 swiper.allowSlideNext = !swiper.isLocked;
30375 swiper.allowSlidePrev = !swiper.isLocked;
30378 if (wasLocked !== swiper.isLocked) { swiper.emit(swiper.isLocked ? 'lock
' : 'unlock
'); }
30380 if (wasLocked && wasLocked !== swiper.isLocked) {
30381 swiper.isEnd = false;
30382 swiper.navigation.update();
30386 var checkOverflow$1 = { checkOverflow: checkOverflow };
30390 direction: 'horizontal
',
30391 touchEventsTarget: 'container
',
30395 preventInteractionOnTransition: false,
30397 // To support iOS's swipe
-to
-go
-back
gesture (when being used
in-app
, with UIWebView
).
30398 edgeSwipeDetection
: false,
30399 edgeSwipeThreshold
: 20,
30403 freeModeMomentum
: true,
30404 freeModeMomentumRatio
: 1,
30405 freeModeMomentumBounce
: true,
30406 freeModeMomentumBounceRatio
: 1,
30407 freeModeMomentumVelocityRatio
: 1,
30408 freeModeSticky
: false,
30409 freeModeMinimumVelocity
: 0.02,
30414 // Set wrapper width
30415 setWrapperSize
: false,
30417 // Virtual Translate
30418 virtualTranslate
: false,
30421 effect
: 'slide', // 'slide' or 'fade' or 'cube' or 'coverflow' or 'flip'
30424 breakpoints
: undefined,
30425 breakpointsInverse
: false,
30430 slidesPerColumn
: 1,
30431 slidesPerColumnFill
: 'column',
30433 centeredSlides
: false,
30434 slidesOffsetBefore
: 0, // in px
30435 slidesOffsetAfter
: 0, // in px
30436 normalizeSlideIndex
: true,
30437 centerInsufficientSlides
: false,
30439 // Disable swiper and hide navigation when container not overflow
30440 watchOverflow
: false,
30443 roundLengths
: false,
30448 simulateTouch
: true,
30451 longSwipesRatio
: 0.5,
30453 followFinger
: true,
30454 allowTouchMove
: true,
30456 touchMoveStopPropagation
: true,
30457 touchStartPreventDefault
: true,
30458 touchStartForcePreventDefault
: false,
30459 touchReleaseOnEdges
: false,
30461 // Unique Navigation Elements
30462 uniqueNavElements
: true,
30466 resistanceRatio
: 0.85,
30469 watchSlidesProgress
: false,
30470 watchSlidesVisibility
: false,
30476 preventClicks
: true,
30477 preventClicksPropagation
: true,
30478 slideToClickedSlide
: false,
30481 preloadImages
: true,
30482 updateOnImagesReady
: true,
30486 loopAdditionalSlides
: 0,
30487 loopedSlides
: null,
30488 loopFillGroupWithBlank
: false,
30490 // Swiping/no swiping
30491 allowSlidePrev
: true,
30492 allowSlideNext
: true,
30493 swipeHandler
: null, // '.swipe-handler',
30495 noSwipingClass
: 'swiper-no-swiping',
30496 noSwipingSelector
: null,
30498 // Passive Listeners
30499 passiveListeners
: true,
30502 containerModifierClass
: 'swiper-container-', // NEW
30503 slideClass
: 'swiper-slide',
30504 slideBlankClass
: 'swiper-slide-invisible-blank',
30505 slideActiveClass
: 'swiper-slide-active',
30506 slideDuplicateActiveClass
: 'swiper-slide-duplicate-active',
30507 slideVisibleClass
: 'swiper-slide-visible',
30508 slideDuplicateClass
: 'swiper-slide-duplicate',
30509 slideNextClass
: 'swiper-slide-next',
30510 slideDuplicateNextClass
: 'swiper-slide-duplicate-next',
30511 slidePrevClass
: 'swiper-slide-prev',
30512 slideDuplicatePrevClass
: 'swiper-slide-duplicate-prev',
30513 wrapperClass
: 'swiper-wrapper',
30516 runCallbacksOnInit
: true,
30519 /* eslint no-param-reassign: "off" */
30523 translate
: translate
,
30524 transition
: transition
$1,
30527 grabCursor
: grabCursor
,
30528 manipulation
: manipulation
,
30530 breakpoints
: breakpoints
,
30531 checkOverflow
: checkOverflow
$1,
30536 var extendedDefaults
= {};
30538 var Swiper
= /*@__PURE__*/(function (SwiperClass
) {
30539 function Swiper() {
30542 var args
= [], len
= arguments
.length
;
30543 while ( len
-- ) args
[ len
] = arguments
[ len
];
30546 if (args
.length
=== 1 && args
[0].constructor && args
[0].constructor === Object
) {
30549 (assign
= args
, el
= assign
[0], params
= assign
[1]);
30551 if (!params
) { params
= {}; }
30553 params
= Utils
.extend({}, params
);
30554 if (el
&& !params
.el
) { params
.el
= el
; }
30556 SwiperClass
.call(this, params
);
30558 Object
.keys(prototypes
).forEach(function (prototypeGroup
) {
30559 Object
.keys(prototypes
[prototypeGroup
]).forEach(function (protoMethod
) {
30560 if (!Swiper
.prototype[protoMethod
]) {
30561 Swiper
.prototype[protoMethod
] = prototypes
[prototypeGroup
][protoMethod
];
30568 if (typeof swiper
.modules
=== 'undefined') {
30569 swiper
.modules
= {};
30571 Object
.keys(swiper
.modules
).forEach(function (moduleName
) {
30572 var module
= swiper
.modules
[moduleName
];
30573 if (module
.params
) {
30574 var moduleParamName
= Object
.keys(module
.params
)[0];
30575 var moduleParams
= module
.params
[moduleParamName
];
30576 if (typeof moduleParams
!== 'object' || moduleParams
=== null) { return; }
30577 if (!(moduleParamName
in params
&& 'enabled' in moduleParams
)) { return; }
30578 if (params
[moduleParamName
] === true) {
30579 params
[moduleParamName
] = { enabled
: true };
30582 typeof params
[moduleParamName
] === 'object'
30583 && !('enabled' in params
[moduleParamName
])
30585 params
[moduleParamName
].enabled
= true;
30587 if (!params
[moduleParamName
]) { params
[moduleParamName
] = { enabled
: false }; }
30591 // Extend defaults with modules params
30592 var swiperParams
= Utils
.extend({}, defaults
);
30593 swiper
.useModulesParams(swiperParams
);
30595 // Extend defaults with passed params
30596 swiper
.params
= Utils
.extend({}, swiperParams
, extendedDefaults
, params
);
30597 swiper
.originalParams
= Utils
.extend({}, swiper
.params
);
30598 swiper
.passedParams
= Utils
.extend({}, params
);
30604 var $el
= $(swiper
.params
.el
);
30611 if ($el
.length
> 1) {
30613 $el
.each(function (index
, containerEl
) {
30614 var newParams
= Utils
.extend({}, params
, { el
: containerEl
});
30615 swipers
.push(new Swiper(newParams
));
30620 el
.swiper
= swiper
;
30621 $el
.data('swiper', swiper
);
30624 var $wrapperEl
= $el
.children(("." + (swiper
.params
.wrapperClass
)));
30627 Utils
.extend(swiper
, {
30630 $wrapperEl
: $wrapperEl
,
30631 wrapperEl
: $wrapperEl
[0],
30640 slidesSizesGrid
: [],
30643 isHorizontal
: function isHorizontal() {
30644 return swiper
.params
.direction
=== 'horizontal';
30646 isVertical
: function isVertical() {
30647 return swiper
.params
.direction
=== 'vertical';
30650 rtl
: (el
.dir
.toLowerCase() === 'rtl' || $el
.css('direction') === 'rtl'),
30651 rtlTranslate
: swiper
.params
.direction
=== 'horizontal' && (el
.dir
.toLowerCase() === 'rtl' || $el
.css('direction') === 'rtl'),
30652 wrongRTL
: $wrapperEl
.css('display') === '-webkit-box',
30664 previousTranslate
: 0,
30670 allowSlideNext
: swiper
.params
.allowSlideNext
,
30671 allowSlidePrev
: swiper
.params
.allowSlidePrev
,
30674 touchEvents
: (function touchEvents() {
30675 var touch
= ['touchstart', 'touchmove', 'touchend'];
30676 var desktop
= ['mousedown', 'mousemove', 'mouseup'];
30677 if (Support
.pointerEvents
) {
30678 desktop
= ['pointerdown', 'pointermove', 'pointerup'];
30679 } else if (Support
.prefixedPointerEvents
) {
30680 desktop
= ['MSPointerDown', 'MSPointerMove', 'MSPointerUp'];
30682 swiper
.touchEventsTouch
= {
30687 swiper
.touchEventsDesktop
= {
30692 return Support
.touch
|| !swiper
.params
.simulateTouch
? swiper
.touchEventsTouch
: swiper
.touchEventsDesktop
;
30695 isTouched
: undefined,
30696 isMoved
: undefined,
30697 allowTouchCallbacks
: undefined,
30698 touchStartTime
: undefined,
30699 isScrolling
: undefined,
30700 currentTranslate
: undefined,
30701 startTranslate
: undefined,
30702 allowThresholdMove
: undefined,
30703 // Form elements to match
30704 formElements
: 'input, select, option, textarea, button, video',
30706 lastClickTime
: Utils
.now(),
30707 clickTimeout
: undefined,
30710 allowMomentumBounce
: undefined,
30711 isTouchEvent
: undefined,
30712 startMoving
: undefined,
30719 allowTouchMove
: swiper
.params
.allowTouchMove
,
30736 swiper
.useModules();
30739 if (swiper
.params
.init
) {
30743 // Return app instance
30747 if ( SwiperClass
) Swiper
.__proto__
= SwiperClass
;
30748 Swiper
.prototype = Object
.create( SwiperClass
&& SwiperClass
.prototype );
30749 Swiper
.prototype.constructor = Swiper
;
30751 var staticAccessors
= { extendedDefaults
: { configurable
: true },defaults
: { configurable
: true },Class
: { configurable
: true },$: { configurable
: true } };
30753 Swiper
.prototype.slidesPerViewDynamic
= function slidesPerViewDynamic () {
30755 var params
= swiper
.params
;
30756 var slides
= swiper
.slides
;
30757 var slidesGrid
= swiper
.slidesGrid
;
30758 var swiperSize
= swiper
.size
;
30759 var activeIndex
= swiper
.activeIndex
;
30761 if (params
.centeredSlides
) {
30762 var slideSize
= slides
[activeIndex
].swiperSlideSize
;
30764 for (var i
= activeIndex
+ 1; i
< slides
.length
; i
+= 1) {
30765 if (slides
[i
] && !breakLoop
) {
30766 slideSize
+= slides
[i
].swiperSlideSize
;
30768 if (slideSize
> swiperSize
) { breakLoop
= true; }
30771 for (var i
$1 = activeIndex
- 1; i
$1 >= 0; i
$1 -= 1) {
30772 if (slides
[i
$1] && !breakLoop
) {
30773 slideSize
+= slides
[i
$1].swiperSlideSize
;
30775 if (slideSize
> swiperSize
) { breakLoop
= true; }
30779 for (var i
$2 = activeIndex
+ 1; i
$2 < slides
.length
; i
$2 += 1) {
30780 if (slidesGrid
[i
$2] - slidesGrid
[activeIndex
] < swiperSize
) {
30788 Swiper
.prototype.update
= function update () {
30790 if (!swiper
|| swiper
.destroyed
) { return; }
30791 var snapGrid
= swiper
.snapGrid
;
30792 var params
= swiper
.params
;
30794 if (params
.breakpoints
) {
30795 swiper
.setBreakpoint();
30797 swiper
.updateSize();
30798 swiper
.updateSlides();
30799 swiper
.updateProgress();
30800 swiper
.updateSlidesClasses();
30802 function setTranslate() {
30803 var translateValue
= swiper
.rtlTranslate
? swiper
.translate
* -1 : swiper
.translate
;
30804 var newTranslate
= Math
.min(Math
.max(translateValue
, swiper
.maxTranslate()), swiper
.minTranslate());
30805 swiper
.setTranslate(newTranslate
);
30806 swiper
.updateActiveIndex();
30807 swiper
.updateSlidesClasses();
30810 if (swiper
.params
.freeMode
) {
30812 if (swiper
.params
.autoHeight
) {
30813 swiper
.updateAutoHeight();
30816 if ((swiper
.params
.slidesPerView
=== 'auto' || swiper
.params
.slidesPerView
> 1) && swiper
.isEnd
&& !swiper
.params
.centeredSlides
) {
30817 translated
= swiper
.slideTo(swiper
.slides
.length
- 1, 0, false, true);
30819 translated
= swiper
.slideTo(swiper
.activeIndex
, 0, false, true);
30825 if (params
.watchOverflow
&& snapGrid
!== swiper
.snapGrid
) {
30826 swiper
.checkOverflow();
30828 swiper
.emit('update');
30831 Swiper
.prototype.changeDirection
= function changeDirection (newDirection
, needUpdate
) {
30832 if ( needUpdate
=== void 0 ) needUpdate
= true;
30835 var currentDirection
= swiper
.params
.direction
;
30836 if (!newDirection
) {
30837 // eslint-disable-next-line
30838 newDirection
= currentDirection
=== 'horizontal' ? 'vertical' : 'horizontal';
30840 if ((newDirection
=== currentDirection
) || (newDirection
!== 'horizontal' && newDirection
!== 'vertical')) {
30844 if (currentDirection
=== 'vertical') {
30846 .removeClass(((swiper
.params
.containerModifierClass
) + "vertical wp8-vertical"))
30847 .addClass(("" + (swiper
.params
.containerModifierClass
) + newDirection
));
30849 if ((Browser
.isIE
|| Browser
.isEdge
) && (Support
.pointerEvents
|| Support
.prefixedPointerEvents
)) {
30850 swiper
.$el
.addClass(((swiper
.params
.containerModifierClass
) + "wp8-" + newDirection
));
30853 if (currentDirection
=== 'horizontal') {
30855 .removeClass(((swiper
.params
.containerModifierClass
) + "horizontal wp8-horizontal"))
30856 .addClass(("" + (swiper
.params
.containerModifierClass
) + newDirection
));
30858 if ((Browser
.isIE
|| Browser
.isEdge
) && (Support
.pointerEvents
|| Support
.prefixedPointerEvents
)) {
30859 swiper
.$el
.addClass(((swiper
.params
.containerModifierClass
) + "wp8-" + newDirection
));
30863 swiper
.params
.direction
= newDirection
;
30865 swiper
.slides
.each(function (slideIndex
, slideEl
) {
30866 if (newDirection
=== 'vertical') {
30867 slideEl
.style
.width
= '';
30869 slideEl
.style
.height
= '';
30873 swiper
.emit('changeDirection');
30874 if (needUpdate
) { swiper
.update(); }
30879 Swiper
.prototype.init
= function init () {
30881 if (swiper
.initialized
) { return; }
30883 swiper
.emit('beforeInit');
30886 if (swiper
.params
.breakpoints
) {
30887 swiper
.setBreakpoint();
30891 swiper
.addClasses();
30894 if (swiper
.params
.loop
) {
30895 swiper
.loopCreate();
30899 swiper
.updateSize();
30902 swiper
.updateSlides();
30904 if (swiper
.params
.watchOverflow
) {
30905 swiper
.checkOverflow();
30909 if (swiper
.params
.grabCursor
) {
30910 swiper
.setGrabCursor();
30913 if (swiper
.params
.preloadImages
) {
30914 swiper
.preloadImages();
30917 // Slide To Initial Slide
30918 if (swiper
.params
.loop
) {
30919 swiper
.slideTo(swiper
.params
.initialSlide
+ swiper
.loopedSlides
, 0, swiper
.params
.runCallbacksOnInit
);
30921 swiper
.slideTo(swiper
.params
.initialSlide
, 0, swiper
.params
.runCallbacksOnInit
);
30925 swiper
.attachEvents();
30928 swiper
.initialized
= true;
30931 swiper
.emit('init');
30934 Swiper
.prototype.destroy
= function destroy (deleteInstance
, cleanStyles
) {
30935 if ( deleteInstance
=== void 0 ) deleteInstance
= true;
30936 if ( cleanStyles
=== void 0 ) cleanStyles
= true;
30939 var params
= swiper
.params
;
30940 var $el
= swiper
.$el
;
30941 var $wrapperEl
= swiper
.$wrapperEl
;
30942 var slides
= swiper
.slides
;
30944 if (typeof swiper
.params
=== 'undefined' || swiper
.destroyed
) {
30948 swiper
.emit('beforeDestroy');
30951 swiper
.initialized
= false;
30954 swiper
.detachEvents();
30958 swiper
.loopDestroy();
30963 swiper
.removeClasses();
30964 $el
.removeAttr('style');
30965 $wrapperEl
.removeAttr('style');
30966 if (slides
&& slides
.length
) {
30969 params
.slideVisibleClass
,
30970 params
.slideActiveClass
,
30971 params
.slideNextClass
,
30972 params
.slidePrevClass
].join(' '))
30973 .removeAttr('style')
30974 .removeAttr('data-swiper-slide-index')
30975 .removeAttr('data-swiper-column')
30976 .removeAttr('data-swiper-row');
30980 swiper
.emit('destroy');
30982 // Detach emitter events
30983 Object
.keys(swiper
.eventsListeners
).forEach(function (eventName
) {
30984 swiper
.off(eventName
);
30987 if (deleteInstance
!== false) {
30988 swiper
.$el
[0].swiper
= null;
30989 swiper
.$el
.data('swiper', null);
30990 Utils
.deleteProps(swiper
);
30992 swiper
.destroyed
= true;
30997 Swiper
.extendDefaults
= function extendDefaults (newDefaults
) {
30998 Utils
.extend(extendedDefaults
, newDefaults
);
31001 staticAccessors
.extendedDefaults
.get = function () {
31002 return extendedDefaults
;
31005 staticAccessors
.defaults
.get = function () {
31009 staticAccessors
.Class
.get = function () {
31010 return SwiperClass
;
31013 staticAccessors
.$.get = function () {
31017 Object
.defineProperties( Swiper
, staticAccessors
);
31020 }(Framework7Class
));
31054 create
: function create() {
31056 Utils
.extend(swiper
, {
31058 resizeHandler
: function resizeHandler() {
31059 if (!swiper
|| swiper
.destroyed
|| !swiper
.initialized
) { return; }
31060 swiper
.emit('beforeResize');
31061 swiper
.emit('resize');
31063 orientationChangeHandler
: function orientationChangeHandler() {
31064 if (!swiper
|| swiper
.destroyed
|| !swiper
.initialized
) { return; }
31065 swiper
.emit('orientationchange');
31071 init
: function init() {
31074 win
.addEventListener('resize', swiper
.resize
.resizeHandler
);
31076 // Emit orientationchange
31077 win
.addEventListener('orientationchange', swiper
.resize
.orientationChangeHandler
);
31079 destroy
: function destroy() {
31081 win
.removeEventListener('resize', swiper
.resize
.resizeHandler
);
31082 win
.removeEventListener('orientationchange', swiper
.resize
.orientationChangeHandler
);
31088 func
: win
.MutationObserver
|| win
.WebkitMutationObserver
,
31089 attach
: function attach(target
, options
) {
31090 if ( options
=== void 0 ) options
= {};
31094 var ObserverFunc
= Observer
.func
;
31095 var observer
= new ObserverFunc(function (mutations
) {
31096 // The observerUpdate event should only be triggered
31097 // once despite the number of mutations. Additional
31098 // triggers are redundant and are very costly
31099 if (mutations
.length
=== 1) {
31100 swiper
.emit('observerUpdate', mutations
[0]);
31103 var observerUpdate
= function observerUpdate() {
31104 swiper
.emit('observerUpdate', mutations
[0]);
31107 if (win
.requestAnimationFrame
) {
31108 win
.requestAnimationFrame(observerUpdate
);
31110 win
.setTimeout(observerUpdate
, 0);
31114 observer
.observe(target
, {
31115 attributes
: typeof options
.attributes
=== 'undefined' ? true : options
.attributes
,
31116 childList
: typeof options
.childList
=== 'undefined' ? true : options
.childList
,
31117 characterData
: typeof options
.characterData
=== 'undefined' ? true : options
.characterData
,
31120 swiper
.observer
.observers
.push(observer
);
31122 init
: function init() {
31124 if (!Support
.observer
|| !swiper
.params
.observer
) { return; }
31125 if (swiper
.params
.observeParents
) {
31126 var containerParents
= swiper
.$el
.parents();
31127 for (var i
= 0; i
< containerParents
.length
; i
+= 1) {
31128 swiper
.observer
.attach(containerParents
[i
]);
31131 // Observe container
31132 swiper
.observer
.attach(swiper
.$el
[0], { childList
: swiper
.params
.observeSlideChildren
});
31135 swiper
.observer
.attach(swiper
.$wrapperEl
[0], { attributes
: false });
31137 destroy
: function destroy() {
31139 swiper
.observer
.observers
.forEach(function (observer
) {
31140 observer
.disconnect();
31142 swiper
.observer
.observers
= [];
31150 observeParents
: false,
31151 observeSlideChildren
: false,
31153 create
: function create() {
31155 Utils
.extend(swiper
, {
31157 init
: Observer
.init
.bind(swiper
),
31158 attach
: Observer
.attach
.bind(swiper
),
31159 destroy
: Observer
.destroy
.bind(swiper
),
31165 init
: function init() {
31167 swiper
.observer
.init();
31169 destroy
: function destroy() {
31171 swiper
.observer
.destroy();
31177 update
: function update(force
) {
31179 var ref
= swiper
.params
;
31180 var slidesPerView
= ref
.slidesPerView
;
31181 var slidesPerGroup
= ref
.slidesPerGroup
;
31182 var centeredSlides
= ref
.centeredSlides
;
31183 var ref
$1 = swiper
.params
.virtual
;
31184 var addSlidesBefore
= ref
$1.addSlidesBefore
;
31185 var addSlidesAfter
= ref
$1.addSlidesAfter
;
31186 var ref
$2 = swiper
.virtual
;
31187 var previousFrom
= ref
$2.from;
31188 var previousTo
= ref
$2.to
;
31189 var slides
= ref
$2.slides
;
31190 var previousSlidesGrid
= ref
$2.slidesGrid
;
31191 var renderSlide
= ref
$2.renderSlide
;
31192 var previousOffset
= ref
$2.offset
;
31193 swiper
.updateActiveIndex();
31194 var activeIndex
= swiper
.activeIndex
|| 0;
31197 if (swiper
.rtlTranslate
) { offsetProp
= 'right'; }
31198 else { offsetProp
= swiper
.isHorizontal() ? 'left' : 'top'; }
31202 if (centeredSlides
) {
31203 slidesAfter
= Math
.floor(slidesPerView
/ 2) + slidesPerGroup
+ addSlidesBefore
;
31204 slidesBefore
= Math
.floor(slidesPerView
/ 2) + slidesPerGroup
+ addSlidesAfter
;
31206 slidesAfter
= slidesPerView
+ (slidesPerGroup
- 1) + addSlidesBefore
;
31207 slidesBefore
= slidesPerGroup
+ addSlidesAfter
;
31209 var from = Math
.max((activeIndex
|| 0) - slidesBefore
, 0);
31210 var to
= Math
.min((activeIndex
|| 0) + slidesAfter
, slides
.length
- 1);
31211 var offset
= (swiper
.slidesGrid
[from] || 0) - (swiper
.slidesGrid
[0] || 0);
31213 Utils
.extend(swiper
.virtual
, {
31217 slidesGrid
: swiper
.slidesGrid
,
31220 function onRendered() {
31221 swiper
.updateSlides();
31222 swiper
.updateProgress();
31223 swiper
.updateSlidesClasses();
31224 if (swiper
.lazy
&& swiper
.params
.lazy
.enabled
) {
31225 swiper
.lazy
.load();
31229 if (previousFrom
=== from && previousTo
=== to
&& !force
) {
31230 if (swiper
.slidesGrid
!== previousSlidesGrid
&& offset
!== previousOffset
) {
31231 swiper
.slides
.css(offsetProp
, (offset
+ "px"));
31233 swiper
.updateProgress();
31236 if (swiper
.params
.virtual
.renderExternal
) {
31237 swiper
.params
.virtual
.renderExternal
.call(swiper
, {
31241 slides
: (function getSlides() {
31242 var slidesToRender
= [];
31243 for (var i
= from; i
<= to
; i
+= 1) {
31244 slidesToRender
.push(slides
[i
]);
31246 return slidesToRender
;
31252 var prependIndexes
= [];
31253 var appendIndexes
= [];
31255 swiper
.$wrapperEl
.find(("." + (swiper
.params
.slideClass
))).remove();
31257 for (var i
= previousFrom
; i
<= previousTo
; i
+= 1) {
31258 if (i
< from || i
> to
) {
31259 swiper
.$wrapperEl
.find(("." + (swiper
.params
.slideClass
) + "[data-swiper-slide-index=\"" + i
+ "\"]")).remove();
31263 for (var i
$1 = 0; i
$1 < slides
.length
; i
$1 += 1) {
31264 if (i
$1 >= from && i
$1 <= to
) {
31265 if (typeof previousTo
=== 'undefined' || force
) {
31266 appendIndexes
.push(i
$1);
31268 if (i
$1 > previousTo
) { appendIndexes
.push(i
$1); }
31269 if (i
$1 < previousFrom
) { prependIndexes
.push(i
$1); }
31273 appendIndexes
.forEach(function (index
) {
31274 swiper
.$wrapperEl
.append(renderSlide(slides
[index
], index
));
31276 prependIndexes
.sort(function (a
, b
) { return b
- a
; }).forEach(function (index
) {
31277 swiper
.$wrapperEl
.prepend(renderSlide(slides
[index
], index
));
31279 swiper
.$wrapperEl
.children('.swiper-slide').css(offsetProp
, (offset
+ "px"));
31282 renderSlide
: function renderSlide(slide
, index
) {
31284 var params
= swiper
.params
.virtual
;
31285 if (params
.cache
&& swiper
.virtual
.cache
[index
]) {
31286 return swiper
.virtual
.cache
[index
];
31288 var $slideEl
= params
.renderSlide
31289 ? $(params
.renderSlide
.call(swiper
, slide
, index
))
31290 : $(("<div class=\"" + (swiper
.params
.slideClass
) + "\" data-swiper-slide-index=\"" + index
+ "\">" + slide
+ "</div>"));
31291 if (!$slideEl
.attr('data-swiper-slide-index')) { $slideEl
.attr('data-swiper-slide-index', index
); }
31292 if (params
.cache
) { swiper
.virtual
.cache
[index
] = $slideEl
; }
31295 appendSlide
: function appendSlide(slides
) {
31297 if (typeof slides
=== 'object' && 'length' in slides
) {
31298 for (var i
= 0; i
< slides
.length
; i
+= 1) {
31299 if (slides
[i
]) { swiper
.virtual
.slides
.push(slides
[i
]); }
31302 swiper
.virtual
.slides
.push(slides
);
31304 swiper
.virtual
.update(true);
31306 prependSlide
: function prependSlide(slides
) {
31308 var activeIndex
= swiper
.activeIndex
;
31309 var newActiveIndex
= activeIndex
+ 1;
31310 var numberOfNewSlides
= 1;
31312 if (Array
.isArray(slides
)) {
31313 for (var i
= 0; i
< slides
.length
; i
+= 1) {
31314 if (slides
[i
]) { swiper
.virtual
.slides
.unshift(slides
[i
]); }
31316 newActiveIndex
= activeIndex
+ slides
.length
;
31317 numberOfNewSlides
= slides
.length
;
31319 swiper
.virtual
.slides
.unshift(slides
);
31321 if (swiper
.params
.virtual
.cache
) {
31322 var cache
= swiper
.virtual
.cache
;
31324 Object
.keys(cache
).forEach(function (cachedIndex
) {
31325 newCache
[parseInt(cachedIndex
, 10) + numberOfNewSlides
] = cache
[cachedIndex
];
31327 swiper
.virtual
.cache
= newCache
;
31329 swiper
.virtual
.update(true);
31330 swiper
.slideTo(newActiveIndex
, 0);
31332 removeSlide
: function removeSlide(slidesIndexes
) {
31334 if (typeof slidesIndexes
=== 'undefined' || slidesIndexes
=== null) { return; }
31335 var activeIndex
= swiper
.activeIndex
;
31336 if (Array
.isArray(slidesIndexes
)) {
31337 for (var i
= slidesIndexes
.length
- 1; i
>= 0; i
-= 1) {
31338 swiper
.virtual
.slides
.splice(slidesIndexes
[i
], 1);
31339 if (swiper
.params
.virtual
.cache
) {
31340 delete swiper
.virtual
.cache
[slidesIndexes
[i
]];
31342 if (slidesIndexes
[i
] < activeIndex
) { activeIndex
-= 1; }
31343 activeIndex
= Math
.max(activeIndex
, 0);
31346 swiper
.virtual
.slides
.splice(slidesIndexes
, 1);
31347 if (swiper
.params
.virtual
.cache
) {
31348 delete swiper
.virtual
.cache
[slidesIndexes
];
31350 if (slidesIndexes
< activeIndex
) { activeIndex
-= 1; }
31351 activeIndex
= Math
.max(activeIndex
, 0);
31353 swiper
.virtual
.update(true);
31354 swiper
.slideTo(activeIndex
, 0);
31356 removeAllSlides
: function removeAllSlides() {
31358 swiper
.virtual
.slides
= [];
31359 if (swiper
.params
.virtual
.cache
) {
31360 swiper
.virtual
.cache
= {};
31362 swiper
.virtual
.update(true);
31363 swiper
.slideTo(0, 0);
31375 renderExternal
: null,
31376 addSlidesBefore
: 0,
31380 create
: function create() {
31382 Utils
.extend(swiper
, {
31384 update
: Virtual
.update
.bind(swiper
),
31385 appendSlide
: Virtual
.appendSlide
.bind(swiper
),
31386 prependSlide
: Virtual
.prependSlide
.bind(swiper
),
31387 removeSlide
: Virtual
.removeSlide
.bind(swiper
),
31388 removeAllSlides
: Virtual
.removeAllSlides
.bind(swiper
),
31389 renderSlide
: Virtual
.renderSlide
.bind(swiper
),
31390 slides
: swiper
.params
.virtual
.slides
,
31396 beforeInit
: function beforeInit() {
31398 if (!swiper
.params
.virtual
.enabled
) { return; }
31399 swiper
.classNames
.push(((swiper
.params
.containerModifierClass
) + "virtual"));
31400 var overwriteParams
= {
31401 watchSlidesProgress
: true,
31403 Utils
.extend(swiper
.params
, overwriteParams
);
31404 Utils
.extend(swiper
.originalParams
, overwriteParams
);
31406 if (!swiper
.params
.initialSlide
) {
31407 swiper
.virtual
.update();
31410 setTranslate
: function setTranslate() {
31412 if (!swiper
.params
.virtual
.enabled
) { return; }
31413 swiper
.virtual
.update();
31419 update
: function update() {
31420 // Update Navigation Buttons
31422 var params
= swiper
.params
.navigation
;
31424 if (swiper
.params
.loop
) { return; }
31425 var ref
= swiper
.navigation
;
31426 var $nextEl
= ref
.$nextEl
;
31427 var $prevEl
= ref
.$prevEl
;
31429 if ($prevEl
&& $prevEl
.length
> 0) {
31430 if (swiper
.isBeginning
) {
31431 $prevEl
.addClass(params
.disabledClass
);
31433 $prevEl
.removeClass(params
.disabledClass
);
31435 $prevEl
[swiper
.params
.watchOverflow
&& swiper
.isLocked
? 'addClass' : 'removeClass'](params
.lockClass
);
31437 if ($nextEl
&& $nextEl
.length
> 0) {
31438 if (swiper
.isEnd
) {
31439 $nextEl
.addClass(params
.disabledClass
);
31441 $nextEl
.removeClass(params
.disabledClass
);
31443 $nextEl
[swiper
.params
.watchOverflow
&& swiper
.isLocked
? 'addClass' : 'removeClass'](params
.lockClass
);
31446 onPrevClick
: function onPrevClick(e
) {
31448 e
.preventDefault();
31449 if (swiper
.isBeginning
&& !swiper
.params
.loop
) { return; }
31450 swiper
.slidePrev();
31452 onNextClick
: function onNextClick(e
) {
31454 e
.preventDefault();
31455 if (swiper
.isEnd
&& !swiper
.params
.loop
) { return; }
31456 swiper
.slideNext();
31458 init
: function init() {
31460 var params
= swiper
.params
.navigation
;
31461 if (!(params
.nextEl
|| params
.prevEl
)) { return; }
31465 if (params
.nextEl
) {
31466 $nextEl
= $(params
.nextEl
);
31468 swiper
.params
.uniqueNavElements
31469 && typeof params
.nextEl
=== 'string'
31470 && $nextEl
.length
> 1
31471 && swiper
.$el
.find(params
.nextEl
).length
=== 1
31473 $nextEl
= swiper
.$el
.find(params
.nextEl
);
31476 if (params
.prevEl
) {
31477 $prevEl
= $(params
.prevEl
);
31479 swiper
.params
.uniqueNavElements
31480 && typeof params
.prevEl
=== 'string'
31481 && $prevEl
.length
> 1
31482 && swiper
.$el
.find(params
.prevEl
).length
=== 1
31484 $prevEl
= swiper
.$el
.find(params
.prevEl
);
31488 if ($nextEl
&& $nextEl
.length
> 0) {
31489 $nextEl
.on('click', swiper
.navigation
.onNextClick
);
31491 if ($prevEl
&& $prevEl
.length
> 0) {
31492 $prevEl
.on('click', swiper
.navigation
.onPrevClick
);
31495 Utils
.extend(swiper
.navigation
, {
31497 nextEl
: $nextEl
&& $nextEl
[0],
31499 prevEl
: $prevEl
&& $prevEl
[0],
31502 destroy
: function destroy() {
31504 var ref
= swiper
.navigation
;
31505 var $nextEl
= ref
.$nextEl
;
31506 var $prevEl
= ref
.$prevEl
;
31507 if ($nextEl
&& $nextEl
.length
) {
31508 $nextEl
.off('click', swiper
.navigation
.onNextClick
);
31509 $nextEl
.removeClass(swiper
.params
.navigation
.disabledClass
);
31511 if ($prevEl
&& $prevEl
.length
) {
31512 $prevEl
.off('click', swiper
.navigation
.onPrevClick
);
31513 $prevEl
.removeClass(swiper
.params
.navigation
.disabledClass
);
31518 var Navigation
$1 = {
31519 name
: 'navigation',
31525 hideOnClick
: false,
31526 disabledClass
: 'swiper-button-disabled',
31527 hiddenClass
: 'swiper-button-hidden',
31528 lockClass
: 'swiper-button-lock',
31531 create
: function create() {
31533 Utils
.extend(swiper
, {
31535 init
: Navigation
.init
.bind(swiper
),
31536 update
: Navigation
.update
.bind(swiper
),
31537 destroy
: Navigation
.destroy
.bind(swiper
),
31538 onNextClick
: Navigation
.onNextClick
.bind(swiper
),
31539 onPrevClick
: Navigation
.onPrevClick
.bind(swiper
),
31544 init
: function init() {
31546 swiper
.navigation
.init();
31547 swiper
.navigation
.update();
31549 toEdge
: function toEdge() {
31551 swiper
.navigation
.update();
31553 fromEdge
: function fromEdge() {
31555 swiper
.navigation
.update();
31557 destroy
: function destroy() {
31559 swiper
.navigation
.destroy();
31561 click
: function click(e
) {
31563 var ref
= swiper
.navigation
;
31564 var $nextEl
= ref
.$nextEl
;
31565 var $prevEl
= ref
.$prevEl
;
31567 swiper
.params
.navigation
.hideOnClick
31568 && !$(e
.target
).is($prevEl
)
31569 && !$(e
.target
).is($nextEl
)
31573 isHidden
= $nextEl
.hasClass(swiper
.params
.navigation
.hiddenClass
);
31574 } else if ($prevEl
) {
31575 isHidden
= $prevEl
.hasClass(swiper
.params
.navigation
.hiddenClass
);
31577 if (isHidden
=== true) {
31578 swiper
.emit('navigationShow', swiper
);
31580 swiper
.emit('navigationHide', swiper
);
31583 $nextEl
.toggleClass(swiper
.params
.navigation
.hiddenClass
);
31586 $prevEl
.toggleClass(swiper
.params
.navigation
.hiddenClass
);
31594 update
: function update() {
31595 // Render || Update Pagination bullets/items
31597 var rtl
= swiper
.rtl
;
31598 var params
= swiper
.params
.pagination
;
31599 if (!params
.el
|| !swiper
.pagination
.el
|| !swiper
.pagination
.$el
|| swiper
.pagination
.$el
.length
=== 0) { return; }
31600 var slidesLength
= swiper
.virtual
&& swiper
.params
.virtual
.enabled
? swiper
.virtual
.slides
.length
: swiper
.slides
.length
;
31601 var $el
= swiper
.pagination
.$el
;
31604 var total
= swiper
.params
.loop
? Math
.ceil((slidesLength
- (swiper
.loopedSlides
* 2)) / swiper
.params
.slidesPerGroup
) : swiper
.snapGrid
.length
;
31605 if (swiper
.params
.loop
) {
31606 current
= Math
.ceil((swiper
.activeIndex
- swiper
.loopedSlides
) / swiper
.params
.slidesPerGroup
);
31607 if (current
> slidesLength
- 1 - (swiper
.loopedSlides
* 2)) {
31608 current
-= (slidesLength
- (swiper
.loopedSlides
* 2));
31610 if (current
> total
- 1) { current
-= total
; }
31611 if (current
< 0 && swiper
.params
.paginationType
!== 'bullets') { current
= total
+ current
; }
31612 } else if (typeof swiper
.snapIndex
!== 'undefined') {
31613 current
= swiper
.snapIndex
;
31615 current
= swiper
.activeIndex
|| 0;
31618 if (params
.type
=== 'bullets' && swiper
.pagination
.bullets
&& swiper
.pagination
.bullets
.length
> 0) {
31619 var bullets
= swiper
.pagination
.bullets
;
31623 if (params
.dynamicBullets
) {
31624 swiper
.pagination
.bulletSize
= bullets
.eq(0)[swiper
.isHorizontal() ? 'outerWidth' : 'outerHeight'](true);
31625 $el
.css(swiper
.isHorizontal() ? 'width' : 'height', ((swiper
.pagination
.bulletSize
* (params
.dynamicMainBullets
+ 4)) + "px"));
31626 if (params
.dynamicMainBullets
> 1 && swiper
.previousIndex
!== undefined) {
31627 swiper
.pagination
.dynamicBulletIndex
+= (current
- swiper
.previousIndex
);
31628 if (swiper
.pagination
.dynamicBulletIndex
> (params
.dynamicMainBullets
- 1)) {
31629 swiper
.pagination
.dynamicBulletIndex
= params
.dynamicMainBullets
- 1;
31630 } else if (swiper
.pagination
.dynamicBulletIndex
< 0) {
31631 swiper
.pagination
.dynamicBulletIndex
= 0;
31634 firstIndex
= current
- swiper
.pagination
.dynamicBulletIndex
;
31635 lastIndex
= firstIndex
+ (Math
.min(bullets
.length
, params
.dynamicMainBullets
) - 1);
31636 midIndex
= (lastIndex
+ firstIndex
) / 2;
31638 bullets
.removeClass(((params
.bulletActiveClass
) + " " + (params
.bulletActiveClass
) + "-next " + (params
.bulletActiveClass
) + "-next-next " + (params
.bulletActiveClass
) + "-prev " + (params
.bulletActiveClass
) + "-prev-prev " + (params
.bulletActiveClass
) + "-main"));
31639 if ($el
.length
> 1) {
31640 bullets
.each(function (index
, bullet
) {
31641 var $bullet
= $(bullet
);
31642 var bulletIndex
= $bullet
.index();
31643 if (bulletIndex
=== current
) {
31644 $bullet
.addClass(params
.bulletActiveClass
);
31646 if (params
.dynamicBullets
) {
31647 if (bulletIndex
>= firstIndex
&& bulletIndex
<= lastIndex
) {
31648 $bullet
.addClass(((params
.bulletActiveClass
) + "-main"));
31650 if (bulletIndex
=== firstIndex
) {
31653 .addClass(((params
.bulletActiveClass
) + "-prev"))
31655 .addClass(((params
.bulletActiveClass
) + "-prev-prev"));
31657 if (bulletIndex
=== lastIndex
) {
31660 .addClass(((params
.bulletActiveClass
) + "-next"))
31662 .addClass(((params
.bulletActiveClass
) + "-next-next"));
31667 var $bullet
= bullets
.eq(current
);
31668 $bullet
.addClass(params
.bulletActiveClass
);
31669 if (params
.dynamicBullets
) {
31670 var $firstDisplayedBullet
= bullets
.eq(firstIndex
);
31671 var $lastDisplayedBullet
= bullets
.eq(lastIndex
);
31672 for (var i
= firstIndex
; i
<= lastIndex
; i
+= 1) {
31673 bullets
.eq(i
).addClass(((params
.bulletActiveClass
) + "-main"));
31675 $firstDisplayedBullet
31677 .addClass(((params
.bulletActiveClass
) + "-prev"))
31679 .addClass(((params
.bulletActiveClass
) + "-prev-prev"));
31680 $lastDisplayedBullet
31682 .addClass(((params
.bulletActiveClass
) + "-next"))
31684 .addClass(((params
.bulletActiveClass
) + "-next-next"));
31687 if (params
.dynamicBullets
) {
31688 var dynamicBulletsLength
= Math
.min(bullets
.length
, params
.dynamicMainBullets
+ 4);
31689 var bulletsOffset
= (((swiper
.pagination
.bulletSize
* dynamicBulletsLength
) - (swiper
.pagination
.bulletSize
)) / 2) - (midIndex
* swiper
.pagination
.bulletSize
);
31690 var offsetProp
= rtl
? 'right' : 'left';
31691 bullets
.css(swiper
.isHorizontal() ? offsetProp
: 'top', (bulletsOffset
+ "px"));
31694 if (params
.type
=== 'fraction') {
31695 $el
.find(("." + (params
.currentClass
))).text(params
.formatFractionCurrent(current
+ 1));
31696 $el
.find(("." + (params
.totalClass
))).text(params
.formatFractionTotal(total
));
31698 if (params
.type
=== 'progressbar') {
31699 var progressbarDirection
;
31700 if (params
.progressbarOpposite
) {
31701 progressbarDirection
= swiper
.isHorizontal() ? 'vertical' : 'horizontal';
31703 progressbarDirection
= swiper
.isHorizontal() ? 'horizontal' : 'vertical';
31705 var scale
= (current
+ 1) / total
;
31708 if (progressbarDirection
=== 'horizontal') {
31713 $el
.find(("." + (params
.progressbarFillClass
))).transform(("translate3d(0,0,0) scaleX(" + scaleX
+ ") scaleY(" + scaleY
+ ")")).transition(swiper
.params
.speed
);
31715 if (params
.type
=== 'custom' && params
.renderCustom
) {
31716 $el
.html(params
.renderCustom(swiper
, current
+ 1, total
));
31717 swiper
.emit('paginationRender', swiper
, $el
[0]);
31719 swiper
.emit('paginationUpdate', swiper
, $el
[0]);
31721 $el
[swiper
.params
.watchOverflow
&& swiper
.isLocked
? 'addClass' : 'removeClass'](params
.lockClass
);
31723 render
: function render() {
31724 // Render Container
31726 var params
= swiper
.params
.pagination
;
31727 if (!params
.el
|| !swiper
.pagination
.el
|| !swiper
.pagination
.$el
|| swiper
.pagination
.$el
.length
=== 0) { return; }
31728 var slidesLength
= swiper
.virtual
&& swiper
.params
.virtual
.enabled
? swiper
.virtual
.slides
.length
: swiper
.slides
.length
;
31730 var $el
= swiper
.pagination
.$el
;
31731 var paginationHTML
= '';
31732 if (params
.type
=== 'bullets') {
31733 var numberOfBullets
= swiper
.params
.loop
? Math
.ceil((slidesLength
- (swiper
.loopedSlides
* 2)) / swiper
.params
.slidesPerGroup
) : swiper
.snapGrid
.length
;
31734 for (var i
= 0; i
< numberOfBullets
; i
+= 1) {
31735 if (params
.renderBullet
) {
31736 paginationHTML
+= params
.renderBullet
.call(swiper
, i
, params
.bulletClass
);
31738 paginationHTML
+= "<" + (params
.bulletElement
) + " class=\"" + (params
.bulletClass
) + "\"></" + (params
.bulletElement
) + ">";
31741 $el
.html(paginationHTML
);
31742 swiper
.pagination
.bullets
= $el
.find(("." + (params
.bulletClass
)));
31744 if (params
.type
=== 'fraction') {
31745 if (params
.renderFraction
) {
31746 paginationHTML
= params
.renderFraction
.call(swiper
, params
.currentClass
, params
.totalClass
);
31748 paginationHTML
= "<span class=\"" + (params
.currentClass
) + "\"></span>"
31750 + "<span class=\"" + (params
.totalClass
) + "\"></span>";
31752 $el
.html(paginationHTML
);
31754 if (params
.type
=== 'progressbar') {
31755 if (params
.renderProgressbar
) {
31756 paginationHTML
= params
.renderProgressbar
.call(swiper
, params
.progressbarFillClass
);
31758 paginationHTML
= "<span class=\"" + (params
.progressbarFillClass
) + "\"></span>";
31760 $el
.html(paginationHTML
);
31762 if (params
.type
!== 'custom') {
31763 swiper
.emit('paginationRender', swiper
.pagination
.$el
[0]);
31766 init
: function init() {
31768 var params
= swiper
.params
.pagination
;
31769 if (!params
.el
) { return; }
31771 var $el
= $(params
.el
);
31772 if ($el
.length
=== 0) { return; }
31775 swiper
.params
.uniqueNavElements
31776 && typeof params
.el
=== 'string'
31778 && swiper
.$el
.find(params
.el
).length
=== 1
31780 $el
= swiper
.$el
.find(params
.el
);
31783 if (params
.type
=== 'bullets' && params
.clickable
) {
31784 $el
.addClass(params
.clickableClass
);
31787 $el
.addClass(params
.modifierClass
+ params
.type
);
31789 if (params
.type
=== 'bullets' && params
.dynamicBullets
) {
31790 $el
.addClass(("" + (params
.modifierClass
) + (params
.type
) + "-dynamic"));
31791 swiper
.pagination
.dynamicBulletIndex
= 0;
31792 if (params
.dynamicMainBullets
< 1) {
31793 params
.dynamicMainBullets
= 1;
31796 if (params
.type
=== 'progressbar' && params
.progressbarOpposite
) {
31797 $el
.addClass(params
.progressbarOppositeClass
);
31800 if (params
.clickable
) {
31801 $el
.on('click', ("." + (params
.bulletClass
)), function onClick(e
) {
31802 e
.preventDefault();
31803 var index
= $(this).index() * swiper
.params
.slidesPerGroup
;
31804 if (swiper
.params
.loop
) { index
+= swiper
.loopedSlides
; }
31805 swiper
.slideTo(index
);
31809 Utils
.extend(swiper
.pagination
, {
31814 destroy
: function destroy() {
31816 var params
= swiper
.params
.pagination
;
31817 if (!params
.el
|| !swiper
.pagination
.el
|| !swiper
.pagination
.$el
|| swiper
.pagination
.$el
.length
=== 0) { return; }
31818 var $el
= swiper
.pagination
.$el
;
31820 $el
.removeClass(params
.hiddenClass
);
31821 $el
.removeClass(params
.modifierClass
+ params
.type
);
31822 if (swiper
.pagination
.bullets
) { swiper
.pagination
.bullets
.removeClass(params
.bulletActiveClass
); }
31823 if (params
.clickable
) {
31824 $el
.off('click', ("." + (params
.bulletClass
)));
31829 var Pagination
$1 = {
31830 name
: 'pagination',
31834 bulletElement
: 'span',
31836 hideOnClick
: false,
31837 renderBullet
: null,
31838 renderProgressbar
: null,
31839 renderFraction
: null,
31840 renderCustom
: null,
31841 progressbarOpposite
: false,
31842 type
: 'bullets', // 'bullets' or 'progressbar' or 'fraction' or 'custom'
31843 dynamicBullets
: false,
31844 dynamicMainBullets
: 1,
31845 formatFractionCurrent: function (number
) { return number
; },
31846 formatFractionTotal: function (number
) { return number
; },
31847 bulletClass
: 'swiper-pagination-bullet',
31848 bulletActiveClass
: 'swiper-pagination-bullet-active',
31849 modifierClass
: 'swiper-pagination-', // NEW
31850 currentClass
: 'swiper-pagination-current',
31851 totalClass
: 'swiper-pagination-total',
31852 hiddenClass
: 'swiper-pagination-hidden',
31853 progressbarFillClass
: 'swiper-pagination-progressbar-fill',
31854 progressbarOppositeClass
: 'swiper-pagination-progressbar-opposite',
31855 clickableClass
: 'swiper-pagination-clickable', // NEW
31856 lockClass
: 'swiper-pagination-lock',
31859 create
: function create() {
31861 Utils
.extend(swiper
, {
31863 init
: Pagination
.init
.bind(swiper
),
31864 render
: Pagination
.render
.bind(swiper
),
31865 update
: Pagination
.update
.bind(swiper
),
31866 destroy
: Pagination
.destroy
.bind(swiper
),
31867 dynamicBulletIndex
: 0,
31872 init
: function init() {
31874 swiper
.pagination
.init();
31875 swiper
.pagination
.render();
31876 swiper
.pagination
.update();
31878 activeIndexChange
: function activeIndexChange() {
31880 if (swiper
.params
.loop
) {
31881 swiper
.pagination
.update();
31882 } else if (typeof swiper
.snapIndex
=== 'undefined') {
31883 swiper
.pagination
.update();
31886 snapIndexChange
: function snapIndexChange() {
31888 if (!swiper
.params
.loop
) {
31889 swiper
.pagination
.update();
31892 slidesLengthChange
: function slidesLengthChange() {
31894 if (swiper
.params
.loop
) {
31895 swiper
.pagination
.render();
31896 swiper
.pagination
.update();
31899 snapGridLengthChange
: function snapGridLengthChange() {
31901 if (!swiper
.params
.loop
) {
31902 swiper
.pagination
.render();
31903 swiper
.pagination
.update();
31906 destroy
: function destroy() {
31908 swiper
.pagination
.destroy();
31910 click
: function click(e
) {
31913 swiper
.params
.pagination
.el
31914 && swiper
.params
.pagination
.hideOnClick
31915 && swiper
.pagination
.$el
.length
> 0
31916 && !$(e
.target
).hasClass(swiper
.params
.pagination
.bulletClass
)
31918 var isHidden
= swiper
.pagination
.$el
.hasClass(swiper
.params
.pagination
.hiddenClass
);
31919 if (isHidden
=== true) {
31920 swiper
.emit('paginationShow', swiper
);
31922 swiper
.emit('paginationHide', swiper
);
31924 swiper
.pagination
.$el
.toggleClass(swiper
.params
.pagination
.hiddenClass
);
31931 setTranslate
: function setTranslate() {
31933 if (!swiper
.params
.scrollbar
.el
|| !swiper
.scrollbar
.el
) { return; }
31934 var scrollbar
= swiper
.scrollbar
;
31935 var rtl
= swiper
.rtlTranslate
;
31936 var progress
= swiper
.progress
;
31937 var dragSize
= scrollbar
.dragSize
;
31938 var trackSize
= scrollbar
.trackSize
;
31939 var $dragEl
= scrollbar
.$dragEl
;
31940 var $el
= scrollbar
.$el
;
31941 var params
= swiper
.params
.scrollbar
;
31943 var newSize
= dragSize
;
31944 var newPos
= (trackSize
- dragSize
) * progress
;
31948 newSize
= dragSize
- newPos
;
31950 } else if (-newPos
+ dragSize
> trackSize
) {
31951 newSize
= trackSize
+ newPos
;
31953 } else if (newPos
< 0) {
31954 newSize
= dragSize
+ newPos
;
31956 } else if (newPos
+ dragSize
> trackSize
) {
31957 newSize
= trackSize
- newPos
;
31959 if (swiper
.isHorizontal()) {
31960 if (Support
.transforms3d
) {
31961 $dragEl
.transform(("translate3d(" + newPos
+ "px, 0, 0)"));
31963 $dragEl
.transform(("translateX(" + newPos
+ "px)"));
31965 $dragEl
[0].style
.width
= newSize
+ "px";
31967 if (Support
.transforms3d
) {
31968 $dragEl
.transform(("translate3d(0px, " + newPos
+ "px, 0)"));
31970 $dragEl
.transform(("translateY(" + newPos
+ "px)"));
31972 $dragEl
[0].style
.height
= newSize
+ "px";
31975 clearTimeout(swiper
.scrollbar
.timeout
);
31976 $el
[0].style
.opacity
= 1;
31977 swiper
.scrollbar
.timeout
= setTimeout(function () {
31978 $el
[0].style
.opacity
= 0;
31979 $el
.transition(400);
31983 setTransition
: function setTransition(duration
) {
31985 if (!swiper
.params
.scrollbar
.el
|| !swiper
.scrollbar
.el
) { return; }
31986 swiper
.scrollbar
.$dragEl
.transition(duration
);
31988 updateSize
: function updateSize() {
31990 if (!swiper
.params
.scrollbar
.el
|| !swiper
.scrollbar
.el
) { return; }
31992 var scrollbar
= swiper
.scrollbar
;
31993 var $dragEl
= scrollbar
.$dragEl
;
31994 var $el
= scrollbar
.$el
;
31996 $dragEl
[0].style
.width
= '';
31997 $dragEl
[0].style
.height
= '';
31998 var trackSize
= swiper
.isHorizontal() ? $el
[0].offsetWidth
: $el
[0].offsetHeight
;
32000 var divider
= swiper
.size
/ swiper
.virtualSize
;
32001 var moveDivider
= divider
* (trackSize
/ swiper
.size
);
32003 if (swiper
.params
.scrollbar
.dragSize
=== 'auto') {
32004 dragSize
= trackSize
* divider
;
32006 dragSize
= parseInt(swiper
.params
.scrollbar
.dragSize
, 10);
32009 if (swiper
.isHorizontal()) {
32010 $dragEl
[0].style
.width
= dragSize
+ "px";
32012 $dragEl
[0].style
.height
= dragSize
+ "px";
32015 if (divider
>= 1) {
32016 $el
[0].style
.display
= 'none';
32018 $el
[0].style
.display
= '';
32020 if (swiper
.params
.scrollbar
.hide
) {
32021 $el
[0].style
.opacity
= 0;
32023 Utils
.extend(scrollbar
, {
32024 trackSize
: trackSize
,
32026 moveDivider
: moveDivider
,
32027 dragSize
: dragSize
,
32029 scrollbar
.$el
[swiper
.params
.watchOverflow
&& swiper
.isLocked
? 'addClass' : 'removeClass'](swiper
.params
.scrollbar
.lockClass
);
32031 setDragPosition
: function setDragPosition(e
) {
32033 var scrollbar
= swiper
.scrollbar
;
32034 var rtl
= swiper
.rtlTranslate
;
32035 var $el
= scrollbar
.$el
;
32036 var dragSize
= scrollbar
.dragSize
;
32037 var trackSize
= scrollbar
.trackSize
;
32039 var pointerPosition
;
32040 if (swiper
.isHorizontal()) {
32041 pointerPosition
= ((e
.type
=== 'touchstart' || e
.type
=== 'touchmove') ? e
.targetTouches
[0].pageX
: e
.pageX
|| e
.clientX
);
32043 pointerPosition
= ((e
.type
=== 'touchstart' || e
.type
=== 'touchmove') ? e
.targetTouches
[0].pageY
: e
.pageY
|| e
.clientY
);
32046 positionRatio
= ((pointerPosition
) - $el
.offset()[swiper
.isHorizontal() ? 'left' : 'top'] - (dragSize
/ 2)) / (trackSize
- dragSize
);
32047 positionRatio
= Math
.max(Math
.min(positionRatio
, 1), 0);
32049 positionRatio
= 1 - positionRatio
;
32052 var position
= swiper
.minTranslate() + ((swiper
.maxTranslate() - swiper
.minTranslate()) * positionRatio
);
32054 swiper
.updateProgress(position
);
32055 swiper
.setTranslate(position
);
32056 swiper
.updateActiveIndex();
32057 swiper
.updateSlidesClasses();
32059 onDragStart
: function onDragStart(e
) {
32061 var params
= swiper
.params
.scrollbar
;
32062 var scrollbar
= swiper
.scrollbar
;
32063 var $wrapperEl
= swiper
.$wrapperEl
;
32064 var $el
= scrollbar
.$el
;
32065 var $dragEl
= scrollbar
.$dragEl
;
32066 swiper
.scrollbar
.isTouched
= true;
32067 e
.preventDefault();
32068 e
.stopPropagation();
32070 $wrapperEl
.transition(100);
32071 $dragEl
.transition(100);
32072 scrollbar
.setDragPosition(e
);
32074 clearTimeout(swiper
.scrollbar
.dragTimeout
);
32078 $el
.css('opacity', 1);
32080 swiper
.emit('scrollbarDragStart', e
);
32082 onDragMove
: function onDragMove(e
) {
32084 var scrollbar
= swiper
.scrollbar
;
32085 var $wrapperEl
= swiper
.$wrapperEl
;
32086 var $el
= scrollbar
.$el
;
32087 var $dragEl
= scrollbar
.$dragEl
;
32089 if (!swiper
.scrollbar
.isTouched
) { return; }
32090 if (e
.preventDefault
) { e
.preventDefault(); }
32091 else { e
.returnValue
= false; }
32092 scrollbar
.setDragPosition(e
);
32093 $wrapperEl
.transition(0);
32095 $dragEl
.transition(0);
32096 swiper
.emit('scrollbarDragMove', e
);
32098 onDragEnd
: function onDragEnd(e
) {
32101 var params
= swiper
.params
.scrollbar
;
32102 var scrollbar
= swiper
.scrollbar
;
32103 var $el
= scrollbar
.$el
;
32105 if (!swiper
.scrollbar
.isTouched
) { return; }
32106 swiper
.scrollbar
.isTouched
= false;
32108 clearTimeout(swiper
.scrollbar
.dragTimeout
);
32109 swiper
.scrollbar
.dragTimeout
= Utils
.nextTick(function () {
32110 $el
.css('opacity', 0);
32111 $el
.transition(400);
32114 swiper
.emit('scrollbarDragEnd', e
);
32115 if (params
.snapOnRelease
) {
32116 swiper
.slideToClosest();
32119 enableDraggable
: function enableDraggable() {
32121 if (!swiper
.params
.scrollbar
.el
) { return; }
32122 var scrollbar
= swiper
.scrollbar
;
32123 var touchEventsTouch
= swiper
.touchEventsTouch
;
32124 var touchEventsDesktop
= swiper
.touchEventsDesktop
;
32125 var params
= swiper
.params
;
32126 var $el
= scrollbar
.$el
;
32127 var target
= $el
[0];
32128 var activeListener
= Support
.passiveListener
&& params
.passiveListeners
? { passive
: false, capture
: false } : false;
32129 var passiveListener
= Support
.passiveListener
&& params
.passiveListeners
? { passive
: true, capture
: false } : false;
32130 if (!Support
.touch
) {
32131 target
.addEventListener(touchEventsDesktop
.start
, swiper
.scrollbar
.onDragStart
, activeListener
);
32132 doc
.addEventListener(touchEventsDesktop
.move, swiper
.scrollbar
.onDragMove
, activeListener
);
32133 doc
.addEventListener(touchEventsDesktop
.end
, swiper
.scrollbar
.onDragEnd
, passiveListener
);
32135 target
.addEventListener(touchEventsTouch
.start
, swiper
.scrollbar
.onDragStart
, activeListener
);
32136 target
.addEventListener(touchEventsTouch
.move, swiper
.scrollbar
.onDragMove
, activeListener
);
32137 target
.addEventListener(touchEventsTouch
.end
, swiper
.scrollbar
.onDragEnd
, passiveListener
);
32140 disableDraggable
: function disableDraggable() {
32142 if (!swiper
.params
.scrollbar
.el
) { return; }
32143 var scrollbar
= swiper
.scrollbar
;
32144 var touchEventsTouch
= swiper
.touchEventsTouch
;
32145 var touchEventsDesktop
= swiper
.touchEventsDesktop
;
32146 var params
= swiper
.params
;
32147 var $el
= scrollbar
.$el
;
32148 var target
= $el
[0];
32149 var activeListener
= Support
.passiveListener
&& params
.passiveListeners
? { passive
: false, capture
: false } : false;
32150 var passiveListener
= Support
.passiveListener
&& params
.passiveListeners
? { passive
: true, capture
: false } : false;
32151 if (!Support
.touch
) {
32152 target
.removeEventListener(touchEventsDesktop
.start
, swiper
.scrollbar
.onDragStart
, activeListener
);
32153 doc
.removeEventListener(touchEventsDesktop
.move, swiper
.scrollbar
.onDragMove
, activeListener
);
32154 doc
.removeEventListener(touchEventsDesktop
.end
, swiper
.scrollbar
.onDragEnd
, passiveListener
);
32156 target
.removeEventListener(touchEventsTouch
.start
, swiper
.scrollbar
.onDragStart
, activeListener
);
32157 target
.removeEventListener(touchEventsTouch
.move, swiper
.scrollbar
.onDragMove
, activeListener
);
32158 target
.removeEventListener(touchEventsTouch
.end
, swiper
.scrollbar
.onDragEnd
, passiveListener
);
32161 init
: function init() {
32163 if (!swiper
.params
.scrollbar
.el
) { return; }
32164 var scrollbar
= swiper
.scrollbar
;
32165 var $swiperEl
= swiper
.$el
;
32166 var params
= swiper
.params
.scrollbar
;
32168 var $el
= $(params
.el
);
32169 if (swiper
.params
.uniqueNavElements
&& typeof params
.el
=== 'string' && $el
.length
> 1 && $swiperEl
.find(params
.el
).length
=== 1) {
32170 $el
= $swiperEl
.find(params
.el
);
32173 var $dragEl
= $el
.find(("." + (swiper
.params
.scrollbar
.dragClass
)));
32174 if ($dragEl
.length
=== 0) {
32175 $dragEl
= $(("<div class=\"" + (swiper
.params
.scrollbar
.dragClass
) + "\"></div>"));
32176 $el
.append($dragEl
);
32179 Utils
.extend(scrollbar
, {
32183 dragEl
: $dragEl
[0],
32186 if (params
.draggable
) {
32187 scrollbar
.enableDraggable();
32190 destroy
: function destroy() {
32192 swiper
.scrollbar
.disableDraggable();
32196 var Scrollbar
$1 = {
32204 snapOnRelease
: true,
32205 lockClass
: 'swiper-scrollbar-lock',
32206 dragClass
: 'swiper-scrollbar-drag',
32209 create
: function create() {
32211 Utils
.extend(swiper
, {
32213 init
: Scrollbar
.init
.bind(swiper
),
32214 destroy
: Scrollbar
.destroy
.bind(swiper
),
32215 updateSize
: Scrollbar
.updateSize
.bind(swiper
),
32216 setTranslate
: Scrollbar
.setTranslate
.bind(swiper
),
32217 setTransition
: Scrollbar
.setTransition
.bind(swiper
),
32218 enableDraggable
: Scrollbar
.enableDraggable
.bind(swiper
),
32219 disableDraggable
: Scrollbar
.disableDraggable
.bind(swiper
),
32220 setDragPosition
: Scrollbar
.setDragPosition
.bind(swiper
),
32221 onDragStart
: Scrollbar
.onDragStart
.bind(swiper
),
32222 onDragMove
: Scrollbar
.onDragMove
.bind(swiper
),
32223 onDragEnd
: Scrollbar
.onDragEnd
.bind(swiper
),
32231 init
: function init() {
32233 swiper
.scrollbar
.init();
32234 swiper
.scrollbar
.updateSize();
32235 swiper
.scrollbar
.setTranslate();
32237 update
: function update() {
32239 swiper
.scrollbar
.updateSize();
32241 resize
: function resize() {
32243 swiper
.scrollbar
.updateSize();
32245 observerUpdate
: function observerUpdate() {
32247 swiper
.scrollbar
.updateSize();
32249 setTranslate
: function setTranslate() {
32251 swiper
.scrollbar
.setTranslate();
32253 setTransition
: function setTransition(duration
) {
32255 swiper
.scrollbar
.setTransition(duration
);
32257 destroy
: function destroy() {
32259 swiper
.scrollbar
.destroy();
32265 setTransform
: function setTransform(el
, progress
) {
32267 var rtl
= swiper
.rtl
;
32270 var rtlFactor
= rtl
? -1 : 1;
32272 var p
= $el
.attr('data-swiper-parallax') || '0';
32273 var x
= $el
.attr('data-swiper-parallax-x');
32274 var y
= $el
.attr('data-swiper-parallax-y');
32275 var scale
= $el
.attr('data-swiper-parallax-scale');
32276 var opacity
= $el
.attr('data-swiper-parallax-opacity');
32281 } else if (swiper
.isHorizontal()) {
32289 if ((x
).indexOf('%') >= 0) {
32290 x
= (parseInt(x
, 10) * progress
* rtlFactor
) + "%";
32292 x
= (x
* progress
* rtlFactor
) + "px";
32294 if ((y
).indexOf('%') >= 0) {
32295 y
= (parseInt(y
, 10) * progress
) + "%";
32297 y
= (y
* progress
) + "px";
32300 if (typeof opacity
!== 'undefined' && opacity
!== null) {
32301 var currentOpacity
= opacity
- ((opacity
- 1) * (1 - Math
.abs(progress
)));
32302 $el
[0].style
.opacity
= currentOpacity
;
32304 if (typeof scale
=== 'undefined' || scale
=== null) {
32305 $el
.transform(("translate3d(" + x
+ ", " + y
+ ", 0px)"));
32307 var currentScale
= scale
- ((scale
- 1) * (1 - Math
.abs(progress
)));
32308 $el
.transform(("translate3d(" + x
+ ", " + y
+ ", 0px) scale(" + currentScale
+ ")"));
32311 setTranslate
: function setTranslate() {
32313 var $el
= swiper
.$el
;
32314 var slides
= swiper
.slides
;
32315 var progress
= swiper
.progress
;
32316 var snapGrid
= swiper
.snapGrid
;
32317 $el
.children('[data-swiper-parallax], [data-swiper-parallax-x], [data-swiper-parallax-y]')
32318 .each(function (index
, el
) {
32319 swiper
.parallax
.setTransform(el
, progress
);
32321 slides
.each(function (slideIndex
, slideEl
) {
32322 var slideProgress
= slideEl
.progress
;
32323 if (swiper
.params
.slidesPerGroup
> 1 && swiper
.params
.slidesPerView
!== 'auto') {
32324 slideProgress
+= Math
.ceil(slideIndex
/ 2) - (progress
* (snapGrid
.length
- 1));
32326 slideProgress
= Math
.min(Math
.max(slideProgress
, -1), 1);
32327 $(slideEl
).find('[data-swiper-parallax], [data-swiper-parallax-x], [data-swiper-parallax-y]')
32328 .each(function (index
, el
) {
32329 swiper
.parallax
.setTransform(el
, slideProgress
);
32333 setTransition
: function setTransition(duration
) {
32334 if ( duration
=== void 0 ) duration
= this.params
.speed
;
32337 var $el
= swiper
.$el
;
32338 $el
.find('[data-swiper-parallax], [data-swiper-parallax-x], [data-swiper-parallax-y]')
32339 .each(function (index
, parallaxEl
) {
32340 var $parallaxEl
= $(parallaxEl
);
32341 var parallaxDuration
= parseInt($parallaxEl
.attr('data-swiper-parallax-duration'), 10) || duration
;
32342 if (duration
=== 0) { parallaxDuration
= 0; }
32343 $parallaxEl
.transition(parallaxDuration
);
32355 create
: function create() {
32357 Utils
.extend(swiper
, {
32359 setTransform
: Parallax
.setTransform
.bind(swiper
),
32360 setTranslate
: Parallax
.setTranslate
.bind(swiper
),
32361 setTransition
: Parallax
.setTransition
.bind(swiper
),
32366 beforeInit
: function beforeInit() {
32368 if (!swiper
.params
.parallax
.enabled
) { return; }
32369 swiper
.params
.watchSlidesProgress
= true;
32370 swiper
.originalParams
.watchSlidesProgress
= true;
32372 init
: function init() {
32374 if (!swiper
.params
.parallax
.enabled
) { return; }
32375 swiper
.parallax
.setTranslate();
32377 setTranslate
: function setTranslate() {
32379 if (!swiper
.params
.parallax
.enabled
) { return; }
32380 swiper
.parallax
.setTranslate();
32382 setTransition
: function setTransition(duration
) {
32384 if (!swiper
.params
.parallax
.enabled
) { return; }
32385 swiper
.parallax
.setTransition(duration
);
32391 // Calc Scale From Multi-touches
32392 getDistanceBetweenTouches
: function getDistanceBetweenTouches(e
) {
32393 if (e
.targetTouches
.length
< 2) { return 1; }
32394 var x1
= e
.targetTouches
[0].pageX
;
32395 var y1
= e
.targetTouches
[0].pageY
;
32396 var x2
= e
.targetTouches
[1].pageX
;
32397 var y2
= e
.targetTouches
[1].pageY
;
32398 var distance
= Math
.sqrt((Math
.pow( (x2
- x1
), 2 )) + (Math
.pow( (y2
- y1
), 2 )));
32402 onGestureStart
: function onGestureStart(e
) {
32404 var params
= swiper
.params
.zoom
;
32405 var zoom
= swiper
.zoom
;
32406 var gesture
= zoom
.gesture
;
32407 zoom
.fakeGestureTouched
= false;
32408 zoom
.fakeGestureMoved
= false;
32409 if (!Support
.gestures
) {
32410 if (e
.type
!== 'touchstart' || (e
.type
=== 'touchstart' && e
.targetTouches
.length
< 2)) {
32413 zoom
.fakeGestureTouched
= true;
32414 gesture
.scaleStart
= Zoom
.getDistanceBetweenTouches(e
);
32416 if (!gesture
.$slideEl
|| !gesture
.$slideEl
.length
) {
32417 gesture
.$slideEl
= $(e
.target
).closest('.swiper-slide');
32418 if (gesture
.$slideEl
.length
=== 0) { gesture
.$slideEl
= swiper
.slides
.eq(swiper
.activeIndex
); }
32419 gesture
.$imageEl
= gesture
.$slideEl
.find('img, svg, canvas');
32420 gesture
.$imageWrapEl
= gesture
.$imageEl
.parent(("." + (params
.containerClass
)));
32421 gesture
.maxRatio
= gesture
.$imageWrapEl
.attr('data-swiper-zoom') || params
.maxRatio
;
32422 if (gesture
.$imageWrapEl
.length
=== 0) {
32423 gesture
.$imageEl
= undefined;
32427 gesture
.$imageEl
.transition(0);
32428 swiper
.zoom
.isScaling
= true;
32430 onGestureChange
: function onGestureChange(e
) {
32432 var params
= swiper
.params
.zoom
;
32433 var zoom
= swiper
.zoom
;
32434 var gesture
= zoom
.gesture
;
32435 if (!Support
.gestures
) {
32436 if (e
.type
!== 'touchmove' || (e
.type
=== 'touchmove' && e
.targetTouches
.length
< 2)) {
32439 zoom
.fakeGestureMoved
= true;
32440 gesture
.scaleMove
= Zoom
.getDistanceBetweenTouches(e
);
32442 if (!gesture
.$imageEl
|| gesture
.$imageEl
.length
=== 0) { return; }
32443 if (Support
.gestures
) {
32444 zoom
.scale
= e
.scale
* zoom
.currentScale
;
32446 zoom
.scale
= (gesture
.scaleMove
/ gesture
.scaleStart
) * zoom
.currentScale
;
32448 if (zoom
.scale
> gesture
.maxRatio
) {
32449 zoom
.scale
= (gesture
.maxRatio
- 1) + (Math
.pow( ((zoom
.scale
- gesture
.maxRatio
) + 1), 0.5 ));
32451 if (zoom
.scale
< params
.minRatio
) {
32452 zoom
.scale
= (params
.minRatio
+ 1) - (Math
.pow( ((params
.minRatio
- zoom
.scale
) + 1), 0.5 ));
32454 gesture
.$imageEl
.transform(("translate3d(0,0,0) scale(" + (zoom
.scale
) + ")"));
32456 onGestureEnd
: function onGestureEnd(e
) {
32458 var params
= swiper
.params
.zoom
;
32459 var zoom
= swiper
.zoom
;
32460 var gesture
= zoom
.gesture
;
32461 if (!Support
.gestures
) {
32462 if (!zoom
.fakeGestureTouched
|| !zoom
.fakeGestureMoved
) {
32465 if (e
.type
!== 'touchend' || (e
.type
=== 'touchend' && e
.changedTouches
.length
< 2 && !Device
.android
)) {
32468 zoom
.fakeGestureTouched
= false;
32469 zoom
.fakeGestureMoved
= false;
32471 if (!gesture
.$imageEl
|| gesture
.$imageEl
.length
=== 0) { return; }
32472 zoom
.scale
= Math
.max(Math
.min(zoom
.scale
, gesture
.maxRatio
), params
.minRatio
);
32473 gesture
.$imageEl
.transition(swiper
.params
.speed
).transform(("translate3d(0,0,0) scale(" + (zoom
.scale
) + ")"));
32474 zoom
.currentScale
= zoom
.scale
;
32475 zoom
.isScaling
= false;
32476 if (zoom
.scale
=== 1) { gesture
.$slideEl
= undefined; }
32478 onTouchStart
: function onTouchStart(e
) {
32480 var zoom
= swiper
.zoom
;
32481 var gesture
= zoom
.gesture
;
32482 var image
= zoom
.image
;
32483 if (!gesture
.$imageEl
|| gesture
.$imageEl
.length
=== 0) { return; }
32484 if (image
.isTouched
) { return; }
32485 if (Device
.android
) { e
.preventDefault(); }
32486 image
.isTouched
= true;
32487 image
.touchesStart
.x
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageX
: e
.pageX
;
32488 image
.touchesStart
.y
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageY
: e
.pageY
;
32490 onTouchMove
: function onTouchMove(e
) {
32492 var zoom
= swiper
.zoom
;
32493 var gesture
= zoom
.gesture
;
32494 var image
= zoom
.image
;
32495 var velocity
= zoom
.velocity
;
32496 if (!gesture
.$imageEl
|| gesture
.$imageEl
.length
=== 0) { return; }
32497 swiper
.allowClick
= false;
32498 if (!image
.isTouched
|| !gesture
.$slideEl
) { return; }
32500 if (!image
.isMoved
) {
32501 image
.width
= gesture
.$imageEl
[0].offsetWidth
;
32502 image
.height
= gesture
.$imageEl
[0].offsetHeight
;
32503 image
.startX
= Utils
.getTranslate(gesture
.$imageWrapEl
[0], 'x') || 0;
32504 image
.startY
= Utils
.getTranslate(gesture
.$imageWrapEl
[0], 'y') || 0;
32505 gesture
.slideWidth
= gesture
.$slideEl
[0].offsetWidth
;
32506 gesture
.slideHeight
= gesture
.$slideEl
[0].offsetHeight
;
32507 gesture
.$imageWrapEl
.transition(0);
32509 image
.startX
= -image
.startX
;
32510 image
.startY
= -image
.startY
;
32513 // Define if we need image drag
32514 var scaledWidth
= image
.width
* zoom
.scale
;
32515 var scaledHeight
= image
.height
* zoom
.scale
;
32517 if (scaledWidth
< gesture
.slideWidth
&& scaledHeight
< gesture
.slideHeight
) { return; }
32519 image
.minX
= Math
.min(((gesture
.slideWidth
/ 2) - (scaledWidth
/ 2)), 0);
32520 image
.maxX
= -image
.minX
;
32521 image
.minY
= Math
.min(((gesture
.slideHeight
/ 2) - (scaledHeight
/ 2)), 0);
32522 image
.maxY
= -image
.minY
;
32524 image
.touchesCurrent
.x
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageX
: e
.pageX
;
32525 image
.touchesCurrent
.y
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageY
: e
.pageY
;
32527 if (!image
.isMoved
&& !zoom
.isScaling
) {
32529 swiper
.isHorizontal()
32531 (Math
.floor(image
.minX
) === Math
.floor(image
.startX
) && image
.touchesCurrent
.x
< image
.touchesStart
.x
)
32532 || (Math
.floor(image
.maxX
) === Math
.floor(image
.startX
) && image
.touchesCurrent
.x
> image
.touchesStart
.x
)
32535 image
.isTouched
= false;
32538 !swiper
.isHorizontal()
32540 (Math
.floor(image
.minY
) === Math
.floor(image
.startY
) && image
.touchesCurrent
.y
< image
.touchesStart
.y
)
32541 || (Math
.floor(image
.maxY
) === Math
.floor(image
.startY
) && image
.touchesCurrent
.y
> image
.touchesStart
.y
)
32544 image
.isTouched
= false;
32548 e
.preventDefault();
32549 e
.stopPropagation();
32551 image
.isMoved
= true;
32552 image
.currentX
= (image
.touchesCurrent
.x
- image
.touchesStart
.x
) + image
.startX
;
32553 image
.currentY
= (image
.touchesCurrent
.y
- image
.touchesStart
.y
) + image
.startY
;
32555 if (image
.currentX
< image
.minX
) {
32556 image
.currentX
= (image
.minX
+ 1) - (Math
.pow( ((image
.minX
- image
.currentX
) + 1), 0.8 ));
32558 if (image
.currentX
> image
.maxX
) {
32559 image
.currentX
= (image
.maxX
- 1) + (Math
.pow( ((image
.currentX
- image
.maxX
) + 1), 0.8 ));
32562 if (image
.currentY
< image
.minY
) {
32563 image
.currentY
= (image
.minY
+ 1) - (Math
.pow( ((image
.minY
- image
.currentY
) + 1), 0.8 ));
32565 if (image
.currentY
> image
.maxY
) {
32566 image
.currentY
= (image
.maxY
- 1) + (Math
.pow( ((image
.currentY
- image
.maxY
) + 1), 0.8 ));
32570 if (!velocity
.prevPositionX
) { velocity
.prevPositionX
= image
.touchesCurrent
.x
; }
32571 if (!velocity
.prevPositionY
) { velocity
.prevPositionY
= image
.touchesCurrent
.y
; }
32572 if (!velocity
.prevTime
) { velocity
.prevTime
= Date
.now(); }
32573 velocity
.x
= (image
.touchesCurrent
.x
- velocity
.prevPositionX
) / (Date
.now() - velocity
.prevTime
) / 2;
32574 velocity
.y
= (image
.touchesCurrent
.y
- velocity
.prevPositionY
) / (Date
.now() - velocity
.prevTime
) / 2;
32575 if (Math
.abs(image
.touchesCurrent
.x
- velocity
.prevPositionX
) < 2) { velocity
.x
= 0; }
32576 if (Math
.abs(image
.touchesCurrent
.y
- velocity
.prevPositionY
) < 2) { velocity
.y
= 0; }
32577 velocity
.prevPositionX
= image
.touchesCurrent
.x
;
32578 velocity
.prevPositionY
= image
.touchesCurrent
.y
;
32579 velocity
.prevTime
= Date
.now();
32581 gesture
.$imageWrapEl
.transform(("translate3d(" + (image
.currentX
) + "px, " + (image
.currentY
) + "px,0)"));
32583 onTouchEnd
: function onTouchEnd() {
32585 var zoom
= swiper
.zoom
;
32586 var gesture
= zoom
.gesture
;
32587 var image
= zoom
.image
;
32588 var velocity
= zoom
.velocity
;
32589 if (!gesture
.$imageEl
|| gesture
.$imageEl
.length
=== 0) { return; }
32590 if (!image
.isTouched
|| !image
.isMoved
) {
32591 image
.isTouched
= false;
32592 image
.isMoved
= false;
32595 image
.isTouched
= false;
32596 image
.isMoved
= false;
32597 var momentumDurationX
= 300;
32598 var momentumDurationY
= 300;
32599 var momentumDistanceX
= velocity
.x
* momentumDurationX
;
32600 var newPositionX
= image
.currentX
+ momentumDistanceX
;
32601 var momentumDistanceY
= velocity
.y
* momentumDurationY
;
32602 var newPositionY
= image
.currentY
+ momentumDistanceY
;
32605 if (velocity
.x
!== 0) { momentumDurationX
= Math
.abs((newPositionX
- image
.currentX
) / velocity
.x
); }
32606 if (velocity
.y
!== 0) { momentumDurationY
= Math
.abs((newPositionY
- image
.currentY
) / velocity
.y
); }
32607 var momentumDuration
= Math
.max(momentumDurationX
, momentumDurationY
);
32609 image
.currentX
= newPositionX
;
32610 image
.currentY
= newPositionY
;
32612 // Define if we need image drag
32613 var scaledWidth
= image
.width
* zoom
.scale
;
32614 var scaledHeight
= image
.height
* zoom
.scale
;
32615 image
.minX
= Math
.min(((gesture
.slideWidth
/ 2) - (scaledWidth
/ 2)), 0);
32616 image
.maxX
= -image
.minX
;
32617 image
.minY
= Math
.min(((gesture
.slideHeight
/ 2) - (scaledHeight
/ 2)), 0);
32618 image
.maxY
= -image
.minY
;
32619 image
.currentX
= Math
.max(Math
.min(image
.currentX
, image
.maxX
), image
.minX
);
32620 image
.currentY
= Math
.max(Math
.min(image
.currentY
, image
.maxY
), image
.minY
);
32622 gesture
.$imageWrapEl
.transition(momentumDuration
).transform(("translate3d(" + (image
.currentX
) + "px, " + (image
.currentY
) + "px,0)"));
32624 onTransitionEnd
: function onTransitionEnd() {
32626 var zoom
= swiper
.zoom
;
32627 var gesture
= zoom
.gesture
;
32628 if (gesture
.$slideEl
&& swiper
.previousIndex
!== swiper
.activeIndex
) {
32629 gesture
.$imageEl
.transform('translate3d(0,0,0) scale(1)');
32630 gesture
.$imageWrapEl
.transform('translate3d(0,0,0)');
32633 zoom
.currentScale
= 1;
32635 gesture
.$slideEl
= undefined;
32636 gesture
.$imageEl
= undefined;
32637 gesture
.$imageWrapEl
= undefined;
32641 toggle
: function toggle(e
) {
32643 var zoom
= swiper
.zoom
;
32645 if (zoom
.scale
&& zoom
.scale
!== 1) {
32653 in: function in$1(e
) {
32656 var zoom
= swiper
.zoom
;
32657 var params
= swiper
.params
.zoom
;
32658 var gesture
= zoom
.gesture
;
32659 var image
= zoom
.image
;
32661 if (!gesture
.$slideEl
) {
32662 gesture
.$slideEl
= swiper
.clickedSlide
? $(swiper
.clickedSlide
) : swiper
.slides
.eq(swiper
.activeIndex
);
32663 gesture
.$imageEl
= gesture
.$slideEl
.find('img, svg, canvas');
32664 gesture
.$imageWrapEl
= gesture
.$imageEl
.parent(("." + (params
.containerClass
)));
32666 if (!gesture
.$imageEl
|| gesture
.$imageEl
.length
=== 0) { return; }
32668 gesture
.$slideEl
.addClass(("" + (params
.zoomedSlideClass
)));
32689 if (typeof image
.touchesStart
.x
=== 'undefined' && e
) {
32690 touchX
= e
.type
=== 'touchend' ? e
.changedTouches
[0].pageX
: e
.pageX
;
32691 touchY
= e
.type
=== 'touchend' ? e
.changedTouches
[0].pageY
: e
.pageY
;
32693 touchX
= image
.touchesStart
.x
;
32694 touchY
= image
.touchesStart
.y
;
32697 zoom
.scale
= gesture
.$imageWrapEl
.attr('data-swiper-zoom') || params
.maxRatio
;
32698 zoom
.currentScale
= gesture
.$imageWrapEl
.attr('data-swiper-zoom') || params
.maxRatio
;
32700 slideWidth
= gesture
.$slideEl
[0].offsetWidth
;
32701 slideHeight
= gesture
.$slideEl
[0].offsetHeight
;
32702 offsetX
= gesture
.$slideEl
.offset().left
;
32703 offsetY
= gesture
.$slideEl
.offset().top
;
32704 diffX
= (offsetX
+ (slideWidth
/ 2)) - touchX
;
32705 diffY
= (offsetY
+ (slideHeight
/ 2)) - touchY
;
32707 imageWidth
= gesture
.$imageEl
[0].offsetWidth
;
32708 imageHeight
= gesture
.$imageEl
[0].offsetHeight
;
32709 scaledWidth
= imageWidth
* zoom
.scale
;
32710 scaledHeight
= imageHeight
* zoom
.scale
;
32712 translateMinX
= Math
.min(((slideWidth
/ 2) - (scaledWidth
/ 2)), 0);
32713 translateMinY
= Math
.min(((slideHeight
/ 2) - (scaledHeight
/ 2)), 0);
32714 translateMaxX
= -translateMinX
;
32715 translateMaxY
= -translateMinY
;
32717 translateX
= diffX
* zoom
.scale
;
32718 translateY
= diffY
* zoom
.scale
;
32720 if (translateX
< translateMinX
) {
32721 translateX
= translateMinX
;
32723 if (translateX
> translateMaxX
) {
32724 translateX
= translateMaxX
;
32727 if (translateY
< translateMinY
) {
32728 translateY
= translateMinY
;
32730 if (translateY
> translateMaxY
) {
32731 translateY
= translateMaxY
;
32737 gesture
.$imageWrapEl
.transition(300).transform(("translate3d(" + translateX
+ "px, " + translateY
+ "px,0)"));
32738 gesture
.$imageEl
.transition(300).transform(("translate3d(0,0,0) scale(" + (zoom
.scale
) + ")"));
32740 out
: function out() {
32743 var zoom
= swiper
.zoom
;
32744 var params
= swiper
.params
.zoom
;
32745 var gesture
= zoom
.gesture
;
32747 if (!gesture
.$slideEl
) {
32748 gesture
.$slideEl
= swiper
.clickedSlide
? $(swiper
.clickedSlide
) : swiper
.slides
.eq(swiper
.activeIndex
);
32749 gesture
.$imageEl
= gesture
.$slideEl
.find('img, svg, canvas');
32750 gesture
.$imageWrapEl
= gesture
.$imageEl
.parent(("." + (params
.containerClass
)));
32752 if (!gesture
.$imageEl
|| gesture
.$imageEl
.length
=== 0) { return; }
32755 zoom
.currentScale
= 1;
32756 gesture
.$imageWrapEl
.transition(300).transform('translate3d(0,0,0)');
32757 gesture
.$imageEl
.transition(300).transform('translate3d(0,0,0) scale(1)');
32758 gesture
.$slideEl
.removeClass(("" + (params
.zoomedSlideClass
)));
32759 gesture
.$slideEl
= undefined;
32761 // Attach/Detach Events
32762 enable
: function enable() {
32764 var zoom
= swiper
.zoom
;
32765 if (zoom
.enabled
) { return; }
32766 zoom
.enabled
= true;
32768 var passiveListener
= swiper
.touchEvents
.start
=== 'touchstart' && Support
.passiveListener
&& swiper
.params
.passiveListeners
? { passive
: true, capture
: false } : false;
32771 if (Support
.gestures
) {
32772 swiper
.$wrapperEl
.on('gesturestart', '.swiper-slide', zoom
.onGestureStart
, passiveListener
);
32773 swiper
.$wrapperEl
.on('gesturechange', '.swiper-slide', zoom
.onGestureChange
, passiveListener
);
32774 swiper
.$wrapperEl
.on('gestureend', '.swiper-slide', zoom
.onGestureEnd
, passiveListener
);
32775 } else if (swiper
.touchEvents
.start
=== 'touchstart') {
32776 swiper
.$wrapperEl
.on(swiper
.touchEvents
.start
, '.swiper-slide', zoom
.onGestureStart
, passiveListener
);
32777 swiper
.$wrapperEl
.on(swiper
.touchEvents
.move, '.swiper-slide', zoom
.onGestureChange
, passiveListener
);
32778 swiper
.$wrapperEl
.on(swiper
.touchEvents
.end
, '.swiper-slide', zoom
.onGestureEnd
, passiveListener
);
32782 swiper
.$wrapperEl
.on(swiper
.touchEvents
.move, ("." + (swiper
.params
.zoom
.containerClass
)), zoom
.onTouchMove
);
32784 disable
: function disable() {
32786 var zoom
= swiper
.zoom
;
32787 if (!zoom
.enabled
) { return; }
32789 swiper
.zoom
.enabled
= false;
32791 var passiveListener
= swiper
.touchEvents
.start
=== 'touchstart' && Support
.passiveListener
&& swiper
.params
.passiveListeners
? { passive
: true, capture
: false } : false;
32794 if (Support
.gestures
) {
32795 swiper
.$wrapperEl
.off('gesturestart', '.swiper-slide', zoom
.onGestureStart
, passiveListener
);
32796 swiper
.$wrapperEl
.off('gesturechange', '.swiper-slide', zoom
.onGestureChange
, passiveListener
);
32797 swiper
.$wrapperEl
.off('gestureend', '.swiper-slide', zoom
.onGestureEnd
, passiveListener
);
32798 } else if (swiper
.touchEvents
.start
=== 'touchstart') {
32799 swiper
.$wrapperEl
.off(swiper
.touchEvents
.start
, '.swiper-slide', zoom
.onGestureStart
, passiveListener
);
32800 swiper
.$wrapperEl
.off(swiper
.touchEvents
.move, '.swiper-slide', zoom
.onGestureChange
, passiveListener
);
32801 swiper
.$wrapperEl
.off(swiper
.touchEvents
.end
, '.swiper-slide', zoom
.onGestureEnd
, passiveListener
);
32805 swiper
.$wrapperEl
.off(swiper
.touchEvents
.move, ("." + (swiper
.params
.zoom
.containerClass
)), zoom
.onTouchMove
);
32817 containerClass
: 'swiper-zoom-container',
32818 zoomedSlideClass
: 'swiper-slide-zoomed',
32821 create
: function create() {
32829 $slideEl
: undefined,
32830 slideWidth
: undefined,
32831 slideHeight
: undefined,
32832 $imageEl
: undefined,
32833 $imageWrapEl
: undefined,
32837 isTouched
: undefined,
32838 isMoved
: undefined,
32839 currentX
: undefined,
32840 currentY
: undefined,
32850 touchesCurrent
: {},
32855 prevPositionX
: undefined,
32856 prevPositionY
: undefined,
32857 prevTime
: undefined,
32861 ('onGestureStart onGestureChange onGestureEnd onTouchStart onTouchMove onTouchEnd onTransitionEnd toggle enable disable in out').split(' ').forEach(function (methodName
) {
32862 zoom
[methodName
] = Zoom
[methodName
].bind(swiper
);
32864 Utils
.extend(swiper
, {
32869 Object
.defineProperty(swiper
.zoom
, 'scale', {
32870 get: function get() {
32873 set: function set(value
) {
32874 if (scale
!== value
) {
32875 var imageEl
= swiper
.zoom
.gesture
.$imageEl
? swiper
.zoom
.gesture
.$imageEl
[0] : undefined;
32876 var slideEl
= swiper
.zoom
.gesture
.$slideEl
? swiper
.zoom
.gesture
.$slideEl
[0] : undefined;
32877 swiper
.emit('zoomChange', value
, imageEl
, slideEl
);
32884 init
: function init() {
32886 if (swiper
.params
.zoom
.enabled
) {
32887 swiper
.zoom
.enable();
32890 destroy
: function destroy() {
32892 swiper
.zoom
.disable();
32894 touchStart
: function touchStart(e
) {
32896 if (!swiper
.zoom
.enabled
) { return; }
32897 swiper
.zoom
.onTouchStart(e
);
32899 touchEnd
: function touchEnd(e
) {
32901 if (!swiper
.zoom
.enabled
) { return; }
32902 swiper
.zoom
.onTouchEnd(e
);
32904 doubleTap
: function doubleTap(e
) {
32906 if (swiper
.params
.zoom
.enabled
&& swiper
.zoom
.enabled
&& swiper
.params
.zoom
.toggle
) {
32907 swiper
.zoom
.toggle(e
);
32910 transitionEnd
: function transitionEnd() {
32912 if (swiper
.zoom
.enabled
&& swiper
.params
.zoom
.enabled
) {
32913 swiper
.zoom
.onTransitionEnd();
32920 loadInSlide
: function loadInSlide(index
, loadInDuplicate
) {
32921 if ( loadInDuplicate
=== void 0 ) loadInDuplicate
= true;
32924 var params
= swiper
.params
.lazy
;
32925 if (typeof index
=== 'undefined') { return; }
32926 if (swiper
.slides
.length
=== 0) { return; }
32927 var isVirtual
= swiper
.virtual
&& swiper
.params
.virtual
.enabled
;
32929 var $slideEl
= isVirtual
32930 ? swiper
.$wrapperEl
.children(("." + (swiper
.params
.slideClass
) + "[data-swiper-slide-index=\"" + index
+ "\"]"))
32931 : swiper
.slides
.eq(index
);
32933 var $images
= $slideEl
.find(("." + (params
.elementClass
) + ":not(." + (params
.loadedClass
) + "):not(." + (params
.loadingClass
) + ")"));
32934 if ($slideEl
.hasClass(params
.elementClass
) && !$slideEl
.hasClass(params
.loadedClass
) && !$slideEl
.hasClass(params
.loadingClass
)) {
32935 $images
= $images
.add($slideEl
[0]);
32937 if ($images
.length
=== 0) { return; }
32939 $images
.each(function (imageIndex
, imageEl
) {
32940 var $imageEl
= $(imageEl
);
32941 $imageEl
.addClass(params
.loadingClass
);
32943 var background
= $imageEl
.attr('data-background');
32944 var src
= $imageEl
.attr('data-src');
32945 var srcset
= $imageEl
.attr('data-srcset');
32946 var sizes
= $imageEl
.attr('data-sizes');
32948 swiper
.loadImage($imageEl
[0], (src
|| background
), srcset
, sizes
, false, function () {
32949 if (typeof swiper
=== 'undefined' || swiper
=== null || !swiper
|| (swiper
&& !swiper
.params
) || swiper
.destroyed
) { return; }
32951 $imageEl
.css('background-image', ("url(\"" + background
+ "\")"));
32952 $imageEl
.removeAttr('data-background');
32955 $imageEl
.attr('srcset', srcset
);
32956 $imageEl
.removeAttr('data-srcset');
32959 $imageEl
.attr('sizes', sizes
);
32960 $imageEl
.removeAttr('data-sizes');
32963 $imageEl
.attr('src', src
);
32964 $imageEl
.removeAttr('data-src');
32968 $imageEl
.addClass(params
.loadedClass
).removeClass(params
.loadingClass
);
32969 $slideEl
.find(("." + (params
.preloaderClass
))).remove();
32970 if (swiper
.params
.loop
&& loadInDuplicate
) {
32971 var slideOriginalIndex
= $slideEl
.attr('data-swiper-slide-index');
32972 if ($slideEl
.hasClass(swiper
.params
.slideDuplicateClass
)) {
32973 var originalSlide
= swiper
.$wrapperEl
.children(("[data-swiper-slide-index=\"" + slideOriginalIndex
+ "\"]:not(." + (swiper
.params
.slideDuplicateClass
) + ")"));
32974 swiper
.lazy
.loadInSlide(originalSlide
.index(), false);
32976 var duplicatedSlide
= swiper
.$wrapperEl
.children(("." + (swiper
.params
.slideDuplicateClass
) + "[data-swiper-slide-index=\"" + slideOriginalIndex
+ "\"]"));
32977 swiper
.lazy
.loadInSlide(duplicatedSlide
.index(), false);
32980 swiper
.emit('lazyImageReady', $slideEl
[0], $imageEl
[0]);
32983 swiper
.emit('lazyImageLoad', $slideEl
[0], $imageEl
[0]);
32986 load
: function load() {
32988 var $wrapperEl
= swiper
.$wrapperEl
;
32989 var swiperParams
= swiper
.params
;
32990 var slides
= swiper
.slides
;
32991 var activeIndex
= swiper
.activeIndex
;
32992 var isVirtual
= swiper
.virtual
&& swiperParams
.virtual
.enabled
;
32993 var params
= swiperParams
.lazy
;
32995 var slidesPerView
= swiperParams
.slidesPerView
;
32996 if (slidesPerView
=== 'auto') {
33000 function slideExist(index
) {
33002 if ($wrapperEl
.children(("." + (swiperParams
.slideClass
) + "[data-swiper-slide-index=\"" + index
+ "\"]")).length
) {
33005 } else if (slides
[index
]) { return true; }
33008 function slideIndex(slideEl
) {
33010 return $(slideEl
).attr('data-swiper-slide-index');
33012 return $(slideEl
).index();
33015 if (!swiper
.lazy
.initialImageLoaded
) { swiper
.lazy
.initialImageLoaded
= true; }
33016 if (swiper
.params
.watchSlidesVisibility
) {
33017 $wrapperEl
.children(("." + (swiperParams
.slideVisibleClass
))).each(function (elIndex
, slideEl
) {
33018 var index
= isVirtual
? $(slideEl
).attr('data-swiper-slide-index') : $(slideEl
).index();
33019 swiper
.lazy
.loadInSlide(index
);
33021 } else if (slidesPerView
> 1) {
33022 for (var i
= activeIndex
; i
< activeIndex
+ slidesPerView
; i
+= 1) {
33023 if (slideExist(i
)) { swiper
.lazy
.loadInSlide(i
); }
33026 swiper
.lazy
.loadInSlide(activeIndex
);
33028 if (params
.loadPrevNext
) {
33029 if (slidesPerView
> 1 || (params
.loadPrevNextAmount
&& params
.loadPrevNextAmount
> 1)) {
33030 var amount
= params
.loadPrevNextAmount
;
33031 var spv
= slidesPerView
;
33032 var maxIndex
= Math
.min(activeIndex
+ spv
+ Math
.max(amount
, spv
), slides
.length
);
33033 var minIndex
= Math
.max(activeIndex
- Math
.max(spv
, amount
), 0);
33035 for (var i
$1 = activeIndex
+ slidesPerView
; i
$1 < maxIndex
; i
$1 += 1) {
33036 if (slideExist(i
$1)) { swiper
.lazy
.loadInSlide(i
$1); }
33039 for (var i
$2 = minIndex
; i
$2 < activeIndex
; i
$2 += 1) {
33040 if (slideExist(i
$2)) { swiper
.lazy
.loadInSlide(i
$2); }
33043 var nextSlide
= $wrapperEl
.children(("." + (swiperParams
.slideNextClass
)));
33044 if (nextSlide
.length
> 0) { swiper
.lazy
.loadInSlide(slideIndex(nextSlide
)); }
33046 var prevSlide
= $wrapperEl
.children(("." + (swiperParams
.slidePrevClass
)));
33047 if (prevSlide
.length
> 0) { swiper
.lazy
.loadInSlide(slideIndex(prevSlide
)); }
33058 loadPrevNext
: false,
33059 loadPrevNextAmount
: 1,
33060 loadOnTransitionStart
: false,
33062 elementClass
: 'swiper-lazy',
33063 loadingClass
: 'swiper-lazy-loading',
33064 loadedClass
: 'swiper-lazy-loaded',
33065 preloaderClass
: 'swiper-lazy-preloader',
33068 create
: function create() {
33070 Utils
.extend(swiper
, {
33072 initialImageLoaded
: false,
33073 load
: Lazy
$2.load
.bind(swiper
),
33074 loadInSlide
: Lazy
$2.loadInSlide
.bind(swiper
),
33079 beforeInit
: function beforeInit() {
33081 if (swiper
.params
.lazy
.enabled
&& swiper
.params
.preloadImages
) {
33082 swiper
.params
.preloadImages
= false;
33085 init
: function init() {
33087 if (swiper
.params
.lazy
.enabled
&& !swiper
.params
.loop
&& swiper
.params
.initialSlide
=== 0) {
33088 swiper
.lazy
.load();
33091 scroll
: function scroll() {
33093 if (swiper
.params
.freeMode
&& !swiper
.params
.freeModeSticky
) {
33094 swiper
.lazy
.load();
33097 resize
: function resize() {
33099 if (swiper
.params
.lazy
.enabled
) {
33100 swiper
.lazy
.load();
33103 scrollbarDragMove
: function scrollbarDragMove() {
33105 if (swiper
.params
.lazy
.enabled
) {
33106 swiper
.lazy
.load();
33109 transitionStart
: function transitionStart() {
33111 if (swiper
.params
.lazy
.enabled
) {
33112 if (swiper
.params
.lazy
.loadOnTransitionStart
|| (!swiper
.params
.lazy
.loadOnTransitionStart
&& !swiper
.lazy
.initialImageLoaded
)) {
33113 swiper
.lazy
.load();
33117 transitionEnd
: function transitionEnd() {
33119 if (swiper
.params
.lazy
.enabled
&& !swiper
.params
.lazy
.loadOnTransitionStart
) {
33120 swiper
.lazy
.load();
33126 /* eslint no-bitwise: ["error", { "allow": [">>"] }] */
33129 LinearSpline
: function LinearSpline(x
, y
) {
33130 var binarySearch
= (function search() {
33134 return function (array
, val
) {
33136 maxIndex
= array
.length
;
33137 while (maxIndex
- minIndex
> 1) {
33138 guess
= maxIndex
+ minIndex
>> 1;
33139 if (array
[guess
] <= val
) {
33150 this.lastIndex
= x
.length
- 1;
33151 // Given an x value (x2), return the expected y2 value:
33152 // (x1,y1) is the known point before given value,
33153 // (x3,y3) is the known point after given value.
33157 this.interpolate
= function interpolate(x2
) {
33158 if (!x2
) { return 0; }
33160 // Get the indexes of x1 and x3 (the array indexes before and after given x2):
33161 i3
= binarySearch(this.x
, x2
);
33164 // We have our indexes i1 & i3, so we can calculate already:
33165 // y2 := ((x2−x1) × (y3−y1)) ÷ (x3−x1) + y1
33166 return (((x2
- this.x
[i1
]) * (this.y
[i3
] - this.y
[i1
])) / (this.x
[i3
] - this.x
[i1
])) + this.y
[i1
];
33170 // xxx: for now i will just save one spline function to to
33171 getInterpolateFunction
: function getInterpolateFunction(c
) {
33173 if (!swiper
.controller
.spline
) {
33174 swiper
.controller
.spline
= swiper
.params
.loop
33175 ? new Controller
.LinearSpline(swiper
.slidesGrid
, c
.slidesGrid
)
33176 : new Controller
.LinearSpline(swiper
.snapGrid
, c
.snapGrid
);
33179 setTranslate
: function setTranslate(setTranslate
$1, byController
) {
33181 var controlled
= swiper
.controller
.control
;
33183 var controlledTranslate
;
33184 function setControlledTranslate(c
) {
33185 // this will create an Interpolate function based on the snapGrids
33186 // x is the Grid of the scrolled scroller and y will be the controlled scroller
33187 // it makes sense to create this only once and recall it for the interpolation
33188 // the function does a lot of value caching for performance
33189 var translate
= swiper
.rtlTranslate
? -swiper
.translate
: swiper
.translate
;
33190 if (swiper
.params
.controller
.by
=== 'slide') {
33191 swiper
.controller
.getInterpolateFunction(c
);
33192 // i am not sure why the values have to be multiplicated this way, tried to invert the snapGrid
33193 // but it did not work out
33194 controlledTranslate
= -swiper
.controller
.spline
.interpolate(-translate
);
33197 if (!controlledTranslate
|| swiper
.params
.controller
.by
=== 'container') {
33198 multiplier
= (c
.maxTranslate() - c
.minTranslate()) / (swiper
.maxTranslate() - swiper
.minTranslate());
33199 controlledTranslate
= ((translate
- swiper
.minTranslate()) * multiplier
) + c
.minTranslate();
33202 if (swiper
.params
.controller
.inverse
) {
33203 controlledTranslate
= c
.maxTranslate() - controlledTranslate
;
33205 c
.updateProgress(controlledTranslate
);
33206 c
.setTranslate(controlledTranslate
, swiper
);
33207 c
.updateActiveIndex();
33208 c
.updateSlidesClasses();
33210 if (Array
.isArray(controlled
)) {
33211 for (var i
= 0; i
< controlled
.length
; i
+= 1) {
33212 if (controlled
[i
] !== byController
&& controlled
[i
] instanceof Swiper
) {
33213 setControlledTranslate(controlled
[i
]);
33216 } else if (controlled
instanceof Swiper
&& byController
!== controlled
) {
33217 setControlledTranslate(controlled
);
33220 setTransition
: function setTransition(duration
, byController
) {
33222 var controlled
= swiper
.controller
.control
;
33224 function setControlledTransition(c
) {
33225 c
.setTransition(duration
, swiper
);
33226 if (duration
!== 0) {
33227 c
.transitionStart();
33228 if (c
.params
.autoHeight
) {
33229 Utils
.nextTick(function () {
33230 c
.updateAutoHeight();
33233 c
.$wrapperEl
.transitionEnd(function () {
33234 if (!controlled
) { return; }
33235 if (c
.params
.loop
&& swiper
.params
.controller
.by
=== 'slide') {
33242 if (Array
.isArray(controlled
)) {
33243 for (i
= 0; i
< controlled
.length
; i
+= 1) {
33244 if (controlled
[i
] !== byController
&& controlled
[i
] instanceof Swiper
) {
33245 setControlledTransition(controlled
[i
]);
33248 } else if (controlled
instanceof Swiper
&& byController
!== controlled
) {
33249 setControlledTransition(controlled
);
33253 var Controller
$1 = {
33254 name
: 'controller',
33257 control
: undefined,
33259 by
: 'slide', // or 'container'
33262 create
: function create() {
33264 Utils
.extend(swiper
, {
33266 control
: swiper
.params
.controller
.control
,
33267 getInterpolateFunction
: Controller
.getInterpolateFunction
.bind(swiper
),
33268 setTranslate
: Controller
.setTranslate
.bind(swiper
),
33269 setTransition
: Controller
.setTransition
.bind(swiper
),
33274 update
: function update() {
33276 if (!swiper
.controller
.control
) { return; }
33277 if (swiper
.controller
.spline
) {
33278 swiper
.controller
.spline
= undefined;
33279 delete swiper
.controller
.spline
;
33282 resize
: function resize() {
33284 if (!swiper
.controller
.control
) { return; }
33285 if (swiper
.controller
.spline
) {
33286 swiper
.controller
.spline
= undefined;
33287 delete swiper
.controller
.spline
;
33290 observerUpdate
: function observerUpdate() {
33292 if (!swiper
.controller
.control
) { return; }
33293 if (swiper
.controller
.spline
) {
33294 swiper
.controller
.spline
= undefined;
33295 delete swiper
.controller
.spline
;
33298 setTranslate
: function setTranslate(translate
, byController
) {
33300 if (!swiper
.controller
.control
) { return; }
33301 swiper
.controller
.setTranslate(translate
, byController
);
33303 setTransition
: function setTransition(duration
, byController
) {
33305 if (!swiper
.controller
.control
) { return; }
33306 swiper
.controller
.setTransition(duration
, byController
);
33312 makeElFocusable
: function makeElFocusable($el
) {
33313 $el
.attr('tabIndex', '0');
33316 addElRole
: function addElRole($el
, role
) {
33317 $el
.attr('role', role
);
33320 addElLabel
: function addElLabel($el
, label
) {
33321 $el
.attr('aria-label', label
);
33324 disableEl
: function disableEl($el
) {
33325 $el
.attr('aria-disabled', true);
33328 enableEl
: function enableEl($el
) {
33329 $el
.attr('aria-disabled', false);
33332 onEnterKey
: function onEnterKey(e
) {
33334 var params
= swiper
.params
.a11y
;
33335 if (e
.keyCode
!== 13) { return; }
33336 var $targetEl
= $(e
.target
);
33337 if (swiper
.navigation
&& swiper
.navigation
.$nextEl
&& $targetEl
.is(swiper
.navigation
.$nextEl
)) {
33338 if (!(swiper
.isEnd
&& !swiper
.params
.loop
)) {
33339 swiper
.slideNext();
33341 if (swiper
.isEnd
) {
33342 swiper
.a11y
.notify(params
.lastSlideMessage
);
33344 swiper
.a11y
.notify(params
.nextSlideMessage
);
33347 if (swiper
.navigation
&& swiper
.navigation
.$prevEl
&& $targetEl
.is(swiper
.navigation
.$prevEl
)) {
33348 if (!(swiper
.isBeginning
&& !swiper
.params
.loop
)) {
33349 swiper
.slidePrev();
33351 if (swiper
.isBeginning
) {
33352 swiper
.a11y
.notify(params
.firstSlideMessage
);
33354 swiper
.a11y
.notify(params
.prevSlideMessage
);
33357 if (swiper
.pagination
&& $targetEl
.is(("." + (swiper
.params
.pagination
.bulletClass
)))) {
33358 $targetEl
[0].click();
33361 notify
: function notify(message
) {
33363 var notification
= swiper
.a11y
.liveRegion
;
33364 if (notification
.length
=== 0) { return; }
33365 notification
.html('');
33366 notification
.html(message
);
33368 updateNavigation
: function updateNavigation() {
33371 if (swiper
.params
.loop
) { return; }
33372 var ref
= swiper
.navigation
;
33373 var $nextEl
= ref
.$nextEl
;
33374 var $prevEl
= ref
.$prevEl
;
33376 if ($prevEl
&& $prevEl
.length
> 0) {
33377 if (swiper
.isBeginning
) {
33378 swiper
.a11y
.disableEl($prevEl
);
33380 swiper
.a11y
.enableEl($prevEl
);
33383 if ($nextEl
&& $nextEl
.length
> 0) {
33384 if (swiper
.isEnd
) {
33385 swiper
.a11y
.disableEl($nextEl
);
33387 swiper
.a11y
.enableEl($nextEl
);
33391 updatePagination
: function updatePagination() {
33393 var params
= swiper
.params
.a11y
;
33394 if (swiper
.pagination
&& swiper
.params
.pagination
.clickable
&& swiper
.pagination
.bullets
&& swiper
.pagination
.bullets
.length
) {
33395 swiper
.pagination
.bullets
.each(function (bulletIndex
, bulletEl
) {
33396 var $bulletEl
= $(bulletEl
);
33397 swiper
.a11y
.makeElFocusable($bulletEl
);
33398 swiper
.a11y
.addElRole($bulletEl
, 'button');
33399 swiper
.a11y
.addElLabel($bulletEl
, params
.paginationBulletMessage
.replace(/{{index}}/, $bulletEl
.index() + 1));
33403 init
: function init() {
33406 swiper
.$el
.append(swiper
.a11y
.liveRegion
);
33409 var params
= swiper
.params
.a11y
;
33412 if (swiper
.navigation
&& swiper
.navigation
.$nextEl
) {
33413 $nextEl
= swiper
.navigation
.$nextEl
;
33415 if (swiper
.navigation
&& swiper
.navigation
.$prevEl
) {
33416 $prevEl
= swiper
.navigation
.$prevEl
;
33419 swiper
.a11y
.makeElFocusable($nextEl
);
33420 swiper
.a11y
.addElRole($nextEl
, 'button');
33421 swiper
.a11y
.addElLabel($nextEl
, params
.nextSlideMessage
);
33422 $nextEl
.on('keydown', swiper
.a11y
.onEnterKey
);
33425 swiper
.a11y
.makeElFocusable($prevEl
);
33426 swiper
.a11y
.addElRole($prevEl
, 'button');
33427 swiper
.a11y
.addElLabel($prevEl
, params
.prevSlideMessage
);
33428 $prevEl
.on('keydown', swiper
.a11y
.onEnterKey
);
33432 if (swiper
.pagination
&& swiper
.params
.pagination
.clickable
&& swiper
.pagination
.bullets
&& swiper
.pagination
.bullets
.length
) {
33433 swiper
.pagination
.$el
.on('keydown', ("." + (swiper
.params
.pagination
.bulletClass
)), swiper
.a11y
.onEnterKey
);
33436 destroy
: function destroy() {
33438 if (swiper
.a11y
.liveRegion
&& swiper
.a11y
.liveRegion
.length
> 0) { swiper
.a11y
.liveRegion
.remove(); }
33442 if (swiper
.navigation
&& swiper
.navigation
.$nextEl
) {
33443 $nextEl
= swiper
.navigation
.$nextEl
;
33445 if (swiper
.navigation
&& swiper
.navigation
.$prevEl
) {
33446 $prevEl
= swiper
.navigation
.$prevEl
;
33449 $nextEl
.off('keydown', swiper
.a11y
.onEnterKey
);
33452 $prevEl
.off('keydown', swiper
.a11y
.onEnterKey
);
33456 if (swiper
.pagination
&& swiper
.params
.pagination
.clickable
&& swiper
.pagination
.bullets
&& swiper
.pagination
.bullets
.length
) {
33457 swiper
.pagination
.$el
.off('keydown', ("." + (swiper
.params
.pagination
.bulletClass
)), swiper
.a11y
.onEnterKey
);
33466 notificationClass
: 'swiper-notification',
33467 prevSlideMessage
: 'Previous slide',
33468 nextSlideMessage
: 'Next slide',
33469 firstSlideMessage
: 'This is the first slide',
33470 lastSlideMessage
: 'This is the last slide',
33471 paginationBulletMessage
: 'Go to slide {{index}}',
33474 create
: function create() {
33476 Utils
.extend(swiper
, {
33478 liveRegion
: $(("<span class=\"" + (swiper
.params
.a11y
.notificationClass
) + "\" aria-live=\"assertive\" aria-atomic=\"true\"></span>")),
33481 Object
.keys(a11y
).forEach(function (methodName
) {
33482 swiper
.a11y
[methodName
] = a11y
[methodName
].bind(swiper
);
33486 init
: function init() {
33488 if (!swiper
.params
.a11y
.enabled
) { return; }
33489 swiper
.a11y
.init();
33490 swiper
.a11y
.updateNavigation();
33492 toEdge
: function toEdge() {
33494 if (!swiper
.params
.a11y
.enabled
) { return; }
33495 swiper
.a11y
.updateNavigation();
33497 fromEdge
: function fromEdge() {
33499 if (!swiper
.params
.a11y
.enabled
) { return; }
33500 swiper
.a11y
.updateNavigation();
33502 paginationUpdate
: function paginationUpdate() {
33504 if (!swiper
.params
.a11y
.enabled
) { return; }
33505 swiper
.a11y
.updatePagination();
33507 destroy
: function destroy() {
33509 if (!swiper
.params
.a11y
.enabled
) { return; }
33510 swiper
.a11y
.destroy();
33515 /* eslint no-underscore-dangle: "off" */
33518 run
: function run() {
33520 var $activeSlideEl
= swiper
.slides
.eq(swiper
.activeIndex
);
33521 var delay
= swiper
.params
.autoplay
.delay
;
33522 if ($activeSlideEl
.attr('data-swiper-autoplay')) {
33523 delay
= $activeSlideEl
.attr('data-swiper-autoplay') || swiper
.params
.autoplay
.delay
;
33525 swiper
.autoplay
.timeout
= Utils
.nextTick(function () {
33526 if (swiper
.params
.autoplay
.reverseDirection
) {
33527 if (swiper
.params
.loop
) {
33529 swiper
.slidePrev(swiper
.params
.speed
, true, true);
33530 swiper
.emit('autoplay');
33531 } else if (!swiper
.isBeginning
) {
33532 swiper
.slidePrev(swiper
.params
.speed
, true, true);
33533 swiper
.emit('autoplay');
33534 } else if (!swiper
.params
.autoplay
.stopOnLastSlide
) {
33535 swiper
.slideTo(swiper
.slides
.length
- 1, swiper
.params
.speed
, true, true);
33536 swiper
.emit('autoplay');
33538 swiper
.autoplay
.stop();
33540 } else if (swiper
.params
.loop
) {
33542 swiper
.slideNext(swiper
.params
.speed
, true, true);
33543 swiper
.emit('autoplay');
33544 } else if (!swiper
.isEnd
) {
33545 swiper
.slideNext(swiper
.params
.speed
, true, true);
33546 swiper
.emit('autoplay');
33547 } else if (!swiper
.params
.autoplay
.stopOnLastSlide
) {
33548 swiper
.slideTo(0, swiper
.params
.speed
, true, true);
33549 swiper
.emit('autoplay');
33551 swiper
.autoplay
.stop();
33555 start
: function start() {
33557 if (typeof swiper
.autoplay
.timeout
!== 'undefined') { return false; }
33558 if (swiper
.autoplay
.running
) { return false; }
33559 swiper
.autoplay
.running
= true;
33560 swiper
.emit('autoplayStart');
33561 swiper
.autoplay
.run();
33564 stop
: function stop() {
33566 if (!swiper
.autoplay
.running
) { return false; }
33567 if (typeof swiper
.autoplay
.timeout
=== 'undefined') { return false; }
33569 if (swiper
.autoplay
.timeout
) {
33570 clearTimeout(swiper
.autoplay
.timeout
);
33571 swiper
.autoplay
.timeout
= undefined;
33573 swiper
.autoplay
.running
= false;
33574 swiper
.emit('autoplayStop');
33577 pause
: function pause(speed
) {
33579 if (!swiper
.autoplay
.running
) { return; }
33580 if (swiper
.autoplay
.paused
) { return; }
33581 if (swiper
.autoplay
.timeout
) { clearTimeout(swiper
.autoplay
.timeout
); }
33582 swiper
.autoplay
.paused
= true;
33583 if (speed
=== 0 || !swiper
.params
.autoplay
.waitForTransition
) {
33584 swiper
.autoplay
.paused
= false;
33585 swiper
.autoplay
.run();
33587 swiper
.$wrapperEl
[0].addEventListener('transitionend', swiper
.autoplay
.onTransitionEnd
);
33588 swiper
.$wrapperEl
[0].addEventListener('webkitTransitionEnd', swiper
.autoplay
.onTransitionEnd
);
33599 waitForTransition
: true,
33600 disableOnInteraction
: true,
33601 stopOnLastSlide
: false,
33602 reverseDirection
: false,
33605 create
: function create() {
33607 Utils
.extend(swiper
, {
33611 run
: Autoplay
.run
.bind(swiper
),
33612 start
: Autoplay
.start
.bind(swiper
),
33613 stop
: Autoplay
.stop
.bind(swiper
),
33614 pause
: Autoplay
.pause
.bind(swiper
),
33615 onTransitionEnd
: function onTransitionEnd(e
) {
33616 if (!swiper
|| swiper
.destroyed
|| !swiper
.$wrapperEl
) { return; }
33617 if (e
.target
!== this) { return; }
33618 swiper
.$wrapperEl
[0].removeEventListener('transitionend', swiper
.autoplay
.onTransitionEnd
);
33619 swiper
.$wrapperEl
[0].removeEventListener('webkitTransitionEnd', swiper
.autoplay
.onTransitionEnd
);
33620 swiper
.autoplay
.paused
= false;
33621 if (!swiper
.autoplay
.running
) {
33622 swiper
.autoplay
.stop();
33624 swiper
.autoplay
.run();
33631 init
: function init() {
33633 if (swiper
.params
.autoplay
.enabled
) {
33634 swiper
.autoplay
.start();
33637 beforeTransitionStart
: function beforeTransitionStart(speed
, internal) {
33639 if (swiper
.autoplay
.running
) {
33640 if (internal || !swiper
.params
.autoplay
.disableOnInteraction
) {
33641 swiper
.autoplay
.pause(speed
);
33643 swiper
.autoplay
.stop();
33647 sliderFirstMove
: function sliderFirstMove() {
33649 if (swiper
.autoplay
.running
) {
33650 if (swiper
.params
.autoplay
.disableOnInteraction
) {
33651 swiper
.autoplay
.stop();
33653 swiper
.autoplay
.pause();
33657 destroy
: function destroy() {
33659 if (swiper
.autoplay
.running
) {
33660 swiper
.autoplay
.stop();
33667 setTranslate
: function setTranslate() {
33669 var slides
= swiper
.slides
;
33670 for (var i
= 0; i
< slides
.length
; i
+= 1) {
33671 var $slideEl
= swiper
.slides
.eq(i
);
33672 var offset
= $slideEl
[0].swiperSlideOffset
;
33674 if (!swiper
.params
.virtualTranslate
) { tx
-= swiper
.translate
; }
33676 if (!swiper
.isHorizontal()) {
33680 var slideOpacity
= swiper
.params
.fadeEffect
.crossFade
33681 ? Math
.max(1 - Math
.abs($slideEl
[0].progress
), 0)
33682 : 1 + Math
.min(Math
.max($slideEl
[0].progress
, -1), 0);
33685 opacity
: slideOpacity
,
33687 .transform(("translate3d(" + tx
+ "px, " + ty
+ "px, 0px)"));
33690 setTransition
: function setTransition(duration
) {
33692 var slides
= swiper
.slides
;
33693 var $wrapperEl
= swiper
.$wrapperEl
;
33694 slides
.transition(duration
);
33695 if (swiper
.params
.virtualTranslate
&& duration
!== 0) {
33696 var eventTriggered
= false;
33697 slides
.transitionEnd(function () {
33698 if (eventTriggered
) { return; }
33699 if (!swiper
|| swiper
.destroyed
) { return; }
33700 eventTriggered
= true;
33701 swiper
.animating
= false;
33702 var triggerEvents
= ['webkitTransitionEnd', 'transitionend'];
33703 for (var i
= 0; i
< triggerEvents
.length
; i
+= 1) {
33704 $wrapperEl
.trigger(triggerEvents
[i
]);
33712 name
: 'effect-fade',
33718 create
: function create() {
33720 Utils
.extend(swiper
, {
33722 setTranslate
: Fade
.setTranslate
.bind(swiper
),
33723 setTransition
: Fade
.setTransition
.bind(swiper
),
33728 beforeInit
: function beforeInit() {
33730 if (swiper
.params
.effect
!== 'fade') { return; }
33731 swiper
.classNames
.push(((swiper
.params
.containerModifierClass
) + "fade"));
33732 var overwriteParams
= {
33734 slidesPerColumn
: 1,
33736 watchSlidesProgress
: true,
33738 virtualTranslate
: true,
33740 Utils
.extend(swiper
.params
, overwriteParams
);
33741 Utils
.extend(swiper
.originalParams
, overwriteParams
);
33743 setTranslate
: function setTranslate() {
33745 if (swiper
.params
.effect
!== 'fade') { return; }
33746 swiper
.fadeEffect
.setTranslate();
33748 setTransition
: function setTransition(duration
) {
33750 if (swiper
.params
.effect
!== 'fade') { return; }
33751 swiper
.fadeEffect
.setTransition(duration
);
33757 setTranslate
: function setTranslate() {
33759 var $el
= swiper
.$el
;
33760 var $wrapperEl
= swiper
.$wrapperEl
;
33761 var slides
= swiper
.slides
;
33762 var swiperWidth
= swiper
.width
;
33763 var swiperHeight
= swiper
.height
;
33764 var rtl
= swiper
.rtlTranslate
;
33765 var swiperSize
= swiper
.size
;
33766 var params
= swiper
.params
.cubeEffect
;
33767 var isHorizontal
= swiper
.isHorizontal();
33768 var isVirtual
= swiper
.virtual
&& swiper
.params
.virtual
.enabled
;
33769 var wrapperRotate
= 0;
33771 if (params
.shadow
) {
33772 if (isHorizontal
) {
33773 $cubeShadowEl
= $wrapperEl
.find('.swiper-cube-shadow');
33774 if ($cubeShadowEl
.length
=== 0) {
33775 $cubeShadowEl
= $('<div class="swiper-cube-shadow"></div>');
33776 $wrapperEl
.append($cubeShadowEl
);
33778 $cubeShadowEl
.css({ height
: (swiperWidth
+ "px") });
33780 $cubeShadowEl
= $el
.find('.swiper-cube-shadow');
33781 if ($cubeShadowEl
.length
=== 0) {
33782 $cubeShadowEl
= $('<div class="swiper-cube-shadow"></div>');
33783 $el
.append($cubeShadowEl
);
33787 for (var i
= 0; i
< slides
.length
; i
+= 1) {
33788 var $slideEl
= slides
.eq(i
);
33789 var slideIndex
= i
;
33791 slideIndex
= parseInt($slideEl
.attr('data-swiper-slide-index'), 10);
33793 var slideAngle
= slideIndex
* 90;
33794 var round
= Math
.floor(slideAngle
/ 360);
33796 slideAngle
= -slideAngle
;
33797 round
= Math
.floor(-slideAngle
/ 360);
33799 var progress
= Math
.max(Math
.min($slideEl
[0].progress
, 1), -1);
33803 if (slideIndex
% 4 === 0) {
33804 tx
= -round
* 4 * swiperSize
;
33806 } else if ((slideIndex
- 1) % 4 === 0) {
33808 tz
= -round
* 4 * swiperSize
;
33809 } else if ((slideIndex
- 2) % 4 === 0) {
33810 tx
= swiperSize
+ (round
* 4 * swiperSize
);
33812 } else if ((slideIndex
- 3) % 4 === 0) {
33814 tz
= (3 * swiperSize
) + (swiperSize
* 4 * round
);
33820 if (!isHorizontal
) {
33825 var transform
= "rotateX(" + (isHorizontal
? 0 : -slideAngle
) + "deg) rotateY(" + (isHorizontal
? slideAngle
: 0) + "deg) translate3d(" + tx
+ "px, " + ty
+ "px, " + tz
+ "px)";
33826 if (progress
<= 1 && progress
> -1) {
33827 wrapperRotate
= (slideIndex
* 90) + (progress
* 90);
33828 if (rtl
) { wrapperRotate
= (-slideIndex
* 90) - (progress
* 90); }
33830 $slideEl
.transform(transform
);
33831 if (params
.slideShadows
) {
33833 var shadowBefore
= isHorizontal
? $slideEl
.find('.swiper-slide-shadow-left') : $slideEl
.find('.swiper-slide-shadow-top');
33834 var shadowAfter
= isHorizontal
? $slideEl
.find('.swiper-slide-shadow-right') : $slideEl
.find('.swiper-slide-shadow-bottom');
33835 if (shadowBefore
.length
=== 0) {
33836 shadowBefore
= $(("<div class=\"swiper-slide-shadow-" + (isHorizontal
? 'left' : 'top') + "\"></div>"));
33837 $slideEl
.append(shadowBefore
);
33839 if (shadowAfter
.length
=== 0) {
33840 shadowAfter
= $(("<div class=\"swiper-slide-shadow-" + (isHorizontal
? 'right' : 'bottom') + "\"></div>"));
33841 $slideEl
.append(shadowAfter
);
33843 if (shadowBefore
.length
) { shadowBefore
[0].style
.opacity
= Math
.max(-progress
, 0); }
33844 if (shadowAfter
.length
) { shadowAfter
[0].style
.opacity
= Math
.max(progress
, 0); }
33848 '-webkit-transform-origin': ("50% 50% -" + (swiperSize
/ 2) + "px"),
33849 '-moz-transform-origin': ("50% 50% -" + (swiperSize
/ 2) + "px"),
33850 '-ms-transform-origin': ("50% 50% -" + (swiperSize
/ 2) + "px"),
33851 'transform-origin': ("50% 50% -" + (swiperSize
/ 2) + "px"),
33854 if (params
.shadow
) {
33855 if (isHorizontal
) {
33856 $cubeShadowEl
.transform(("translate3d(0px, " + ((swiperWidth
/ 2) + params
.shadowOffset
) + "px, " + (-swiperWidth
/ 2) + "px) rotateX(90deg) rotateZ(0deg) scale(" + (params
.shadowScale
) + ")"));
33858 var shadowAngle
= Math
.abs(wrapperRotate
) - (Math
.floor(Math
.abs(wrapperRotate
) / 90) * 90);
33859 var multiplier
= 1.5 - (
33860 (Math
.sin((shadowAngle
* 2 * Math
.PI
) / 360) / 2)
33861 + (Math
.cos((shadowAngle
* 2 * Math
.PI
) / 360) / 2)
33863 var scale1
= params
.shadowScale
;
33864 var scale2
= params
.shadowScale
/ multiplier
;
33865 var offset
= params
.shadowOffset
;
33866 $cubeShadowEl
.transform(("scale3d(" + scale1
+ ", 1, " + scale2
+ ") translate3d(0px, " + ((swiperHeight
/ 2) + offset
) + "px, " + (-swiperHeight
/ 2 / scale2
) + "px) rotateX(-90deg)"));
33869 var zFactor
= (Browser
.isSafari
|| Browser
.isUiWebView
) ? (-swiperSize
/ 2) : 0;
33871 .transform(("translate3d(0px,0," + zFactor
+ "px) rotateX(" + (swiper
.isHorizontal() ? 0 : wrapperRotate
) + "deg) rotateY(" + (swiper
.isHorizontal() ? -wrapperRotate
: 0) + "deg)"));
33873 setTransition
: function setTransition(duration
) {
33875 var $el
= swiper
.$el
;
33876 var slides
= swiper
.slides
;
33878 .transition(duration
)
33879 .find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left')
33880 .transition(duration
);
33881 if (swiper
.params
.cubeEffect
.shadow
&& !swiper
.isHorizontal()) {
33882 $el
.find('.swiper-cube-shadow').transition(duration
);
33888 name
: 'effect-cube',
33891 slideShadows
: true,
33897 create
: function create() {
33899 Utils
.extend(swiper
, {
33901 setTranslate
: Cube
.setTranslate
.bind(swiper
),
33902 setTransition
: Cube
.setTransition
.bind(swiper
),
33907 beforeInit
: function beforeInit() {
33909 if (swiper
.params
.effect
!== 'cube') { return; }
33910 swiper
.classNames
.push(((swiper
.params
.containerModifierClass
) + "cube"));
33911 swiper
.classNames
.push(((swiper
.params
.containerModifierClass
) + "3d"));
33912 var overwriteParams
= {
33914 slidesPerColumn
: 1,
33916 watchSlidesProgress
: true,
33917 resistanceRatio
: 0,
33919 centeredSlides
: false,
33920 virtualTranslate
: true,
33922 Utils
.extend(swiper
.params
, overwriteParams
);
33923 Utils
.extend(swiper
.originalParams
, overwriteParams
);
33925 setTranslate
: function setTranslate() {
33927 if (swiper
.params
.effect
!== 'cube') { return; }
33928 swiper
.cubeEffect
.setTranslate();
33930 setTransition
: function setTransition(duration
) {
33932 if (swiper
.params
.effect
!== 'cube') { return; }
33933 swiper
.cubeEffect
.setTransition(duration
);
33939 setTranslate
: function setTranslate() {
33941 var slides
= swiper
.slides
;
33942 var rtl
= swiper
.rtlTranslate
;
33943 for (var i
= 0; i
< slides
.length
; i
+= 1) {
33944 var $slideEl
= slides
.eq(i
);
33945 var progress
= $slideEl
[0].progress
;
33946 if (swiper
.params
.flipEffect
.limitRotation
) {
33947 progress
= Math
.max(Math
.min($slideEl
[0].progress
, 1), -1);
33949 var offset
= $slideEl
[0].swiperSlideOffset
;
33950 var rotate
= -180 * progress
;
33951 var rotateY
= rotate
;
33955 if (!swiper
.isHorizontal()) {
33958 rotateX
= -rotateY
;
33961 rotateY
= -rotateY
;
33964 $slideEl
[0].style
.zIndex
= -Math
.abs(Math
.round(progress
)) + slides
.length
;
33966 if (swiper
.params
.flipEffect
.slideShadows
) {
33968 var shadowBefore
= swiper
.isHorizontal() ? $slideEl
.find('.swiper-slide-shadow-left') : $slideEl
.find('.swiper-slide-shadow-top');
33969 var shadowAfter
= swiper
.isHorizontal() ? $slideEl
.find('.swiper-slide-shadow-right') : $slideEl
.find('.swiper-slide-shadow-bottom');
33970 if (shadowBefore
.length
=== 0) {
33971 shadowBefore
= $(("<div class=\"swiper-slide-shadow-" + (swiper
.isHorizontal() ? 'left' : 'top') + "\"></div>"));
33972 $slideEl
.append(shadowBefore
);
33974 if (shadowAfter
.length
=== 0) {
33975 shadowAfter
= $(("<div class=\"swiper-slide-shadow-" + (swiper
.isHorizontal() ? 'right' : 'bottom') + "\"></div>"));
33976 $slideEl
.append(shadowAfter
);
33978 if (shadowBefore
.length
) { shadowBefore
[0].style
.opacity
= Math
.max(-progress
, 0); }
33979 if (shadowAfter
.length
) { shadowAfter
[0].style
.opacity
= Math
.max(progress
, 0); }
33982 .transform(("translate3d(" + tx
+ "px, " + ty
+ "px, 0px) rotateX(" + rotateX
+ "deg) rotateY(" + rotateY
+ "deg)"));
33985 setTransition
: function setTransition(duration
) {
33987 var slides
= swiper
.slides
;
33988 var activeIndex
= swiper
.activeIndex
;
33989 var $wrapperEl
= swiper
.$wrapperEl
;
33991 .transition(duration
)
33992 .find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left')
33993 .transition(duration
);
33994 if (swiper
.params
.virtualTranslate
&& duration
!== 0) {
33995 var eventTriggered
= false;
33996 // eslint-disable-next-line
33997 slides
.eq(activeIndex
).transitionEnd(function onTransitionEnd() {
33998 if (eventTriggered
) { return; }
33999 if (!swiper
|| swiper
.destroyed
) { return; }
34000 // if (!$(this).hasClass(swiper.params.slideActiveClass)) return;
34001 eventTriggered
= true;
34002 swiper
.animating
= false;
34003 var triggerEvents
= ['webkitTransitionEnd', 'transitionend'];
34004 for (var i
= 0; i
< triggerEvents
.length
; i
+= 1) {
34005 $wrapperEl
.trigger(triggerEvents
[i
]);
34013 name
: 'effect-flip',
34016 slideShadows
: true,
34017 limitRotation
: true,
34020 create
: function create() {
34022 Utils
.extend(swiper
, {
34024 setTranslate
: Flip
.setTranslate
.bind(swiper
),
34025 setTransition
: Flip
.setTransition
.bind(swiper
),
34030 beforeInit
: function beforeInit() {
34032 if (swiper
.params
.effect
!== 'flip') { return; }
34033 swiper
.classNames
.push(((swiper
.params
.containerModifierClass
) + "flip"));
34034 swiper
.classNames
.push(((swiper
.params
.containerModifierClass
) + "3d"));
34035 var overwriteParams
= {
34037 slidesPerColumn
: 1,
34039 watchSlidesProgress
: true,
34041 virtualTranslate
: true,
34043 Utils
.extend(swiper
.params
, overwriteParams
);
34044 Utils
.extend(swiper
.originalParams
, overwriteParams
);
34046 setTranslate
: function setTranslate() {
34048 if (swiper
.params
.effect
!== 'flip') { return; }
34049 swiper
.flipEffect
.setTranslate();
34051 setTransition
: function setTransition(duration
) {
34053 if (swiper
.params
.effect
!== 'flip') { return; }
34054 swiper
.flipEffect
.setTransition(duration
);
34060 setTranslate
: function setTranslate() {
34062 var swiperWidth
= swiper
.width
;
34063 var swiperHeight
= swiper
.height
;
34064 var slides
= swiper
.slides
;
34065 var $wrapperEl
= swiper
.$wrapperEl
;
34066 var slidesSizesGrid
= swiper
.slidesSizesGrid
;
34067 var params
= swiper
.params
.coverflowEffect
;
34068 var isHorizontal
= swiper
.isHorizontal();
34069 var transform
= swiper
.translate
;
34070 var center
= isHorizontal
? -transform
+ (swiperWidth
/ 2) : -transform
+ (swiperHeight
/ 2);
34071 var rotate
= isHorizontal
? params
.rotate
: -params
.rotate
;
34072 var translate
= params
.depth
;
34073 // Each slide offset from center
34074 for (var i
= 0, length
= slides
.length
; i
< length
; i
+= 1) {
34075 var $slideEl
= slides
.eq(i
);
34076 var slideSize
= slidesSizesGrid
[i
];
34077 var slideOffset
= $slideEl
[0].swiperSlideOffset
;
34078 var offsetMultiplier
= ((center
- slideOffset
- (slideSize
/ 2)) / slideSize
) * params
.modifier
;
34080 var rotateY
= isHorizontal
? rotate
* offsetMultiplier
: 0;
34081 var rotateX
= isHorizontal
? 0 : rotate
* offsetMultiplier
;
34083 var translateZ
= -translate
* Math
.abs(offsetMultiplier
);
34085 var translateY
= isHorizontal
? 0 : params
.stretch
* (offsetMultiplier
);
34086 var translateX
= isHorizontal
? params
.stretch
* (offsetMultiplier
) : 0;
34088 // Fix for ultra small values
34089 if (Math
.abs(translateX
) < 0.001) { translateX
= 0; }
34090 if (Math
.abs(translateY
) < 0.001) { translateY
= 0; }
34091 if (Math
.abs(translateZ
) < 0.001) { translateZ
= 0; }
34092 if (Math
.abs(rotateY
) < 0.001) { rotateY
= 0; }
34093 if (Math
.abs(rotateX
) < 0.001) { rotateX
= 0; }
34095 var slideTransform
= "translate3d(" + translateX
+ "px," + translateY
+ "px," + translateZ
+ "px) rotateX(" + rotateX
+ "deg) rotateY(" + rotateY
+ "deg)";
34097 $slideEl
.transform(slideTransform
);
34098 $slideEl
[0].style
.zIndex
= -Math
.abs(Math
.round(offsetMultiplier
)) + 1;
34099 if (params
.slideShadows
) {
34101 var $shadowBeforeEl
= isHorizontal
? $slideEl
.find('.swiper-slide-shadow-left') : $slideEl
.find('.swiper-slide-shadow-top');
34102 var $shadowAfterEl
= isHorizontal
? $slideEl
.find('.swiper-slide-shadow-right') : $slideEl
.find('.swiper-slide-shadow-bottom');
34103 if ($shadowBeforeEl
.length
=== 0) {
34104 $shadowBeforeEl
= $(("<div class=\"swiper-slide-shadow-" + (isHorizontal
? 'left' : 'top') + "\"></div>"));
34105 $slideEl
.append($shadowBeforeEl
);
34107 if ($shadowAfterEl
.length
=== 0) {
34108 $shadowAfterEl
= $(("<div class=\"swiper-slide-shadow-" + (isHorizontal
? 'right' : 'bottom') + "\"></div>"));
34109 $slideEl
.append($shadowAfterEl
);
34111 if ($shadowBeforeEl
.length
) { $shadowBeforeEl
[0].style
.opacity
= offsetMultiplier
> 0 ? offsetMultiplier
: 0; }
34112 if ($shadowAfterEl
.length
) { $shadowAfterEl
[0].style
.opacity
= (-offsetMultiplier
) > 0 ? -offsetMultiplier
: 0; }
34116 // Set correct perspective for IE10
34117 if (Support
.pointerEvents
|| Support
.prefixedPointerEvents
) {
34118 var ws
= $wrapperEl
[0].style
;
34119 ws
.perspectiveOrigin
= center
+ "px 50%";
34122 setTransition
: function setTransition(duration
) {
34125 .transition(duration
)
34126 .find('.swiper-slide-shadow-top, .swiper-slide-shadow-right, .swiper-slide-shadow-bottom, .swiper-slide-shadow-left')
34127 .transition(duration
);
34131 var EffectCoverflow
= {
34132 name
: 'effect-coverflow',
34139 slideShadows
: true,
34142 create
: function create() {
34144 Utils
.extend(swiper
, {
34146 setTranslate
: Coverflow
.setTranslate
.bind(swiper
),
34147 setTransition
: Coverflow
.setTransition
.bind(swiper
),
34152 beforeInit
: function beforeInit() {
34154 if (swiper
.params
.effect
!== 'coverflow') { return; }
34156 swiper
.classNames
.push(((swiper
.params
.containerModifierClass
) + "coverflow"));
34157 swiper
.classNames
.push(((swiper
.params
.containerModifierClass
) + "3d"));
34159 swiper
.params
.watchSlidesProgress
= true;
34160 swiper
.originalParams
.watchSlidesProgress
= true;
34162 setTranslate
: function setTranslate() {
34164 if (swiper
.params
.effect
!== 'coverflow') { return; }
34165 swiper
.coverflowEffect
.setTranslate();
34167 setTransition
: function setTransition(duration
) {
34169 if (swiper
.params
.effect
!== 'coverflow') { return; }
34170 swiper
.coverflowEffect
.setTransition(duration
);
34176 init
: function init() {
34178 var ref
= swiper
.params
;
34179 var thumbsParams
= ref
.thumbs
;
34180 var SwiperClass
= swiper
.constructor;
34181 if (thumbsParams
.swiper
instanceof SwiperClass
) {
34182 swiper
.thumbs
.swiper
= thumbsParams
.swiper
;
34183 Utils
.extend(swiper
.thumbs
.swiper
.originalParams
, {
34184 watchSlidesProgress
: true,
34185 slideToClickedSlide
: false,
34187 Utils
.extend(swiper
.thumbs
.swiper
.params
, {
34188 watchSlidesProgress
: true,
34189 slideToClickedSlide
: false,
34191 } else if (Utils
.isObject(thumbsParams
.swiper
)) {
34192 swiper
.thumbs
.swiper
= new SwiperClass(Utils
.extend({}, thumbsParams
.swiper
, {
34193 watchSlidesVisibility
: true,
34194 watchSlidesProgress
: true,
34195 slideToClickedSlide
: false,
34197 swiper
.thumbs
.swiperCreated
= true;
34199 swiper
.thumbs
.swiper
.$el
.addClass(swiper
.params
.thumbs
.thumbsContainerClass
);
34200 swiper
.thumbs
.swiper
.on('tap', swiper
.thumbs
.onThumbClick
);
34202 onThumbClick
: function onThumbClick() {
34204 var thumbsSwiper
= swiper
.thumbs
.swiper
;
34205 if (!thumbsSwiper
) { return; }
34206 var clickedIndex
= thumbsSwiper
.clickedIndex
;
34207 var clickedSlide
= thumbsSwiper
.clickedSlide
;
34208 if (clickedSlide
&& $(clickedSlide
).hasClass(swiper
.params
.thumbs
.slideThumbActiveClass
)) { return; }
34209 if (typeof clickedIndex
=== 'undefined' || clickedIndex
=== null) { return; }
34211 if (thumbsSwiper
.params
.loop
) {
34212 slideToIndex
= parseInt($(thumbsSwiper
.clickedSlide
).attr('data-swiper-slide-index'), 10);
34214 slideToIndex
= clickedIndex
;
34216 if (swiper
.params
.loop
) {
34217 var currentIndex
= swiper
.activeIndex
;
34218 if (swiper
.slides
.eq(currentIndex
).hasClass(swiper
.params
.slideDuplicateClass
)) {
34220 // eslint-disable-next-line
34221 swiper
._clientLeft
= swiper
.$wrapperEl
[0].clientLeft
;
34222 currentIndex
= swiper
.activeIndex
;
34224 var prevIndex
= swiper
.slides
.eq(currentIndex
).prevAll(("[data-swiper-slide-index=\"" + slideToIndex
+ "\"]")).eq(0).index();
34225 var nextIndex
= swiper
.slides
.eq(currentIndex
).nextAll(("[data-swiper-slide-index=\"" + slideToIndex
+ "\"]")).eq(0).index();
34226 if (typeof prevIndex
=== 'undefined') { slideToIndex
= nextIndex
; }
34227 else if (typeof nextIndex
=== 'undefined') { slideToIndex
= prevIndex
; }
34228 else if (nextIndex
- currentIndex
< currentIndex
- prevIndex
) { slideToIndex
= nextIndex
; }
34229 else { slideToIndex
= prevIndex
; }
34231 swiper
.slideTo(slideToIndex
);
34233 update
: function update(initial
) {
34235 var thumbsSwiper
= swiper
.thumbs
.swiper
;
34236 if (!thumbsSwiper
) { return; }
34238 var slidesPerView
= thumbsSwiper
.params
.slidesPerView
=== 'auto'
34239 ? thumbsSwiper
.slidesPerViewDynamic()
34240 : thumbsSwiper
.params
.slidesPerView
;
34242 if (swiper
.realIndex
!== thumbsSwiper
.realIndex
) {
34243 var currentThumbsIndex
= thumbsSwiper
.activeIndex
;
34244 var newThumbsIndex
;
34245 if (thumbsSwiper
.params
.loop
) {
34246 if (thumbsSwiper
.slides
.eq(currentThumbsIndex
).hasClass(thumbsSwiper
.params
.slideDuplicateClass
)) {
34247 thumbsSwiper
.loopFix();
34248 // eslint-disable-next-line
34249 thumbsSwiper
._clientLeft
= thumbsSwiper
.$wrapperEl
[0].clientLeft
;
34250 currentThumbsIndex
= thumbsSwiper
.activeIndex
;
34252 // Find actual thumbs index to slide to
34253 var prevThumbsIndex
= thumbsSwiper
.slides
.eq(currentThumbsIndex
).prevAll(("[data-swiper-slide-index=\"" + (swiper
.realIndex
) + "\"]")).eq(0).index();
34254 var nextThumbsIndex
= thumbsSwiper
.slides
.eq(currentThumbsIndex
).nextAll(("[data-swiper-slide-index=\"" + (swiper
.realIndex
) + "\"]")).eq(0).index();
34255 if (typeof prevThumbsIndex
=== 'undefined') { newThumbsIndex
= nextThumbsIndex
; }
34256 else if (typeof nextThumbsIndex
=== 'undefined') { newThumbsIndex
= prevThumbsIndex
; }
34257 else if (nextThumbsIndex
- currentThumbsIndex
=== currentThumbsIndex
- prevThumbsIndex
) { newThumbsIndex
= currentThumbsIndex
; }
34258 else if (nextThumbsIndex
- currentThumbsIndex
< currentThumbsIndex
- prevThumbsIndex
) { newThumbsIndex
= nextThumbsIndex
; }
34259 else { newThumbsIndex
= prevThumbsIndex
; }
34261 newThumbsIndex
= swiper
.realIndex
;
34263 if (thumbsSwiper
.visibleSlidesIndexes
.indexOf(newThumbsIndex
) < 0) {
34264 if (thumbsSwiper
.params
.centeredSlides
) {
34265 if (newThumbsIndex
> currentThumbsIndex
) {
34266 newThumbsIndex
= newThumbsIndex
- Math
.floor(slidesPerView
/ 2) + 1;
34268 newThumbsIndex
= newThumbsIndex
+ Math
.floor(slidesPerView
/ 2) - 1;
34270 } else if (newThumbsIndex
> currentThumbsIndex
) {
34271 newThumbsIndex
= newThumbsIndex
- slidesPerView
+ 1;
34273 thumbsSwiper
.slideTo(newThumbsIndex
, initial
? 0 : undefined);
34278 var thumbsToActivate
= 1;
34279 var thumbActiveClass
= swiper
.params
.thumbs
.slideThumbActiveClass
;
34281 if (swiper
.params
.slidesPerView
> 1 && !swiper
.params
.centeredSlides
) {
34282 thumbsToActivate
= swiper
.params
.slidesPerView
;
34285 thumbsSwiper
.slides
.removeClass(thumbActiveClass
);
34286 if (thumbsSwiper
.params
.loop
) {
34287 for (var i
= 0; i
< thumbsToActivate
; i
+= 1) {
34288 thumbsSwiper
.$wrapperEl
.children(("[data-swiper-slide-index=\"" + (swiper
.realIndex
+ i
) + "\"]")).addClass(thumbActiveClass
);
34291 for (var i
$1 = 0; i
$1 < thumbsToActivate
; i
$1 += 1) {
34292 thumbsSwiper
.slides
.eq(swiper
.realIndex
+ i
$1).addClass(thumbActiveClass
);
34302 slideThumbActiveClass
: 'swiper-slide-thumb-active',
34303 thumbsContainerClass
: 'swiper-container-thumbs',
34306 create
: function create() {
34308 Utils
.extend(swiper
, {
34311 init
: Thumbs
.init
.bind(swiper
),
34312 update
: Thumbs
.update
.bind(swiper
),
34313 onThumbClick
: Thumbs
.onThumbClick
.bind(swiper
),
34318 beforeInit
: function beforeInit() {
34320 var ref
= swiper
.params
;
34321 var thumbs
= ref
.thumbs
;
34322 if (!thumbs
|| !thumbs
.swiper
) { return; }
34323 swiper
.thumbs
.init();
34324 swiper
.thumbs
.update(true);
34326 slideChange
: function slideChange() {
34328 if (!swiper
.thumbs
.swiper
) { return; }
34329 swiper
.thumbs
.update();
34331 update
: function update() {
34333 if (!swiper
.thumbs
.swiper
) { return; }
34334 swiper
.thumbs
.update();
34336 resize
: function resize() {
34338 if (!swiper
.thumbs
.swiper
) { return; }
34339 swiper
.thumbs
.update();
34341 observerUpdate
: function observerUpdate() {
34343 if (!swiper
.thumbs
.swiper
) { return; }
34344 swiper
.thumbs
.update();
34346 setTransition
: function setTransition(duration
) {
34348 var thumbsSwiper
= swiper
.thumbs
.swiper
;
34349 if (!thumbsSwiper
) { return; }
34350 thumbsSwiper
.setTransition(duration
);
34352 beforeDestroy
: function beforeDestroy() {
34354 var thumbsSwiper
= swiper
.thumbs
.swiper
;
34355 if (!thumbsSwiper
) { return; }
34356 if (swiper
.thumbs
.swiperCreated
&& thumbsSwiper
) {
34357 thumbsSwiper
.destroy();
34388 if (!window
.Swiper
) {
34389 window
.Swiper
= Swiper
;
34393 function initSwiper(swiperEl
) {
34395 var $swiperEl
= $(swiperEl
);
34396 if ($swiperEl
.length
=== 0) { return; }
34397 if ($swiperEl
[0].swiper
) { return; }
34401 var isRoutableTabs
;
34402 if ($swiperEl
.hasClass('tabs-swipeable-wrap')) {
34404 .addClass('swiper-container')
34406 .addClass('swiper-wrapper')
34408 .addClass('swiper-slide');
34409 initialSlide
= $swiperEl
.children('.tabs').children('.tab-active').index();
34411 isRoutableTabs
= $swiperEl
.find('.tabs-routable').length
> 0;
34413 if ($swiperEl
.attr('data-swiper')) {
34414 params
= JSON
.parse($swiperEl
.attr('data-swiper'));
34416 params
= $swiperEl
.dataset();
34417 Object
.keys(params
).forEach(function (key
) {
34418 var value
= params
[key
];
34419 if (typeof value
=== 'string' && value
.indexOf('{') === 0 && value
.indexOf('}') > 0) {
34421 params
[key
] = JSON
.parse(value
);
34428 if (typeof params
.initialSlide
=== 'undefined' && typeof initialSlide
!== 'undefined') {
34429 params
.initialSlide
= initialSlide
;
34432 var swiper
= app
.swiper
.create($swiperEl
[0], params
);
34434 swiper
.on('slideChange', function () {
34435 if (isRoutableTabs
) {
34436 var view
= app
.views
.get($swiperEl
.parents('.view'));
34437 if (!view
) { view
= app
.views
.main
; }
34438 var router
= view
.router
;
34439 var tabRoute
= router
.findTabRoute(swiper
.slides
.eq(swiper
.activeIndex
)[0]);
34441 setTimeout(function () {
34442 router
.navigate(tabRoute
.path
);
34447 tabEl
: swiper
.slides
.eq(swiper
.activeIndex
),
34459 create
: function create() {
34461 app
.swiper
= ConstructorMethods({
34462 defaultSelector
: '.swiper-container',
34463 constructor: Swiper
,
34468 pageBeforeRemove
: function pageBeforeRemove(page
) {
34470 page
.$el
.find('.swiper-init, .tabs-swipeable-wrap').each(function (index
, swiperEl
) {
34471 app
.swiper
.destroy(swiperEl
);
34474 pageMounted
: function pageMounted(page
) {
34476 page
.$el
.find('.tabs-swipeable-wrap').each(function (index
, swiperEl
) {
34477 initSwiper
.call(app
, swiperEl
);
34480 pageInit
: function pageInit(page
) {
34482 page
.$el
.find('.swiper-init, .tabs-swipeable-wrap').each(function (index
, swiperEl
) {
34483 initSwiper
.call(app
, swiperEl
);
34486 pageReinit
: function pageReinit(page
) {
34488 page
.$el
.find('.swiper-init, .tabs-swipeable-wrap').each(function (index
, swiperEl
) {
34489 var swiper
= app
.swiper
.get(swiperEl
);
34490 if (swiper
&& swiper
.update
) { swiper
.update(); }
34493 tabMounted
: function tabMounted(tabEl
) {
34495 $(tabEl
).find('.swiper-init, .tabs-swipeable-wrap').each(function (index
, swiperEl
) {
34496 initSwiper
.call(app
, swiperEl
);
34499 tabShow
: function tabShow(tabEl
) {
34501 $(tabEl
).find('.swiper-init, .tabs-swipeable-wrap').each(function (index
, swiperEl
) {
34502 var swiper
= app
.swiper
.get(swiperEl
);
34503 if (swiper
&& swiper
.update
) { swiper
.update(); }
34506 tabBeforeRemove
: function tabBeforeRemove(tabEl
) {
34508 $(tabEl
).find('.swiper-init, .tabs-swipeable-wrap').each(function (index
, swiperEl
) {
34509 app
.swiper
.destroy(swiperEl
);
34515 insert
: function insert(vnode
) {
34517 var swiperEl
= vnode
.elm
;
34518 initSwiper
.call(app
, swiperEl
);
34520 destroy
: function destroy(vnode
) {
34522 var swiperEl
= vnode
.elm
;
34523 app
.swiper
.destroy(swiperEl
);
34526 'tabs-swipeable-wrap': {
34527 insert
: function insert(vnode
) {
34529 var swiperEl
= vnode
.elm
;
34530 initSwiper
.call(app
, swiperEl
);
34532 destroy
: function destroy(vnode
) {
34534 var swiperEl
= vnode
.elm
;
34535 app
.swiper
.destroy(swiperEl
);
34541 /* eslint indent: ["off"] */
34543 var PhotoBrowser
= /*@__PURE__*/(function (Framework7Class
) {
34544 function PhotoBrowser(app
, params
) {
34545 if ( params
=== void 0 ) params
= {};
34547 Framework7Class
.call(this, params
, [app
]);
34552 var defaults
= Utils
.extend({
34554 }, app
.params
.photoBrowser
);
34556 // Extend defaults with modules params
34557 pb
.useModulesParams(defaults
);
34559 pb
.params
= Utils
.extend(defaults
, params
);
34564 activeIndex
: pb
.params
.swiper
.initialSlide
,
34565 url
: pb
.params
.url
,
34566 view
: pb
.params
.view
|| app
.views
.main
,
34572 current
: undefined,
34574 activeSlide
: undefined,
34575 timeStart
: undefined,
34586 if ( Framework7Class
) PhotoBrowser
.__proto__
= Framework7Class
;
34587 PhotoBrowser
.prototype = Object
.create( Framework7Class
&& Framework7Class
.prototype );
34588 PhotoBrowser
.prototype.constructor = PhotoBrowser
;
34590 PhotoBrowser
.prototype.onSlideChange
= function onSlideChange (swiper
) {
34592 pb
.activeIndex
= swiper
.activeIndex
;
34594 var current
= swiper
.activeIndex
+ 1;
34595 var total
= pb
.params
.virtualSlides
? pb
.params
.photos
.length
: swiper
.slides
.length
;
34596 if (swiper
.params
.loop
) {
34598 current
-= swiper
.loopedSlides
;
34599 if (current
< 1) { current
= total
+ current
; }
34600 if (current
> total
) { current
-= total
; }
34603 var $activeSlideEl
= pb
.params
.virtualSlides
34604 ? swiper
.$wrapperEl
.find((".swiper-slide[data-swiper-slide-index=\"" + (swiper
.activeIndex
) + "\"]"))
34605 : swiper
.slides
.eq(swiper
.activeIndex
);
34606 var $previousSlideEl
= pb
.params
.virtualSlides
34607 ? swiper
.$wrapperEl
.find((".swiper-slide[data-swiper-slide-index=\"" + (swiper
.previousIndex
) + "\"]"))
34608 : swiper
.slides
.eq(swiper
.previousIndex
);
34610 var $currentEl
= pb
.$el
.find('.photo-browser-current');
34611 var $totalEl
= pb
.$el
.find('.photo-browser-total');
34612 if (pb
.params
.type
=== 'page' && pb
.params
.navbar
&& $currentEl
.length
=== 0 && pb
.app
.theme
=== 'ios') {
34613 var navbarEl
= pb
.app
.navbar
.getElByPage(pb
.$el
);
34615 $currentEl
= $(navbarEl
).find('.photo-browser-current');
34616 $totalEl
= $(navbarEl
).find('.photo-browser-total');
34619 $currentEl
.text(current
);
34620 $totalEl
.text(total
);
34623 if (pb
.captions
.length
> 0) {
34624 var captionIndex
= swiper
.params
.loop
? $activeSlideEl
.attr('data-swiper-slide-index') : pb
.activeIndex
;
34625 pb
.$captionsContainerEl
.find('.photo-browser-caption-active').removeClass('photo-browser-caption-active');
34626 pb
.$captionsContainerEl
.find(("[data-caption-index=\"" + captionIndex
+ "\"]")).addClass('photo-browser-caption-active');
34630 var previousSlideVideo
= $previousSlideEl
.find('video');
34631 if (previousSlideVideo
.length
> 0) {
34632 if ('pause' in previousSlideVideo
[0]) { previousSlideVideo
[0].pause(); }
34636 PhotoBrowser
.prototype.onTouchStart
= function onTouchStart () {
34638 var swipeToClose
= pb
.swipeToClose
;
34639 if (!swipeToClose
.allow
) { return; }
34640 swipeToClose
.isTouched
= true;
34643 PhotoBrowser
.prototype.onTouchMove
= function onTouchMove (e
) {
34645 var swipeToClose
= pb
.swipeToClose
;
34647 if (!swipeToClose
.isTouched
) { return; }
34648 if (!swipeToClose
.started
) {
34649 swipeToClose
.started
= true;
34650 swipeToClose
.start
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageY
: e
.pageY
;
34651 if (pb
.params
.virtualSlides
) {
34652 swipeToClose
.activeSlide
= pb
.swiper
.$wrapperEl
.children('.swiper-slide-active');
34654 swipeToClose
.activeSlide
= pb
.swiper
.slides
.eq(pb
.swiper
.activeIndex
);
34656 swipeToClose
.timeStart
= Utils
.now();
34658 e
.preventDefault();
34659 swipeToClose
.current
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageY
: e
.pageY
;
34660 swipeToClose
.diff
= swipeToClose
.start
- swipeToClose
.current
;
34661 var opacity
= 1 - (Math
.abs(swipeToClose
.diff
) / 300);
34662 var color
= pb
.exposed
|| pb
.params
.theme
=== 'dark' ? 0 : 255;
34663 swipeToClose
.activeSlide
.transform(("translate3d(0," + (-swipeToClose
.diff
) + "px,0)"));
34664 pb
.swiper
.$el
.css('background-color', ("rgba(" + color
+ ", " + color
+ ", " + color
+ ", " + opacity
+ ")")).transition(0);
34667 PhotoBrowser
.prototype.onTouchEnd
= function onTouchEnd () {
34669 var swipeToClose
= pb
.swipeToClose
;
34670 swipeToClose
.isTouched
= false;
34671 if (!swipeToClose
.started
) {
34672 swipeToClose
.started
= false;
34675 swipeToClose
.started
= false;
34676 swipeToClose
.allow
= false;
34677 var diff
= Math
.abs(swipeToClose
.diff
);
34678 var timeDiff
= (new Date()).getTime() - swipeToClose
.timeStart
;
34679 if ((timeDiff
< 300 && diff
> 20) || (timeDiff
>= 300 && diff
> 100)) {
34680 Utils
.nextTick(function () {
34682 if (swipeToClose
.diff
< 0) { pb
.$el
.addClass('swipe-close-to-bottom'); }
34683 else { pb
.$el
.addClass('swipe-close-to-top'); }
34685 pb
.emit('local::swipeToClose', pb
);
34687 swipeToClose
.allow
= true;
34692 swipeToClose
.activeSlide
.addClass('photo-browser-transitioning').transitionEnd(function () {
34693 swipeToClose
.allow
= true;
34694 swipeToClose
.activeSlide
.removeClass('photo-browser-transitioning');
34697 swipeToClose
.allow
= true;
34699 pb
.swiper
.$el
.transition('').css('background-color', '');
34700 swipeToClose
.activeSlide
.transform('');
34703 // Render Functions
34704 PhotoBrowser
.prototype.renderNavbar
= function renderNavbar () {
34706 if (pb
.params
.renderNavbar
) { return pb
.params
.renderNavbar
.call(pb
); }
34708 var iconsColor
= pb
.params
.iconsColor
;
34709 if (!pb
.params
.iconsColor
&& pb
.params
.theme
=== 'dark') { iconsColor
= 'white'; }
34711 var backLinkText
= (pb
.app
.theme
=== 'ios' || pb
.app
.theme
=== 'aurora') && pb
.params
.backLinkText
? pb
.params
.backLinkText
: '';
34713 var isPopup
= pb
.params
.type
!== 'page';
34714 var navbarHtml
= ("\n <div class=\"navbar\">\n <div class=\"navbar-inner sliding\">\n <div class=\"left\">\n <a class=\"link " + (isPopup
? 'popup-close' : '') + " " + (!backLinkText
? 'icon-only' : '') + " " + (!isPopup
? 'back' : '') + "\" " + (isPopup
? 'data-popup=".photo-browser-popup"' : '') + ">\n <i class=\"icon icon-back " + (iconsColor
? ("color-" + iconsColor
) : '') + "\"></i>\n " + (backLinkText
? ("<span>" + backLinkText
+ "</span>") : '') + "\n </a>\n </div>\n <div class=\"title\">\n <span class=\"photo-browser-current\"></span>\n <span class=\"photo-browser-of\">" + (pb
.params
.navbarOfText
) + "</span>\n <span class=\"photo-browser-total\"></span>\n </div>\n <div class=\"right\"></div>\n </div>\n </div>\n ").trim();
34718 PhotoBrowser
.prototype.renderToolbar
= function renderToolbar () {
34720 if (pb
.params
.renderToolbar
) { return pb
.params
.renderToolbar
.call(pb
); }
34722 var iconsColor
= pb
.params
.iconsColor
;
34723 if (!pb
.params
.iconsColor
&& pb
.params
.theme
=== 'dark') { iconsColor
= 'white'; }
34725 var toolbarHtml
= ("\n <div class=\"toolbar toolbar-bottom tabbar\">\n <div class=\"toolbar-inner\">\n <a class=\"link photo-browser-prev\">\n <i class=\"icon icon-back " + (iconsColor
? ("color-" + iconsColor
) : '') + "\"></i>\n </a>\n <a class=\"link photo-browser-next\">\n <i class=\"icon icon-forward " + (iconsColor
? ("color-" + iconsColor
) : '') + "\"></i>\n </a>\n </div>\n </div>\n ").trim();
34726 return toolbarHtml
;
34729 PhotoBrowser
.prototype.renderCaption
= function renderCaption (caption
, index
) {
34731 if (pb
.params
.renderCaption
) { return pb
.params
.renderCaption
.call(pb
, caption
, index
); }
34732 var captionHtml
= ("\n <div class=\"photo-browser-caption\" data-caption-index=\"" + index
+ "\">\n " + caption
+ "\n </div>\n ").trim();
34733 return captionHtml
;
34736 PhotoBrowser
.prototype.renderObject
= function renderObject (photo
, index
) {
34738 if (pb
.params
.renderObject
) { return pb
.params
.renderObject
.call(pb
, photo
, index
); }
34739 var objHtml
= "\n <div class=\"photo-browser-slide photo-browser-object-slide swiper-slide\" data-swiper-slide-index=\"" + index
+ "\">" + (photo
.html
? photo
.html
: photo
) + "</div>\n ";
34743 PhotoBrowser
.prototype.renderLazyPhoto
= function renderLazyPhoto (photo
, index
) {
34745 if (pb
.params
.renderLazyPhoto
) { return pb
.params
.renderLazyPhoto
.call(pb
, photo
, index
); }
34746 var photoHtml
= ("\n <div class=\"photo-browser-slide photo-browser-slide-lazy swiper-slide\" data-swiper-slide-index=\"" + index
+ "\">\n <div class=\"preloader swiper-lazy-preloader " + (pb
.params
.theme
=== 'dark' ? 'color-white' : '') + "\">" + (Utils
[((pb
.app
.theme
) + "PreloaderContent")] || '') + "</div>\n <span class=\"swiper-zoom-container\">\n <img data-src=\"" + (photo
.url
? photo
.url
: photo
) + "\" class=\"swiper-lazy\">\n </span>\n </div>\n ").trim();
34750 PhotoBrowser
.prototype.renderPhoto
= function renderPhoto (photo
, index
) {
34752 if (pb
.params
.renderPhoto
) { return pb
.params
.renderPhoto
.call(pb
, photo
, index
); }
34753 var photoHtml
= ("\n <div class=\"photo-browser-slide swiper-slide\" data-swiper-slide-index=\"" + index
+ "\">\n <span class=\"swiper-zoom-container\">\n <img src=\"" + (photo
.url
? photo
.url
: photo
) + "\">\n </span>\n </div>\n ").trim();
34757 PhotoBrowser
.prototype.render
= function render () {
34759 if (pb
.params
.render
) { return pb
.params
.render
.call(pb
, pb
.params
); }
34760 var html
= ("\n <div class=\"photo-browser photo-browser-" + (pb
.params
.theme
) + "\">\n <div class=\"view\">\n <div class=\"page photo-browser-page photo-browser-page-" + (pb
.params
.theme
) + " no-toolbar " + (!pb
.params
.navbar
? 'no-navbar' : '') + "\" data-name=\"photo-browser-page\">\n " + (pb
.params
.navbar
? pb
.renderNavbar() : '') + "\n " + (pb
.params
.toolbar
? pb
.renderToolbar() : '') + "\n <div class=\"photo-browser-captions photo-browser-captions-" + (pb
.params
.captionsTheme
|| pb
.params
.theme
) + "\">\n " + (pb
.params
.photos
.map(function (photo
, index
) {
34761 if (photo
.caption
) { return pb
.renderCaption(photo
.caption
, index
); }
34763 }).join(' ')) + "\n </div>\n <div class=\"photo-browser-swiper-container swiper-container\">\n <div class=\"photo-browser-swiper-wrapper swiper-wrapper\">\n " + (pb
.params
.virtualSlides
? '' : pb
.params
.photos
.map(function (photo
, index
) {
34764 if (photo
.html
|| ((typeof photo
=== 'string' || photo
instanceof String
) && photo
.indexOf('<') >= 0 && photo
.indexOf('>') >= 0)) {
34765 return pb
.renderObject(photo
, index
);
34767 if (pb
.params
.swiper
.lazy
=== true || (pb
.params
.swiper
.lazy
&& pb
.params
.swiper
.lazy
.enabled
)) {
34768 return pb
.renderLazyPhoto(photo
, index
);
34770 return pb
.renderPhoto(photo
, index
);
34771 }).join(' ')) + "\n </div>\n </div>\n </div>\n </div>\n </div>\n ").trim();
34775 PhotoBrowser
.prototype.renderStandalone
= function renderStandalone () {
34777 if (pb
.params
.renderStandalone
) { return pb
.params
.renderStandalone
.call(pb
); }
34778 var standaloneHtml
= "<div class=\"popup photo-browser-popup photo-browser-standalone popup-tablet-fullscreen\">" + (pb
.render()) + "</div>";
34779 return standaloneHtml
;
34782 PhotoBrowser
.prototype.renderPage
= function renderPage () {
34784 if (pb
.params
.renderPage
) { return pb
.params
.renderPage
.call(pb
); }
34785 var pageHtml
= pb
.render();
34790 PhotoBrowser
.prototype.renderPopup
= function renderPopup () {
34792 if (pb
.params
.renderPopup
) { return pb
.params
.renderPopup
.call(pb
); }
34793 var popupHtml
= "<div class=\"popup photo-browser-popup\">" + (pb
.render()) + "</div>";
34799 PhotoBrowser
.prototype.onOpen
= function onOpen (type
, el
) {
34804 $el
[0].f7PhotoBrowser
= pb
;
34808 pb
.openedIn
= type
;
34811 pb
.$swiperContainerEl
= pb
.$el
.find('.photo-browser-swiper-container');
34812 pb
.$swiperWrapperEl
= pb
.$el
.find('.photo-browser-swiper-wrapper');
34813 pb
.slides
= pb
.$el
.find('.photo-browser-slide');
34814 pb
.$captionsContainerEl
= pb
.$el
.find('.photo-browser-captions');
34815 pb
.captions
= pb
.$el
.find('.photo-browser-caption');
34818 var swiperParams
= Utils
.extend({}, pb
.params
.swiper
, {
34819 initialSlide
: pb
.activeIndex
,
34821 tap
: function tap(e
) {
34822 pb
.emit('local::tap', e
);
34824 click
: function click(e
) {
34825 if (pb
.params
.exposition
) {
34826 pb
.expositionToggle();
34828 pb
.emit('local::click', e
);
34830 doubleTap
: function doubleTap(e
) {
34831 pb
.emit('local::doubleTap', e
);
34833 slideChange
: function slideChange() {
34834 var args
= [], len
= arguments
.length
;
34835 while ( len
-- ) args
[ len
] = arguments
[ len
];
34838 pb
.onSlideChange(swiper
);
34839 pb
.emit
.apply(pb
, [ 'local::slideChange' ].concat( args
));
34841 transitionStart
: function transitionStart() {
34842 var args
= [], len
= arguments
.length
;
34843 while ( len
-- ) args
[ len
] = arguments
[ len
];
34845 pb
.emit
.apply(pb
, [ 'local::transitionStart' ].concat( args
));
34847 transitionEnd
: function transitionEnd() {
34848 var args
= [], len
= arguments
.length
;
34849 while ( len
-- ) args
[ len
] = arguments
[ len
];
34851 pb
.emit
.apply(pb
, [ 'local::transitionEnd' ].concat( args
));
34853 slideChangeTransitionStart
: function slideChangeTransitionStart() {
34854 var args
= [], len
= arguments
.length
;
34855 while ( len
-- ) args
[ len
] = arguments
[ len
];
34857 pb
.emit
.apply(pb
, [ 'local::slideChangeTransitionStart' ].concat( args
));
34859 slideChangeTransitionEnd
: function slideChangeTransitionEnd() {
34860 var args
= [], len
= arguments
.length
;
34861 while ( len
-- ) args
[ len
] = arguments
[ len
];
34863 pb
.emit
.apply(pb
, [ 'local::slideChangeTransitionEnd' ].concat( args
));
34865 lazyImageLoad
: function lazyImageLoad() {
34866 var args
= [], len
= arguments
.length
;
34867 while ( len
-- ) args
[ len
] = arguments
[ len
];
34869 pb
.emit
.apply(pb
, [ 'local::lazyImageLoad' ].concat( args
));
34871 lazyImageReady
: function lazyImageReady() {
34872 var args
= [], len
= arguments
.length
;
34873 while ( len
-- ) args
[ len
] = arguments
[ len
];
34875 var slideEl
= args
[0];
34876 $(slideEl
).removeClass('photo-browser-slide-lazy');
34877 pb
.emit
.apply(pb
, [ 'local::lazyImageReady' ].concat( args
));
34881 if (pb
.params
.swipeToClose
&& pb
.params
.type
!== 'page') {
34882 Utils
.extend(swiperParams
.on
, {
34883 touchStart
: function touchStart(e
) {
34884 pb
.onTouchStart(e
);
34885 pb
.emit('local::touchStart', e
);
34887 touchMoveOpposite
: function touchMoveOpposite(e
) {
34889 pb
.emit('local::touchMoveOpposite', e
);
34891 touchEnd
: function touchEnd(e
) {
34893 pb
.emit('local::touchEnd', e
);
34897 if (pb
.params
.virtualSlides
) {
34898 Utils
.extend(swiperParams
, {
34900 slides
: pb
.params
.photos
,
34901 renderSlide
: function renderSlide(photo
, index
) {
34902 if (photo
.html
|| ((typeof photo
=== 'string' || photo
instanceof String
) && photo
.indexOf('<') >= 0 && photo
.indexOf('>') >= 0)) {
34903 return pb
.renderObject(photo
, index
);
34905 if (pb
.params
.swiper
.lazy
=== true || (pb
.params
.swiper
.lazy
&& pb
.params
.swiper
.lazy
.enabled
)) {
34906 return pb
.renderLazyPhoto(photo
, index
);
34908 return pb
.renderPhoto(photo
, index
);
34914 pb
.swiper
= app
.swiper
.create(pb
.$swiperContainerEl
, swiperParams
);
34916 if (pb
.activeIndex
=== 0) {
34917 pb
.onSlideChange(pb
.swiper
);
34920 pb
.$el
.trigger('photobrowser:open');
34922 pb
.emit('local::open photoBrowserOpen', pb
);
34925 PhotoBrowser
.prototype.onOpened
= function onOpened () {
34929 pb
.$el
.trigger('photobrowser:opened');
34931 pb
.emit('local::opened photoBrowserOpened', pb
);
34934 PhotoBrowser
.prototype.onClose
= function onClose () {
34936 if (pb
.destroyed
) { return; }
34939 if (pb
.swiper
&& pb
.swiper
.destroy
) {
34940 pb
.swiper
.destroy(true, false);
34945 pb
.$el
.trigger('photobrowser:close');
34947 pb
.emit('local::close photoBrowserClose', pb
);
34950 PhotoBrowser
.prototype.onClosed
= function onClosed () {
34952 if (pb
.destroyed
) { return; }
34959 pb
.$el
.trigger('photobrowser:closed');
34961 pb
.emit('local::closed photoBrowserClosed', pb
);
34965 PhotoBrowser
.prototype.openPage
= function openPage () {
34967 if (pb
.opened
) { return pb
; }
34969 var pageHtml
= pb
.renderPage();
34971 pb
.view
.router
.navigate({
34977 pageBeforeIn
: function pageBeforeIn(e
, page
) {
34978 pb
.view
.$el
.addClass(("with-photo-browser-page with-photo-browser-page-" + (pb
.params
.theme
)));
34979 pb
.onOpen('page', page
.el
);
34981 pageAfterIn
: function pageAfterIn(e
, page
) {
34982 pb
.onOpened('page', page
.el
);
34984 pageBeforeOut
: function pageBeforeOut(e
, page
) {
34985 pb
.view
.$el
.removeClass(("with-photo-browser-page with-photo-browser-page-exposed with-photo-browser-page-" + (pb
.params
.theme
)));
34986 pb
.onClose('page', page
.el
);
34988 pageAfterOut
: function pageAfterOut(e
, page
) {
34989 pb
.onClosed('page', page
.el
);
34997 PhotoBrowser
.prototype.openStandalone
= function openStandalone () {
34999 if (pb
.opened
) { return pb
; }
35001 var standaloneHtml
= pb
.renderStandalone();
35003 var popupParams
= {
35005 content
: standaloneHtml
,
35007 popupOpen
: function popupOpen(popup
) {
35008 pb
.onOpen('popup', popup
.el
);
35010 popupOpened
: function popupOpened(popup
) {
35011 pb
.onOpened('popup', popup
.el
);
35013 popupClose
: function popupClose(popup
) {
35014 pb
.onClose('popup', popup
.el
);
35016 popupClosed
: function popupClosed(popup
) {
35017 pb
.onClosed('popup', popup
.el
);
35022 if (pb
.params
.routableModals
) {
35023 pb
.view
.router
.navigate({
35027 popup
: popupParams
,
35031 pb
.modal
= pb
.app
.popup
.create(popupParams
).open();
35036 PhotoBrowser
.prototype.openPopup
= function openPopup () {
35038 if (pb
.opened
) { return pb
; }
35040 var popupHtml
= pb
.renderPopup();
35042 var popupParams
= {
35043 content
: popupHtml
,
35045 popupOpen
: function popupOpen(popup
) {
35046 pb
.onOpen('popup', popup
.el
);
35048 popupOpened
: function popupOpened(popup
) {
35049 pb
.onOpened('popup', popup
.el
);
35051 popupClose
: function popupClose(popup
) {
35052 pb
.onClose('popup', popup
.el
);
35054 popupClosed
: function popupClosed(popup
) {
35055 pb
.onClosed('popup', popup
.el
);
35060 if (pb
.params
.routableModals
) {
35061 pb
.view
.router
.navigate({
35065 popup
: popupParams
,
35069 pb
.modal
= pb
.app
.popup
.create(popupParams
).open();
35075 PhotoBrowser
.prototype.expositionEnable
= function expositionEnable () {
35077 if (pb
.params
.type
=== 'page') {
35078 pb
.view
.$el
.addClass('with-photo-browser-page-exposed');
35080 if (pb
.$el
) { pb
.$el
.addClass('photo-browser-exposed'); }
35081 if (pb
.params
.expositionHideCaptions
) { pb
.$captionsContainerEl
.addClass('photo-browser-captions-exposed'); }
35086 PhotoBrowser
.prototype.expositionDisable
= function expositionDisable () {
35088 if (pb
.params
.type
=== 'page') {
35089 pb
.view
.$el
.removeClass('with-photo-browser-page-exposed');
35091 if (pb
.$el
) { pb
.$el
.removeClass('photo-browser-exposed'); }
35092 if (pb
.params
.expositionHideCaptions
) { pb
.$captionsContainerEl
.removeClass('photo-browser-captions-exposed'); }
35093 pb
.exposed
= false;
35097 PhotoBrowser
.prototype.expositionToggle
= function expositionToggle () {
35099 if (pb
.params
.type
=== 'page') {
35100 pb
.view
.$el
.toggleClass('with-photo-browser-page-exposed');
35102 if (pb
.$el
) { pb
.$el
.toggleClass('photo-browser-exposed'); }
35103 if (pb
.params
.expositionHideCaptions
) { pb
.$captionsContainerEl
.toggleClass('photo-browser-captions-exposed'); }
35104 pb
.exposed
= !pb
.exposed
;
35108 PhotoBrowser
.prototype.open
= function open (index
) {
35110 var type
= pb
.params
.type
;
35112 if (pb
.swiper
&& typeof index
!== 'undefined') {
35113 pb
.swiper
.slideTo(parseInt(index
, 10));
35117 if (typeof index
!== 'undefined') {
35118 pb
.activeIndex
= index
;
35120 if (type
=== 'standalone') {
35121 pb
.openStandalone();
35123 if (type
=== 'page') {
35126 if (type
=== 'popup') {
35132 PhotoBrowser
.prototype.close
= function close () {
35134 if (!pb
.opened
) { return pb
; }
35135 if (pb
.params
.routableModals
|| pb
.openedIn
=== 'page') {
35136 if (pb
.view
) { pb
.view
.router
.back(); }
35138 pb
.modal
.once('modalClosed', function () {
35139 Utils
.nextTick(function () {
35140 pb
.modal
.destroy();
35148 // eslint-disable-next-line
35149 PhotoBrowser
.prototype.init
= function init () {};
35151 PhotoBrowser
.prototype.destroy
= function destroy () {
35153 pb
.emit('local::beforeDestroy photoBrowserBeforeDestroy', pb
);
35155 pb
.$el
.trigger('photobrowser:beforedestroy');
35156 pb
.$el
[0].f7PhotoBrowser
= null;
35157 delete pb
.$el
[0].f7PhotoBrowser
;
35159 Utils
.deleteProps(pb
);
35163 return PhotoBrowser
;
35164 }(Framework7Class
));
35166 var PhotoBrowser
$1 = {
35167 name
: 'photoBrowser',
35172 expositionHideCaptions
: false,
35173 type
: 'standalone',
35177 captionsTheme
: undefined,
35178 iconsColor
: undefined,
35179 swipeToClose
: true,
35180 backLinkText
: 'Close',
35181 navbarOfText
: 'of',
35184 routableModals
: true,
35185 virtualSlides
: true,
35187 renderNavbar
: undefined,
35188 renderToolbar
: undefined,
35189 renderCaption
: undefined,
35190 renderObject
: undefined,
35191 renderLazyPhoto
: undefined,
35192 renderPhoto
: undefined,
35193 renderPage
: undefined,
35194 renderPopup
: undefined,
35195 renderStandalone
: undefined,
35202 preloadImages
: true,
35204 nextEl
: '.photo-browser-next',
35205 prevEl
: '.photo-browser-prev',
35218 create
: function create() {
35220 app
.photoBrowser
= ConstructorMethods({
35221 defaultSelector
: '.photo-browser',
35222 constructor: PhotoBrowser
,
35224 domProp
: 'f7PhotoBrowser',
35228 PhotoBrowser
: PhotoBrowser
,
35232 var Notification
= /*@__PURE__*/(function (Modal
) {
35233 function Notification(app
, params
) {
35234 var extendedParams
= Utils
.extend({
35236 }, app
.params
.notification
, params
);
35238 // Extends with open/close Modal methods;
35239 Modal
.call(this, app
, extendedParams
);
35241 var notification
= this;
35243 notification
.app
= app
;
35245 notification
.params
= extendedParams
;
35247 var ref
= notification
.params
;
35248 var icon
= ref
.icon
;
35249 var title
= ref
.title
;
35250 var titleRightText
= ref
.titleRightText
;
35251 var subtitle
= ref
.subtitle
;
35252 var text
= ref
.text
;
35253 var closeButton
= ref
.closeButton
;
35254 var closeTimeout
= ref
.closeTimeout
;
35255 var cssClass
= ref
.cssClass
;
35256 var closeOnClick
= ref
.closeOnClick
;
35259 if (!notification
.params
.el
) {
35261 var notificationHtml
= notification
.render({
35264 titleRightText
: titleRightText
,
35265 subtitle
: subtitle
,
35267 closeButton
: closeButton
,
35268 cssClass
: cssClass
,
35271 $el
= $(notificationHtml
);
35273 $el
= $(notification
.params
.el
);
35276 if ($el
&& $el
.length
> 0 && $el
[0].f7Modal
) {
35277 return $el
[0].f7Modal
;
35280 if ($el
.length
=== 0) {
35281 return notification
.destroy();
35284 Utils
.extend(notification
, {
35287 type
: 'notification',
35290 $el
[0].f7Modal
= notification
;
35293 $el
.find('.notification-close-button').on('click', function () {
35294 notification
.close();
35297 $el
.on('click', function (e
) {
35298 if (closeButton
&& $(e
.target
).closest('.notification-close-button').length
) {
35301 notification
.emit('local::click notificationClick', notification
);
35302 if (closeOnClick
) { notification
.close(); }
35305 notification
.on('beforeDestroy', function () {
35314 var touchStartTime
;
35315 var notificationHeight
;
35316 var touchesStart
= {};
35317 function handleTouchStart(e
) {
35318 if (isTouched
) { return; }
35321 isScrolling
= undefined;
35322 touchStartTime
= Utils
.now();
35323 touchesStart
.x
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageX
: e
.pageX
;
35324 touchesStart
.y
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageY
: e
.pageY
;
35326 function handleTouchMove(e
) {
35327 if (!isTouched
) { return; }
35328 var pageX
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageX
: e
.pageX
;
35329 var pageY
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageY
: e
.pageY
;
35330 if (typeof isScrolling
=== 'undefined') {
35331 isScrolling
= !!(isScrolling
|| Math
.abs(pageY
- touchesStart
.y
) < Math
.abs(pageX
- touchesStart
.x
));
35337 e
.preventDefault();
35339 notification
.$el
.removeClass('notification-transitioning');
35340 notification
.$el
.transition(0);
35341 notificationHeight
= notification
.$el
[0].offsetHeight
/ 2;
35344 touchesDiff
= (pageY
- touchesStart
.y
);
35345 var newTranslate
= touchesDiff
;
35346 if (touchesDiff
> 0) {
35347 newTranslate
= Math
.pow( touchesDiff
, 0.8 );
35349 notification
.$el
.transform(("translate3d(0, " + newTranslate
+ "px, 0)"));
35351 function handleTouchEnd() {
35352 if (!isTouched
|| !isMoved
) {
35359 if (touchesDiff
=== 0) {
35363 var timeDiff
= Utils
.now() - touchStartTime
;
35364 notification
.$el
.transition('');
35365 notification
.$el
.addClass('notification-transitioning');
35366 notification
.$el
.transform('');
35369 (touchesDiff
< -10 && timeDiff
< 300)
35370 || (-touchesDiff
>= notificationHeight
/ 1)
35372 notification
.close();
35376 function attachTouchEvents() {
35378 notification
.$el
.on(app
.touchEvents
.start
, handleTouchStart
, { passive
: true });
35379 app
.on('touchmove:active', handleTouchMove
);
35380 app
.on('touchend:passive', handleTouchEnd
);
35383 function detachTouchEvents() {
35385 notification
.$el
.off(app
.touchEvents
.start
, handleTouchStart
, { passive
: true });
35386 app
.off('touchmove:active', handleTouchMove
);
35387 app
.off('touchend:passive', handleTouchEnd
);
35392 function closeOnTimeout() {
35393 timeoutId
= Utils
.nextTick(function () {
35394 if (isTouched
&& isMoved
) {
35398 notification
.close();
35401 notification
.on('open', function () {
35402 if (notification
.params
.swipeToClose
) {
35403 attachTouchEvents();
35405 $('.notification.modal-in').each(function (index
, openedEl
) {
35406 var notificationInstance
= app
.notification
.get(openedEl
);
35407 if (openedEl
!== notification
.el
&& notificationInstance
) {
35408 notificationInstance
.close();
35411 if (closeTimeout
) {
35415 notification
.on('close beforeDestroy', function () {
35416 if (notification
.params
.swipeToClose
) {
35417 detachTouchEvents();
35419 win
.clearTimeout(timeoutId
);
35422 return notification
;
35425 if ( Modal
) Notification
.__proto__
= Modal
;
35426 Notification
.prototype = Object
.create( Modal
&& Modal
.prototype );
35427 Notification
.prototype.constructor = Notification
;
35429 Notification
.prototype.render
= function render () {
35430 var notification
= this;
35431 if (notification
.params
.render
) { return notification
.params
.render
.call(notification
, notification
); }
35432 var ref
= notification
.params
;
35433 var icon
= ref
.icon
;
35434 var title
= ref
.title
;
35435 var titleRightText
= ref
.titleRightText
;
35436 var subtitle
= ref
.subtitle
;
35437 var text
= ref
.text
;
35438 var closeButton
= ref
.closeButton
;
35439 var cssClass
= ref
.cssClass
;
35440 return ("\n <div class=\"notification " + (cssClass
|| '') + "\">\n <div class=\"notification-header\">\n " + (icon
? ("<div class=\"notification-icon\">" + icon
+ "</div>") : '') + "\n " + (title
? ("<div class=\"notification-title\">" + title
+ "</div>") : '') + "\n " + (titleRightText
? ("<div class=\"notification-title-right-text\">" + titleRightText
+ "</div>") : '') + "\n " + (closeButton
? '<span class="notification-close-button"></span>' : '') + "\n </div>\n <div class=\"notification-content\">\n " + (subtitle
? ("<div class=\"notification-subtitle\">" + subtitle
+ "</div>") : '') + "\n " + (text
? ("<div class=\"notification-text\">" + text
+ "</div>") : '') + "\n </div>\n </div>\n ").trim();
35443 return Notification
;
35446 var Notification
$1 = {
35447 name
: 'notification',
35449 Notification
: Notification
,
35451 create
: function create() {
35453 app
.notification
= Utils
.extend(
35457 constructor: Notification
,
35458 defaultSelector
: '.notification.modal-in',
35466 titleRightText
: null,
35469 closeButton
: false,
35470 closeTimeout
: null,
35471 closeOnClick
: false,
35472 swipeToClose
: true,
35479 /* eslint "no-useless-escape": "off" */
35481 var Autocomplete
= /*@__PURE__*/(function (Framework7Class
) {
35482 function Autocomplete(app
, params
) {
35483 if ( params
=== void 0 ) params
= {};
35485 Framework7Class
.call(this, params
, [app
]);
35490 var defaults
= Utils
.extend({
35492 }, app
.params
.autocomplete
);
35494 if (typeof defaults
.searchbarDisableButton
=== 'undefined') {
35495 defaults
.searchbarDisableButton
= app
.theme
!== 'aurora';
35498 // Extend defaults with modules params
35499 ac
.useModulesParams(defaults
);
35501 ac
.params
= Utils
.extend(defaults
, params
);
35504 if (ac
.params
.openerEl
) {
35505 $openerEl
= $(ac
.params
.openerEl
);
35506 if ($openerEl
.length
) { $openerEl
[0].f7Autocomplete
= ac
; }
35510 if (ac
.params
.inputEl
) {
35511 $inputEl
= $(ac
.params
.inputEl
);
35512 if ($inputEl
.length
) { $inputEl
[0].f7Autocomplete
= ac
; }
35516 if (ac
.params
.view
) {
35517 view
= ac
.params
.view
;
35518 } else if ($openerEl
|| $inputEl
) {
35519 var $el
= $openerEl
|| $inputEl
;
35520 view
= $el
.closest('.view').length
&& $el
.closest('.view')[0].f7View
;
35522 if (!view
) { view
= app
.views
.main
; }
35524 var id
= Utils
.id();
35526 var url
= params
.url
;
35527 if (!url
&& $openerEl
&& $openerEl
.length
) {
35528 if ($openerEl
.attr('href')) { url
= $openerEl
.attr('href'); }
35529 else if ($openerEl
.find('a').length
> 0) {
35530 url
= $openerEl
.find('a').attr('href');
35533 if (!url
|| url
=== '#' || url
=== '') { url
= ac
.params
.url
; }
35535 var inputType
= ac
.params
.multiple
? 'checkbox' : 'radio';
35538 $openerEl
: $openerEl
,
35539 openerEl
: $openerEl
&& $openerEl
[0],
35540 $inputEl
: $inputEl
,
35541 inputEl
: $inputEl
&& $inputEl
[0],
35545 value
: ac
.params
.value
|| [],
35546 inputType
: inputType
,
35547 inputName
: (inputType
+ "-" + id
),
35548 $modalEl
: undefined,
35549 $dropdownEl
: undefined,
35552 var previousQuery
= '';
35553 function onInputChange() {
35554 var query
= ac
.$inputEl
.val().trim();
35556 if (!ac
.params
.source
) { return; }
35557 ac
.params
.source
.call(ac
, query
, function (items
) {
35558 var itemsHTML
= '';
35559 var limit
= ac
.params
.limit
? Math
.min(ac
.params
.limit
, items
.length
) : items
.length
;
35562 if (ac
.params
.highlightMatches
) {
35563 query
= query
.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, '\\$&');
35564 regExp
= new RegExp(("(" + query
+ ")"), 'i');
35569 for (var i
= 0; i
< limit
; i
+= 1) {
35570 var itemValue
= typeof items
[i
] === 'object' ? items
[i
][ac
.params
.valueProperty
] : items
[i
];
35571 var itemText
= typeof items
[i
] === 'object' ? items
[i
][ac
.params
.textProperty
] : items
[i
];
35573 firstValue
= itemValue
;
35574 firstItem
= ac
.items
[i
];
35576 itemsHTML
+= ac
.renderItem({
35578 text
: ac
.params
.highlightMatches
? itemText
.replace(regExp
, '<b>$1</b>') : itemText
,
35581 if (itemsHTML
=== '' && query
=== '' && ac
.params
.dropdownPlaceholderText
) {
35582 itemsHTML
+= ac
.renderItem({
35584 text
: ac
.params
.dropdownPlaceholderText
,
35587 ac
.$dropdownEl
.find('ul').html(itemsHTML
);
35588 if (ac
.params
.typeahead
) {
35589 if (!firstValue
|| !firstItem
) {
35592 if (firstValue
.toLowerCase().indexOf(query
.toLowerCase()) !== 0) {
35595 if (previousQuery
.toLowerCase() === query
.toLowerCase()) {
35600 if (previousQuery
.toLowerCase().indexOf(query
.toLowerCase()) === 0) {
35601 previousQuery
= query
;
35605 $inputEl
.val(firstValue
);
35606 $inputEl
[0].setSelectionRange(query
.length
, firstValue
.length
);
35608 var previousValue
= typeof ac
.value
[0] === 'object' ? ac
.value
[0][ac
.params
.valueProperty
] : ac
.value
[0];
35609 if (!previousValue
|| firstValue
.toLowerCase() !== previousValue
.toLowerCase()) {
35610 ac
.value
= [firstItem
];
35611 ac
.emit('local::change autocompleteChange', [firstItem
]);
35615 previousQuery
= query
;
35618 function onPageInputChange() {
35620 var value
= input
.value
;
35621 var isValues
= $(input
).parents('.autocomplete-values').length
> 0;
35626 if (ac
.inputType
=== 'checkbox' && !input
.checked
) {
35627 for (var i
= 0; i
< ac
.value
.length
; i
+= 1) {
35628 aValue
= typeof ac
.value
[i
] === 'string' ? ac
.value
[i
] : ac
.value
[i
][ac
.params
.valueProperty
];
35629 if (aValue
=== value
|| aValue
* 1 === value
* 1) {
35630 ac
.value
.splice(i
, 1);
35634 ac
.emit('local::change autocompleteChange', ac
.value
);
35639 // Find Related Item
35640 for (var i
$1 = 0; i
$1 < ac
.items
.length
; i
$1 += 1) {
35641 itemValue
= typeof ac
.items
[i
$1] === 'object' ? ac
.items
[i
$1][ac
.params
.valueProperty
] : ac
.items
[i
$1];
35642 if (itemValue
=== value
|| itemValue
* 1 === value
* 1) { item
= ac
.items
[i
$1]; }
35644 if (ac
.inputType
=== 'radio') {
35646 } else if (input
.checked
) {
35647 ac
.value
.push(item
);
35649 for (var i
$2 = 0; i
$2 < ac
.value
.length
; i
$2 += 1) {
35650 aValue
= typeof ac
.value
[i
$2] === 'object' ? ac
.value
[i
$2][ac
.params
.valueProperty
] : ac
.value
[i
$2];
35651 if (aValue
=== value
|| aValue
* 1 === value
* 1) {
35652 ac
.value
.splice(i
$2, 1);
35657 // Update Values Block
35660 // On Select Callback
35661 if (((ac
.inputType
=== 'radio' && input
.checked
) || ac
.inputType
=== 'checkbox')) {
35662 ac
.emit('local::change autocompleteChange', ac
.value
);
35665 function onHtmlClick(e
) {
35666 var $targetEl
= $(e
.target
);
35667 if ($targetEl
.is(ac
.$inputEl
[0]) || (ac
.$dropdownEl
&& $targetEl
.closest(ac
.$dropdownEl
[0]).length
)) { return; }
35670 function onOpenerClick() {
35673 function onInputFocus() {
35676 function onInputBlur() {
35677 if (ac
.$dropdownEl
.find('label.active-state').length
> 0) { return; }
35678 setTimeout(function () {
35682 function onResize() {
35683 ac
.positionDropdown();
35686 function onKeyDown(e
) {
35687 if (!ac
.opened
) { return; }
35688 if (e
.keyCode
=== 27) {
35690 e
.preventDefault();
35691 ac
.$inputEl
.blur();
35694 if (e
.keyCode
=== 13) {
35696 var $selectedItemLabel
= ac
.$dropdownEl
.find('.autocomplete-dropdown-selected label');
35697 if ($selectedItemLabel
.length
) {
35698 e
.preventDefault();
35699 $selectedItemLabel
.trigger('click');
35700 ac
.$inputEl
.blur();
35703 if (ac
.params
.typeahead
) {
35704 e
.preventDefault();
35705 ac
.$inputEl
.blur();
35709 if (e
.keyCode
!== 40 && e
.keyCode
!== 38) { return; }
35710 e
.preventDefault();
35711 var $selectedItem
= ac
.$dropdownEl
.find('.autocomplete-dropdown-selected');
35713 if ($selectedItem
.length
) {
35714 $newItem
= $selectedItem
[e
.keyCode
=== 40 ? 'next' : 'prev']('li');
35715 if (!$newItem
.length
) {
35716 $newItem
= ac
.$dropdownEl
.find('li').eq(e
.keyCode
=== 40 ? 0 : ac
.$dropdownEl
.find('li').length
- 1);
35719 $newItem
= ac
.$dropdownEl
.find('li').eq(e
.keyCode
=== 40 ? 0 : ac
.$dropdownEl
.find('li').length
- 1);
35721 if ($newItem
.hasClass('autocomplete-dropdown-placeholder')) { return; }
35722 $selectedItem
.removeClass('autocomplete-dropdown-selected');
35723 $newItem
.addClass('autocomplete-dropdown-selected');
35725 function onDropdownClick() {
35726 var $clickedEl
= $(this);
35728 for (var i
= 0; i
< ac
.items
.length
; i
+= 1) {
35729 var itemValue
= typeof ac
.items
[i
] === 'object' ? ac
.items
[i
][ac
.params
.valueProperty
] : ac
.items
[i
];
35730 var value
= $clickedEl
.attr('data-value');
35731 if (itemValue
=== value
|| itemValue
* 1 === value
* 1) {
35732 clickedItem
= ac
.items
[i
];
35735 if (ac
.params
.updateInputValueOnSelect
) {
35736 ac
.$inputEl
.val(typeof clickedItem
=== 'object' ? clickedItem
[ac
.params
.valueProperty
] : clickedItem
);
35737 ac
.$inputEl
.trigger('input change');
35739 ac
.value
= [clickedItem
];
35740 ac
.emit('local::change autocompleteChange', [clickedItem
]);
35744 ac
.attachEvents
= function attachEvents() {
35745 if (ac
.params
.openIn
!== 'dropdown' && ac
.$openerEl
) {
35746 ac
.$openerEl
.on('click', onOpenerClick
);
35748 if (ac
.params
.openIn
=== 'dropdown' && ac
.$inputEl
) {
35749 ac
.$inputEl
.on('focus', onInputFocus
);
35750 ac
.$inputEl
.on(ac
.params
.inputEvents
, onInputChange
);
35751 if (app
.device
.android
) {
35752 $('html').on('click', onHtmlClick
);
35754 ac
.$inputEl
.on('blur', onInputBlur
);
35756 ac
.$inputEl
.on('keydown', onKeyDown
);
35759 ac
.detachEvents
= function attachEvents() {
35760 if (ac
.params
.openIn
!== 'dropdown' && ac
.$openerEl
) {
35761 ac
.$openerEl
.off('click', onOpenerClick
);
35763 if (ac
.params
.openIn
=== 'dropdown' && ac
.$inputEl
) {
35764 ac
.$inputEl
.off('focus', onInputFocus
);
35765 ac
.$inputEl
.off(ac
.params
.inputEvents
, onInputChange
);
35766 if (app
.device
.android
) {
35767 $('html').off('click', onHtmlClick
);
35769 ac
.$inputEl
.off('blur', onInputBlur
);
35771 ac
.$inputEl
.off('keydown', onKeyDown
);
35774 ac
.attachDropdownEvents
= function attachDropdownEvents() {
35775 ac
.$dropdownEl
.on('click', 'label', onDropdownClick
);
35776 app
.on('resize', onResize
);
35778 ac
.detachDropdownEvents
= function detachDropdownEvents() {
35779 ac
.$dropdownEl
.off('click', 'label', onDropdownClick
);
35780 app
.off('resize', onResize
);
35783 ac
.attachPageEvents
= function attachPageEvents() {
35784 ac
.$el
.on('change', 'input[type="radio"], input[type="checkbox"]', onPageInputChange
);
35785 if (ac
.params
.closeOnSelect
&& !ac
.params
.multiple
) {
35786 ac
.$el
.once('click', '.list label', function () {
35787 Utils
.nextTick(function () {
35793 ac
.detachPageEvents
= function detachPageEvents() {
35794 ac
.$el
.off('change', 'input[type="radio"], input[type="checkbox"]', onPageInputChange
);
35806 if ( Framework7Class
) Autocomplete
.__proto__
= Framework7Class
;
35807 Autocomplete
.prototype = Object
.create( Framework7Class
&& Framework7Class
.prototype );
35808 Autocomplete
.prototype.constructor = Autocomplete
;
35810 Autocomplete
.prototype.positionDropdown
= function positionDropdown () {
35814 var $inputEl
= ac
.$inputEl
;
35816 var $dropdownEl
= ac
.$dropdownEl
;
35818 var $pageContentEl
= $inputEl
.parents('.page-content');
35819 if ($pageContentEl
.length
=== 0) { return; }
35820 var inputOffset
= $inputEl
.offset();
35821 var inputOffsetWidth
= $inputEl
[0].offsetWidth
;
35822 var inputOffsetHeight
= $inputEl
[0].offsetHeight
;
35823 var $listEl
= $inputEl
.parents('.list');
35826 $listEl
.parents().each(function (index
, parentEl
) {
35827 if ($listParent
) { return; }
35828 var $parentEl
= $(parentEl
);
35829 if ($parentEl
.parent($pageContentEl
).length
) { $listParent
= $parentEl
; }
35832 var listOffset
= $listEl
.offset();
35833 var paddingBottom
= parseInt($pageContentEl
.css('padding-bottom'), 10);
35834 var listOffsetLeft
= $listEl
.length
> 0 ? listOffset
.left
- $pageContentEl
.offset().left
: 0;
35835 var inputOffsetLeft
= inputOffset
.left
- ($listEl
.length
> 0 ? listOffset
.left
: 0) - (app
.rtl
? 0 : 0);
35836 var inputOffsetTop
= inputOffset
.top
- ($pageContentEl
.offset().top
- $pageContentEl
[0].scrollTop
);
35838 var maxHeight
= $pageContentEl
[0].scrollHeight
- paddingBottom
- (inputOffsetTop
+ $pageContentEl
[0].scrollTop
) - $inputEl
[0].offsetHeight
;
35840 var paddingProp
= app
.rtl
? 'padding-right' : 'padding-left';
35842 if ($listEl
.length
&& !ac
.params
.expandInput
) {
35843 paddingValue
= (app
.rtl
? $listEl
[0].offsetWidth
- inputOffsetLeft
- inputOffsetWidth
: inputOffsetLeft
) - (app
.theme
=== 'md' ? 16 : 15);
35847 left
: (($listEl
.length
> 0 ? listOffsetLeft
: inputOffsetLeft
) + "px"),
35848 top
: ((inputOffsetTop
+ $pageContentEl
[0].scrollTop
+ inputOffsetHeight
) + "px"),
35849 width
: (($listEl
.length
> 0 ? $listEl
[0].offsetWidth
: inputOffsetWidth
) + "px"),
35851 $dropdownEl
.children('.autocomplete-dropdown-inner').css(( obj
= {
35852 maxHeight
: (maxHeight
+ "px")
35853 }, obj
[paddingProp
] = $listEl
.length
> 0 && !ac
.params
.expandInput
? (paddingValue
+ "px") : '', obj
));
35856 Autocomplete
.prototype.focus
= function focus () {
35858 ac
.$el
.find('input[type=search]').focus();
35861 Autocomplete
.prototype.source
= function source (query
) {
35863 if (!ac
.params
.source
) { return; }
35867 ac
.params
.source
.call(ac
, query
, function (items
) {
35868 var itemsHTML
= '';
35869 var limit
= ac
.params
.limit
? Math
.min(ac
.params
.limit
, items
.length
) : items
.length
;
35871 for (var i
= 0; i
< limit
; i
+= 1) {
35872 var selected
= false;
35873 var itemValue
= typeof items
[i
] === 'object' ? items
[i
][ac
.params
.valueProperty
] : items
[i
];
35874 for (var j
= 0; j
< ac
.value
.length
; j
+= 1) {
35875 var aValue
= typeof ac
.value
[j
] === 'object' ? ac
.value
[j
][ac
.params
.valueProperty
] : ac
.value
[j
];
35876 if (aValue
=== itemValue
|| aValue
* 1 === itemValue
* 1) { selected
= true; }
35878 itemsHTML
+= ac
.renderItem({
35880 text
: typeof items
[i
] === 'object' ? items
[i
][ac
.params
.textProperty
] : items
[i
],
35881 inputType
: ac
.inputType
,
35883 inputName
: ac
.inputName
,
35884 selected
: selected
,
35887 $el
.find('.autocomplete-found ul').html(itemsHTML
);
35888 if (items
.length
=== 0) {
35889 if (query
.length
!== 0) {
35890 $el
.find('.autocomplete-not-found').show();
35891 $el
.find('.autocomplete-found, .autocomplete-values').hide();
35893 $el
.find('.autocomplete-values').show();
35894 $el
.find('.autocomplete-found, .autocomplete-not-found').hide();
35897 $el
.find('.autocomplete-found').show();
35898 $el
.find('.autocomplete-not-found, .autocomplete-values').hide();
35903 Autocomplete
.prototype.updateValues
= function updateValues () {
35905 var valuesHTML
= '';
35906 for (var i
= 0; i
< ac
.value
.length
; i
+= 1) {
35907 valuesHTML
+= ac
.renderItem({
35908 value
: typeof ac
.value
[i
] === 'object' ? ac
.value
[i
][ac
.params
.valueProperty
] : ac
.value
[i
],
35909 text
: typeof ac
.value
[i
] === 'object' ? ac
.value
[i
][ac
.params
.textProperty
] : ac
.value
[i
],
35910 inputType
: ac
.inputType
,
35912 inputName
: ((ac
.inputName
) + "-checked}"),
35916 ac
.$el
.find('.autocomplete-values ul').html(valuesHTML
);
35919 Autocomplete
.prototype.preloaderHide
= function preloaderHide () {
35921 if (ac
.params
.openIn
=== 'dropdown' && ac
.$dropdownEl
) {
35922 ac
.$dropdownEl
.find('.autocomplete-preloader').removeClass('autocomplete-preloader-visible');
35924 $('.autocomplete-preloader').removeClass('autocomplete-preloader-visible');
35928 Autocomplete
.prototype.preloaderShow
= function preloaderShow () {
35930 if (ac
.params
.openIn
=== 'dropdown' && ac
.$dropdownEl
) {
35931 ac
.$dropdownEl
.find('.autocomplete-preloader').addClass('autocomplete-preloader-visible');
35933 $('.autocomplete-preloader').addClass('autocomplete-preloader-visible');
35937 Autocomplete
.prototype.renderPreloader
= function renderPreloader () {
35939 return ("\n <div class=\"autocomplete-preloader preloader " + (ac
.params
.preloaderColor
? ("color-" + (ac
.params
.preloaderColor
)) : '') + "\">" + (Utils
[((ac
.app
.theme
) + "PreloaderContent")] || '') + "</div>\n ").trim();
35942 Autocomplete
.prototype.renderSearchbar
= function renderSearchbar () {
35944 if (ac
.params
.renderSearchbar
) { return ac
.params
.renderSearchbar
.call(ac
); }
35945 var searchbarHTML
= ("\n <form class=\"searchbar\">\n <div class=\"searchbar-inner\">\n <div class=\"searchbar-input-wrap\">\n <input type=\"search\" placeholder=\"" + (ac
.params
.searchbarPlaceholder
) + "\"/>\n <i class=\"searchbar-icon\"></i>\n <span class=\"input-clear-button\"></span>\n </div>\n " + (ac
.params
.searchbarDisableButton
? ("\n <span class=\"searchbar-disable-button\">" + (ac
.params
.searchbarDisableText
) + "</span>\n ") : '') + "\n </div>\n </form>\n ").trim();
35946 return searchbarHTML
;
35949 Autocomplete
.prototype.renderItem
= function renderItem (item
, index
) {
35951 if (ac
.params
.renderItem
) { return ac
.params
.renderItem
.call(ac
, item
, index
); }
35953 var itemValue
= item
.value
&& typeof item
.value
=== 'string' ? item
.value
.replace(/"/g, '"') : item.value;
35954 if (ac.params.openIn !== 'dropdown') {
35955 itemHtml = "\n <li
>\n <label
class=\"item
-" + (item.inputType) + " item
-content
\">\n <input type
=\"" + (item.inputType) + "\" name
=\"" + (item.inputName) + "\" value
=\"" + itemValue + "\" " + (item.selected ? 'checked' : '') + ">\n <i
class=\"icon icon
-" + (item.inputType) + "\"></i>\n <div class=\"item-inner\">\n <div class=\"item-title\">" + (item.text) + "</div>\n </div>\n </label>\n </li
>\n ";
35956 } else if (!item.placeholder) {
35958 itemHtml = "\n <li
>\n <label
class=\"item
-radio item
-content
\" data
-value
=\"" + itemValue + "\">\n <div
class=\"item
-inner
\">\n <div
class=\"item
-title
\">" + (item.text) + "</div>\n </div>\n </label>\n </li>\n ";
35960 // Dropwdown placeholder
35961 itemHtml = "\n <li
class=\"autocomplete
-dropdown
-placeholder
\">\n <label
class=\"item
-content
\">\n <div
class=\"item
-inner
\">\n <div
class=\"item
-title
\">" + (item.text) + "</div>\n </div>\n </label>\n </li>\n ";
35963 return itemHtml.trim();
35966 Autocomplete.prototype.renderNavbar = function renderNavbar () {
35968 if (ac.params.renderNavbar) { return ac.params.renderNavbar.call(ac); }
35969 var pageTitle = ac.params.pageTitle;
35970 if (typeof pageTitle === 'undefined' && ac.$openerEl && ac.$openerEl.length) {
35971 pageTitle = ac.$openerEl.find('.item-title').text().trim();
35973 var inPopup = ac.params.openIn === 'popup';
35974 var navbarLeft = inPopup
35975 ? ("\n " + (ac.params.preloader ? ("\n <div
class=\"left
\">\n " + (ac.renderPreloader()) + "\n </div
>\n ") : '') + "\n ")
35976 : ("\n <div
class=\"left sliding
\">\n <a
class=\"link back
\">\n <i
class=\"icon icon
-back
\"></i>\n <span class=\"if-not-md\">" + (ac.params.pageBackLinkText) + "</span>\n </a>\n </div>\n ");
35977 var navbarRight = inPopup
35978 ? ("\n <div
class=\"right
\">\n <a
class=\"link popup
-close
\" data
-popup
=\".autocomplete
-popup
\">\n " + (ac.params.popupCloseLinkText) + "\n </a>\n </div>\n ")
35979 : ("\n " + (ac.params.preloader ? ("\n <div
class=\"right
\">\n " + (ac.renderPreloader()) + "\n </div
>\n ") : '') + "\n ");
35980 var navbarHtml = ("\n <div
class=\"navbar
" + (ac.params.navbarColorTheme ? ("color
-" + (ac.params.navbarColorTheme)) : '') + "\">\n <div
class=\"navbar
-inner
" + (ac.params.navbarColorTheme ? ("color
-" + (ac.params.navbarColorTheme)) : '') + "\">\n " + navbarLeft + "\n " + (pageTitle ? ("<div
class=\"title sliding
\">" + pageTitle + "</div>") : '') + "\n " + navbarRight + "\n <div class=\"subnavbar sliding\">" + (ac.renderSearchbar()) + "</div>\n </div>\n </div>\n ").trim();
35984 Autocomplete.prototype.renderDropdown = function renderDropdown () {
35986 if (ac.params.renderDropdown) { return ac.params.renderDropdown.call(ac, ac.items); }
35987 var dropdownHtml = ("\n <div
class=\"autocomplete
-dropdown
\">\n <div
class=\"autocomplete
-dropdown
-inner
\">\n <div
class=\"list
" + (!ac.params.expandInput ? 'no-safe-areas' : '') + "\">\n <ul
></ul>\n </div>\n </div>\n " + (ac.params.preloader ? ac.renderPreloader() : '') + "\n </div>\n ").trim();
35988 return dropdownHtml;
35991 Autocomplete.prototype.renderPage = function renderPage (inPopup) {
35993 if (ac.params.renderPage) { return ac.params.renderPage.call(ac, ac.items); }
35995 var pageHtml = ("\n <div
class=\"page page
-with-subnavbar autocomplete
-page
\" data
-name
=\"autocomplete
-page
\">\n " + (ac.renderNavbar(inPopup)) + "\n <div
class=\"searchbar
-backdrop
\"></div>\n <div class=\"page-content\">\n <div class=\"list autocomplete-list autocomplete-found autocomplete-list-" + (ac.id) + " " + (ac.params.formColorTheme ? ("color-" + (ac.params.formColorTheme)) : '') + "\">\n <ul></ul>\n </div>\n <div class=\"list autocomplete-not-found\">\n <ul>\n <li class=\"item-content\"><div class=\"item-inner\"><div class=\"item-title\">" + (ac.params.notFoundText) + "</div></div></li>\n </ul>\n </div>\n <div
class=\"list autocomplete
-values
\">\n <ul
></ul>\n </div>\n </div>\n </div>\n ").trim();
35999 Autocomplete.prototype.renderPopup = function renderPopup () {
36001 if (ac.params.renderPopup) { return ac.params.renderPopup.call(ac, ac.items); }
36002 var popupHtml = ("\n <div
class=\"popup autocomplete
-popup
\">\n <div
class=\"view
\">\n " + (ac.renderPage(true)) + ";\n </div>\n </div>\n ").trim();
36006 Autocomplete.prototype.onOpen = function onOpen (type, el) {
36012 ac.openedIn = type;
36015 if (ac.params.openIn === 'dropdown') {
36016 ac.attachDropdownEvents();
36018 ac.$dropdownEl.addClass('autocomplete-dropdown-in');
36019 ac.$inputEl.trigger('input');
36022 var $searchbarEl = $el.find('.searchbar');
36023 if (ac.params.openIn === 'page' && app.theme === 'ios' && $searchbarEl.length === 0) {
36024 $searchbarEl = $(app.navbar.getElByPage($el)).find('.searchbar');
36026 ac.searchbar = app.searchbar.create({
36028 backdropEl: $el.find('.searchbar-backdrop'),
36029 customSearch: true,
36031 search: function search(sb, query) {
36032 if (query.length === 0 && ac.searchbar.enabled) {
36033 ac.searchbar.backdropShow();
36035 ac.searchbar.backdropHide();
36042 // Attach page events
36043 ac.attachPageEvents();
36045 // Update Values On Page Init
36049 if (ac.params.requestSourceOnOpen) { ac.source(''); }
36052 ac.emit('local::open autocompleteOpen', ac);
36055 Autocomplete.prototype.autoFocus = function autoFocus () {
36057 if (ac.searchbar && ac.searchbar.$inputEl) {
36058 ac.searchbar.$inputEl.focus();
36063 Autocomplete.prototype.onOpened = function onOpened () {
36065 if (ac.params.openIn !== 'dropdown' && ac.params.autoFocus) {
36068 ac.emit('local::opened autocompleteOpened', ac);
36071 Autocomplete.prototype.onClose = function onClose () {
36073 if (ac.destroyed) { return; }
36076 if (ac.searchbar && ac.searchbar.destroy) {
36077 ac.searchbar.destroy();
36078 ac.searchbar = null;
36079 delete ac.searchbar;
36082 if (ac.params.openIn === 'dropdown') {
36083 ac.detachDropdownEvents();
36084 ac.$dropdownEl.removeClass('autocomplete-dropdown-in').remove();
36085 ac.$inputEl.parents('.item-content-dropdown-expanded').removeClass('item-content-dropdown-expanded');
36087 ac.detachPageEvents();
36090 ac.emit('local::close autocompleteClose', ac);
36093 Autocomplete.prototype.onClosed = function onClosed () {
36095 if (ac.destroyed) { return; }
36102 ac.emit('local::closed autocompleteClosed', ac);
36105 Autocomplete.prototype.openPage = function openPage () {
36107 if (ac.opened) { return ac; }
36108 var pageHtml = ac.renderPage();
36109 ac.view.router.navigate({
36115 pageBeforeIn: function pageBeforeIn(e, page) {
36116 ac.onOpen('page', page.el);
36118 pageAfterIn: function pageAfterIn(e, page) {
36119 ac.onOpened('page', page.el);
36121 pageBeforeOut: function pageBeforeOut(e, page) {
36122 ac.onClose('page', page.el);
36124 pageAfterOut: function pageAfterOut(e, page) {
36125 ac.onClosed('page', page.el);
36129 animate: ac.params.animate,
36136 Autocomplete.prototype.openPopup = function openPopup () {
36138 if (ac.opened) { return ac; }
36139 var popupHtml = ac.renderPopup();
36141 var popupParams = {
36142 content: popupHtml,
36143 animate: ac.params.animate,
36145 popupOpen: function popupOpen(popup) {
36146 ac.onOpen('popup', popup.el);
36148 popupOpened: function popupOpened(popup) {
36149 ac.onOpened('popup', popup.el);
36151 popupClose: function popupClose(popup) {
36152 ac.onClose('popup', popup.el);
36154 popupClosed: function popupClosed(popup) {
36155 ac.onClosed('popup', popup.el);
36160 if (ac.params.routableModals) {
36161 ac.view.router.navigate({
36165 popup: popupParams,
36169 ac.modal = ac.app.popup.create(popupParams).open(ac.params.animate);
36174 Autocomplete.prototype.openDropdown = function openDropdown () {
36177 if (!ac.$dropdownEl) {
36178 ac.$dropdownEl = $(ac.renderDropdown());
36180 var $listEl = ac.$inputEl.parents('.list');
36181 if ($listEl.length && ac.$inputEl.parents('.item-content').length > 0 && ac.params.expandInput) {
36182 ac.$inputEl.parents('.item-content').addClass('item-content-dropdown-expanded');
36185 var $pageContentEl = ac.$inputEl.parents('.page-content');
36186 if (ac.params.dropdownContainerEl) {
36187 $(ac.params.dropdownContainerEl).append(ac.$dropdownEl);
36188 } else if ($pageContentEl.length === 0) {
36189 ac.$dropdownEl.insertAfter(ac.$inputEl);
36191 ac.positionDropdown();
36192 $pageContentEl.append(ac.$dropdownEl);
36194 ac.onOpen('dropdown', ac.$dropdownEl);
36195 ac.onOpened('dropdown', ac.$dropdownEl);
36198 Autocomplete.prototype.open = function open () {
36200 if (ac.opened) { return ac; }
36201 var openIn = ac.params.openIn;
36202 ac[("open
" + (openIn.split('').map(function (el, index) {
36203 if (index === 0) { return el.toUpperCase(); }
36209 Autocomplete.prototype.close = function close () {
36211 if (!ac.opened) { return ac; }
36212 if (ac.params.openIn === 'dropdown') {
36215 } else if (ac.params.routableModals || ac.openedIn === 'page') {
36216 ac.view.router.back({ animate: ac.params.animate });
36218 ac.modal.once('modalClosed', function () {
36219 Utils.nextTick(function () {
36220 ac.modal.destroy();
36229 Autocomplete.prototype.init = function init () {
36234 Autocomplete.prototype.destroy = function destroy () {
36236 ac.emit('local::beforeDestroy autocompleteBeforeDestroy', ac);
36238 if (ac.$inputEl && ac.$inputEl[0]) {
36239 delete ac.$inputEl[0].f7Autocomplete;
36241 if (ac.$openerEl && ac.$openerEl[0]) {
36242 delete ac.$openerEl[0].f7Autocomplete;
36244 Utils.deleteProps(ac);
36245 ac.destroyed = true;
36248 return Autocomplete;
36249 }(Framework7Class));
36251 var Autocomplete$1 = {
36252 name: 'autocomplete',
36255 openerEl: undefined,
36256 inputEl: undefined,
36260 dropdownContainerEl: undefined,
36261 dropdownPlaceholderText: undefined,
36263 highlightMatches: true,
36264 expandInput: false,
36265 updateInputValueOnSelect: true,
36266 inputEvents: 'input',
36273 valueProperty: 'id',
36274 textProperty: 'text',
36276 openIn: 'page', // or 'popup' or 'dropdown'
36277 pageBackLinkText: 'Back',
36278 popupCloseLinkText: 'Close',
36279 pageTitle: undefined,
36280 searchbarPlaceholder: 'Search...',
36281 searchbarDisableText: 'Cancel',
36282 searchbarDisableButton: undefined,
36287 closeOnSelect: false,
36288 notFoundText: 'Nothing found',
36289 requestSourceOnOpen: false,
36292 preloaderColor: undefined,
36296 formColorTheme: undefined,
36297 navbarColorTheme: undefined,
36300 routableModals: true,
36303 // Custom render functions
36304 renderDropdown: undefined,
36305 renderPage: undefined,
36306 renderPopup: undefined,
36307 renderItem: undefined,
36308 renderSearchbar: undefined,
36309 renderNavbar: undefined,
36314 Autocomplete: Autocomplete,
36316 create: function create() {
36318 app.autocomplete = Utils.extend(
36319 ConstructorMethods({
36320 defaultSelector: undefined,
36321 constructor: Autocomplete,
36323 domProp: 'f7Autocomplete',
36326 open: function open(autocompleteEl) {
36327 var ac = app.autocomplete.get(autocompleteEl);
36328 if (ac && ac.open) { return ac.open(); }
36331 close: function close(autocompleteEl) {
36332 var ac = app.autocomplete.get(autocompleteEl);
36333 if (ac && ac.close) { return ac.close(); }
36341 var Tooltip = /*@__PURE__*/(function (Framework7Class) {
36342 function Tooltip(app, params) {
36343 if ( params === void 0 ) params = {};
36345 Framework7Class.call(this, params, [app]);
36347 var tooltip = this;
36349 var defaults = Utils.extend({}, app.params.tooltip);
36351 // Extend defaults with modules params
36352 tooltip.useModulesParams(defaults);
36354 tooltip.params = Utils.extend(defaults, params);
36356 var ref = tooltip.params;
36357 var targetEl = ref.targetEl;
36358 if (!targetEl) { return tooltip; }
36360 var $targetEl = $(targetEl);
36361 if ($targetEl.length === 0) { return tooltip; }
36363 if ($targetEl[0].f7Tooltip) { return $targetEl[0].f7Tooltip; }
36365 var $el = $(tooltip.render()).eq(0);
36367 Utils.extend(tooltip, {
36369 $targetEl: $targetEl,
36370 targetEl: $targetEl && $targetEl[0],
36373 text: tooltip.params.text || '',
36378 $targetEl[0].f7Tooltip = tooltip;
36380 var touchesStart = {};
36382 function handleTouchStart(e) {
36383 if (isTouched) { return; }
36385 touchesStart.x = e.type === 'touchstart' ? e.targetTouches[0].pageX : e.pageX;
36386 touchesStart.y = e.type === 'touchstart' ? e.targetTouches[0].pageY : e.pageY;
36387 tooltip.show(this);
36389 function handleTouchMove(e) {
36390 if (!isTouched) { return; }
36391 var x = e.type === 'touchmove' ? e.targetTouches[0].pageX : e.pageX;
36392 var y = e.type === 'touchmove' ? e.targetTouches[0].pageY : e.pageY;
36393 var distance = Math.pow( (
36394 (Math.pow( (x - touchesStart.x), 2 ))
36395 + (Math.pow( (y - touchesStart.y), 2 ))
36397 if (distance > 50) {
36402 function handleTouchEnd() {
36403 if (!isTouched) { return; }
36407 function handleMouseEnter() {
36408 tooltip.show(this);
36410 function handleMouseLeave() {
36413 function handleTransitionEnd() {
36414 if (!$el.hasClass('tooltip-in')) {
36415 $el.removeClass('tooltip-out').remove();
36419 tooltip.attachEvents = function attachEvents() {
36420 $el.on('transitionend', handleTransitionEnd);
36421 if (Support.touch) {
36422 var passive = Support.passiveListener ? { passive: true } : false;
36423 $targetEl.on(app.touchEvents.start, handleTouchStart, passive);
36424 app.on('touchmove', handleTouchMove);
36425 app.on('touchend:passive', handleTouchEnd);
36427 $targetEl.on('mouseenter', handleMouseEnter);
36428 $targetEl.on('mouseleave', handleMouseLeave);
36431 tooltip.detachEvents = function detachEvents() {
36432 $el.off('transitionend', handleTransitionEnd);
36433 if (Support.touch) {
36434 var passive = Support.passiveListener ? { passive: true } : false;
36435 $targetEl.off(app.touchEvents.start, handleTouchStart, passive);
36436 app.off('touchmove', handleTouchMove);
36437 app.off('touchend:passive', handleTouchEnd);
36439 $targetEl.off('mouseenter', handleMouseEnter);
36440 $targetEl.off('mouseleave', handleMouseLeave);
36445 tooltip.useModules();
36452 if ( Framework7Class ) Tooltip.__proto__ = Framework7Class;
36453 Tooltip.prototype = Object.create( Framework7Class && Framework7Class.prototype );
36454 Tooltip.prototype.constructor = Tooltip;
36456 Tooltip.prototype.position = function position (targetEl) {
36457 var tooltip = this;
36458 var $el = tooltip.$el;
36459 var app = tooltip.app;
36460 $el.css({ left: '', top: '' });
36461 var $targetEl = $(targetEl || tooltip.targetEl);
36462 var ref = [$el.width(), $el.height()];
36463 var width = ref[0];
36464 var height = ref[1];
36466 $el.css({ left: '', top: '' });
36470 var targetOffsetLeft;
36471 var targetOffsetTop;
36472 if ($targetEl && $targetEl.length > 0) {
36473 targetWidth = $targetEl.outerWidth();
36474 targetHeight = $targetEl.outerHeight();
36476 var targetOffset = $targetEl.offset();
36477 targetOffsetLeft = targetOffset.left - app.left;
36478 targetOffsetTop = targetOffset.top - app.top;
36480 var targetParentPage = $targetEl.parents('.page');
36481 if (targetParentPage.length > 0) {
36482 targetOffsetTop -= targetParentPage[0].scrollTop;
36485 var ref$1 = [0, 0, 0];
36486 var left = ref$1[0];
36487 var top = ref$1[1];
36490 var position = 'top';
36492 if (height < targetOffsetTop) {
36494 top = targetOffsetTop - height;
36495 } else if (height < app.height - targetOffsetTop - targetHeight) {
36497 position = 'bottom';
36498 top = targetOffsetTop + targetHeight;
36501 position = 'middle';
36502 top = ((targetHeight / 2) + targetOffsetTop) - (height / 2);
36505 } else if (top + height >= app.height) {
36506 top = app.height - height - 8;
36510 // Horizontal Position
36511 if (position === 'top' || position === 'bottom') {
36512 left = ((targetWidth / 2) + targetOffsetLeft) - (width / 2);
36513 if (left < 8) { left = 8; }
36514 if (left + width > app.width) { left = app.width - width - 8; }
36515 if (left < 0) { left = 0; }
36516 } else if (position === 'middle') {
36517 left = targetOffsetLeft - width;
36518 if (left < 8 || (left + width > app.width)) {
36519 if (left < 8) { left = targetOffsetLeft + targetWidth; }
36520 if (left + width > app.width) { left = app.width - width - 8; }
36525 $el.css({ top: (top + "px
"), left: (left + "px
") });
36528 Tooltip.prototype.show = function show (aroundEl) {
36529 var tooltip = this;
36530 var app = tooltip.app;
36531 var $el = tooltip.$el;
36532 var $targetEl = tooltip.$targetEl;
36533 app.root.append($el);
36534 tooltip.position(aroundEl);
36535 var $aroundEl = $(aroundEl);
36536 tooltip.visible = true;
36537 tooltip.opened = true;
36538 $targetEl.trigger('tooltip:show', tooltip);
36539 $el.trigger('tooltip:show', tooltip);
36540 if ($aroundEl.length && $aroundEl[0] !== $targetEl[0]) {
36541 $aroundEl.trigger('tooltip:show', tooltip);
36543 tooltip.emit('local::show tooltipShow', tooltip);
36544 $el.removeClass('tooltip-out').addClass('tooltip-in');
36548 Tooltip.prototype.hide = function hide () {
36549 var tooltip = this;
36550 var $el = tooltip.$el;
36551 var $targetEl = tooltip.$targetEl;
36552 tooltip.visible = false;
36553 tooltip.opened = false;
36554 $targetEl.trigger('tooltip:hide', tooltip);
36555 $el.trigger('tooltip:hide', tooltip);
36556 tooltip.emit('local::hide tooltipHide', tooltip);
36557 $el.addClass('tooltip-out').removeClass('tooltip-in');
36561 Tooltip.prototype.render = function render () {
36562 var tooltip = this;
36563 if (tooltip.params.render) { return tooltip.params.render.call(tooltip, tooltip); }
36564 var ref = tooltip.params;
36565 var cssClass = ref.cssClass;
36566 var text = ref.text;
36567 return ("\n <div
class=\"tooltip
" + (cssClass || '') + "\">\n <div
class=\"tooltip
-content
\">" + (text || '') + "</div>\n </div>\n ").trim();
36570 Tooltip.prototype.setText = function setText (newText) {
36571 var tooltip = this;
36572 if (typeof newText === 'undefined') {
36575 tooltip.params.text = newText;
36576 tooltip.text = newText;
36578 tooltip.$el.children('.tooltip-content').html(newText);
36580 if (tooltip.opened) {
36581 tooltip.position();
36586 Tooltip.prototype.init = function init () {
36587 var tooltip = this;
36588 tooltip.attachEvents();
36591 Tooltip.prototype.destroy = function destroy () {
36592 var tooltip = this;
36593 if (!tooltip.$targetEl || tooltip.destroyed) { return; }
36594 tooltip.$targetEl.trigger('tooltip:beforedestroy', tooltip);
36595 tooltip.emit('local::beforeDestroy tooltipBeforeDestroy', tooltip);
36596 tooltip.$el.remove();
36597 delete tooltip.$targetEl[0].f7Tooltip;
36598 tooltip.detachEvents();
36599 Utils.deleteProps(tooltip);
36600 tooltip.destroyed = true;
36604 }(Framework7Class));
36611 create: function create() {
36613 app.tooltip = ConstructorMethods({
36614 defaultSelector: '.tooltip',
36615 constructor: Tooltip,
36617 domProp: 'f7Tooltip',
36619 app.tooltip.show = function show(el) {
36621 if ($el.length === 0) { return undefined; }
36622 var tooltip = $el[0].f7Tooltip;
36623 if (!tooltip) { return undefined; }
36624 tooltip.show($el[0]);
36627 app.tooltip.hide = function hide(el) {
36629 if ($el.length === 0) { return undefined; }
36630 var tooltip = $el[0].f7Tooltip;
36631 if (!tooltip) { return undefined; }
36635 app.tooltip.setText = function text(el, newText) {
36637 if ($el.length === 0) { return undefined; }
36638 var tooltip = $el[0].f7Tooltip;
36639 if (!tooltip) { return undefined; }
36640 tooltip.setText(newText);
36653 tabMounted: function tabMounted(tabEl) {
36655 $(tabEl).find('.tooltip-init').each(function (index, el) {
36656 var text = $(el).attr('data-tooltip');
36657 if (!text) { return; }
36658 app.tooltip.create({ targetEl: el, text: text });
36661 tabBeforeRemove: function tabBeforeRemove(tabEl) {
36662 $(tabEl).find('.tooltip-init').each(function (index, el) {
36663 if (el.f7Tooltip) { el.f7Tooltip.destroy(); }
36666 pageInit: function pageInit(page) {
36668 page.$el.find('.tooltip-init').each(function (index, el) {
36669 var text = $(el).attr('data-tooltip');
36670 if (!text) { return; }
36671 app.tooltip.create({ targetEl: el, text: text });
36673 if (app.theme === 'ios' && page.view && page.view.router.separateNavbar && page.$navbarEl && page.$navbarEl.length > 0) {
36674 page.$navbarEl.find('.tooltip-init').each(function (index, el) {
36675 var text = $(el).attr('data-tooltip');
36676 if (!text) { return; }
36677 app.tooltip.create({ targetEl: el, text: text });
36681 pageBeforeRemove: function pageBeforeRemove(page) {
36683 page.$el.find('.tooltip-init').each(function (index, el) {
36684 if (el.f7Tooltip) { el.f7Tooltip.destroy(); }
36686 if (app.theme === 'ios' && page.view && page.view.router.separateNavbar && page.$navbarEl && page.$navbarEl.length > 0) {
36687 page.$navbarEl.find('.tooltip-init').each(function (index, el) {
36688 if (el.f7Tooltip) { el.f7Tooltip.destroy(); }
36695 insert: function insert(vnode) {
36697 var el = vnode.elm;
36698 var text = $(el).attr('data-tooltip');
36699 if (!text) { return; }
36700 app.tooltip.create({ targetEl: el, text: text });
36702 update: function update(vnode) {
36703 var el = vnode.elm;
36704 if (!el.f7Tooltip) { return; }
36705 if (vnode && vnode.data && vnode.data.attrs && vnode.data.attrs['data-tooltip']) {
36706 el.f7Tooltip.setText(vnode.data.attrs['data-tooltip']);
36709 destroy: function destroy(vnode) {
36710 var el = vnode.elm;
36711 if (el.f7Tooltip) { el.f7Tooltip.destroy(); }
36717 /* eslint no-nested-ternary: off */
36719 var Gauge = /*@__PURE__*/(function (Framework7Class) {
36720 function Gauge(app, params) {
36721 if ( params === void 0 ) params = {};
36723 // Extends with open/close Modal methods;
36724 Framework7Class.call(this, params, [app]);
36728 var defaults = Utils.extend({}, app.params.gauge);
36730 // Extend defaults with modules params
36731 gauge.useModulesParams(defaults);
36733 gauge.params = Utils.extend(defaults, params);
36735 var ref = gauge.params;
36737 if (!el) { return gauge; }
36740 if ($el.length === 0) { return gauge; }
36742 if ($el[0].f7Gauge) { return $el[0].f7Gauge; }
36744 Utils.extend(gauge, {
36750 $el[0].f7Gauge = gauge;
36753 gauge.useModules();
36760 if ( Framework7Class ) Gauge.__proto__ = Framework7Class;
36761 Gauge.prototype = Object.create( Framework7Class && Framework7Class.prototype );
36762 Gauge.prototype.constructor = Gauge;
36764 Gauge.prototype.calcRadius = function calcRadius () {
36766 var ref = gauge.params;
36767 var size = ref.size;
36768 var borderWidth = ref.borderWidth;
36769 return (size / 2) - (borderWidth / 2);
36772 Gauge.prototype.calcBorderLength = function calcBorderLength () {
36774 var radius = gauge.calcRadius();
36775 return 2 * Math.PI * radius;
36778 Gauge.prototype.render = function render () {
36780 if (gauge.params.render) { return gauge.params.render.call(gauge, gauge); }
36782 var ref = gauge.params;
36783 var type = ref.type;
36784 var value = ref.value;
36785 var size = ref.size;
36786 var bgColor = ref.bgColor;
36787 var borderBgColor = ref.borderBgColor;
36788 var borderColor = ref.borderColor;
36789 var borderWidth = ref.borderWidth;
36790 var valueText = ref.valueText;
36791 var valueTextColor = ref.valueTextColor;
36792 var valueFontSize = ref.valueFontSize;
36793 var valueFontWeight = ref.valueFontWeight;
36794 var labelText = ref.labelText;
36795 var labelTextColor = ref.labelTextColor;
36796 var labelFontSize = ref.labelFontSize;
36797 var labelFontWeight = ref.labelFontWeight;
36799 var semiCircle = type === 'semicircle';
36800 var radius = gauge.calcRadius();
36801 var length = gauge.calcBorderLength();
36802 var progress = Math.max(Math.min(value, 1), 0);
36804 return ("\n <svg
class=\"gauge
-svg
\" width
=\"" + size + "px
\" height
=\"" + (semiCircle ? size / 2 : size) + "px
\" viewBox
=\"0 0 " + size + " " + (semiCircle ? size / 2 : size) + "\">\n " + (semiCircle ? ("\n <path
\n class=\"gauge
-back
-semi
\"\n d
=\"M
" + (size - (borderWidth / 2)) + "," + (size / 2) + " a1
,1 0 0,0 -" + (size - borderWidth) + ",0\"\n stroke
=\"" + borderBgColor + "\"\n stroke
-width
=\"" + borderWidth + "\"\n fill
=\"" + (bgColor || 'none') + "\"\n />\n <path\n class=\"gauge-front-semi\"\n d=\"M" + (size - (borderWidth / 2)) + "," + (size
/ 2) + " a1,1 0 0,0 -" + (size
- borderWidth
) + ",0\"\n stroke=\"" + borderColor
+ "\"\n stroke-width=\"" + borderWidth
+ "\"\n stroke-dasharray=\"" + (length
/ 2) + "\"\n stroke-dashoffset=\"" + ((length
/ 2) * (1 + progress
)) + "\"\n fill=\"" + (borderBgColor
? 'none' : (bgColor
|| 'none')) + "\"\n />\n ") : ("\n " + (borderBgColor
? ("\n <circle\n class=\"gauge-back-circle\"\n stroke=\"" + borderBgColor
+ "\"\n stroke-width=\"" + borderWidth
+ "\"\n fill=\"" + (bgColor
|| 'none') + "\"\n cx=\"" + (size
/ 2) + "\"\n cy=\"" + (size
/ 2) + "\"\n r=\"" + radius
+ "\"\n ></circle>\n ") : '') + "\n <circle\n class=\"gauge-front-circle\"\n transform=\"" + ("rotate(-90 " + (size
/ 2) + " " + (size
/ 2) + ")") + "\"\n stroke=\"" + borderColor
+ "\"\n stroke-width=\"" + borderWidth
+ "\"\n stroke-dasharray=\"" + length
+ "\"\n stroke-dashoffset=\"" + (length
* (1 - progress
)) + "\"\n fill=\"" + (borderBgColor
? 'none' : bgColor
|| 'none') + "\"\n cx=\"" + (size
/ 2) + "\"\n cy=\"" + (size
/ 2) + "\"\n r=\"" + radius
+ "\"\n ></circle>\n ")) + "\n " + (valueText
? ("\n <text\n class=\"gauge-value-text\"\n x=\"50%\"\n y=\"" + (semiCircle
? '100%' : '50%') + "\"\n font-weight=\"" + valueFontWeight
+ "\"\n font-size=\"" + valueFontSize
+ "\"\n fill=\"" + valueTextColor
+ "\"\n dy=\"" + (semiCircle
? (labelText
? -labelFontSize
- 15 : -5) : 0) + "\"\n text-anchor=\"middle\"\n dominant-baseline=\"" + (!semiCircle
&& 'middle') + "\"\n >" + valueText
+ "</text>\n ") : '') + "\n " + (labelText
? ("\n <text\n class=\"gauge-label-text\"\n x=\"50%\"\n y=\"" + (semiCircle
? '100%' : '50%') + "\"\n font-weight=\"" + labelFontWeight
+ "\"\n font-size=\"" + labelFontSize
+ "\"\n fill=\"" + labelTextColor
+ "\"\n dy=\"" + (semiCircle
? -5 : (valueText
? ((valueFontSize
/ 2) + 10) : 0)) + "\"\n text-anchor=\"middle\"\n dominant-baseline=\"" + (!semiCircle
&& 'middle') + "\"\n >" + labelText
+ "</text>\n ") : '') + "\n </svg>\n ").trim();
36807 Gauge
.prototype.update
= function update (newParams
) {
36808 if ( newParams
=== void 0 ) newParams
= {};
36811 var params
= gauge
.params
;
36812 var $gaugeSvgEl
= gauge
.$gaugeSvgEl
;
36814 Object
.keys(newParams
).forEach(function (param
) {
36815 if (typeof newParams
[param
] !== 'undefined') {
36816 params
[param
] = newParams
[param
];
36819 if ($gaugeSvgEl
.length
=== 0) { return gauge
; }
36821 var value
= params
.value
;
36822 var size
= params
.size
;
36823 var bgColor
= params
.bgColor
;
36824 var borderBgColor
= params
.borderBgColor
;
36825 var borderColor
= params
.borderColor
;
36826 var borderWidth
= params
.borderWidth
;
36827 var valueText
= params
.valueText
;
36828 var valueTextColor
= params
.valueTextColor
;
36829 var valueFontSize
= params
.valueFontSize
;
36830 var valueFontWeight
= params
.valueFontWeight
;
36831 var labelText
= params
.labelText
;
36832 var labelTextColor
= params
.labelTextColor
;
36833 var labelFontSize
= params
.labelFontSize
;
36834 var labelFontWeight
= params
.labelFontWeight
;
36836 var length
= gauge
.calcBorderLength();
36837 var progress
= Math
.max(Math
.min(value
, 1), 0);
36838 var radius
= gauge
.calcRadius();
36839 var semiCircle
= params
.type
=== 'semicircle';
36842 width
: (size
+ "px"),
36843 height
: ((semiCircle
? size
/ 2 : size
) + "px"),
36844 viewBox
: ("0 0 " + size
+ " " + (semiCircle
? size
/ 2 : size
)),
36846 Object
.keys(svgAttrs
).forEach(function (attr
) {
36847 $gaugeSvgEl
.attr(attr
, svgAttrs
[attr
]);
36851 d
: ("M" + (size
- (borderWidth
/ 2)) + "," + (size
/ 2) + " a1,1 0 0,0 -" + (size
- borderWidth
) + ",0"),
36852 stroke
: borderBgColor
,
36853 'stroke-width': borderWidth
,
36854 fill
: bgColor
|| 'none',
36857 d
: ("M" + (size
- (borderWidth
/ 2)) + "," + (size
/ 2) + " a1,1 0 0,0 -" + (size
- borderWidth
) + ",0"),
36858 stroke
: borderColor
,
36859 'stroke-width': borderWidth
,
36860 'stroke-dasharray': length
/ 2,
36861 'stroke-dashoffset': (length
/ 2) * (progress
- 1),
36862 fill
: borderBgColor
? 'none' : (bgColor
|| 'none'),
36864 Object
.keys(backAttrs
).forEach(function (attr
) {
36865 $gaugeSvgEl
.find('.gauge-back-semi').attr(attr
, backAttrs
[attr
]);
36867 Object
.keys(frontAttrs
).forEach(function (attr
) {
36868 $gaugeSvgEl
.find('.gauge-front-semi').attr(attr
, frontAttrs
[attr
]);
36871 var backAttrs
$1 = {
36872 stroke
: borderBgColor
,
36873 'stroke-width': borderWidth
,
36874 fill
: bgColor
|| 'none',
36879 var frontAttrs
$1 = {
36880 transform
: ("rotate(-90 " + (size
/ 2) + " " + (size
/ 2) + ")"),
36881 stroke
: borderColor
,
36882 'stroke-width': borderWidth
,
36883 'stroke-dasharray': length
,
36884 'stroke-dashoffset': length
* (1 - progress
),
36885 fill
: borderBgColor
? 'none' : bgColor
|| 'none',
36890 Object
.keys(backAttrs
$1).forEach(function (attr
) {
36891 $gaugeSvgEl
.find('.gauge-back-circle').attr(attr
, backAttrs
$1[attr
]);
36893 Object
.keys(frontAttrs
$1).forEach(function (attr
) {
36894 $gaugeSvgEl
.find('.gauge-front-circle').attr(attr
, frontAttrs
$1[attr
]);
36898 if (!$gaugeSvgEl
.find('.gauge-value-text').length
) {
36899 $gaugeSvgEl
.append('<text class="gauge-value-text"></text>');
36903 y
: semiCircle
? '100%' : '50%',
36904 'font-weight': valueFontWeight
,
36905 'font-size': valueFontSize
,
36906 fill
: valueTextColor
,
36907 dy
: semiCircle
? (labelText
? -labelFontSize
- 15 : -5) : 0,
36908 'text-anchor': 'middle',
36909 'dominant-baseline': !semiCircle
&& 'middle',
36911 Object
.keys(textAttrs
).forEach(function (attr
) {
36912 $gaugeSvgEl
.find('.gauge-value-text').attr(attr
, textAttrs
[attr
]);
36914 $gaugeSvgEl
.find('.gauge-value-text').text(valueText
);
36916 $gaugeSvgEl
.find('.gauge-value-text').remove();
36919 if (!$gaugeSvgEl
.find('.gauge-label-text').length
) {
36920 $gaugeSvgEl
.append('<text class="gauge-label-text"></text>');
36924 y
: semiCircle
? '100%' : '50%',
36925 'font-weight': labelFontWeight
,
36926 'font-size': labelFontSize
,
36927 fill
: labelTextColor
,
36928 dy
: semiCircle
? -5 : (valueText
? ((valueFontSize
/ 2) + 10) : 0),
36929 'text-anchor': 'middle',
36930 'dominant-baseline': !semiCircle
&& 'middle',
36932 Object
.keys(labelAttrs
).forEach(function (attr
) {
36933 $gaugeSvgEl
.find('.gauge-label-text').attr(attr
, labelAttrs
[attr
]);
36935 $gaugeSvgEl
.find('.gauge-label-text').text(labelText
);
36937 $gaugeSvgEl
.find('.gauge-label-text').remove();
36942 Gauge
.prototype.init
= function init () {
36944 var $gaugeSvgEl
= $(gauge
.render()).eq(0);
36945 $gaugeSvgEl
.f7Gauge
= gauge
;
36946 Utils
.extend(gauge
, {
36947 $gaugeSvgEl
: $gaugeSvgEl
,
36948 gaugeSvgEl
: $gaugeSvgEl
&& $gaugeSvgEl
[0],
36950 gauge
.$el
.append($gaugeSvgEl
);
36954 Gauge
.prototype.destroy
= function destroy () {
36956 if (!gauge
.$el
|| gauge
.destroyed
) { return; }
36957 gauge
.$el
.trigger('gauge:beforedestroy', gauge
);
36958 gauge
.emit('local::beforeDestroy gaugeBeforeDestroy', gauge
);
36959 gauge
.$gaugeSvgEl
.remove();
36960 delete gauge
.$el
[0].f7Gauge
;
36961 Utils
.deleteProps(gauge
);
36962 gauge
.destroyed
= true;
36966 }(Framework7Class
));
36973 create
: function create() {
36975 app
.gauge
= ConstructorMethods({
36976 defaultSelector
: '.gauge',
36977 constructor: Gauge
,
36979 domProp
: 'f7Gauge',
36981 app
.gauge
.update
= function update(el
, newParams
) {
36983 if ($el
.length
=== 0) { return undefined; }
36984 var gauge
= app
.gauge
.get(el
);
36985 if (!gauge
) { return undefined; }
36986 gauge
.update(newParams
);
36996 bgColor
: 'transparent',
36997 borderBgColor
: '#eeeeee',
36998 borderColor
: '#000000',
37001 valueTextColor
: '#000000',
37003 valueFontWeight
: 500,
37005 labelTextColor
: '#888888',
37007 labelFontWeight
: 400,
37011 tabMounted
: function tabMounted(tabEl
) {
37013 $(tabEl
).find('.gauge-init').each(function (index
, el
) {
37014 app
.gauge
.create(Utils
.extend({ el
: el
}, $(el
).dataset() || {}));
37017 tabBeforeRemove
: function tabBeforeRemove(tabEl
) {
37018 $(tabEl
).find('.gauge-init').each(function (index
, el
) {
37019 if (el
.f7Gauge
) { el
.f7Gauge
.destroy(); }
37022 pageInit
: function pageInit(page
) {
37024 page
.$el
.find('.gauge-init').each(function (index
, el
) {
37025 app
.gauge
.create(Utils
.extend({ el
: el
}, $(el
).dataset() || {}));
37028 pageBeforeRemove
: function pageBeforeRemove(page
) {
37029 page
.$el
.find('.gauge-init').each(function (index
, el
) {
37030 if (el
.f7Gauge
) { el
.f7Gauge
.destroy(); }
37036 insert
: function insert(vnode
) {
37038 var el
= vnode
.elm
;
37039 app
.gauge
.create(Utils
.extend({ el
: el
}, $(el
).dataset() || {}));
37041 destroy
: function destroy(vnode
) {
37042 var el
= vnode
.elm
;
37043 if (el
.f7Gauge
) { el
.f7Gauge
.destroy(); }
37054 open
: function open(el
) {
37055 if ( el
=== void 0 ) el
= '.menu-item-dropdown';
37058 if (!el
) { return; }
37059 var $el
= $(el
).closest('.menu-item-dropdown');
37060 if (!$el
.length
) { return; }
37061 var $menuEl
= $el
.closest('.menu').eq(0);
37062 if ($menuEl
.length
) {
37063 var zIndex
= $menuEl
.css('z-index');
37064 var originalZIndex
= $menuEl
[0].style
.zIndex
;
37065 $menuEl
.css('z-index', parseInt(zIndex
|| 0, 0) + 1);
37066 $menuEl
[0].f7MenuZIndex
= originalZIndex
;
37068 $el
.eq(0).addClass('menu-item-dropdown-opened').trigger('menu:opened');
37069 app
.emit('menuOpened', $el
.eq(0)[0]);
37071 close
: function close(el
) {
37072 if ( el
=== void 0 ) el
= '.menu-item-dropdown-opened';
37075 if (!el
) { return; }
37076 var $el
= $(el
).closest('.menu-item-dropdown-opened');
37077 if (!$el
.length
) { return; }
37078 var $menuEl
= $el
.closest('.menu').eq(0);
37079 if ($menuEl
.length
) {
37080 var zIndex
= $menuEl
[0].f7MenuZIndex
;
37081 $menuEl
.css('z-index', zIndex
);
37082 delete $menuEl
[0].f7MenuZIndex
;
37084 $el
.eq(0).removeClass('menu-item-dropdown-opened').trigger('menu:closed');
37085 app
.emit('menuClosed', $el
.eq(0)[0]);
37091 create
: function create() {
37094 open
: Menu
.open
.bind(app
),
37095 close
: Menu
.close
.bind(app
),
37099 click
: function click(e
) {
37101 var openedMenus
= $('.menu-item-dropdown-opened');
37102 if (!openedMenus
.length
) { return; }
37103 openedMenus
.each(function (index
, el
) {
37104 if (!$(e
.target
).closest('.menu-item-dropdown-opened').length
) {
37105 app
.menu
.close(el
);
37111 '.menu-item-dropdown': function onClick($clickedEl
, dataset
, e
) {
37113 if ($clickedEl
.hasClass('menu-item-dropdown-opened')) {
37114 if ($(e
.target
).closest('.menu-dropdown').length
) { return; }
37115 app
.menu
.close($clickedEl
);
37117 app
.menu
.open($clickedEl
);
37120 '.menu-close': function onClick() {
37127 var moduleAlphaSlider
= {
37128 render
: function render(self
) {
37129 var ref
= self
.params
;
37130 var sliderLabel
= ref
.sliderLabel
;
37131 var sliderValue
= ref
.sliderValue
;
37132 var sliderValueEditable
= ref
.sliderValueEditable
;
37133 var alphaLabelText
= ref
.alphaLabelText
;
37134 return ("\n <div class=\"color-picker-module color-picker-module-alpha-slider\">\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + alphaLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-alpha\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"0.01\" min=\"0\" max=\"1\" class=\"color-picker-value-alpha\">\n " : "\n <span class=\"color-picker-value-alpha\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n </div>\n ");
37136 init
: function init(self
) {
37137 self
.alphaRangeSlider
= self
.app
.range
.create({
37138 el
: self
.$el
.find('.color-picker-slider-alpha'),
37144 change
: function change(range
, value
) {
37145 var alpha
= Math
.floor(value
* 100) / 100;
37146 self
.setValue({ alpha
: alpha
});
37150 function handleInputChange(e
) {
37151 var alpha
= self
.value
.alpha
;
37152 var value
= parseFloat(e
.target
.value
);
37153 if (Number
.isNaN(value
)) {
37154 e
.target
.value
= alpha
;
37157 value
= Math
.max(0, Math
.min(1, value
));
37158 self
.setValue({ alpha
: value
});
37161 self
.$el
.on('change', '.color-picker-module-alpha-slider input', handleInputChange
);
37163 self
.destroyAlphaSliderEvents
= function destroyAlphaSliderEvents() {
37164 self
.$el
.off('change', '.color-picker-module-alpha-slider input', handleInputChange
);
37167 update
: function update(self
) {
37168 var value
= self
.value
;
37169 var ref
= self
.params
;
37170 var sliderValue
= ref
.sliderValue
;
37171 var sliderValueEditable
= ref
.sliderValueEditable
;
37173 var alpha
= value
.alpha
;
37174 self
.alphaRangeSlider
.value
= alpha
;
37175 self
.alphaRangeSlider
.layout();
37176 if (sliderValue
&& sliderValueEditable
) {
37177 self
.$el
.find('input.color-picker-value-alpha').val(alpha
);
37179 self
.$el
.find('span.color-picker-value-alpha').text(alpha
);
37182 destroy
: function destroy(self
) {
37183 if (self
.alphaRangeSlider
&& self
.alphaRangeSlider
.destroy
) {
37184 self
.alphaRangeSlider
.destroy();
37186 delete self
.alphaRangeSlider
;
37188 if (self
.destroyAlphaSliderEvents
) { self
.destroyAlphaSliderEvents(); }
37189 delete self
.destroyAlphaSliderEvents
;
37193 var moduleCurrentColor
= {
37194 render
: function render() {
37195 return "\n <div class=\"color-picker-module color-picker-module-current-color\">\n <div class=\"color-picker-current-color\"></div>\n </div>\n ";
37197 update
: function update(self
) {
37198 self
.$el
.find('.color-picker-module-current-color .color-picker-current-color').css(
37199 'background-color',
37206 render
: function render(self
) {
37207 var ref
= self
.params
;
37208 var hexLabel
= ref
.hexLabel
;
37209 var hexLabelText
= ref
.hexLabelText
;
37210 var hexValueEditable
= ref
.hexValueEditable
;
37211 return ("\n <div class=\"color-picker-module color-picker-module-hex\">\n <div class=\"color-picker-hex-wrap\">\n " + (hexLabel
? ("\n <div class=\"color-picker-hex-label\">" + hexLabelText
+ "</div>\n ") : '') + "\n <div class=\"color-picker-hex-value\">\n " + (hexValueEditable
? "\n <input type=\"text\" class=\"color-picker-value-hex\">\n " : "\n <span class=\"color-picker-value-hex\"></span>\n ") + "\n </div>\n </div>\n </div>\n ");
37213 init
: function init(self
) {
37214 function handleInputChange(e
) {
37215 var hex
= self
.value
.hex
;
37216 var value
= e
.target
.value
.replace(/#/g
, '');
37217 if (Number
.isNaN(value
) || !value
|| (value
.length
!== 3 && value
.length
!== 6)) {
37218 e
.target
.value
= hex
;
37222 var current
= parseInt(value
, 16);
37223 var max
= parseInt('ffffff', 16); // eslint-disable-line
37224 if (current
> max
) {
37227 if (current
< min
) {
37230 self
.setValue({ hex
: value
});
37233 self
.$el
.on('change', '.color-picker-module-hex input', handleInputChange
);
37235 self
.destroyHexEvents
= function destroyHexEvents() {
37236 self
.$el
.off('change', '.color-picker-module-hex input', handleInputChange
);
37239 update
: function update(self
) {
37240 var value
= self
.value
;
37242 var ref
= self
.params
;
37243 var hexValueEditable
= ref
.hexValueEditable
;
37245 var hex
= value
.hex
;
37246 if (hexValueEditable
) {
37247 self
.$el
.find('input.color-picker-value-hex').val(hex
);
37249 self
.$el
.find('span.color-picker-value-hex').text(hex
);
37252 destroy
: function destroy(self
) {
37253 if (self
.destroyHexEvents
) { self
.destroyHexEvents(); }
37254 delete self
.destroyHexEvents
;
37258 var moduleHsbSliders
= {
37259 render
: function render(self
) {
37260 var ref
= self
.params
;
37261 var sliderLabel
= ref
.sliderLabel
;
37262 var sliderValue
= ref
.sliderValue
;
37263 var sliderValueEditable
= ref
.sliderValueEditable
;
37264 var hueLabelText
= ref
.hueLabelText
;
37265 var saturationLabelText
= ref
.saturationLabelText
;
37266 var brightnessLabelText
= ref
.brightnessLabelText
;
37267 return ("\n <div class=\"color-picker-module color-picker-module-hsb-sliders\">\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + hueLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-hue\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"0.1\" min=\"0\" max=\"360\" class=\"color-picker-value-hue\" data-color-index=\"0\">\n " : "\n <span class=\"color-picker-value-hue\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + saturationLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-saturation\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"0.1\" min=\"0\" max=\"100\" class=\"color-picker-value-saturation\" data-color-index=\"1\">\n " : "\n <span class=\"color-picker-value-saturation\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + brightnessLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-brightness\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"0.1\" min=\"0\" max=\"100\" class=\"color-picker-value-brightness\" data-color-index=\"2\">\n " : "\n <span class=\"color-picker-value-brightness\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n </div>\n ");
37269 init
: function init(self
) {
37270 self
.hueRangeSlider
= self
.app
.range
.create({
37271 el
: self
.$el
.find('.color-picker-slider-hue'),
37277 change
: function change(range
, value
) {
37278 self
.setValue({ hue
: value
});
37282 self
.saturationRangeSlider
= self
.app
.range
.create({
37283 el
: self
.$el
.find('.color-picker-slider-saturation'),
37289 change
: function change(range
, value
) {
37290 var s
= Math
.floor(value
* 1000) / 1000;
37291 self
.setValue({ hsb
: [self
.value
.hsb
[0], s
, self
.value
.hsb
[2]] });
37295 self
.brightnessRangeSlider
= self
.app
.range
.create({
37296 el
: self
.$el
.find('.color-picker-slider-brightness'),
37302 change
: function change(range
, value
) {
37303 var b
= Math
.floor(value
* 1000) / 1000;
37304 self
.setValue({ hsb
: [self
.value
.hsb
[0], self
.value
.hsb
[1], b
] });
37309 function handleInputChange(e
) {
37310 var hsb
= [].concat( self
.value
.hsb
);
37311 var index
= parseInt($(e
.target
).attr('data-color-index'), 10);
37312 var value
= parseFloat(e
.target
.value
);
37313 if (Number
.isNaN(value
)) {
37314 e
.target
.value
= hsb
[index
];
37318 value
= Math
.max(0, Math
.min(360, value
));
37320 value
= Math
.max(0, Math
.min(100, value
)) / 100;
37323 hsb
[index
] = value
;
37324 self
.setValue({ hsb
: hsb
});
37327 self
.$el
.on('change', '.color-picker-module-hsb-sliders input', handleInputChange
);
37329 self
.destroyHsbSlidersEvents
= function destroyHsbSlidersEvents() {
37330 self
.$el
.off('change', '.color-picker-module-hsb-sliders input', handleInputChange
);
37333 update
: function update(self
) {
37334 var app
= self
.app
;
37335 var value
= self
.value
;
37336 var ref
= self
.params
;
37337 var sliderValue
= ref
.sliderValue
;
37338 var sliderValueEditable
= ref
.sliderValueEditable
;
37340 var hsb
= value
.hsb
;
37341 var hue
= value
.hue
;
37343 self
.hueRangeSlider
.value
= hue
;
37344 self
.saturationRangeSlider
.value
= hsb
[1];
37345 self
.brightnessRangeSlider
.value
= hsb
[2];
37347 self
.hueRangeSlider
.layout();
37348 self
.saturationRangeSlider
.layout();
37349 self
.brightnessRangeSlider
.layout();
37351 var hslCurrent
= Utils
.colorHsbToHsl(hsb
[0], hsb
[1], 1);
37352 var hslLeft
= Utils
.colorHsbToHsl(hsb
[0], 0, 1);
37353 var hslRight
= Utils
.colorHsbToHsl(hsb
[0], 1, 1);
37354 var brightness
= hsb
[2];
37356 self
.hueRangeSlider
.$el
[0].style
.setProperty(
37357 '--f7-range-knob-color',
37358 ("hsl(" + hue
+ ", 100%, 50%)")
37360 self
.saturationRangeSlider
.$el
[0].style
.setProperty(
37361 '--f7-range-knob-color',
37362 ("hsl(" + (hslCurrent
[0]) + ", " + (hslCurrent
[1] * 100) + "%, " + (hslCurrent
[2] * 100) + "%)")
37364 self
.brightnessRangeSlider
.$el
[0].style
.setProperty(
37365 '--f7-range-knob-color',
37366 ("rgb(" + (brightness
* 255) + ", " + (brightness
* 255) + ", " + (brightness
* 255) + ")")
37368 self
.saturationRangeSlider
.$el
.find('.range-bar').css(
37369 'background-image',
37370 ("linear-gradient(" + (app
.rtl
? 'to left' : 'to right') + ", hsl(" + (hslLeft
[0]) + ", " + (hslLeft
[1] * 100) + "%, " + (hslLeft
[2] * 100) + "%), hsl(" + (hslRight
[0]) + ", " + (hslRight
[1] * 100) + "%, " + (hslRight
[2] * 100) + "%))")
37373 if (sliderValue
&& sliderValueEditable
) {
37374 self
.$el
.find('input.color-picker-value-hue').val(("" + hue
));
37375 self
.$el
.find('input.color-picker-value-saturation').val(("" + (hsb
[1] * 1000 / 10)));
37376 self
.$el
.find('input.color-picker-value-brightness').val(("" + (hsb
[2] * 1000 / 10)));
37377 } else if (sliderValue
) {
37378 self
.$el
.find('span.color-picker-value-hue').text(("" + hue
));
37379 self
.$el
.find('span.color-picker-value-saturation').text(("" + (hsb
[1] * 1000 / 10)));
37380 self
.$el
.find('span.color-picker-value-brightness').text(("" + (hsb
[2] * 1000 / 10)));
37383 destroy
: function destroy(self
) {
37384 if (self
.hueRangeSlider
&& self
.hueRangeSlider
.destroy
) {
37385 self
.hueRangeSlider
.destroy();
37387 if (self
.saturationRangeSlider
&& self
.saturationRangeSlider
.destroy
) {
37388 self
.saturationRangeSlider
.destroy();
37390 if (self
.brightnessRangeSlider
&& self
.brightnessRangeSlider
.destroy
) {
37391 self
.brightnessRangeSlider
.destroy();
37394 delete self
.hueRangeSlider
;
37395 delete self
.saturationRangeSlider
;
37396 delete self
.brightnessRangeSlider
;
37398 if (self
.destroyHsbSlidersEvents
) { self
.destroyHsbSlidersEvents(); }
37399 delete self
.destroyHsbSlidersEvents
;
37403 var moduleHueSlider
= {
37404 render
: function render(self
) {
37405 var ref
= self
.params
;
37406 var sliderLabel
= ref
.sliderLabel
;
37407 var sliderValue
= ref
.sliderValue
;
37408 var sliderValueEditable
= ref
.sliderValueEditable
;
37409 var hueLabelText
= ref
.hueLabelText
;
37410 return ("\n <div class=\"color-picker-module color-picker-module-hue-slider\">\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + hueLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-hue\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"0.1\" min=\"0\" max=\"360\" class=\"color-picker-value-hue\">\n " : "\n <span class=\"color-picker-value-hue\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n </div>\n ");
37412 init
: function init(self
) {
37413 self
.hueRangeSlider
= self
.app
.range
.create({
37414 el
: self
.$el
.find('.color-picker-slider-hue'),
37420 change
: function change(range
, value
) {
37421 self
.setValue({ hue
: value
});
37426 update
: function update(self
) {
37427 var value
= self
.value
;
37428 var ref
= self
.params
;
37429 var sliderValue
= ref
.sliderValue
;
37430 var sliderValueEditable
= ref
.sliderValueEditable
;
37432 var hue
= value
.hue
;
37434 self
.hueRangeSlider
.value
= hue
;
37435 self
.hueRangeSlider
.layout();
37436 self
.hueRangeSlider
.$el
[0].style
.setProperty(
37437 '--f7-range-knob-color',
37438 ("hsl(" + hue
+ ", 100%, 50%)")
37440 if (sliderValue
&& sliderValueEditable
) {
37441 self
.$el
.find('input.color-picker-value-hue').val(("" + hue
));
37442 } else if (sliderValue
) {
37443 self
.$el
.find('span.color-picker-value-hue').text(("" + hue
));
37446 destroy
: function destroy(self
) {
37447 if (self
.hueRangeSlider
&& self
.hueRangeSlider
.destroy
) {
37448 self
.hueRangeSlider
.destroy();
37450 delete self
.hueRangeSlider
;
37454 var moduleBrightnessSlider
= {
37455 render
: function render(self
) {
37456 var ref
= self
.params
;
37457 var sliderLabel
= ref
.sliderLabel
;
37458 var sliderValue
= ref
.sliderValue
;
37459 var sliderValueEditable
= ref
.sliderValueEditable
;
37460 var brightnessLabelText
= ref
.brightnessLabelText
;
37461 return ("\n <div class=\"color-picker-module color-picker-module-brightness-slider\">\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + brightnessLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-brightness\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"0.1\" min=\"0\" max=\"100\" class=\"color-picker-value-brightness\">\n " : "\n <span class=\"color-picker-value-brightness\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n </div>\n ");
37463 init
: function init(self
) {
37464 self
.brightnessRangeSlider
= self
.app
.range
.create({
37465 el
: self
.$el
.find('.color-picker-slider-brightness'),
37471 change
: function change(range
, value
) {
37472 var b
= Math
.floor(value
* 1000) / 1000;
37473 self
.setValue({ hsb
: [self
.value
.hsb
[0], self
.value
.hsb
[1], b
] });
37478 update
: function update(self
) {
37479 var value
= self
.value
;
37480 var app
= self
.app
;
37481 var ref
= self
.params
;
37482 var sliderValue
= ref
.sliderValue
;
37483 var sliderValueEditable
= ref
.sliderValueEditable
;
37485 var hsb
= value
.hsb
;
37487 self
.brightnessRangeSlider
.value
= hsb
[2];
37488 self
.brightnessRangeSlider
.layout();
37490 var hslCurrent
= Utils
.colorHsbToHsl(hsb
[0], hsb
[1], hsb
[2]);
37491 var hslLeft
= Utils
.colorHsbToHsl(hsb
[0], hsb
[1], 0);
37492 var hslRight
= Utils
.colorHsbToHsl(hsb
[0], hsb
[1], 1);
37494 self
.brightnessRangeSlider
.$el
[0].style
.setProperty(
37495 '--f7-range-knob-color',
37496 ("hsl(" + (hslCurrent
[0]) + ", " + (hslCurrent
[1] * 100) + "%, " + (hslCurrent
[2] * 100) + "%)")
37498 self
.brightnessRangeSlider
.$el
.find('.range-bar').css(
37499 'background-image',
37500 ("linear-gradient(" + (app
.rtl
? 'to left' : 'to right') + ", hsl(" + (hslLeft
[0]) + ", " + (hslLeft
[1] * 100) + "%, " + (hslLeft
[2] * 100) + "%), hsl(" + (hslRight
[0]) + ", " + (hslRight
[1] * 100) + "%, " + (hslRight
[2] * 100) + "%))")
37502 if (sliderValue
&& sliderValueEditable
) {
37503 self
.$el
.find('input.color-picker-value-brightness').val(("" + (hsb
[2] * 1000 / 10)));
37504 } else if (sliderValue
) {
37505 self
.$el
.find('span.color-picker-value-brightness').text(("" + (hsb
[2] * 1000 / 10)));
37508 destroy
: function destroy(self
) {
37509 if (self
.brightnessRangeSlider
&& self
.brightnessRangeSlider
.destroy
) {
37510 self
.brightnessRangeSlider
.destroy();
37512 delete self
.brightnessRangeSlider
;
37516 /* eslint indent: ["off"] */
37518 var modulePalette
= {
37519 render
: function render(self
) {
37520 return ("\n <div class=\"color-picker-module color-picker-module-palette\">\n <div class=\"color-picker-palette\">\n " + (self
.params
.palette
.map(function (p
) {
37521 if (Array
.isArray(p
)) {
37522 var row
= '<div class="color-picker-palette-row">';
37523 row
+= p
.map(function (c
) { return ("\n <div class=\"color-picker-palette-value\" data-palette-color=\"" + c
+ "\" style=\"background-color: " + c
+ "\"></div>\n "); }).join('');
37527 return ("\n <div class=\"color-picker-palette-value\" data-palette-color=\"" + p
+ "\" style=\"background-color: " + p
+ "\"></div>\n ");
37528 }).join('')) + "\n </div>\n </div>\n ");
37530 init
: function init(self
) {
37531 function handlePaletteClick(e
) {
37532 var hex
= $(e
.target
).attr('data-palette-color');
37538 self
.$el
.on('click', '.color-picker-module-palette .color-picker-palette-value', handlePaletteClick
);
37540 self
.destroyPaletteEvents
= function destroyPaletteEvents() {
37541 self
.$el
.off('click', '.color-picker-module-hex input', handlePaletteClick
);
37544 destroy
: function destroy(self
) {
37545 if (self
.destroyPaletteEvents
) {
37546 self
.destroyPaletteEvents();
37548 delete self
.destroyPaletteEvents
;
37552 var moduleInitialCurrentColors
= {
37553 render
: function render() {
37554 return "\n <div class=\"color-picker-module color-picker-module-initial-current-colors\">\n <div class=\"color-picker-initial-current-colors\">\n <div class=\"color-picker-initial-color\"></div>\n <div class=\"color-picker-current-color\"></div>\n </div>\n </div>\n ";
37556 init
: function init(self
) {
37557 function handleInitialColorClick() {
37558 if (self
.initialValue
) {
37559 var ref
= self
.initialValue
;
37561 var alpha
= ref
.alpha
;
37568 self
.$el
.on('click', '.color-picker-initial-color', handleInitialColorClick
);
37569 self
.destroyInitialCurrentEvents
= function destroyInitialCurrentEvents() {
37570 self
.$el
.off('click', '.color-picker-initial-color', handleInitialColorClick
);
37573 update
: function update(self
) {
37574 self
.$el
.find('.color-picker-module-initial-current-colors .color-picker-initial-color').css(
37575 'background-color',
37576 self
.initialValue
.hex
37578 self
.$el
.find('.color-picker-module-initial-current-colors .color-picker-current-color').css(
37579 'background-color',
37583 destroy
: function destroy(self
) {
37584 if (self
.destroyInitialCurrentEvents
) {
37585 self
.destroyInitialCurrentEvents();
37587 delete self
.destroyInitialCurrentEvents
;
37591 var moduleRgbBars
= {
37592 render
: function render(self
) {
37593 var ref
= self
.params
;
37594 var barLabel
= ref
.barLabel
;
37595 var barValue
= ref
.barValue
;
37596 var barValueEditable
= ref
.barValueEditable
;
37597 var redLabelText
= ref
.redLabelText
;
37598 var greenLabelText
= ref
.greenLabelText
;
37599 var blueLabelText
= ref
.blueLabelText
;
37600 return ("\n <div class=\"color-picker-module color-picker-module-rgb-bars\">\n <div class=\"color-picker-bar-wrap\">\n " + (barLabel
? ("\n <div class=\"color-picker-bar-label\">" + redLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-bar color-picker-bar-red\"></div>\n " + (barValue
? ("\n <div class=\"color-picker-bar-value\">\n " + (barValueEditable
? "\n <input type=\"number\" step=\"1\" min=\"0\" max=\"255\" class=\"color-picker-value-bar-red\" data-color-index=\"0\">\n " : "\n <span class=\"color-picker-value-bar-red\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n <div class=\"color-picker-bar-wrap\">\n " + (barLabel
? ("\n <div class=\"color-picker-bar-label\">" + greenLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-bar color-picker-bar-green\"></div>\n " + (barValue
? ("\n <div class=\"color-picker-bar-value\">\n " + (barValueEditable
? "\n <input type=\"number\" step=\"1\" min=\"0\" max=\"255\" class=\"color-picker-value-bar-green\" data-color-index=\"1\">\n " : "\n <span class=\"color-picker-value-bar-green\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n <div class=\"color-picker-bar-wrap\">\n " + (barLabel
? ("\n <div class=\"color-picker-bar-label\">" + blueLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-bar color-picker-bar-blue\"></div>\n " + (barValue
? ("\n <div class=\"color-picker-bar-value\">\n " + (barValueEditable
? "\n <input type=\"number\" step=\"1\" min=\"0\" max=\"255\" class=\"color-picker-value-bar-blue\" data-color-index=\"2\">\n " : "\n <span class=\"color-picker-value-bar-blue\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n </div>\n ");
37602 init
: function init(self
) {
37603 self
.redBar
= self
.app
.range
.create({
37604 el
: self
.$el
.find('.color-picker-bar-red'),
37611 change
: function change(range
, value
) {
37612 self
.setValue({ rgb
: [value
, self
.value
.rgb
[1], self
.value
.rgb
[2]] });
37616 self
.greenBar
= self
.app
.range
.create({
37617 el
: self
.$el
.find('.color-picker-bar-green'),
37624 change
: function change(range
, value
) {
37625 self
.setValue({ rgb
: [self
.value
.rgb
[0], value
, self
.value
.rgb
[2]] });
37629 self
.blueBar
= self
.app
.range
.create({
37630 el
: self
.$el
.find('.color-picker-bar-blue'),
37637 change
: function change(range
, value
) {
37638 self
.setValue({ rgb
: [self
.value
.rgb
[0], self
.value
.rgb
[1], value
] });
37643 function handleInputChange(e
) {
37644 var rgb
= [].concat( self
.value
.rgb
);
37645 var index
= parseInt($(e
.target
).attr('data-color-index'), 10);
37646 var value
= parseInt(e
.target
.value
, 10);
37647 if (Number
.isNaN(value
)) {
37648 e
.target
.value
= rgb
[index
];
37651 value
= Math
.max(0, Math
.min(255, value
));
37652 rgb
[index
] = value
;
37653 self
.setValue({ rgb
: rgb
});
37656 self
.$el
.on('change', '.color-picker-module-rgb-bars input', handleInputChange
);
37658 self
.destroyRgbBarsEvents
= function destroyRgbBarsEvents() {
37659 self
.$el
.off('change', '.color-picker-module-rgb-bars input', handleInputChange
);
37662 update
: function update(self
) {
37663 var value
= self
.value
;
37664 var redBar
= self
.redBar
;
37665 var greenBar
= self
.greenBar
;
37666 var blueBar
= self
.blueBar
;
37668 var ref
= self
.params
;
37669 var barValue
= ref
.barValue
;
37670 var barValueEditable
= ref
.barValueEditable
;
37672 var rgb
= value
.rgb
;
37674 redBar
.value
= rgb
[0];
37675 greenBar
.value
= rgb
[1];
37676 blueBar
.value
= rgb
[2];
37682 redBar
.$el
.find('.range-bar').css('background-image', ("linear-gradient(to top, rgb(0, " + (rgb
[1]) + ", " + (rgb
[2]) + "), rgb(255, " + (rgb
[1]) + ", " + (rgb
[2]) + "))"));
37683 greenBar
.$el
.find('.range-bar').css('background-image', ("linear-gradient(to top, rgb(" + (rgb
[0]) + ", 0, " + (rgb
[2]) + "), rgb(" + (rgb
[0]) + ", 255, " + (rgb
[2]) + "))"));
37684 blueBar
.$el
.find('.range-bar').css('background-image', ("linear-gradient(to top, rgb(" + (rgb
[0]) + ", " + (rgb
[1]) + ", 0), rgb(" + (rgb
[0]) + ", " + (rgb
[1]) + ", 255))"));
37686 if (barValue
&& barValueEditable
) {
37687 self
.$el
.find('input.color-picker-value-bar-red').val(rgb
[0]);
37688 self
.$el
.find('input.color-picker-value-bar-green').val(rgb
[1]);
37689 self
.$el
.find('input.color-picker-value-bar-blue').val(rgb
[2]);
37690 } else if (barValue
) {
37691 self
.$el
.find('span.color-picker-value-bar-red').text(rgb
[0]);
37692 self
.$el
.find('span.color-picker-value-bar-green').text(rgb
[1]);
37693 self
.$el
.find('span.color-picker-value-bar-blue').text(rgb
[2]);
37696 destroy
: function destroy(self
) {
37697 if (self
.redBar
&& self
.redBar
.destroy
) {
37698 self
.redBar
.destroy();
37700 if (self
.greenBar
&& self
.greenBar
.destroy
) {
37701 self
.greenBar
.destroy();
37703 if (self
.blueBar
&& self
.blueBar
.destroy
) {
37704 self
.blueBar
.destroy();
37707 delete self
.redBar
;
37708 delete self
.greenBar
;
37709 delete self
.blueBar
;
37711 if (self
.destroyRgbBarsEvents
) { self
.destroyRgbBarsEvents(); }
37712 delete self
.destroyRgbBarsEvents
;
37716 var moduleRgbSliders
= {
37717 render
: function render(self
) {
37718 var ref
= self
.params
;
37719 var sliderLabel
= ref
.sliderLabel
;
37720 var sliderValue
= ref
.sliderValue
;
37721 var sliderValueEditable
= ref
.sliderValueEditable
;
37722 var redLabelText
= ref
.redLabelText
;
37723 var greenLabelText
= ref
.greenLabelText
;
37724 var blueLabelText
= ref
.blueLabelText
;
37725 return ("\n <div class=\"color-picker-module color-picker-module-rgb-sliders\">\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + redLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-red\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"1\" min=\"0\" max=\"255\" class=\"color-picker-value-red\" data-color-index=\"0\">\n " : "\n <span class=\"color-picker-value-red\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + greenLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-green\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"1\" min=\"0\" max=\"255\" class=\"color-picker-value-green\" data-color-index=\"1\">\n " : "\n <span class=\"color-picker-value-green\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n <div class=\"color-picker-slider-wrap\">\n " + (sliderLabel
? ("\n <div class=\"color-picker-slider-label\">" + blueLabelText
+ "</div>\n ") : '') + "\n <div class=\"range-slider color-picker-slider color-picker-slider-blue\"></div>\n " + (sliderValue
? ("\n <div class=\"color-picker-slider-value\">\n " + (sliderValueEditable
? "\n <input type=\"number\" step=\"1\" min=\"0\" max=\"255\" class=\"color-picker-value-blue\" data-color-index=\"2\">\n " : "\n <span class=\"color-picker-value-blue\"></span>\n ") + "\n </div>\n ") : '') + "\n </div>\n </div>\n ");
37727 init
: function init(self
) {
37728 self
.redRangeSlider
= self
.app
.range
.create({
37729 el
: self
.$el
.find('.color-picker-slider-red'),
37735 change
: function change(range
, value
) {
37736 self
.setValue({ rgb
: [value
, self
.value
.rgb
[1], self
.value
.rgb
[2]] });
37740 self
.greenRangeSlider
= self
.app
.range
.create({
37741 el
: self
.$el
.find('.color-picker-slider-green'),
37747 change
: function change(range
, value
) {
37748 self
.setValue({ rgb
: [self
.value
.rgb
[0], value
, self
.value
.rgb
[2]] });
37752 self
.blueRangeSlider
= self
.app
.range
.create({
37753 el
: self
.$el
.find('.color-picker-slider-blue'),
37759 change
: function change(range
, value
) {
37760 self
.setValue({ rgb
: [self
.value
.rgb
[0], self
.value
.rgb
[1], value
] });
37765 function handleInputChange(e
) {
37766 var rgb
= [].concat( self
.value
.rgb
);
37767 var index
= parseInt($(e
.target
).attr('data-color-index'), 10);
37768 var value
= parseInt(e
.target
.value
, 10);
37769 if (Number
.isNaN(value
)) {
37770 e
.target
.value
= rgb
[index
];
37773 value
= Math
.max(0, Math
.min(255, value
));
37774 rgb
[index
] = value
;
37775 self
.setValue({ rgb
: rgb
});
37778 self
.$el
.on('change', '.color-picker-module-rgb-sliders input', handleInputChange
);
37780 self
.destroyRgbSlidersEvents
= function destroyRgbSlidersEvents() {
37781 self
.$el
.off('change', '.color-picker-module-rgb-sliders input', handleInputChange
);
37784 update
: function update(self
) {
37785 var app
= self
.app
;
37786 var value
= self
.value
;
37787 var redRangeSlider
= self
.redRangeSlider
;
37788 var greenRangeSlider
= self
.greenRangeSlider
;
37789 var blueRangeSlider
= self
.blueRangeSlider
;
37791 var ref
= self
.params
;
37792 var sliderValue
= ref
.sliderValue
;
37793 var sliderValueEditable
= ref
.sliderValueEditable
;
37795 var rgb
= value
.rgb
;
37797 redRangeSlider
.value
= rgb
[0];
37798 greenRangeSlider
.value
= rgb
[1];
37799 blueRangeSlider
.value
= rgb
[2];
37801 redRangeSlider
.layout();
37802 greenRangeSlider
.layout();
37803 blueRangeSlider
.layout();
37805 redRangeSlider
.$el
[0].style
.setProperty('--f7-range-knob-color', ("rgb(" + (rgb
[0]) + ", " + (rgb
[1]) + ", " + (rgb
[2]) + ")"));
37806 greenRangeSlider
.$el
[0].style
.setProperty('--f7-range-knob-color', ("rgb(" + (rgb
[0]) + ", " + (rgb
[1]) + ", " + (rgb
[2]) + ")"));
37807 blueRangeSlider
.$el
[0].style
.setProperty('--f7-range-knob-color', ("rgb(" + (rgb
[0]) + ", " + (rgb
[1]) + ", " + (rgb
[2]) + ")"));
37809 var direction
= app
.rtl
? 'to left' : 'to right';
37811 redRangeSlider
.$el
.find('.range-bar').css('background-image', ("linear-gradient(" + direction
+ ", rgb(0, " + (rgb
[1]) + ", " + (rgb
[2]) + "), rgb(255, " + (rgb
[1]) + ", " + (rgb
[2]) + "))"));
37812 greenRangeSlider
.$el
.find('.range-bar').css('background-image', ("linear-gradient(" + direction
+ ", rgb(" + (rgb
[0]) + ", 0, " + (rgb
[2]) + "), rgb(" + (rgb
[0]) + ", 255, " + (rgb
[2]) + "))"));
37813 blueRangeSlider
.$el
.find('.range-bar').css('background-image', ("linear-gradient(" + direction
+ ", rgb(" + (rgb
[0]) + ", " + (rgb
[1]) + ", 0), rgb(" + (rgb
[0]) + ", " + (rgb
[1]) + ", 255))"));
37815 if (sliderValue
&& sliderValueEditable
) {
37816 self
.$el
.find('input.color-picker-value-red').val(rgb
[0]);
37817 self
.$el
.find('input.color-picker-value-green').val(rgb
[1]);
37818 self
.$el
.find('input.color-picker-value-blue').val(rgb
[2]);
37819 } else if (sliderValue
) {
37820 self
.$el
.find('span.color-picker-value-red').text(rgb
[0]);
37821 self
.$el
.find('span.color-picker-value-green').text(rgb
[1]);
37822 self
.$el
.find('span.color-picker-value-blue').text(rgb
[2]);
37825 destroy
: function destroy(self
) {
37826 if (self
.redRangeSlider
&& self
.redRangeSlider
.destroy
) {
37827 self
.redRangeSlider
.destroy();
37829 if (self
.greenRangeSlider
&& self
.greenRangeSlider
.destroy
) {
37830 self
.greenRangeSlider
.destroy();
37832 if (self
.blueRangeSlider
&& self
.blueRangeSlider
.destroy
) {
37833 self
.blueRangeSlider
.destroy();
37836 delete self
.redRangeSlider
;
37837 delete self
.greenRangeSlider
;
37838 delete self
.blueRangeSlider
;
37840 if (self
.destroyRgbSlidersEvents
) { self
.destroyRgbSlidersEvents(); }
37841 delete self
.destroyRgbSlidersEvents
;
37845 var moduleSbSpectrum
= {
37846 render
: function render() {
37847 return "\n <div class=\"color-picker-module color-picker-module-sb-spectrum\">\n <div class=\"color-picker-sb-spectrum\" style=\"background-color: hsl(0, 100%, 50%)\">\n <div class=\"color-picker-sb-spectrum-handle\"></div>\n </div>\n </div>\n ";
37849 init
: function init(self
) {
37850 var app
= self
.app
;
37860 var specterIsTouched
;
37861 var specterHandleIsTouched
;
37863 var $el
= self
.$el
;
37865 function setSBFromSpecterCoords(x
, y
) {
37866 var s
= (x
- specterRect
.left
) / specterRect
.width
;
37867 var b
= (y
- specterRect
.top
) / specterRect
.height
;
37868 s
= Math
.max(0, Math
.min(1, s
));
37869 b
= 1 - Math
.max(0, Math
.min(1, b
));
37871 self
.setValue({ hsb
: [self
.value
.hue
, s
, b
] });
37874 function handleTouchStart(e
) {
37875 if (isMoved
|| isTouched
) { return; }
37876 touchStartX
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageX
: e
.pageX
;
37877 touchCurrentX
= touchStartX
;
37878 touchStartY
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageY
: e
.pageY
;
37879 touchCurrentY
= touchStartY
;
37880 var $targetEl
= $(e
.target
);
37881 specterHandleIsTouched
= $targetEl
.closest('.color-picker-sb-spectrum-handle').length
> 0;
37882 if (!specterHandleIsTouched
) {
37883 specterIsTouched
= $targetEl
.closest('.color-picker-sb-spectrum').length
> 0;
37885 if (specterIsTouched
) {
37886 specterRect
= $el
.find('.color-picker-sb-spectrum')[0].getBoundingClientRect();
37887 setSBFromSpecterCoords(touchStartX
, touchStartY
);
37889 if (specterHandleIsTouched
|| specterIsTouched
) {
37890 $el
.find('.color-picker-sb-spectrum-handle').addClass('color-picker-sb-spectrum-handle-pressed');
37893 function handleTouchMove(e
) {
37894 if (!(specterIsTouched
|| specterHandleIsTouched
)) { return; }
37895 touchCurrentX
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageX
: e
.pageX
;
37896 touchCurrentY
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageY
: e
.pageY
;
37897 e
.preventDefault();
37901 if (specterHandleIsTouched
) {
37902 specterRect
= $el
.find('.color-picker-sb-spectrum')[0].getBoundingClientRect();
37905 if (specterIsTouched
|| specterHandleIsTouched
) {
37906 setSBFromSpecterCoords(touchCurrentX
, touchCurrentY
);
37909 function handleTouchEnd() {
37911 if (specterIsTouched
|| specterHandleIsTouched
) {
37912 $el
.find('.color-picker-sb-spectrum-handle').removeClass('color-picker-sb-spectrum-handle-pressed');
37914 specterIsTouched
= false;
37915 specterHandleIsTouched
= false;
37918 function handleResize() {
37919 self
.modules
['sb-spectrum'].update(self
);
37922 var passiveListener
= app
.touchEvents
.start
=== 'touchstart' && app
.support
.passiveListener
? { passive
: true, capture
: false } : false;
37924 self
.$el
.on(app
.touchEvents
.start
, handleTouchStart
, passiveListener
);
37925 app
.on('touchmove:active', handleTouchMove
);
37926 app
.on('touchend:passive', handleTouchEnd
);
37927 app
.on('resize', handleResize
);
37929 self
.destroySpectrumEvents
= function destroySpectrumEvents() {
37930 self
.$el
.off(app
.touchEvents
.start
, handleTouchStart
, passiveListener
);
37931 app
.off('touchmove:active', handleTouchMove
);
37932 app
.off('touchend:passive', handleTouchEnd
);
37933 app
.off('resize', handleResize
);
37936 update
: function update(self
) {
37937 var value
= self
.value
;
37939 var hsl
= value
.hsl
;
37940 var hsb
= value
.hsb
;
37942 var specterWidth
= self
.$el
.find('.color-picker-sb-spectrum')[0].offsetWidth
;
37943 var specterHeight
= self
.$el
.find('.color-picker-sb-spectrum')[0].offsetHeight
;
37945 self
.$el
.find('.color-picker-sb-spectrum')
37946 .css('background-color', ("hsl(" + (hsl
[0]) + ", 100%, 50%)"));
37948 self
.$el
.find('.color-picker-sb-spectrum-handle')
37949 .css('background-color', ("hsl(" + (hsl
[0]) + ", " + (hsl
[1] * 100) + "%, " + (hsl
[2] * 100) + "%)"))
37950 .transform(("translate(" + (specterWidth
* hsb
[1]) + "px, " + (specterHeight
* (1 - hsb
[2])) + "px)"));
37952 destroy
: function destroy(self
) {
37953 if (self
.destroySpectrumEvents
) { self
.destroySpectrumEvents(); }
37954 delete self
.destroySpectrumEvents
;
37958 var moduleHsSpectrum
= {
37959 render
: function render() {
37960 return "\n <div class=\"color-picker-module color-picker-module-hs-spectrum\">\n <div class=\"color-picker-hs-spectrum\">\n <div class=\"color-picker-hs-spectrum-handle\"></div>\n </div>\n </div>\n ";
37962 init
: function init(self
) {
37963 var app
= self
.app
;
37973 var specterIsTouched
;
37974 var specterHandleIsTouched
;
37976 var $el
= self
.$el
;
37978 function setHSFromSpecterCoords(x
, y
) {
37979 var h
= (x
- specterRect
.left
) / specterRect
.width
* 360;
37980 var s
= (y
- specterRect
.top
) / specterRect
.height
;
37981 h
= Math
.max(0, Math
.min(360, h
));
37982 s
= 1 - Math
.max(0, Math
.min(1, s
));
37984 self
.setValue({ hsb
: [h
, s
, self
.value
.hsb
[2]] });
37987 function handleTouchStart(e
) {
37988 if (isMoved
|| isTouched
) { return; }
37989 touchStartX
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageX
: e
.pageX
;
37990 touchCurrentX
= touchStartX
;
37991 touchStartY
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageY
: e
.pageY
;
37992 touchCurrentY
= touchStartY
;
37993 var $targetEl
= $(e
.target
);
37994 specterHandleIsTouched
= $targetEl
.closest('.color-picker-hs-spectrum-handle').length
> 0;
37995 if (!specterHandleIsTouched
) {
37996 specterIsTouched
= $targetEl
.closest('.color-picker-hs-spectrum').length
> 0;
37998 if (specterIsTouched
) {
37999 specterRect
= $el
.find('.color-picker-hs-spectrum')[0].getBoundingClientRect();
38000 setHSFromSpecterCoords(touchStartX
, touchStartY
);
38002 if (specterHandleIsTouched
|| specterIsTouched
) {
38003 $el
.find('.color-picker-hs-spectrum-handle').addClass('color-picker-hs-spectrum-handle-pressed');
38006 function handleTouchMove(e
) {
38007 if (!(specterIsTouched
|| specterHandleIsTouched
)) { return; }
38008 touchCurrentX
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageX
: e
.pageX
;
38009 touchCurrentY
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageY
: e
.pageY
;
38010 e
.preventDefault();
38014 if (specterHandleIsTouched
) {
38015 specterRect
= $el
.find('.color-picker-hs-spectrum')[0].getBoundingClientRect();
38018 if (specterIsTouched
|| specterHandleIsTouched
) {
38019 setHSFromSpecterCoords(touchCurrentX
, touchCurrentY
);
38022 function handleTouchEnd() {
38024 if (specterIsTouched
|| specterHandleIsTouched
) {
38025 $el
.find('.color-picker-hs-spectrum-handle').removeClass('color-picker-hs-spectrum-handle-pressed');
38027 specterIsTouched
= false;
38028 specterHandleIsTouched
= false;
38031 function handleResize() {
38032 self
.modules
['hs-spectrum'].update(self
);
38035 var passiveListener
= app
.touchEvents
.start
=== 'touchstart' && app
.support
.passiveListener
? { passive
: true, capture
: false } : false;
38037 self
.$el
.on(app
.touchEvents
.start
, handleTouchStart
, passiveListener
);
38038 app
.on('touchmove:active', handleTouchMove
);
38039 app
.on('touchend:passive', handleTouchEnd
);
38040 app
.on('resize', handleResize
);
38042 self
.destroySpectrumEvents
= function destroySpectrumEvents() {
38043 self
.$el
.off(app
.touchEvents
.start
, handleTouchStart
, passiveListener
);
38044 app
.off('touchmove:active', handleTouchMove
);
38045 app
.off('touchend:passive', handleTouchEnd
);
38046 app
.off('resize', handleResize
);
38049 update
: function update(self
) {
38050 var value
= self
.value
;
38052 var hsb
= value
.hsb
;
38054 var specterWidth
= self
.$el
.find('.color-picker-hs-spectrum')[0].offsetWidth
;
38055 var specterHeight
= self
.$el
.find('.color-picker-hs-spectrum')[0].offsetHeight
;
38057 var hslBright
= Utils
.colorHsbToHsl(hsb
[0], hsb
[1], 1);
38059 self
.$el
.find('.color-picker-hs-spectrum-handle')
38060 .css('background-color', ("hsl(" + (hslBright
[0]) + ", " + (hslBright
[1] * 100) + "%, " + (hslBright
[2] * 100) + "%)"))
38061 .transform(("translate(" + (specterWidth
* (hsb
[0] / 360)) + "px, " + (specterHeight
* (1 - hsb
[1])) + "px)"));
38063 destroy
: function destroy(self
) {
38064 if (self
.destroySpectrumEvents
) { self
.destroySpectrumEvents(); }
38065 delete self
.destroySpectrumEvents
;
38069 function svgWheelCircles() {
38072 for (var i
= total
; i
> 0; i
-= 1) {
38073 var angle
= i
* Math
.PI
/ (total
/ 2);
38074 var hue
= 360 / total
* i
;
38075 circles
+= "<circle cx=\"" + (150 - Math
.sin(angle
) * 125) + "\" cy=\"" + (150 - Math
.cos(angle
) * 125) + "\" r=\"25\" fill=\"hsl(" + hue
+ ", 100%, 50%)\"></circle>";
38079 var moduleWheel
= {
38080 render
: function render() {
38081 return ("\n <div class=\"color-picker-module color-picker-module-wheel\">\n <div class=\"color-picker-wheel\">\n <svg viewBox=\"0 0 300 300\" width=\"300\" height=\"300\">" + (svgWheelCircles()) + "</svg>\n <div class=\"color-picker-wheel-handle\"></div>\n <div class=\"color-picker-sb-spectrum\" style=\"background-color: hsl(0, 100%, 50%)\">\n <div class=\"color-picker-sb-spectrum-handle\"></div>\n </div>\n </div>\n </div>\n ");
38083 init
: function init(self
) {
38084 var app
= self
.app
;
38094 var wheelIsTouched
;
38095 var wheelHandleIsTouched
;
38097 var specterIsTouched
;
38098 var specterHandleIsTouched
;
38100 var $el
= self
.$el
;
38102 function setHueFromWheelCoords(x
, y
) {
38103 var wheelCenterX
= wheelRect
.left
+ wheelRect
.width
/ 2;
38104 var wheelCenterY
= wheelRect
.top
+ wheelRect
.height
/ 2;
38105 var angleRad
= Math
.atan2(y
- wheelCenterY
, x
- wheelCenterX
);
38106 var angleDeg
= angleRad
* 180 / Math
.PI
+ 90;
38107 if (angleDeg
< 0) { angleDeg
+= 360; }
38108 angleDeg
= 360 - angleDeg
;
38109 self
.setValue({ hue
: angleDeg
});
38111 function setSBFromSpecterCoords(x
, y
) {
38112 var s
= (x
- specterRect
.left
) / specterRect
.width
;
38113 var b
= (y
- specterRect
.top
) / specterRect
.height
;
38114 s
= Math
.max(0, Math
.min(1, s
));
38115 b
= 1 - Math
.max(0, Math
.min(1, b
));
38117 self
.setValue({ hsb
: [self
.value
.hue
, s
, b
] });
38120 function handleTouchStart(e
) {
38121 if (isMoved
|| isTouched
) { return; }
38122 touchStartX
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageX
: e
.pageX
;
38123 touchCurrentX
= touchStartX
;
38124 touchStartY
= e
.type
=== 'touchstart' ? e
.targetTouches
[0].pageY
: e
.pageY
;
38125 touchCurrentY
= touchStartY
;
38126 var $targetEl
= $(e
.target
);
38127 wheelHandleIsTouched
= $targetEl
.closest('.color-picker-wheel-handle').length
> 0;
38128 wheelIsTouched
= $targetEl
.closest('circle').length
> 0;
38129 specterHandleIsTouched
= $targetEl
.closest('.color-picker-sb-spectrum-handle').length
> 0;
38130 if (!specterHandleIsTouched
) {
38131 specterIsTouched
= $targetEl
.closest('.color-picker-sb-spectrum').length
> 0;
38133 if (wheelIsTouched
) {
38134 wheelRect
= $el
.find('.color-picker-wheel')[0].getBoundingClientRect();
38135 setHueFromWheelCoords(touchStartX
, touchStartY
);
38137 if (specterIsTouched
) {
38138 specterRect
= $el
.find('.color-picker-sb-spectrum')[0].getBoundingClientRect();
38139 setSBFromSpecterCoords(touchStartX
, touchStartY
);
38141 if (specterHandleIsTouched
|| specterIsTouched
) {
38142 $el
.find('.color-picker-sb-spectrum-handle').addClass('color-picker-sb-spectrum-handle-pressed');
38145 function handleTouchMove(e
) {
38146 if (!(wheelIsTouched
|| wheelHandleIsTouched
) && !(specterIsTouched
|| specterHandleIsTouched
)) { return; }
38147 touchCurrentX
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageX
: e
.pageX
;
38148 touchCurrentY
= e
.type
=== 'touchmove' ? e
.targetTouches
[0].pageY
: e
.pageY
;
38149 e
.preventDefault();
38153 if (wheelHandleIsTouched
) {
38154 wheelRect
= $el
.find('.color-picker-wheel')[0].getBoundingClientRect();
38156 if (specterHandleIsTouched
) {
38157 specterRect
= $el
.find('.color-picker-sb-spectrum')[0].getBoundingClientRect();
38160 if (wheelIsTouched
|| wheelHandleIsTouched
) {
38161 setHueFromWheelCoords(touchCurrentX
, touchCurrentY
);
38163 if (specterIsTouched
|| specterHandleIsTouched
) {
38164 setSBFromSpecterCoords(touchCurrentX
, touchCurrentY
);
38167 function handleTouchEnd() {
38169 if (specterIsTouched
|| specterHandleIsTouched
) {
38170 $el
.find('.color-picker-sb-spectrum-handle').removeClass('color-picker-sb-spectrum-handle-pressed');
38172 wheelIsTouched
= false;
38173 wheelHandleIsTouched
= false;
38174 specterIsTouched
= false;
38175 specterHandleIsTouched
= false;
38178 function handleResize() {
38179 self
.modules
.wheel
.update(self
);
38182 var passiveListener
= app
.touchEvents
.start
=== 'touchstart' && app
.support
.passiveListener
? { passive
: true, capture
: false } : false;
38184 self
.$el
.on(app
.touchEvents
.start
, handleTouchStart
, passiveListener
);
38185 app
.on('touchmove:active', handleTouchMove
);
38186 app
.on('touchend:passive', handleTouchEnd
);
38187 app
.on('resize', handleResize
);
38189 self
.destroyWheelEvents
= function destroyWheelEvents() {
38190 self
.$el
.off(app
.touchEvents
.start
, handleTouchStart
, passiveListener
);
38191 app
.off('touchmove:active', handleTouchMove
);
38192 app
.off('touchend:passive', handleTouchEnd
);
38193 app
.off('resize', handleResize
);
38196 update
: function update(self
) {
38197 var value
= self
.value
;
38199 var hsl
= value
.hsl
;
38200 var hsb
= value
.hsb
;
38202 var specterWidth
= self
.$el
.find('.color-picker-sb-spectrum')[0].offsetWidth
;
38203 var specterHeight
= self
.$el
.find('.color-picker-sb-spectrum')[0].offsetHeight
;
38204 var wheelSize
= self
.$el
.find('.color-picker-wheel')[0].offsetWidth
;
38205 var wheelHalfSize
= wheelSize
/ 2;
38206 var angleRad
= value
.hue
* Math
.PI
/ 180;
38207 var handleSize
= wheelSize
/ 6;
38208 var handleHalfSize
= handleSize
/ 2;
38209 var tX
= wheelHalfSize
- Math
.sin(angleRad
) * (wheelHalfSize
- handleHalfSize
) - handleHalfSize
;
38210 var tY
= wheelHalfSize
- Math
.cos(angleRad
) * (wheelHalfSize
- handleHalfSize
) - handleHalfSize
;
38211 self
.$el
.find('.color-picker-wheel-handle')
38212 .css('background-color', ("hsl(" + (hsl
[0]) + ", 100%, 50%)"))
38213 .transform(("translate(" + tX
+ "px, " + tY
+ "px)"));
38215 self
.$el
.find('.color-picker-sb-spectrum')
38216 .css('background-color', ("hsl(" + (hsl
[0]) + ", 100%, 50%)"));
38218 self
.$el
.find('.color-picker-sb-spectrum-handle')
38219 .css('background-color', ("hsl(" + (hsl
[0]) + ", " + (hsl
[1] * 100) + "%, " + (hsl
[2] * 100) + "%)"))
38220 .transform(("translate(" + (specterWidth
* hsb
[1]) + "px, " + (specterHeight
* (1 - hsb
[2])) + "px)"));
38222 destroy
: function destroy(self
) {
38223 if (self
.destroyWheelEvents
) { self
.destroyWheelEvents(); }
38224 delete self
.destroyWheelEvents
;
38228 var ColorPicker
= /*@__PURE__*/(function (Framework7Class
) {
38229 function ColorPicker(app
, params
) {
38230 if ( params
=== void 0 ) params
= {};
38232 Framework7Class
.call(this, params
, [app
]);
38235 self
.params
= Utils
.extend({}, app
.params
.colorPicker
, params
);
38238 if (self
.params
.containerEl
) {
38239 $containerEl
= $(self
.params
.containerEl
);
38240 if ($containerEl
.length
=== 0) { return self
; }
38244 if (self
.params
.inputEl
) {
38245 $inputEl
= $(self
.params
.inputEl
);
38249 if (self
.params
.targetEl
) {
38250 $targetEl
= $(self
.params
.targetEl
);
38255 view
= $inputEl
.parents('.view').length
&& $inputEl
.parents('.view')[0].f7View
;
38257 if (!view
&& $targetEl
) {
38258 view
= $targetEl
.parents('.view').length
&& $targetEl
.parents('.view')[0].f7View
;
38260 if (!view
) { view
= app
.views
.main
; }
38262 Utils
.extend(self
, {
38264 $containerEl
: $containerEl
,
38265 containerEl
: $containerEl
&& $containerEl
[0],
38266 inline
: $containerEl
&& $containerEl
.length
> 0,
38267 $inputEl
: $inputEl
,
38268 inputEl
: $inputEl
&& $inputEl
[0],
38269 $targetEl
: $targetEl
,
38270 targetEl
: $targetEl
&& $targetEl
[0],
38271 initialized
: false,
38273 url
: self
.params
.url
,
38276 'alpha-slider': moduleAlphaSlider
,
38277 'current-color': moduleCurrentColor
,
38278 'hex': moduleHex
, // eslint-disable-line
38279 'hsb-sliders': moduleHsbSliders
,
38280 'hue-slider': moduleHueSlider
,
38281 'brightness-slider': moduleBrightnessSlider
,
38282 'palette': modulePalette
, // eslint-disable-line
38283 'initial-current-colors': moduleInitialCurrentColors
,
38284 'rgb-bars': moduleRgbBars
,
38285 'rgb-sliders': moduleRgbSliders
,
38286 'sb-spectrum': moduleSbSpectrum
,
38287 'hs-spectrum': moduleHsSpectrum
,
38288 'wheel': moduleWheel
, // eslint-disable-line
38292 function onInputClick() {
38295 function onInputFocus(e
) {
38296 e
.preventDefault();
38298 function onTargetClick() {
38301 function onHtmlClick(e
) {
38302 if (self
.params
.openIn
=== 'page') { return; }
38303 var $clickTargetEl
= $(e
.target
);
38304 if (!self
.opened
|| self
.closing
) { return; }
38305 if ($clickTargetEl
.closest('[class*="backdrop"]').length
) { return; }
38306 if ($clickTargetEl
.closest('.color-picker-popup, .color-picker-popover').length
) { return; }
38307 if ($inputEl
&& $inputEl
.length
> 0) {
38308 if ($clickTargetEl
[0] !== $inputEl
[0] && $clickTargetEl
.closest('.sheet-modal').length
=== 0) {
38311 } else if ($(e
.target
).closest('.sheet-modal').length
=== 0) {
38317 Utils
.extend(self
, {
38318 attachInputEvents
: function attachInputEvents() {
38319 self
.$inputEl
.on('click', onInputClick
);
38320 if (self
.params
.inputReadOnly
) {
38321 self
.$inputEl
.on('focus mousedown', onInputFocus
);
38324 detachInputEvents
: function detachInputEvents() {
38325 self
.$inputEl
.off('click', onInputClick
);
38326 if (self
.params
.inputReadOnly
) {
38327 self
.$inputEl
.off('focus mousedown', onInputFocus
);
38330 attachTargetEvents
: function attachTargetEvents() {
38331 self
.$targetEl
.on('click', onTargetClick
);
38333 detachTargetEvents
: function detachTargetEvents() {
38334 self
.$targetEl
.off('click', onTargetClick
);
38336 attachHtmlEvents
: function attachHtmlEvents() {
38337 app
.on('click', onHtmlClick
);
38339 detachHtmlEvents
: function detachHtmlEvents() {
38340 app
.off('click', onHtmlClick
);
38349 if ( Framework7Class
) ColorPicker
.__proto__
= Framework7Class
;
38350 ColorPicker
.prototype = Object
.create( Framework7Class
&& Framework7Class
.prototype );
38351 ColorPicker
.prototype.constructor = ColorPicker
;
38353 ColorPicker
.prototype.attachEvents
= function attachEvents () {
38355 self
.centerModules
= self
.centerModules
.bind(self
);
38356 if (self
.params
.centerModules
) {
38357 self
.app
.on('resize', self
.centerModules
);
38361 ColorPicker
.prototype.detachEvents
= function detachEvents () {
38363 if (self
.params
.centerModules
) {
38364 self
.app
.off('resize', self
.centerModules
);
38368 ColorPicker
.prototype.centerModules
= function centerModules () {
38370 if (!self
.opened
|| !self
.$el
|| self
.inline
) { return; }
38371 var $pageContentEl
= self
.$el
.find('.page-content');
38372 if (!$pageContentEl
.length
) { return; }
38373 var ref
= $pageContentEl
[0];
38374 var scrollHeight
= ref
.scrollHeight
;
38375 var offsetHeight
= ref
.offsetHeight
;
38376 if (scrollHeight
<= offsetHeight
) {
38377 $pageContentEl
.addClass('justify-content-center');
38379 $pageContentEl
.removeClass('justify-content-center');
38383 ColorPicker
.prototype.initInput
= function initInput () {
38385 if (!self
.$inputEl
) { return; }
38386 if (self
.params
.inputReadOnly
) { self
.$inputEl
.prop('readOnly', true); }
38389 ColorPicker
.prototype.getModalType
= function getModalType () {
38391 var app
= self
.app
;
38392 var modal
= self
.modal
;
38393 var params
= self
.params
;
38394 var openIn
= params
.openIn
;
38395 var openInPhone
= params
.openInPhone
;
38396 if (modal
&& modal
.type
) { return modal
.type
; }
38397 if (openIn
!== 'auto') { return openIn
; }
38398 if (self
.inline
) { return null; }
38399 if (app
.device
.ios
) {
38400 return app
.device
.ipad
? 'popover' : openInPhone
;
38402 if (app
.width
>= 768 || (app
.device
.desktop
&& app
.theme
=== 'aurora')) {
38406 return openInPhone
;
38409 ColorPicker
.prototype.formatValue
= function formatValue () {
38411 var value
= self
.value
;
38412 if (self
.params
.formatValue
) {
38413 return self
.params
.formatValue
.call(self
, value
);
38418 // eslint-disable-next-line
38419 ColorPicker
.prototype.normalizeHsValues
= function normalizeHsValues (arr
) {
38421 Math
.floor(arr
[0] * 10) / 10,
38422 Math
.floor(arr
[1] * 1000) / 1000,
38423 Math
.floor(arr
[2] * 1000) / 1000 ];
38426 ColorPicker
.prototype.setValue
= function setValue (value
, updateModules
) {
38427 if ( value
=== void 0 ) value
= {};
38428 if ( updateModules
=== void 0 ) updateModules
= true;
38431 if (typeof value
=== 'undefined') { return; }
38433 var ref
= (self
.value
|| {});
38438 var alpha
= ref
.alpha
; if ( alpha
=== void 0 ) alpha
= 1;
38440 var rgba
= ref
.rgba
;
38441 var hsla
= ref
.hsla
;
38443 var needChangeEvent
= self
.value
|| (!self
.value
&& !self
.params
.value
);
38445 Object
.keys(value
).forEach(function (k
) {
38446 if (!self
.value
|| typeof self
.value
[k
] === 'undefined') {
38447 valueChanged
= true;
38451 if (Array
.isArray(v
)) {
38452 v
.forEach(function (subV
, subIndex
) {
38453 if (subV
!== self
.value
[k
][subIndex
]) {
38454 valueChanged
= true;
38457 } else if (v
!== self
.value
[k
]) {
38458 valueChanged
= true;
38461 if (!valueChanged
) { return; }
38463 if (value
.rgb
|| value
.rgba
) {
38464 var ref
$1 = (value
.rgb
|| value
.rgba
);
38468 var a
= ref
$1[3]; if ( a
=== void 0 ) a
= alpha
;
38470 hex
= Utils
.colorRgbToHex
.apply(Utils
, rgb
);
38471 hsl
= Utils
.colorRgbToHsl
.apply(Utils
, rgb
);
38472 hsb
= Utils
.colorHslToHsb
.apply(Utils
, hsl
);
38473 hsl
= self
.normalizeHsValues(hsl
);
38474 hsb
= self
.normalizeHsValues(hsb
);
38477 rgba
= [rgb
[0], rgb
[1], rgb
[2], a
];
38478 hsla
= [hsl
[0], hsl
[1], hsl
[2], a
];
38481 if (value
.hsl
|| value
.hsla
) {
38482 var ref
$2 = (value
.hsl
|| value
.hsla
);
38486 var a
$1 = ref
$2[3]; if ( a
$1 === void 0 ) a
$1 = alpha
;
38488 rgb
= Utils
.colorHslToRgb
.apply(Utils
, hsl
);
38489 hex
= Utils
.colorRgbToHex
.apply(Utils
, rgb
);
38490 hsb
= Utils
.colorHslToHsb
.apply(Utils
, hsl
);
38491 hsl
= self
.normalizeHsValues(hsl
);
38492 hsb
= self
.normalizeHsValues(hsb
);
38495 rgba
= [rgb
[0], rgb
[1], rgb
[2], a
$1];
38496 hsla
= [hsl
[0], hsl
[1], hsl
[2], a
$1];
38500 var ref
$3 = value
.hsb
;
38501 var h
$1 = ref
$3[0];
38502 var s
$1 = ref
$3[1];
38503 var b
$1 = ref
$3[2];
38504 var a
$2 = ref
$3[3]; if ( a
$2 === void 0 ) a
$2 = alpha
;
38505 hsb
= [h
$1, s
$1, b
$1];
38506 hsl
= Utils
.colorHsbToHsl
.apply(Utils
, hsb
);
38507 rgb
= Utils
.colorHslToRgb
.apply(Utils
, hsl
);
38508 hex
= Utils
.colorRgbToHex
.apply(Utils
, rgb
);
38509 hsl
= self
.normalizeHsValues(hsl
);
38510 hsb
= self
.normalizeHsValues(hsb
);
38513 rgba
= [rgb
[0], rgb
[1], rgb
[2], a
$2];
38514 hsla
= [hsl
[0], hsl
[1], hsl
[2], a
$2];
38518 rgb
= Utils
.colorHexToRgb(value
.hex
);
38519 hex
= Utils
.colorRgbToHex
.apply(Utils
, rgb
);
38520 hsl
= Utils
.colorRgbToHsl
.apply(Utils
, rgb
);
38521 hsb
= Utils
.colorHslToHsb
.apply(Utils
, hsl
);
38522 hsl
= self
.normalizeHsValues(hsl
);
38523 hsb
= self
.normalizeHsValues(hsb
);
38525 rgba
= [rgb
[0], rgb
[1], rgb
[2], alpha
];
38526 hsla
= [hsl
[0], hsl
[1], hsl
[2], alpha
];
38529 if (typeof value
.alpha
!== 'undefined') {
38530 alpha
= value
.alpha
;
38531 if (typeof rgb
!== 'undefined') {
38532 rgba
= [rgb
[0], rgb
[1], rgb
[2], alpha
];
38534 if (typeof hsl
!== 'undefined') {
38535 hsla
= [hsl
[0], hsl
[1], hsl
[2], alpha
];
38539 if (typeof value
.hue
!== 'undefined') {
38542 var l
$1 = hsl
[2]; // eslint-disable-line
38543 hsl
= [value
.hue
, s
$2, l
$1];
38544 hsb
= Utils
.colorHslToHsb
.apply(Utils
, hsl
);
38545 rgb
= Utils
.colorHslToRgb
.apply(Utils
, hsl
);
38546 hex
= Utils
.colorRgbToHex
.apply(Utils
, rgb
);
38547 hsl
= self
.normalizeHsValues(hsl
);
38548 hsb
= self
.normalizeHsValues(hsb
);
38550 rgba
= [rgb
[0], rgb
[1], rgb
[2], alpha
];
38551 hsla
= [hsl
[0], hsl
[1], hsl
[2], alpha
];
38563 if (!self
.initialValue
) { self
.initialValue
= Utils
.extend({}, self
.value
); }
38564 self
.updateValue(needChangeEvent
);
38565 if (self
.opened
&& updateModules
) {
38566 self
.updateModules();
38570 ColorPicker
.prototype.getValue
= function getValue () {
38575 ColorPicker
.prototype.updateValue
= function updateValue (fireEvents
) {
38576 if ( fireEvents
=== void 0 ) fireEvents
= true;
38579 var $inputEl
= self
.$inputEl
;
38580 var value
= self
.value
;
38581 var $targetEl
= self
.$targetEl
;
38582 if ($targetEl
&& self
.params
.targetElSetBackgroundColor
) {
38583 var rgba
= value
.rgba
;
38584 $targetEl
.css('background-color', ("rgba(" + (rgba
.join(', ')) + ")"));
38587 self
.emit('local::change colorPickerChange', self
, value
);
38590 if ($inputEl
&& $inputEl
.length
) {
38591 var inputValue
= self
.formatValue(value
);
38592 if ($inputEl
&& $inputEl
.length
) {
38593 $inputEl
.val(inputValue
);
38595 $inputEl
.trigger('change');
38601 ColorPicker
.prototype.updateModules
= function updateModules () {
38603 var modules
= self
.modules
;
38604 self
.params
.modules
.forEach(function (m
) {
38605 if (typeof m
=== 'string' && modules
[m
] && modules
[m
].update
) {
38606 modules
[m
].update(self
);
38607 } else if (m
&& m
.update
) {
38613 ColorPicker
.prototype.update
= function update () {
38615 self
.updateModules();
38618 ColorPicker
.prototype.renderPicker
= function renderPicker () {
38620 var params
= self
.params
;
38621 var modules
= self
.modules
;
38624 params
.modules
.forEach(function (m
) {
38625 if (typeof m
=== 'string' && modules
[m
] && modules
[m
].render
) {
38626 html
+= modules
[m
].render(self
);
38627 } else if (m
&& m
.render
) {
38628 html
+= m
.render(self
);
38635 ColorPicker
.prototype.renderNavbar
= function renderNavbar () {
38637 if (self
.params
.renderNavbar
) {
38638 return self
.params
.renderNavbar
.call(self
, self
);
38640 var ref
= self
.params
;
38641 var openIn
= ref
.openIn
;
38642 var navbarTitleText
= ref
.navbarTitleText
;
38643 var navbarBackLinkText
= ref
.navbarBackLinkText
;
38644 var navbarCloseText
= ref
.navbarCloseText
;
38645 return ("\n <div class=\"navbar\">\n <div class=\"navbar-inner sliding\">\n " + (openIn
=== 'page' ? ("\n <div class=\"left\">\n <a class=\"link back\">\n <i class=\"icon icon-back\"></i>\n <span class=\"if-not-md\">" + navbarBackLinkText
+ "</span>\n </a>\n </div>\n ") : '') + "\n <div class=\"title\">" + navbarTitleText
+ "</div>\n " + (openIn
!== 'page' ? ("\n <div class=\"right\">\n <a class=\"link popup-close\" data-popup=\".color-picker-popup\">" + navbarCloseText
+ "</a>\n </div>\n ") : '') + "\n </div>\n </div>\n ").trim();
38648 ColorPicker
.prototype.renderToolbar
= function renderToolbar () {
38650 if (self
.params
.renderToolbar
) {
38651 return self
.params
.renderToolbar
.call(self
, self
);
38653 return ("\n <div class=\"toolbar toolbar-top no-shadow\">\n <div class=\"toolbar-inner\">\n <div class=\"left\"></div>\n <div class=\"right\">\n <a class=\"link sheet-close popover-close\" data-sheet=\".color-picker-sheet-modal\" data-popover=\".color-picker-popover\">" + (self
.params
.toolbarCloseText
) + "</a>\n </div>\n </div>\n </div>\n ").trim();
38656 ColorPicker
.prototype.renderInline
= function renderInline () {
38658 var ref
= self
.params
;
38659 var cssClass
= ref
.cssClass
;
38660 var groupedModules
= ref
.groupedModules
;
38661 var inlineHtml
= ("\n <div class=\"color-picker color-picker-inline " + (groupedModules
? 'color-picker-grouped-modules' : '') + " " + (cssClass
|| '') + "\">\n " + (self
.renderPicker()) + "\n </div>\n ").trim();
38666 ColorPicker
.prototype.renderSheet
= function renderSheet () {
38668 var ref
= self
.params
;
38669 var cssClass
= ref
.cssClass
;
38670 var toolbarSheet
= ref
.toolbarSheet
;
38671 var groupedModules
= ref
.groupedModules
;
38672 var sheetHtml
= ("\n <div class=\"sheet-modal color-picker color-picker-sheet-modal " + (groupedModules
? 'color-picker-grouped-modules' : '') + " " + (cssClass
|| '') + "\">\n " + (toolbarSheet
? self
.renderToolbar() : '') + "\n <div class=\"sheet-modal-inner\">\n <div class=\"page-content\">\n " + (self
.renderPicker()) + "\n </div>\n </div>\n </div>\n ").trim();
38677 ColorPicker
.prototype.renderPopover
= function renderPopover () {
38679 var ref
= self
.params
;
38680 var cssClass
= ref
.cssClass
;
38681 var toolbarPopover
= ref
.toolbarPopover
;
38682 var groupedModules
= ref
.groupedModules
;
38683 var popoverHtml
= ("\n <div class=\"popover color-picker-popover " + (cssClass
|| '') + "\">\n <div class=\"popover-inner\">\n <div class=\"color-picker " + (groupedModules
? 'color-picker-grouped-modules' : '') + "\">\n " + (toolbarPopover
? self
.renderToolbar() : '') + "\n <div class=\"page-content\">\n " + (self
.renderPicker()) + "\n </div>\n </div>\n </div>\n </div>\n ").trim();
38685 return popoverHtml
;
38688 ColorPicker
.prototype.renderPopup
= function renderPopup () {
38690 var ref
= self
.params
;
38691 var cssClass
= ref
.cssClass
;
38692 var navbarPopup
= ref
.navbarPopup
;
38693 var groupedModules
= ref
.groupedModules
;
38694 var popupHtml
= ("\n <div class=\"popup color-picker-popup " + (cssClass
|| '') + "\">\n <div class=\"page\">\n " + (navbarPopup
? self
.renderNavbar() : '') + "\n <div class=\"color-picker " + (groupedModules
? 'color-picker-grouped-modules' : '') + "\">\n <div class=\"page-content\">\n " + (self
.renderPicker()) + "\n </div>\n </div>\n </div>\n </div>\n ").trim();
38699 ColorPicker
.prototype.renderPage
= function renderPage () {
38701 var ref
= self
.params
;
38702 var cssClass
= ref
.cssClass
;
38703 var groupedModules
= ref
.groupedModules
;
38704 var pageHtml
= ("\n <div class=\"page color-picker-page " + (cssClass
|| '') + "\" data-name=\"color-picker-page\">\n " + (self
.renderNavbar()) + "\n <div class=\"color-picker " + (groupedModules
? 'color-picker-grouped-modules' : '') + "\">\n <div class=\"page-content\">\n " + (self
.renderPicker()) + "\n </div>\n </div>\n </div>\n ").trim();
38708 // eslint-disable-next-line
38709 ColorPicker
.prototype.render
= function render () {
38711 var params
= self
.params
;
38712 if (params
.render
) { return params
.render
.call(self
); }
38713 if (self
.inline
) { return self
.renderInline(); }
38714 if (params
.openIn
=== 'page') {
38715 return self
.renderPage();
38718 var modalType
= self
.getModalType();
38719 if (modalType
=== 'popover') { return self
.renderPopover(); }
38720 if (modalType
=== 'sheet') { return self
.renderSheet(); }
38721 if (modalType
=== 'popup') { return self
.renderPopup(); }
38724 ColorPicker
.prototype.onOpen
= function onOpen () {
38726 var initialized
= self
.initialized
;
38727 var $el
= self
.$el
;
38728 var app
= self
.app
;
38729 var $inputEl
= self
.$inputEl
;
38730 var inline
= self
.inline
;
38731 var value
= self
.value
;
38732 var params
= self
.params
;
38733 var modules
= self
.modules
;
38734 self
.closing
= false;
38735 self
.opened
= true;
38736 self
.opening
= true;
38738 // Init main events
38739 self
.attachEvents();
38741 params
.modules
.forEach(function (m
) {
38742 if (typeof m
=== 'string' && modules
[m
] && modules
[m
].render
) {
38743 modules
[m
].init(self
);
38744 } else if (m
&& m
.init
) {
38749 var updateValue
= !value
&& params
.value
;
38752 if (!initialized
) {
38753 if (value
) { self
.setValue(value
); }
38754 else if (params
.value
) {
38755 self
.setValue(params
.value
, false);
38756 } else if (!params
.value
) {
38757 self
.setValue({ hex
: '#ff0000' }, false);
38759 } else if (value
) {
38760 self
.initialValue
= Utils
.extend({}, value
);
38761 self
.setValue(value
, false);
38764 // Update input value
38765 if (updateValue
) { self
.updateValue(); }
38766 self
.updateModules();
38769 if (params
.centerModules
) {
38770 self
.centerModules();
38774 if (!inline
&& $inputEl
&& $inputEl
.length
&& app
.theme
=== 'md') {
38775 $inputEl
.trigger('focus');
38778 self
.initialized
= true;
38782 $el
.trigger('colorpicker:open', self
);
38785 $inputEl
.trigger('colorpicker:open', self
);
38787 self
.emit('local::open colorPickerOpen', self
);
38790 ColorPicker
.prototype.onOpened
= function onOpened () {
38792 self
.opening
= false;
38794 self
.$el
.trigger('colorpicker:opened', self
);
38796 if (self
.$inputEl
) {
38797 self
.$inputEl
.trigger('colorpicker:opened', self
);
38799 self
.emit('local::opened colorPickerOpened', self
);
38802 ColorPicker
.prototype.onClose
= function onClose () {
38804 var app
= self
.app
;
38805 var params
= self
.params
;
38806 var modules
= self
.modules
;
38807 self
.opening
= false;
38808 self
.closing
= true;
38811 self
.detachEvents();
38813 if (self
.$inputEl
&& app
.theme
=== 'md') {
38814 self
.$inputEl
.trigger('blur');
38816 params
.modules
.forEach(function (m
) {
38817 if (typeof m
=== 'string' && modules
[m
] && modules
[m
].update
) {
38818 modules
[m
].destroy(self
);
38819 } else if (m
&& m
.destroy
) {
38825 self
.$el
.trigger('colorpicker:close', self
);
38827 if (self
.$inputEl
) {
38828 self
.$inputEl
.trigger('colorpicker:close', self
);
38830 self
.emit('local::close colorPickerClose', self
);
38833 ColorPicker
.prototype.onClosed
= function onClosed () {
38835 self
.opened
= false;
38836 self
.closing
= false;
38838 if (!self
.inline
) {
38839 Utils
.nextTick(function () {
38840 if (self
.modal
&& self
.modal
.el
&& self
.modal
.destroy
) {
38841 if (!self
.params
.routableModals
) {
38842 self
.modal
.destroy();
38849 self
.$el
.trigger('colorpicker:closed', self
);
38851 if (self
.$inputEl
) {
38852 self
.$inputEl
.trigger('colorpicker:closed', self
);
38854 self
.emit('local::closed colorPickerClosed', self
);
38857 ColorPicker
.prototype.open
= function open () {
38861 var app
= self
.app
;
38862 var opened
= self
.opened
;
38863 var inline
= self
.inline
;
38864 var $inputEl
= self
.$inputEl
;
38865 var $targetEl
= self
.$targetEl
;
38866 var params
= self
.params
;
38867 if (opened
) { return; }
38870 self
.$el
= $(self
.render());
38871 self
.$el
[0].f7ColorPicker
= self
;
38872 self
.$containerEl
.append(self
.$el
);
38878 var colorPickerContent
= self
.render();
38880 if (params
.openIn
=== 'page') {
38881 self
.view
.router
.navigate({
38884 content
: colorPickerContent
,
38887 pageBeforeIn
: function pageBeforeIn(e
, page
) {
38888 self
.$el
= page
.$el
.find('.color-picker');
38889 self
.$el
[0].f7ColorPicker
= self
;
38892 pageAfterIn
: function pageAfterIn() {
38895 pageBeforeOut
: function pageBeforeOut() {
38898 pageAfterOut
: function pageAfterOut() {
38900 if (self
.$el
&& self
.$el
[0]) {
38901 self
.$el
[0].f7ColorPicker
= null;
38902 delete self
.$el
[0].f7ColorPicker
;
38909 var modalType
= self
.getModalType();
38910 var backdrop
= params
.backdrop
;
38911 if (backdrop
=== null || typeof backdrop
=== 'undefined') {
38912 if (modalType
=== 'popover' && app
.params
.popover
.backdrop
!== false) { backdrop
= true; }
38913 if (modalType
=== 'popup') { backdrop
= true; }
38915 var modalParams
= {
38916 targetEl
: ($targetEl
|| $inputEl
),
38917 scrollToEl
: params
.scrollToInput
? ($targetEl
|| $inputEl
) : undefined,
38918 content
: colorPickerContent
,
38919 backdrop
: backdrop
,
38920 closeByBackdropClick
: params
.closeByBackdropClick
,
38922 open
: function open() {
38924 self
.modal
= modal
;
38925 self
.$el
= modalType
=== 'popover' || modalType
=== 'popup' ? modal
.$el
.find('.color-picker') : modal
.$el
;
38926 self
.$el
[0].f7ColorPicker
= self
;
38929 opened
: function opened() { self
.onOpened(); },
38930 close
: function close() { self
.onClose(); },
38931 closed
: function closed() {
38933 if (self
.$el
&& self
.$el
[0]) {
38934 self
.$el
[0].f7ColorPicker
= null;
38935 delete self
.$el
[0].f7ColorPicker
;
38940 if (params
.routableModals
) {
38941 self
.view
.router
.navigate({
38945 }, obj
[modalType
] = modalParams
, obj
),
38948 self
.modal
= app
[modalType
].create(modalParams
);
38954 ColorPicker
.prototype.close
= function close () {
38956 var opened
= self
.opened
;
38957 var inline
= self
.inline
;
38958 if (!opened
) { return; }
38964 if (self
.params
.routableModals
) {
38965 self
.view
.router
.back();
38967 self
.modal
.close();
38971 ColorPicker
.prototype.init
= function init () {
38978 self
.emit('local::init colorPickerInit', self
);
38982 if (!self
.initialized
&& self
.params
.value
) {
38983 self
.setValue(self
.params
.value
);
38986 // Attach input Events
38987 if (self
.$inputEl
) {
38988 self
.attachInputEvents();
38990 if (self
.$targetEl
) {
38991 self
.attachTargetEvents();
38993 if (self
.params
.closeByOutsideClick
) {
38994 self
.attachHtmlEvents();
38996 self
.emit('local::init colorPickerInit', self
);
38999 ColorPicker
.prototype.destroy
= function destroy () {
39001 if (self
.destroyed
) { return; }
39002 var $el
= self
.$el
;
39003 self
.emit('local::beforeDestroy colorPickerBeforeDestroy', self
);
39004 if ($el
) { $el
.trigger('colorpicker:beforedestroy', self
); }
39009 self
.detachEvents();
39010 if (self
.$inputEl
) {
39011 self
.detachInputEvents();
39013 if (self
.$targetEl
) {
39014 self
.detachTargetEvents();
39016 if (self
.params
.closeByOutsideClick
) {
39017 self
.detachHtmlEvents();
39020 if ($el
&& $el
.length
) { delete self
.$el
[0].f7ColorPicker
; }
39021 Utils
.deleteProps(self
);
39022 self
.destroyed
= true;
39025 return ColorPicker
;
39026 }(Framework7Class
));
39028 var ColorPicker
$1 = {
39029 name
: 'colorPicker',
39031 ColorPicker
: ColorPicker
,
39033 create
: function create() {
39035 app
.colorPicker
= ConstructorMethods({
39036 defaultSelector
: '.color-picker',
39037 constructor: ColorPicker
,
39039 domProp
: 'f7ColorPicker',
39041 app
.colorPicker
.close
= function close(el
) {
39042 if ( el
=== void 0 ) el
= '.color-picker';
39045 if ($el
.length
=== 0) { return; }
39046 var colorPicker
= $el
[0].f7ColorPicker
;
39047 if (!colorPicker
|| (colorPicker
&& !colorPicker
.opened
)) { return; }
39048 colorPicker
.close();
39053 // Color picker settings
39058 ['#FFEBEE', '#FFCDD2', '#EF9A9A', '#E57373', '#EF5350', '#F44336', '#E53935', '#D32F2F', '#C62828', '#B71C1C'],
39059 ['#F3E5F5', '#E1BEE7', '#CE93D8', '#BA68C8', '#AB47BC', '#9C27B0', '#8E24AA', '#7B1FA2', '#6A1B9A', '#4A148C'],
39060 ['#E8EAF6', '#C5CAE9', '#9FA8DA', '#7986CB', '#5C6BC0', '#3F51B5', '#3949AB', '#303F9F', '#283593', '#1A237E'],
39061 ['#E1F5FE', '#B3E5FC', '#81D4FA', '#4FC3F7', '#29B6F6', '#03A9F4', '#039BE5', '#0288D1', '#0277BD', '#01579B'],
39062 ['#E0F2F1', '#B2DFDB', '#80CBC4', '#4DB6AC', '#26A69A', '#009688', '#00897B', '#00796B', '#00695C', '#004D40'],
39063 ['#F1F8E9', '#DCEDC8', '#C5E1A5', '#AED581', '#9CCC65', '#8BC34A', '#7CB342', '#689F38', '#558B2F', '#33691E'],
39064 ['#FFFDE7', '#FFF9C4', '#FFF59D', '#FFF176', '#FFEE58', '#FFEB3B', '#FDD835', '#FBC02D', '#F9A825', '#F57F17'],
39065 ['#FFF3E0', '#FFE0B2', '#FFCC80', '#FFB74D', '#FFA726', '#FF9800', '#FB8C00', '#F57C00', '#EF6C00', '#E65100'] ],
39066 groupedModules
: false,
39067 centerModules
: true,
39069 sliderLabel
: false,
39070 sliderValue
: false,
39071 sliderValueEdiable
: false,
39075 barValueEdiable
: false,
39078 hexValueEditable
: false,
39081 greenLabelText
: 'G',
39082 blueLabelText
: 'B',
39084 saturationLabelText
: 'S',
39085 brightnessLabelText
: 'B',
39086 hexLabelText
: 'HEX',
39087 alphaLabelText
: 'A',
39089 // Common opener settings
39091 openIn
: 'popover', // or 'popover' or 'sheet' or 'popup' or 'page' or 'auto'
39092 openInPhone
: 'popup', // or 'popover' or 'sheet' or 'popup' or 'page'
39095 targetElSetBackgroundColor
: false,
39097 inputReadOnly
: true,
39098 closeByOutsideClick
: true,
39099 scrollToInput
: true,
39100 toolbarSheet
: true,
39101 toolbarPopover
: false,
39102 toolbarCloseText
: 'Done',
39104 navbarCloseText
: 'Done',
39105 navbarTitleText
: 'Color',
39106 navbarBackLinkText
: 'Back',
39108 routableModals
: true,
39112 closeByBackdropClick
: true,
39113 // Render functions
39114 renderToolbar
: null,
39115 renderNavbar
: null,
39116 renderInline
: null,
39117 renderPopover
: null,
39126 open
: function open(itemEl
) {
39128 var $itemEl
= $(itemEl
).eq(0);
39129 if (!$itemEl
.length
) { return; }
39130 $itemEl
.addClass('treeview-item-opened');
39131 $itemEl
.trigger('treeview:open');
39132 app
.emit('treeviewOpen', $itemEl
[0]);
39134 $itemEl
[0].f7TreeviewChildrenLoaded
= true;
39135 $itemEl
.find('.treeview-toggle').removeClass('treeview-toggle-hidden');
39136 $itemEl
.find('.treeview-preloader').remove();
39139 if ($itemEl
.hasClass('treeview-load-children') && !$itemEl
[0].f7TreeviewChildrenLoaded
) {
39140 $itemEl
.trigger('treeview:loadchildren', done
);
39141 app
.emit('treeviewLoadChildren', $itemEl
[0], done
);
39142 $itemEl
.find('.treeview-toggle').addClass('treeview-toggle-hidden');
39143 $itemEl
.find('.treeview-item-root').prepend(("<div class=\"preloader treeview-preloader\">" + (Utils
[((app
.theme
) + "PreloaderContent")]) + "</div>"));
39146 close
: function close(itemEl
) {
39148 var $itemEl
= $(itemEl
).eq(0);
39149 if (!$itemEl
.length
) { return; }
39150 $itemEl
.removeClass('treeview-item-opened');
39151 $itemEl
.trigger('treeview:close');
39152 app
.emit('treeviewClose', $itemEl
[0]);
39154 toggle
: function toggle(itemEl
) {
39156 var $itemEl
= $(itemEl
).eq(0);
39157 if (!$itemEl
.length
) { return; }
39158 var wasOpened
= $itemEl
.hasClass('treeview-item-opened');
39159 app
.treeview
[wasOpened
? 'close' : 'open']($itemEl
);
39165 create
: function create() {
39167 Utils
.extend(app
, {
39169 open
: Treeview
.open
.bind(app
),
39170 close
: Treeview
.close
.bind(app
),
39171 toggle
: Treeview
.toggle
.bind(app
),
39176 '.treeview-toggle': function toggle($clickedEl
, clickedData
, e
) {
39178 if ($clickedEl
.parents('.treeview-item-toggle').length
) { return; }
39179 var $treeviewItemEl
= $clickedEl
.parents('.treeview-item').eq(0);
39180 if (!$treeviewItemEl
.length
) { return; }
39181 e
.preventF7Router
= true;
39182 app
.treeview
.toggle($treeviewItemEl
[0]);
39184 '.treeview-item-toggle': function toggle($clickedEl
, clickedData
, e
) {
39186 var $treeviewItemEl
= $clickedEl
.closest('.treeview-item').eq(0);
39187 if (!$treeviewItemEl
.length
) { return; }
39188 e
.preventF7Router
= true;
39189 app
.treeview
.toggle($treeviewItemEl
[0]);
39194 var ViAd
= /*@__PURE__*/(function (Framework7Class
) {
39195 function ViAd(app
, params
) {
39196 if ( params
=== void 0 ) params
= {};
39198 Framework7Class
.call(this, params
, [app
]);
39201 throw new Error('Framework7: vi SDK not found.');
39205 if (typeof win
.orientation
!== 'undefined') {
39206 orientation
= win
.orientation
=== -90 || win
.orientation
=== 90 ? 'horizontal' : 'vertical';
39208 var defaults
= Utils
.extend(
39213 appVer
: app
.version
,
39214 language
: app
.language
,
39216 height
: app
.height
,
39218 osVersion
: Device
.osVersion
,
39219 orientation
: orientation
,
39223 // Extend defaults with modules params
39224 vi
.useModulesParams(defaults
);
39226 vi
.params
= Utils
.extend(defaults
, params
);
39229 var skipParams
= ('on autoplay fallbackOverlay fallbackOverlayText enabled').split(' ');
39230 Object
.keys(vi
.params
).forEach(function (paramName
) {
39231 if (skipParams
.indexOf(paramName
) >= 0) { return; }
39232 var paramValue
= vi
.params
[paramName
];
39233 if ([null, undefined].indexOf(paramValue
) >= 0) { return; }
39234 adParams
[paramName
] = paramValue
;
39237 if (!vi
.params
.appId
) {
39238 throw new Error('Framework7: "app.id" is required to display an ad. Make sure you have specified it on app initialization.');
39240 if (!vi
.params
.placementId
) {
39241 throw new Error('Framework7: "placementId" is required to display an ad.');
39244 function onResize() {
39245 var $viFrame
= $('iframe#viAd');
39246 if ($viFrame
.length
=== 0) { return; }
39249 width
: ((app
.width
) + "px"),
39250 height
: ((app
.height
) + "px"),
39254 function removeOverlay() {
39255 if (!vi
.$overlayEl
) { return; }
39256 vi
.$overlayEl
.off('click touchstart');
39257 vi
.$overlayEl
.remove();
39259 function createOverlay(videoEl
) {
39260 if (!videoEl
) { return; }
39261 vi
.$overlayEl
= $(("\n <div class=\"vi-overlay no-fastclick\">\n " + (vi
.params
.fallbackOverlayText
? ("<div class=\"vi-overlay-text\">" + (vi
.params
.fallbackOverlayText
) + "</div>") : '') + "\n <div class=\"vi-overlay-play-button\"></div>\n </div>\n ").trim());
39263 var touchStartTime
;
39264 vi
.$overlayEl
.on('touchstart', function () {
39265 touchStartTime
= Utils
.now();
39267 vi
.$overlayEl
.on('click', function () {
39268 var timeDiff
= Utils
.now() - touchStartTime
;
39269 if (timeDiff
> 300) { return; }
39278 app
.root
.append(vi
.$overlayEl
);
39282 vi
.ad
= new win
.vi
.Ad(adParams
);
39284 Utils
.extend(vi
.ad
, {
39285 onAdReady
: function onAdReady() {
39286 app
.on('resize', onResize
);
39287 vi
.emit('local::ready');
39288 if (vi
.params
.autoplay
) {
39292 onAdStarted
: function onAdStarted() {
39293 vi
.emit('local::started');
39295 onAdClick
: function onAdClick(targetUrl
) {
39296 vi
.emit('local::click', targetUrl
);
39298 onAdImpression
: function onAdImpression() {
39299 vi
.emit('local::impression');
39301 onAdStopped
: function onAdStopped(reason
) {
39302 app
.off('resize', onResize
);
39305 vi
.emit('local::stopped', reason
);
39306 if (reason
=== 'complete') {
39307 vi
.emit('local::complete');
39308 vi
.emit('local::completed');
39310 if (reason
=== 'userexit') {
39311 vi
.emit('local::userexit');
39313 vi
.destroyed
= true;
39315 onAutoPlayFailed
: function onAutoPlayFailed(reason
, videoEl
) {
39316 vi
.emit('local::autoplayFailed', reason
, videoEl
);
39317 if (reason
&& reason
.name
&& reason
.name
.indexOf('NotAllowedError') !== -1 && vi
.params
.fallbackOverlay
) {
39318 createOverlay(videoEl
);
39321 onAdError
: function onAdError(msg
) {
39323 app
.off('resize', onResize
);
39324 vi
.emit('local::error', msg
);
39325 vi
.destroyed
= true;
39336 if ( Framework7Class
) ViAd
.__proto__
= Framework7Class
;
39337 ViAd
.prototype = Object
.create( Framework7Class
&& Framework7Class
.prototype );
39338 ViAd
.prototype.constructor = ViAd
;
39340 ViAd
.prototype.start
= function start () {
39342 if (vi
.destroyed
) { return; }
39343 if (vi
.ad
) { vi
.ad
.startAd(); }
39346 ViAd
.prototype.pause
= function pause () {
39348 if (vi
.destroyed
) { return; }
39349 if (vi
.ad
) { vi
.ad
.pauseAd(); }
39352 ViAd
.prototype.resume
= function resume () {
39354 if (vi
.destroyed
) { return; }
39355 if (vi
.ad
) { vi
.ad
.resumeAd(); }
39358 ViAd
.prototype.stop
= function stop () {
39360 if (vi
.destroyed
) { return; }
39361 if (vi
.ad
) { vi
.ad
.stopAd(); }
39364 ViAd
.prototype.init
= function init () {
39366 if (vi
.destroyed
) { return; }
39367 if (vi
.ad
) { vi
.ad
.initAd(); }
39370 ViAd
.prototype.destroy
= function destroy () {
39372 vi
.destroyed
= true;
39373 vi
.emit('local::beforeDestroy');
39374 Utils
.deleteProps(vi
);
39378 }(Framework7Class
));
39386 fallbackOverlay
: true,
39387 fallbackOverlayText
: 'Please watch this ad',
39389 startMuted
: (Device
.ios
|| Device
.android
) && !Device
.cordova
,
39395 placementId
: 'pltd4o7ibb9rc653x14',
39396 placementType
: 'interstitial',
39398 showProgress
: true,
39399 showBranding
: true,
39405 advertiserId
: null,
39411 manufacturer
: null,
39413 connectionType
: null,
39414 connectionProvider
: null,
39417 create
: function create() {
39421 createAd
: function createAd(adParams
) {
39422 return new ViAd(app
, adParams
);
39424 loadSdk
: function loadSdk() {
39425 if (app
.vi
.sdkReady
) { return; }
39426 var script
= doc
.createElement('script');
39427 script
.onload
= function onload() {
39428 app
.emit('viSdkReady');
39429 app
.vi
.sdkReady
= true;
39431 script
.src
= 'https://c.vi-serve.com/viadshtml/vi.min.js';
39432 $('head').append(script
);
39437 init
: function init() {
39439 if (app
.params
.vi
.enabled
|| (app
.passedParams
.vi
&& app
.passedParams
.vi
.enabled
!== false)) { app
.vi
.loadSdk(); }
39449 name
: 'typography',
39453 if (typeof window
!== 'undefined') {
39455 if (!window
.Template7
) { window
.Template7
= Template7
; }
39458 if (!window
.Dom7
) { window
.Dom7
= $; }
39462 // Install Core Modules & Components
39464 RouterTemplateLoaderModule
,
39465 RouterComponentLoaderModule
]);
39479 ServiceWorkerModule
,