igniteui-webcomponents-inputs
Version:
Ignite UI Web Components inputs components.
393 lines (392 loc) • 11.6 kB
JavaScript
/*
THIS INFRAGISTICS ULTIMATE SOFTWARE LICENSE AGREEMENT ("AGREEMENT") LOCATED HERE:
https://www.infragistics.com/legal/license/igultimate-la
https://www.infragistics.com/legal/license/igultimate-eula
GOVERNS THE LICENSING, INSTALLATION AND USE OF INFRAGISTICS SOFTWARE. BY DOWNLOADING AND/OR INSTALLING AND USING INFRAGISTICS SOFTWARE: you are indicating that you have read and understand this Agreement, and agree to be legally bound by it on behalf of the yourself and your company.
*/
import { Base, Delegate_$type, fromEnum, runOn, markType, INotifyPropertyChanged_$type, PropertyChangedEventArgs } from "igniteui-webcomponents-core";
import { List$1 } from "igniteui-webcomponents-core";
import { ScaleTransform } from "igniteui-webcomponents-core";
import { NativeUI } from "igniteui-webcomponents-core";
import { KeyFrameAnimationFactory } from "igniteui-webcomponents-core";
import { AnimationKeyFrameEffect } from "igniteui-webcomponents-core";
import { AnimationKeyFrameEffectTiming } from "igniteui-webcomponents-core";
import { LinkedList$1 } from "igniteui-webcomponents-core";
import { IKeyFrameAnimation_$type } from "igniteui-webcomponents-core";
import { AnimationKeyFrameProperty } from "igniteui-webcomponents-core";
import { RippleVisualModelExport } from "./RippleVisualModelExport";
import { AppearanceHelper } from "igniteui-webcomponents-core";
import { BrushUtil } from "igniteui-webcomponents-core";
let RippleView = /*@__PURE__*/ (() => {
class RippleView extends Base {
constructor() {
super();
this.b = null;
this.g = null;
this.c = null;
this.f = new List$1(Delegate_$type, 0);
this.l = null;
this.d = true;
this.k = null;
this.h = null;
this.j = null;
this.i = null;
}
w() {
}
e() {
return true;
}
t(a) {
if (a == null) {
for (let b of fromEnum(this.f)) {
b();
}
this.f.clear();
}
this.g = a;
this.b.ai();
}
v() {
if (this.b.q == null) {
this.l = null;
for (let a of fromEnum(this.f)) {
a();
}
this.f.clear();
}
else {
let b = this.b.q;
let c = this.g.getWrapper(b);
this.l = c;
this.f.add(c.listen("click", runOn(this, this.p)));
this.f.add(c.listen("mouseenter", runOn(this, this.q)));
this.f.add(c.listen("mouseleave", runOn(this, this.r)));
}
}
r(a) {
this.b.ag();
}
q(a) {
this.b.af();
}
p(a) {
if (this.l == null) {
return;
}
let b = this.g.rootWrapper.getOffset();
let c = a.pageX - b.left;
let d = a.pageY - b.top;
this.b.al(c, d, this.g.rootWrapper.outerWidth(), this.g.rootWrapper.outerHeight());
}
aa() {
if (this.b.j) {
this.g.rootWrapper.setStyleProperty("background-color", this.b.as._fill);
}
}
x() {
this.g.rootWrapper.setStyleProperty("background-color", "transparent");
}
z() {
this.g.rootWrapper.setStyleProperty("background-color", this.b.as._fill);
}
m(a, b, c) {
let d = this.g.createElement("span");
d.setStyleProperty("width", c * 2 + "px");
d.setStyleProperty("height", c * 2 + "px");
d.setStyleProperty("top", b + "px");
d.setStyleProperty("left", a + "px");
d.setStyleProperty("background-color", this.b.at._fill);
d.setStyleProperty("position", "absolute");
d.setStyleProperty("pointer-events", "none");
d.setStyleProperty("border-radius", c + "px");
d.setStyleProperty("opacity", ".5");
NativeUI.af(d, ((() => {
let $ret = new ScaleTransform();
$ret.l = 0.3;
$ret.m = 0.3;
return $ret;
})()));
this.g.append(d);
return d;
}
y(a) {
let b = a;
b.remove();
}
n() {
if (KeyFrameAnimationFactory.h == null) {
KeyFrameAnimationFactory.h = this.g;
}
}
a(a, b) {
return new AnimationKeyFrameEffect(0, a, 0, null, b);
}
o(a) {
}
s() {
this.d = true;
this.v();
}
u() {
this.d = false;
for (let a of fromEnum(this.f)) {
a();
}
this.f.clear();
}
}
RippleView.$t = /*@__PURE__*/ markType(RippleView, 'RippleView');
return RippleView;
})();
export { RippleView };
let XRipple = /*@__PURE__*/ (() => {
class XRipple extends Base {
constructor() {
super();
this.c = null;
this.j = false;
this.p = null;
this.ar = null;
this.aq = null;
this.ao = XRipple.au;
this.m = new LinkedList$1(IKeyFrameAnimation_$type);
this.ap = XRipple.av;
this.n = 600;
this.f = false;
this.e = false;
this.g = false;
this.propertyChanged = null;
let a = new RippleView();
a.b = this;
this.c = a;
this.c.w();
}
destroy() {
this.provideContainer(null);
}
ah(a, b, c) {
if (this.propertyChanged != null) {
this.propertyChanged(this, new PropertyChangedEventArgs(a));
}
this.aj(a, b, c);
}
aj(a, b, c) {
switch (a) {
case "RippleColor":
this.at = this.ax != null ? this.ax : XRipple.av;
break;
case "HoverColor":
this.as = this.aw != null ? this.aw : XRipple.au;
break;
case "EventSource":
if (this.c.e()) {
this.c.v();
}
break;
case "ActualRippleColor":
this.an();
break;
case "ActualHoverColor":
this.am();
break;
}
}
am() {
if (this.i) {
this.c.x();
return;
}
this.c.aa();
}
an() {
}
af() {
this.j = true;
if (this.i) {
this.c.x();
return;
}
if (this.k) {
this.c.z();
}
}
ag() {
this.j = false;
if (this.k || this.i) {
this.c.x();
}
}
get q() {
return this.p;
}
set q(a) {
let b = this.p;
this.p = a;
if (b != this.p) {
this.ah("EventSource", b, a);
}
}
get ax() {
return this.ar;
}
set ax(a) {
let b = this.ar;
this.ar = a;
if (b != this.ar) {
this.ah("RippleColor", b, a);
}
}
get aw() {
return this.aq;
}
set aw(a) {
let b = this.aq;
this.aq = a;
if (b != this.aq) {
this.ah("HoverColor", b, a);
}
}
get as() {
return this.ao;
}
set as(a) {
let b = this.ao;
this.ao = a;
if (b != this.ao) {
this.ah("ActualHoverColor", b, a);
}
}
al(a, b, c, d) {
if (this.i) {
return;
}
let e = Math.max(c, d);
let f = e / 2;
let g = a - f;
let h = b - f;
if (this.h) {
g = 0;
h = 0;
}
let i = this.c.m(g, h, f);
let j = this.d(i);
this.m.f(j);
let k = this.m.d;
j.play();
j.finished.f((l) => {
j.commitStyles();
this.m.h(k);
this.c.y(i);
});
}
d(a) {
let b = this.a;
let c = KeyFrameAnimationFactory.f.c(this.c.a(a, b).m(new AnimationKeyFrameProperty(1, 0.5), new AnimationKeyFrameProperty(14, ((() => {
let $ret = new ScaleTransform();
$ret.l = 0.3;
$ret.m = 0.3;
return $ret;
})()))).m(new AnimationKeyFrameProperty(1, 0), new AnimationKeyFrameProperty(14, ((() => {
let $ret = new ScaleTransform();
$ret.l = 2;
$ret.m = 2;
return $ret;
})()))));
return c;
}
get at() {
return this.ap;
}
set at(a) {
let b = this.ap;
this.ap = a;
if (b != this.ap) {
this.ah("ActualRippleColor", b, a);
}
}
get o() {
return this.n;
}
set o(a) {
let b = this.n;
this.n = a;
if (b != this.n) {
this.ah("RippleDuration", b, a);
}
}
get i() {
return this.f;
}
set i(a) {
let b = this.f;
this.f = a;
if (b != this.f) {
this.ah("IsDisabled", b, a);
}
}
get h() {
return this.e;
}
set h(a) {
let b = this.e;
this.e = a;
if (b != this.e) {
this.ah("IsCentered", b, a);
}
}
get k() {
return this.g;
}
set k(a) {
let b = this.g;
this.g = a;
if (b != this.g) {
this.ah("IsHoverEnabled", b, a);
}
}
ai() {
this.c.v();
}
get a() {
let a = new AnimationKeyFrameEffectTiming();
a.g = this.o;
a.b = 0;
return a;
}
onDetachedFromUI() {
this.c.u();
}
onAttachedToUI() {
this.c.s();
}
l() {
return this.c.e();
}
r() {
return this.b();
}
v() {
let a = this.b();
return a.g();
}
b() {
let a = new RippleVisualModelExport();
a.a = AppearanceHelper.a(this.as);
a.b = AppearanceHelper.a(this.at);
a.f = this.o;
a.d = this.i;
a.c = this.h;
a.e = this.k;
return a;
}
provideContainer(a) {
this.c.t(a);
}
}
XRipple.$t = /*@__PURE__*/ markType(XRipple, 'XRipple', Base.$, [INotifyPropertyChanged_$type]);
XRipple.au = /*@__PURE__*/ BrushUtil.j(40, 0, 0, 0);
XRipple.av = /*@__PURE__*/ BrushUtil.j(189, 0, 0, 0);
return XRipple;
})();
export { XRipple };