@progress/kendo-angular-inputs
Version:
Kendo UI for Angular Inputs Package - Everything you need to build professional form functionality (Checkbox, ColorGradient, ColorPalette, ColorPicker, FlatColorPicker, FormField, MaskedTextBox, NumericTextBox, RadioButton, RangeSlider, Slider, Switch, Te
86 lines (85 loc) • 3.05 kB
JavaScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
/**
* @hidden
*/
export const bezierCommand = (controlPointCalc) => (point, i, a) => {
// start control point
const [cpsX, cpsY] = controlPointCalc(a[i - 1], a[i - 2], point);
// end control point
const [cpeX, cpeY] = controlPointCalc(point, a[i - 1], a[i + 1], true);
return `C ${cpsX},${cpsY} ${cpeX},${cpeY} ${point[0]},${point[1]}`;
};
/**
* @hidden
*/
export const controlPoint = (lineCalc) => (current, previous, next, reverse) => {
// when 'current' is the first or last point of the array
// 'previous' and 'next' are undefined
// replace with 'current'
const p = previous || current;
const n = next || current;
const smooth = 0.1;
// properties of the line between previous and next
const l = lineCalc(p, n);
// If is end-control-point, add PI to the angle to go backward
const angle = l.angle + (reverse ? Math.PI : 0);
const length = l.length * smooth;
// The control point position is relative to the current point
const x = current[0] + Math.cos(angle) * length;
const y = current[1] + Math.sin(angle) * length;
return [x, y];
};
/**
* @hidden
*/
export const line = (pointA, pointB) => {
const lengthX = pointB[0] - pointA[0];
const lengthY = pointB[1] - pointA[1];
return {
length: Math.sqrt(Math.pow(lengthX, 2) + Math.pow(lengthY, 2)),
angle: Math.atan2(lengthY, lengthX)
};
};
/**
* @hidden
*/
export const d = (points, command) => {
if (points.length === 0) {
return '';
}
// build the d attributes by looping over the points
const d = points.reduce((acc, point, i, a) => i === 0 ?
// if first point
`M ${point[0]},${point[1]}` :
// else
`${acc} ${command(point, i, a)}`, '');
return d;
};
/**
* @hidden
*
* Render the svg <path> element.
*
* @param points (array) Represents the points coordinates as an array of tuples.
* @param command (function) The command that is used (bezierCommand, lineCommand).
* @param point (array) [x,y] Represents the current point coordinates.
* @param i (integer) Represents the index of 'point' in the array 'a'.
* @param a (array) Represents the complete array of points coordinates.
* @output (string) a svg path command.
* @output (string) a Svg <path> element
*/
export const svgPath = (points, command) => {
if (points.length === 0) {
return '';
}
// build the d attributes by looping over the points
const d = points.reduce((acc, point, i, a) => i === 0 ?
// if first point
`M ${point[0]},${point[1]}` :
// else
`${acc} ${command(point, i, a)}`, '');
return d;
};