igniteui-react-grids
Version:
Ignite UI React grid components.
635 lines (634 loc) • 20.5 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 { __extends } from "tslib";
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
*/
var GridSortIndicatorView = /** @class */ /*@__PURE__*/ (function (_super) {
__extends(GridSortIndicatorView, _super);
function GridSortIndicatorView(a) {
var _this = _super.call(this) || this;
_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;
return _this;
}
GridSortIndicatorView.prototype.t = function () {
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;
}
var a = Math.round(this.k * this.g);
var 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 (var c = 0; c < this.d.count; c++) {
this.c.k(this.d._inner[c].j);
var 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();
};
GridSortIndicatorView.prototype.u = function () {
this.t();
};
GridSortIndicatorView.prototype.n = function () {
this.a.an(this.k, this.j, this.d);
};
GridSortIndicatorView.prototype.v = function () {
var _this = this;
if (this.d.count != 1) {
return;
}
this.d._inner[0]._opacity = this.a.r;
var a = { $type: Point_$type, x: this.k / 2, y: this.j / 2 };
var b = new TransformGroup();
b.j.add(((function () {
var $ret = new TranslateTransform();
$ret.j = -a.x;
$ret.k = -a.y;
return $ret;
})()));
b.j.add(((function () {
var $ret = new RotateTransform();
$ret.j = _this.a.q;
return $ret;
})()));
b.j.add(((function () {
var $ret = new TranslateTransform();
$ret.j = a.x;
$ret.k = a.y;
return $ret;
})()));
this.d._inner[0].j = b;
};
GridSortIndicatorView.prototype.o = function () {
this.a.ao(this.k, this.j, this.d);
};
GridSortIndicatorView.prototype.w = function () {
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;
};
GridSortIndicatorView.prototype.p = function () {
this.a.ap(this.k, this.j, this.d);
};
GridSortIndicatorView.prototype.x = function () {
this.d._inner[0]._opacity = this.a.r;
this.d._inner[1]._opacity = this.a.x;
};
GridSortIndicatorView.prototype.r = function (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);
var b = a;
this.l = b;
this.a.j.u(this.l);
this.a.i.u(this.l);
this.l.rootWrapper.addClass("ui-radialgauge-container");
var c = this.g;
var d = Math.round(b.rootWrapper.width());
var e = Math.round(b.rootWrapper.height());
var f = d * c;
var g = e * c;
this.l.rootWrapper.setStyleProperty("position", "relative");
var 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;
var 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();
};
GridSortIndicatorView.prototype.s = function (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();
};
GridSortIndicatorView.prototype.q = function () {
if (isNaN_(this.a.w)) {
this.a.p = window.devicePixelRatio;
if (this.g != this.a.p) {
this.g = this.a.p;
this.t();
}
}
};
GridSortIndicatorView.prototype.y = function () {
return GridStyleRepository.br;
};
GridSortIndicatorView.$t = markType(GridSortIndicatorView, 'GridSortIndicatorView');
return GridSortIndicatorView;
}(Base));
export { GridSortIndicatorView };
/**
* @hidden
*/
var GridSortIndicator = /** @class */ /*@__PURE__*/ (function (_super) {
__extends(GridSortIndicator, _super);
function GridSortIndicator() {
var _this = _super.call(this) || this;
_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;
var a = _this.g;
a.propertyChanged = delegateCombine(a.propertyChanged, runOn(_this, _this.al));
var b = _this.h;
b.propertyChanged = delegateCombine(b.propertyChanged, runOn(_this, _this.am));
return _this;
}
Object.defineProperty(GridSortIndicator.prototype, "ac", {
get: function () {
return this.ab;
},
set: function (a) {
this.ab = a;
},
enumerable: false,
configurable: true
});
Object.defineProperty(GridSortIndicator.prototype, "b", {
get: function () {
return this.a;
},
set: function (a) {
var b = this.a;
this.a = a;
if (b != this.a) {
this.as("SortDirection", enumGetBox(ColumnSortDirection_$type, b), enumGetBox(ColumnSortDirection_$type, this.a));
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(GridSortIndicator.prototype, "a0", {
get: function () {
return this.az;
},
set: function (a) {
var b = this.az;
this.az = a;
if (b != this.az) {
this.as("IconColor", b, this.az);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(GridSortIndicator.prototype, "l", {
get: function () {
return this.k;
},
set: function (a) {
var b = this.k;
this.k = a;
if (b != this.k) {
this.as("IsAnimationEnabled", b, this.k);
}
},
enumerable: false,
configurable: true
});
Object.defineProperty(GridSortIndicator.prototype, "i", {
get: function () {
return this.g;
},
enumerable: false,
configurable: true
});
Object.defineProperty(GridSortIndicator.prototype, "j", {
get: function () {
return this.h;
},
enumerable: false,
configurable: true
});
Object.defineProperty(GridSortIndicator.prototype, "w", {
get: function () {
return this.o;
},
set: function (a) {
var b = this.o;
this.o = a;
this.as("PixelScalingRatio", b, this.o);
},
enumerable: false,
configurable: true
});
Object.defineProperty(GridSortIndicator.prototype, "p", {
get: function () {
return this.m;
},
set: function (a) {
var b = this.m;
this.m = a;
this.as("ActualPixelScalingRatio", b, this.m);
},
enumerable: false,
configurable: true
});
Object.defineProperty(GridSortIndicator.prototype, "f", {
get: function () {
return this.e;
},
set: function (a) {
var b = this.e;
this.e = a;
if (b != this.e) {
this.as("SortIndicatorStyle", enumGetBox(SortIndicatorStyle_$type, b), enumGetBox(SortIndicatorStyle_$type, this.e));
}
},
enumerable: false,
configurable: true
});
GridSortIndicator.prototype.as = function (a, b, c) {
this.aw(a, b, c);
if (this.propertyChanged != null) {
this.propertyChanged(this, new PropertyChangedEventArgs(a));
}
};
Object.defineProperty(GridSortIndicator.prototype, "r", {
get: function () {
return this.n;
},
set: function (a) {
var b = this.n;
this.n = a;
if (b != a) {
this.as("CurrentOpacity", b, a);
}
},
enumerable: false,
configurable: true
});
GridSortIndicator.prototype.aw = function (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;
}
};
GridSortIndicator.prototype.am = function (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();
};
GridSortIndicator.prototype.al = function (a, b) {
this.q = this.s + this.g.o * (this.y - this.s);
this.c.u();
};
GridSortIndicator.prototype.au = function (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();
}
};
GridSortIndicator.prototype.av = function (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();
}
};
GridSortIndicator.prototype.v = function () {
switch (this.f) {
case 0: return 1;
case 1: return 0.71;
case 2: return 1;
}
return 1;
};
GridSortIndicator.prototype.ax = function (a) {
this.c.r(a);
};
GridSortIndicator.prototype.ay = function (a) {
this.j.u(a);
this.i.u(a);
};
GridSortIndicator.prototype.ad = function () {
return this.c.m.getNativeElement();
};
GridSortIndicator.prototype.ar = function (a, b) {
this.c.s(a, b);
};
GridSortIndicator.prototype.aq = function () {
this.c.q();
};
GridSortIndicator.prototype.an = function (a, b, c) {
var d = Math.min(a, b);
var e = { $type: Point_$type, x: a / 2, y: b / 2 };
var f = d * 0.5;
var g = f / 2;
var h = f / 2.5;
var i = g / 2;
var j = new PathFigure();
j._startPoint = { $type: Point_$type, x: e.x, y: e.y - g };
var k = new LineSegment(1);
k.c = { $type: Point_$type, x: e.x, y: e.y + g };
j._segments.add(k);
var l = new PathFigure();
l._startPoint = { $type: Point_$type, x: e.x - h, y: e.y };
var m = new LineSegment(1);
m.c = { $type: Point_$type, x: e.x, y: e.y + g };
var n = new LineSegment(1);
n.c = { $type: Point_$type, x: e.x + h, y: e.y };
l._segments.add(m);
l._segments.add(n);
var o = new PathGeometry();
o.c.add(j);
o.c.add(l);
var p = new Path();
p.an = o;
p._stroke = this.c.y();
p.ad = 1.5;
p.am = 2;
c.add(p);
};
GridSortIndicator.prototype.ao = function (a, b, c) {
var _this = this;
var d = Geometry.a("M3.792172, 7.800278 L7.983785, 3.635676 L12.148387, 7.800278L12.148387, 7.800278");
var e = Geometry.a("M7.97027972,4.10930186 L7.97027972,13.8116223 L7.97027972,4.10930186 Z");
var f = Geometry.a("M11.851613, 16.199722 L16.043224, 20.364325 L20.207829, 16.199722");
var g = Geometry.a("M16.043224,10.1883777 L16.043224,19.8906981 L16.043224,10.1883777 Z");
c.add(((function () {
var $ret = new Path();
$ret.an = d;
$ret.am = 2;
$ret.stroke = _this.c.y();
$ret.ad = 2;
return $ret;
})()));
c.add(((function () {
var $ret = new Path();
$ret.an = e;
$ret.am = 2;
$ret.stroke = _this.c.y();
$ret.ad = 2;
return $ret;
})()));
c.add(((function () {
var $ret = new Path();
$ret.an = f;
$ret.am = 2;
$ret.stroke = _this.c.y();
$ret.ad = 2;
return $ret;
})()));
c.add(((function () {
var $ret = new Path();
$ret.an = g;
$ret.am = 2;
$ret.stroke = _this.c.y();
$ret.ad = 2;
return $ret;
})()));
};
GridSortIndicator.prototype.ap = function (a, b, c) {
var _this = this;
var d = { $type: Point_$type, x: a / 2, y: b / 2 };
var e = { $type: Point_$type, x: d.x - 3.5, y: d.y - 1.5 };
var f = { $type: Point_$type, x: d.x - 3.5, y: d.y + 1.5 };
var g = Geometry.a("M" + e.x.toString() + ", " + e.y.toString() + " l 3.5,-3.5 3.5,3.5");
var h = Geometry.a("M" + f.x.toString() + ", " + f.y.toString() + " l 3.5,3.5 3.5,-3.5");
c.add(((function () {
var $ret = new Path();
$ret.an = g;
$ret.am = 2;
$ret.stroke = _this.c.y();
$ret.ad = 2;
return $ret;
})()));
c.add(((function () {
var $ret = new Path();
$ret.an = h;
$ret.am = 2;
$ret.stroke = _this.c.y();
$ret.ad = 2;
return $ret;
})()));
};
GridSortIndicator.prototype.at = function () {
if (this.renderCompleted != null) {
this.renderCompleted(this, new SortIndicatorRenderCompletedEventArgs());
}
};
GridSortIndicator.$t = markType(GridSortIndicator, 'GridSortIndicator', Base.$, [INotifyPropertyChanged_$type]);
return GridSortIndicator;
}(Base));
export { GridSortIndicator };