igniteui-react-grids
Version:
Ignite UI React grid components.
589 lines (588 loc) • 19.4 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, Point_$type, markType, INotifyPropertyChanged_$type, PropertyChangedEventArgs, enumGetBox, EnumUtil, runOn, delegateCombine } from "igniteui-react-core";
import { RenderingContext } from "igniteui-react-core";
import { List$1 } from "igniteui-react-core";
import { Path } from "igniteui-react-core";
import { SortIndicatorStyle_$type } from "./SortIndicatorStyle";
import { TransformGroup } from "igniteui-react-core";
import { TranslateTransform } from "igniteui-react-core";
import { RotateTransform } from "igniteui-react-core";
import { DoubleAnimator } from "igniteui-react-core";
import { CanvasViewRenderer } from "igniteui-react-core";
import { GridStyleRepository } from "./GridStyleRepository";
import { truncate, isNaN_ } from "igniteui-react-core";
import { ColumnSortDirection_$type } from "./ColumnSortDirection";
import { EasingFunctions } from "igniteui-react-core";
import { PathFigure } from "igniteui-react-core";
import { LineSegment } from "igniteui-react-core";
import { PathGeometry } from "igniteui-react-core";
import { Geometry } from "igniteui-react-core";
import { SortIndicatorRenderCompletedEventArgs } from "./SortIndicatorRenderCompletedEventArgs";
/**
* @hidden
*/
export let GridSortIndicatorView = /*@__PURE__*/ (() => {
class GridSortIndicatorView extends Base {
constructor(a) {
super();
this.a = null;
this.d = new List$1(Path.$, 0);
this.i = 0;
this.h = 0;
this.b = 0;
this.m = null;
this.c = null;
this.l = null;
this.f = 0;
this.e = 0;
this.g = 1;
this.k = 0;
this.j = 0;
this.a = a;
}
t() {
if (this.m == null || this.c == null) {
return;
}
if (this.i != this.k || this.h != this.j || this.b != this.a.f) {
this.d.clear();
switch (this.a.f) {
case 0:
this.n();
break;
case 1:
this.o();
break;
case 2:
this.p();
break;
}
this.i = this.k;
this.h = this.j;
this.b = this.a.f;
}
switch (this.a.f) {
case 0:
this.v();
break;
case 1:
this.w();
break;
case 2:
this.x();
break;
}
let a = Math.round(this.k * this.g);
let b = Math.round(this.j * this.g);
if (this.f != a || this.e != b) {
this.m.setAttribute("width", a.toString());
this.m.setAttribute("height", b.toString());
this.m.setStyleProperty("width", this.k.toString() + "px");
this.m.setStyleProperty("height", this.j.toString() + "px");
this.m.setStyleProperty("top", "0px");
this.m.setStyleProperty("left", "0px");
this.f = truncate(Math.round(a));
this.e = truncate(Math.round(b));
}
if (this.c.d && this.g != 1) {
this.c.aa();
this.c.ab(this.g, this.g);
}
this.c.l(0, 0, this.k, this.j);
this.c.aa();
this.c.ab(this.a.v(), this.a.v());
for (let c = 0; c < this.d.count; c++) {
this.c.k(this.d._inner[c].j);
let d = this.y();
if (this.a.a0 != null) {
d = this.a.a0;
}
this.d._inner[c]._stroke = d;
this.c.t(this.d._inner[c]);
}
this.c.z();
if (this.c.d && this.g != 1) {
this.c.z();
}
this.a.at();
}
u() {
this.t();
}
n() {
this.a.an(this.k, this.j, this.d);
}
v() {
if (this.d.count != 1) {
return;
}
this.d._inner[0]._opacity = this.a.r;
let a = { $type: Point_$type, x: this.k / 2, y: this.j / 2 };
let b = new TransformGroup();
b.j.add(((() => {
let $ret = new TranslateTransform();
$ret.j = -a.x;
$ret.k = -a.y;
return $ret;
})()));
b.j.add(((() => {
let $ret = new RotateTransform();
$ret.j = this.a.q;
return $ret;
})()));
b.j.add(((() => {
let $ret = new TranslateTransform();
$ret.j = a.x;
$ret.k = a.y;
return $ret;
})()));
this.d._inner[0].j = b;
}
o() {
this.a.ao(this.k, this.j, this.d);
}
w() {
if (this.d.count != 4) {
return;
}
this.d._inner[0]._opacity = this.a.r;
this.d._inner[1]._opacity = this.a.r;
this.d._inner[2]._opacity = this.a.x;
this.d._inner[3]._opacity = this.a.x;
}
p() {
this.a.ap(this.k, this.j, this.d);
}
x() {
this.d._inner[0]._opacity = this.a.r;
this.d._inner[1]._opacity = this.a.x;
}
r(a) {
if (a == null) {
this.m = null;
this.l = null;
this.c = null;
return;
}
this.g = (isNaN_(this.a.w) ? this.a.p : this.a.w);
let b = a;
this.l = b;
this.a.j.u(this.l);
this.a.i.u(this.l);
this.l.rootWrapper.addClass("ui-radialgauge-container");
let c = this.g;
let d = Math.round(b.rootWrapper.width());
let e = Math.round(b.rootWrapper.height());
let f = d * c;
let g = e * c;
this.l.rootWrapper.setStyleProperty("position", "relative");
let h = this.l.createElement("canvas");
h.setStyleProperty("position", "absolute");
this.l.append(h);
this.f = truncate(Math.round(f));
this.e = truncate(Math.round(g));
h.setAttribute("width", f.toString());
h.setAttribute("height", g.toString());
h.setStyleProperty("width", d.toString() + "px");
h.setStyleProperty("height", e.toString() + "px");
this.k = d;
this.j = e;
this.m = h;
let i = this.l.get2DCanvasContext(this.m);
this.c = new RenderingContext(new CanvasViewRenderer(), i);
if (isNaN_(this.a.w)) {
this.a.p = window.devicePixelRatio;
this.g = this.a.p;
}
this.t();
}
s(a, b) {
if (isNaN_(this.a.w)) {
this.a.p = window.devicePixelRatio;
this.g = this.a.p;
}
this.k = a;
this.j = b;
this.t();
}
q() {
if (isNaN_(this.a.w)) {
this.a.p = window.devicePixelRatio;
if (this.g != this.a.p) {
this.g = this.a.p;
this.t();
}
}
}
y() {
return GridStyleRepository.br;
}
}
GridSortIndicatorView.$t = /*@__PURE__*/ markType(GridSortIndicatorView, 'GridSortIndicatorView');
return GridSortIndicatorView;
})();
/**
* @hidden
*/
export let GridSortIndicator = /*@__PURE__*/ (() => {
class GridSortIndicator extends Base {
get ac() {
return this.ab;
}
set ac(a) {
this.ab = a;
}
get b() {
return this.a;
}
set b(a) {
let b = this.a;
this.a = a;
if (b != this.a) {
this.as("SortDirection", enumGetBox(ColumnSortDirection_$type, b), enumGetBox(ColumnSortDirection_$type, this.a));
}
}
get a0() {
return this.az;
}
set a0(a) {
let b = this.az;
this.az = a;
if (b != this.az) {
this.as("IconColor", b, this.az);
}
}
get l() {
return this.k;
}
set l(a) {
let b = this.k;
this.k = a;
if (b != this.k) {
this.as("IsAnimationEnabled", b, this.k);
}
}
get i() {
return this.g;
}
get j() {
return this.h;
}
get w() {
return this.o;
}
set w(a) {
let b = this.o;
this.o = a;
this.as("PixelScalingRatio", b, this.o);
}
get p() {
return this.m;
}
set p(a) {
let b = this.m;
this.m = a;
this.as("ActualPixelScalingRatio", b, this.m);
}
get f() {
return this.e;
}
set f(a) {
let b = this.e;
this.e = a;
if (b != this.e) {
this.as("SortIndicatorStyle", enumGetBox(SortIndicatorStyle_$type, b), enumGetBox(SortIndicatorStyle_$type, this.e));
}
}
as(a, b, c) {
this.aw(a, b, c);
if (this.propertyChanged != null) {
this.propertyChanged(this, new PropertyChangedEventArgs(a));
}
}
get r() {
return this.n;
}
set r(a) {
let b = this.n;
this.n = a;
if (b != a) {
this.as("CurrentOpacity", b, a);
}
}
aw(a, b, c) {
switch (a) {
case "PixelScalingRatio":
this.p = this.w;
break;
case "ActualPixelScalingRatio":
this.c.u();
break;
case "IconColor":
this.c.u();
break;
case "SortIndicatorStyle":
switch (this.f) {
case 0:
this.au(this.b, false);
break;
case 1:
case 2:
this.av(this.b, false);
break;
}
break;
case "SortDirection":
switch (this.f) {
case 0:
this.au(EnumUtil.getEnumValue(ColumnSortDirection_$type, c), this.l);
break;
case 1:
case 2:
this.av(EnumUtil.getEnumValue(ColumnSortDirection_$type, c), this.l);
break;
}
break;
}
}
constructor() {
super();
this.ab = null;
this.a = 0;
this.az = null;
this.k = true;
this.propertyChanged = null;
this.g = null;
this.h = null;
this.o = NaN;
this.m = 1;
this.e = 0;
this.n = 0;
this.q = 0;
this.x = 0;
this.t = 0;
this.s = 0;
this.z = 0;
this.y = 0;
this.u = 0;
this.aa = 0;
this.c = null;
this.renderCompleted = null;
this.r = 0;
this.x = 0.5;
this.q = 180;
this.c = new GridSortIndicatorView(this);
this.g = new DoubleAnimator(0, 1, 400);
this.h = new DoubleAnimator(0, 1, 400);
this.g.b = EasingFunctions.cubicEase;
this.h.b = EasingFunctions.cubicEase;
let a = this.g;
a.propertyChanged = delegateCombine(a.propertyChanged, runOn(this, this.al));
let b = this.h;
b.propertyChanged = delegateCombine(b.propertyChanged, runOn(this, this.am));
}
am(a, b) {
switch (this.f) {
case 0:
this.r = this.t + this.h.o * (this.z - this.t);
break;
case 1:
case 2:
this.r = this.t + this.h.o * (this.z - this.t);
this.x = this.u + this.h.o * (this.aa - this.u);
break;
}
this.c.u();
}
al(a, b) {
this.q = this.s + this.g.o * (this.y - this.s);
this.c.u();
}
au(a, b) {
this.t = this.r;
this.s = this.q;
if (this.l || this.g.f() || this.h.f()) {
this.g.w();
this.h.w();
}
if (a == 0) {
this.z = 0;
this.y = 180;
}
else {
this.z = 1;
if (a == 1) {
this.y = 180;
}
else {
this.y = 0;
}
}
if (b) {
this.g.v();
this.h.v();
}
else {
this.q = this.y;
this.r = this.z;
this.c.u();
}
}
av(a, b) {
this.t = this.r;
this.u = this.x;
if (this.l || this.h.f()) {
this.h.w();
}
switch (a) {
case 0:
this.z = 0.4;
this.aa = 0.4;
break;
case 1:
this.z = 1;
this.aa = 0.2;
break;
case 2:
this.z = 0.2;
this.aa = 1;
break;
}
if (b) {
this.h.v();
}
else {
this.r = this.z;
this.x = this.aa;
this.c.u();
}
}
v() {
switch (this.f) {
case 0: return 1;
case 1: return 0.71;
case 2: return 1;
}
return 1;
}
ax(a) {
this.c.r(a);
}
ay(a) {
this.j.u(a);
this.i.u(a);
}
ad() {
return this.c.m.getNativeElement();
}
ar(a, b) {
this.c.s(a, b);
}
aq() {
this.c.q();
}
an(a, b, c) {
let d = Math.min(a, b);
let e = { $type: Point_$type, x: a / 2, y: b / 2 };
let f = d * 0.5;
let g = f / 2;
let h = f / 2.5;
let i = g / 2;
let j = new PathFigure();
j._startPoint = { $type: Point_$type, x: e.x, y: e.y - g };
let k = new LineSegment(1);
k.c = { $type: Point_$type, x: e.x, y: e.y + g };
j._segments.add(k);
let l = new PathFigure();
l._startPoint = { $type: Point_$type, x: e.x - h, y: e.y };
let m = new LineSegment(1);
m.c = { $type: Point_$type, x: e.x, y: e.y + g };
let n = new LineSegment(1);
n.c = { $type: Point_$type, x: e.x + h, y: e.y };
l._segments.add(m);
l._segments.add(n);
let o = new PathGeometry();
o.c.add(j);
o.c.add(l);
let p = new Path();
p.an = o;
p._stroke = this.c.y();
p.ad = 1.5;
p.am = 2;
c.add(p);
}
ao(a, b, c) {
let d = Geometry.a("M3.792172, 7.800278 L7.983785, 3.635676 L12.148387, 7.800278L12.148387, 7.800278");
let e = Geometry.a("M7.97027972,4.10930186 L7.97027972,13.8116223 L7.97027972,4.10930186 Z");
let f = Geometry.a("M11.851613, 16.199722 L16.043224, 20.364325 L20.207829, 16.199722");
let g = Geometry.a("M16.043224,10.1883777 L16.043224,19.8906981 L16.043224,10.1883777 Z");
c.add(((() => {
let $ret = new Path();
$ret.an = d;
$ret.am = 2;
$ret.stroke = this.c.y();
$ret.ad = 2;
return $ret;
})()));
c.add(((() => {
let $ret = new Path();
$ret.an = e;
$ret.am = 2;
$ret.stroke = this.c.y();
$ret.ad = 2;
return $ret;
})()));
c.add(((() => {
let $ret = new Path();
$ret.an = f;
$ret.am = 2;
$ret.stroke = this.c.y();
$ret.ad = 2;
return $ret;
})()));
c.add(((() => {
let $ret = new Path();
$ret.an = g;
$ret.am = 2;
$ret.stroke = this.c.y();
$ret.ad = 2;
return $ret;
})()));
}
ap(a, b, c) {
let d = { $type: Point_$type, x: a / 2, y: b / 2 };
let e = { $type: Point_$type, x: d.x - 3.5, y: d.y - 1.5 };
let f = { $type: Point_$type, x: d.x - 3.5, y: d.y + 1.5 };
let g = Geometry.a("M" + e.x.toString() + ", " + e.y.toString() + " l 3.5,-3.5 3.5,3.5");
let h = Geometry.a("M" + f.x.toString() + ", " + f.y.toString() + " l 3.5,3.5 3.5,-3.5");
c.add(((() => {
let $ret = new Path();
$ret.an = g;
$ret.am = 2;
$ret.stroke = this.c.y();
$ret.ad = 2;
return $ret;
})()));
c.add(((() => {
let $ret = new Path();
$ret.an = h;
$ret.am = 2;
$ret.stroke = this.c.y();
$ret.ad = 2;
return $ret;
})()));
}
at() {
if (this.renderCompleted != null) {
this.renderCompleted(this, new SortIndicatorRenderCompletedEventArgs());
}
}
}
GridSortIndicator.$t = /*@__PURE__*/ markType(GridSortIndicator, 'GridSortIndicator', Base.$, [INotifyPropertyChanged_$type]);
return GridSortIndicator;
})();