-
Notifications
You must be signed in to change notification settings - Fork 0
/
28-es5.js
181 lines (149 loc) · 10 KB
/
28-es5.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
(function () {
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
(window["webpackJsonp"] = window["webpackJsonp"] || []).push([[28], {
/***/
"./node_modules/@ionic/core/dist/esm/ion-ripple-effect.entry.js":
/*!**********************************************************************!*\
!*** ./node_modules/@ionic/core/dist/esm/ion-ripple-effect.entry.js ***!
\**********************************************************************/
/*! exports provided: ion_ripple_effect */
/***/
function node_modulesIonicCoreDistEsmIonRippleEffectEntryJs(module, __webpack_exports__, __webpack_require__) {
"use strict";
__webpack_require__.r(__webpack_exports__);
/* harmony export (binding) */
__webpack_require__.d(__webpack_exports__, "ion_ripple_effect", function () {
return RippleEffect;
});
/* harmony import */
var _index_e806d1f6_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(
/*! ./index-e806d1f6.js */
"./node_modules/@ionic/core/dist/esm/index-e806d1f6.js");
/* harmony import */
var _ionic_global_9d5c8ee3_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(
/*! ./ionic-global-9d5c8ee3.js */
"./node_modules/@ionic/core/dist/esm/ionic-global-9d5c8ee3.js");
var rippleEffectCss = ":host{left:0;right:0;top:0;bottom:0;position:absolute;contain:strict;pointer-events:none}:host(.unbounded){contain:layout size style}.ripple-effect{border-radius:50%;position:absolute;background-color:currentColor;color:inherit;contain:strict;opacity:0;-webkit-animation:225ms rippleAnimation forwards, 75ms fadeInAnimation forwards;animation:225ms rippleAnimation forwards, 75ms fadeInAnimation forwards;will-change:transform, opacity;pointer-events:none}.fade-out{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale, 1));transform:translate(var(--translate-end)) scale(var(--final-scale, 1));-webkit-animation:150ms fadeOutAnimation forwards;animation:150ms fadeOutAnimation forwards}@-webkit-keyframes rippleAnimation{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale, 1));transform:translate(var(--translate-end)) scale(var(--final-scale, 1))}}@keyframes rippleAnimation{from{-webkit-animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transform:scale(1);transform:scale(1)}to{-webkit-transform:translate(var(--translate-end)) scale(var(--final-scale, 1));transform:translate(var(--translate-end)) scale(var(--final-scale, 1))}}@-webkit-keyframes fadeInAnimation{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:0.16}}@keyframes fadeInAnimation{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0}to{opacity:0.16}}@-webkit-keyframes fadeOutAnimation{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}@keyframes fadeOutAnimation{from{-webkit-animation-timing-function:linear;animation-timing-function:linear;opacity:0.16}to{opacity:0}}";
var RippleEffect = /*#__PURE__*/function () {
function RippleEffect(hostRef) {
_classCallCheck(this, RippleEffect);
Object(_index_e806d1f6_js__WEBPACK_IMPORTED_MODULE_0__["r"])(this, hostRef);
/**
* Sets the type of ripple-effect:
*
* - `bounded`: the ripple effect expands from the user's click position
* - `unbounded`: the ripple effect expands from the center of the button and overflows the container.
*
* NOTE: Surfaces for bounded ripples should have the overflow property set to hidden,
* while surfaces for unbounded ripples should have it set to visible.
*/
this.type = 'bounded';
}
/**
* Adds the ripple effect to the parent element.
*
* @param x The horizontal coordinate of where the ripple should start.
* @param y The vertical coordinate of where the ripple should start.
*/
_createClass(RippleEffect, [{
key: "addRipple",
value: function () {
var _addRipple = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(x, y) {
var _this = this;
return regeneratorRuntime.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
return _context.abrupt("return", new Promise(function (resolve) {
Object(_index_e806d1f6_js__WEBPACK_IMPORTED_MODULE_0__["f"])(function () {
var rect = _this.el.getBoundingClientRect();
var width = rect.width;
var height = rect.height;
var hypotenuse = Math.sqrt(width * width + height * height);
var maxDim = Math.max(height, width);
var maxRadius = _this.unbounded ? maxDim : hypotenuse + PADDING;
var initialSize = Math.floor(maxDim * INITIAL_ORIGIN_SCALE);
var finalScale = maxRadius / initialSize;
var posX = x - rect.left;
var posY = y - rect.top;
if (_this.unbounded) {
posX = width * 0.5;
posY = height * 0.5;
}
var styleX = posX - initialSize * 0.5;
var styleY = posY - initialSize * 0.5;
var moveX = width * 0.5 - posX;
var moveY = height * 0.5 - posY;
Object(_index_e806d1f6_js__WEBPACK_IMPORTED_MODULE_0__["c"])(function () {
var div = document.createElement('div');
div.classList.add('ripple-effect');
var style = div.style;
style.top = styleY + 'px';
style.left = styleX + 'px';
style.width = style.height = initialSize + 'px';
style.setProperty('--final-scale', "".concat(finalScale));
style.setProperty('--translate-end', "".concat(moveX, "px, ").concat(moveY, "px"));
var container = _this.el.shadowRoot || _this.el;
container.appendChild(div);
setTimeout(function () {
resolve(function () {
removeRipple(div);
});
}, 225 + 100);
});
});
}));
case 1:
case "end":
return _context.stop();
}
}
}, _callee);
}));
function addRipple(_x, _x2) {
return _addRipple.apply(this, arguments);
}
return addRipple;
}()
}, {
key: "render",
value: function render() {
var _class;
var mode = Object(_ionic_global_9d5c8ee3_js__WEBPACK_IMPORTED_MODULE_1__["b"])(this);
return Object(_index_e806d1f6_js__WEBPACK_IMPORTED_MODULE_0__["h"])(_index_e806d1f6_js__WEBPACK_IMPORTED_MODULE_0__["H"], {
role: "presentation",
"class": (_class = {}, _defineProperty(_class, mode, true), _defineProperty(_class, 'unbounded', this.unbounded), _class)
});
}
}, {
key: "unbounded",
get: function get() {
return this.type === 'unbounded';
}
}, {
key: "el",
get: function get() {
return Object(_index_e806d1f6_js__WEBPACK_IMPORTED_MODULE_0__["i"])(this);
}
}]);
return RippleEffect;
}();
var removeRipple = function removeRipple(ripple) {
ripple.classList.add('fade-out');
setTimeout(function () {
ripple.remove();
}, 200);
};
var PADDING = 10;
var INITIAL_ORIGIN_SCALE = 0.5;
RippleEffect.style = rippleEffectCss;
/***/
}
}]);
})();
//# sourceMappingURL=28-es5.js.map