@stemy/ngx-utils 19.7.9 → 19.7.10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/stemy-ngx-utils.mjs +56 -49
- package/fesm2022/stemy-ngx-utils.mjs.map +1 -1
- package/ngx-utils/common-types.d.ts +11 -1
- package/ngx-utils/components/interactive-canvas/interactive-circle.component.d.ts +2 -3
- package/ngx-utils/components/interactive-canvas/interactive-item.component.d.ts +5 -3
- package/ngx-utils/components/interactive-canvas/interactive-rect.component.d.ts +4 -5
- package/ngx-utils/utils/canvas.d.ts +0 -3
- package/ngx-utils/utils/geometry/shapes.d.ts +4 -0
- package/package.json +1 -1
- package/public_api.d.ts +2 -2
|
@@ -1136,19 +1136,6 @@ const shg_table = [
|
|
|
1136
1136
|
24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24,
|
|
1137
1137
|
24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24
|
|
1138
1138
|
];
|
|
1139
|
-
function drawRect(ctx, w, h) {
|
|
1140
|
-
ctx.beginPath();
|
|
1141
|
-
ctx.rect(-w / 2, -h / 2, w, h);
|
|
1142
|
-
ctx.closePath();
|
|
1143
|
-
}
|
|
1144
|
-
function drawOval(ctx, w, h) {
|
|
1145
|
-
ctx.beginPath();
|
|
1146
|
-
ctx.ellipse(0, 0, w / 2, h / 2, 0, 0, Math.PI * 2);
|
|
1147
|
-
ctx.closePath();
|
|
1148
|
-
}
|
|
1149
|
-
function drawPoint(ctx) {
|
|
1150
|
-
drawOval(ctx, 4, 4);
|
|
1151
|
-
}
|
|
1152
1139
|
class CanvasUtils {
|
|
1153
1140
|
static manipulatePixels(canvas, ctx, colorTransformer) {
|
|
1154
1141
|
const imgData = ctx.getImageData(0, 0, canvas.width, canvas.height);
|
|
@@ -2118,6 +2105,11 @@ class Point extends Shape {
|
|
|
2118
2105
|
const x = Number(xOrP);
|
|
2119
2106
|
this.pt = isPoint(xOrP) ? xOrP : { x: isNaN(x) ? 0 : xOrP, y };
|
|
2120
2107
|
}
|
|
2108
|
+
draw(ctx) {
|
|
2109
|
+
ctx.beginPath();
|
|
2110
|
+
ctx.ellipse(0, 0, 1.5, 1.5, 0, 0, Math.PI * 2);
|
|
2111
|
+
ctx.closePath();
|
|
2112
|
+
}
|
|
2121
2113
|
support() {
|
|
2122
2114
|
return this.center;
|
|
2123
2115
|
}
|
|
@@ -2190,6 +2182,17 @@ class Rect extends Shape {
|
|
|
2190
2182
|
this.height = height;
|
|
2191
2183
|
this.rotation = rotation;
|
|
2192
2184
|
}
|
|
2185
|
+
draw(ctx, ratio) {
|
|
2186
|
+
ratio = ratio ?? 1;
|
|
2187
|
+
const w = this.width * ratio;
|
|
2188
|
+
const h = this.height * ratio;
|
|
2189
|
+
const angle = toRadians(this.rotation);
|
|
2190
|
+
ctx.rotate(angle);
|
|
2191
|
+
ctx.beginPath();
|
|
2192
|
+
ctx.rect(-w / 2, -h / 2, w, h);
|
|
2193
|
+
ctx.closePath();
|
|
2194
|
+
ctx.rotate(-angle);
|
|
2195
|
+
}
|
|
2193
2196
|
support(dir) {
|
|
2194
2197
|
const ang = this.rotation ?? 0;
|
|
2195
2198
|
const dLocal = rotateDeg(ensurePoint(dir, { x: 1, y: 0 }), -ang);
|
|
@@ -2211,6 +2214,17 @@ class Oval extends Shape {
|
|
|
2211
2214
|
this.height = height;
|
|
2212
2215
|
this.rotation = rotation;
|
|
2213
2216
|
}
|
|
2217
|
+
draw(ctx, ratio) {
|
|
2218
|
+
ratio = ratio ?? 1;
|
|
2219
|
+
const w = this.width * ratio;
|
|
2220
|
+
const h = this.height * ratio;
|
|
2221
|
+
const angle = toRadians(this.rotation);
|
|
2222
|
+
ctx.rotate(angle);
|
|
2223
|
+
ctx.beginPath();
|
|
2224
|
+
ctx.ellipse(0, 0, w / 2, h / 2, 0, 0, Math.PI * 2);
|
|
2225
|
+
ctx.closePath();
|
|
2226
|
+
ctx.rotate(-angle);
|
|
2227
|
+
}
|
|
2214
2228
|
support(dir) {
|
|
2215
2229
|
const ang = this.rotation ?? 0;
|
|
2216
2230
|
const d = rotateDeg(ensurePoint(dir, { x: 1, y: 0 }), -ang);
|
|
@@ -7830,6 +7844,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
7830
7844
|
}] } });
|
|
7831
7845
|
|
|
7832
7846
|
class InteractiveItemComponent {
|
|
7847
|
+
get frame() {
|
|
7848
|
+
return this.mFrame;
|
|
7849
|
+
}
|
|
7833
7850
|
get shapes() {
|
|
7834
7851
|
return this.mShapes;
|
|
7835
7852
|
}
|
|
@@ -7894,10 +7911,11 @@ class InteractiveItemComponent {
|
|
|
7894
7911
|
this.valid = true;
|
|
7895
7912
|
this.pos = Point.Zero;
|
|
7896
7913
|
this.direction = "none";
|
|
7914
|
+
this.mFrame = new Rect(0, 0, 3, 3);
|
|
7897
7915
|
this.mShapes = [];
|
|
7898
7916
|
}
|
|
7899
|
-
draw(ctx) {
|
|
7900
|
-
|
|
7917
|
+
draw(ctx, shape) {
|
|
7918
|
+
shape.draw(ctx, 1);
|
|
7901
7919
|
ctx.fill();
|
|
7902
7920
|
ctx.stroke();
|
|
7903
7921
|
}
|
|
@@ -8358,7 +8376,7 @@ class InteractiveCanvasComponent {
|
|
|
8358
8376
|
ctx.lineWidth = 1;
|
|
8359
8377
|
ctx.strokeStyle = "black";
|
|
8360
8378
|
ctx.fillStyle = "white";
|
|
8361
|
-
await item.draw(ctx);
|
|
8379
|
+
await item.draw(ctx, shape);
|
|
8362
8380
|
ctx.restore();
|
|
8363
8381
|
}
|
|
8364
8382
|
}
|
|
@@ -8417,20 +8435,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
8417
8435
|
class InteractiveCircleComponent extends InteractiveItemComponent {
|
|
8418
8436
|
constructor() {
|
|
8419
8437
|
super();
|
|
8420
|
-
this.radius = 10;
|
|
8421
|
-
|
|
8422
|
-
|
|
8423
|
-
|
|
8424
|
-
|
|
8425
|
-
ctx.fill();
|
|
8426
|
-
ctx.stroke();
|
|
8438
|
+
this.radius = input(10);
|
|
8439
|
+
effect(() => {
|
|
8440
|
+
const radius = this.radius();
|
|
8441
|
+
this.mFrame = new Rect(0, 0, radius * 2, radius * 2);
|
|
8442
|
+
});
|
|
8427
8443
|
}
|
|
8428
8444
|
calcShape(x, y) {
|
|
8429
|
-
const
|
|
8430
|
-
return new Circle(x, y,
|
|
8445
|
+
const radius = untracked(() => this.radius());
|
|
8446
|
+
return new Circle(x, y, radius * this.canvas.ratio);
|
|
8431
8447
|
}
|
|
8432
8448
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: InteractiveCircleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8433
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
8449
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.14", type: InteractiveCircleComponent, isStandalone: false, selector: "interactive-circle", inputs: { radius: { classPropertyName: "radius", publicName: "radius", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
8434
8450
|
{ provide: InteractiveItemComponent, useExisting: InteractiveCircleComponent },
|
|
8435
8451
|
], usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
|
|
8436
8452
|
}
|
|
@@ -8444,30 +8460,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
8444
8460
|
{ provide: InteractiveItemComponent, useExisting: InteractiveCircleComponent },
|
|
8445
8461
|
]
|
|
8446
8462
|
}]
|
|
8447
|
-
}], ctorParameters: () => []
|
|
8448
|
-
type: Input
|
|
8449
|
-
}] } });
|
|
8463
|
+
}], ctorParameters: () => [] });
|
|
8450
8464
|
|
|
8451
8465
|
class InteractiveRectComponent extends InteractiveItemComponent {
|
|
8452
8466
|
constructor() {
|
|
8453
8467
|
super();
|
|
8454
|
-
this.width = 10;
|
|
8455
|
-
this.height = 10;
|
|
8456
|
-
this.rotation = 0;
|
|
8457
|
-
|
|
8458
|
-
|
|
8459
|
-
|
|
8460
|
-
ctx.rotate(toRadians(this.rotation));
|
|
8461
|
-
drawRect(ctx, this.width * ratio, this.height * ratio);
|
|
8462
|
-
ctx.fill();
|
|
8463
|
-
ctx.stroke();
|
|
8468
|
+
this.width = input(10);
|
|
8469
|
+
this.height = input(10);
|
|
8470
|
+
this.rotation = input(0);
|
|
8471
|
+
effect(() => {
|
|
8472
|
+
this.mFrame = new Rect(0, 0, this.width(), this.height(), this.rotation());
|
|
8473
|
+
});
|
|
8464
8474
|
}
|
|
8465
8475
|
calcShape(x, y) {
|
|
8466
8476
|
const ratio = this.canvas.ratio;
|
|
8467
|
-
|
|
8477
|
+
const width = untracked(() => this.width());
|
|
8478
|
+
const height = untracked(() => this.height());
|
|
8479
|
+
const rotation = untracked(() => this.rotation());
|
|
8480
|
+
return new Rect(x, y, width * ratio, height * ratio, rotation);
|
|
8468
8481
|
}
|
|
8469
8482
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: InteractiveRectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8470
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
8483
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.14", type: InteractiveRectComponent, isStandalone: false, selector: "interactive-rect", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, rotation: { classPropertyName: "rotation", publicName: "rotation", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
8471
8484
|
{ provide: InteractiveItemComponent, useExisting: InteractiveRectComponent },
|
|
8472
8485
|
], usesInheritance: true, ngImport: i0, template: "", isInline: true }); }
|
|
8473
8486
|
}
|
|
@@ -8481,13 +8494,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
8481
8494
|
{ provide: InteractiveItemComponent, useExisting: InteractiveRectComponent },
|
|
8482
8495
|
]
|
|
8483
8496
|
}]
|
|
8484
|
-
}], ctorParameters: () => []
|
|
8485
|
-
type: Input
|
|
8486
|
-
}], height: [{
|
|
8487
|
-
type: Input
|
|
8488
|
-
}], rotation: [{
|
|
8489
|
-
type: Input
|
|
8490
|
-
}] } });
|
|
8497
|
+
}], ctorParameters: () => [] });
|
|
8491
8498
|
|
|
8492
8499
|
class TabsComponent {
|
|
8493
8500
|
constructor() {
|
|
@@ -9204,5 +9211,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
9204
9211
|
* Generated bundle index. Do not edit.
|
|
9205
9212
|
*/
|
|
9206
9213
|
|
|
9207
|
-
export { API_SERVICE, APP_BASE_URL, AUTH_SERVICE, AclService, AjaxRequestHandler, ApiService, ArrayUtils, AsyncMethodBase, AsyncMethodDirective, AsyncMethodTargetDirective, AuthGuard, BASE_CONFIG, BUTTON_TYPE, BackgroundDirective, BaseDialogService, BaseHttpClient, BaseHttpService, BaseToasterService, BtnComponent, BtnDefaultComponent, CONFIG_SERVICE, CacheService, CanvasColor, CanvasUtils, ChipsComponent, ChunkPipe, Circle, CloseBtnComponent, ComponentLoaderDirective, ComponentLoaderService, ConfigService, DIALOG_SERVICE, DateUtils, DragDropEventPlugin, DropListComponent, DropdownBoxComponent, DropdownContentDirective, DropdownDirective, DropdownToggleDirective, DynamicTableComponent, DynamicTableTemplateDirective, EPSILON, ERROR_HANDLER, EXPRESS_REQUEST, EntriesPipe, ErrorHandlerService, EventsService, ExtraItemPropertiesPipe, FactoryDependencies, FakeModuleComponent, FileSystemEntry, FileUtils, FilterPipe, FindPipe, ForbiddenZone, FormatNumberPipe, FormatterService, GenericValue, GetOffsetPipe, GetTypePipe, GetValuePipe, GlobalTemplateDirective, GlobalTemplatePipe, GlobalTemplateService, GroupByPipe, ICON_MAP, ICON_SERVICE, ICON_TYPE, IConfiguration, IconComponent, IconDefaultComponent, IconDirective, IconService, IncludesPipe, Initializer, InteractiveCanvasComponent, InteractiveCircleComponent, InteractiveItemComponent, InteractiveRectComponent, IsTypePipe, JSONfn, JoinPipe, KeysPipe, LANGUAGE_SERVICE, LanguageService, LoaderUtils, LocalHttpService, MapPipe, MathUtils, MaxPipe, MinPipe, NgxTemplateOutletDirective, NgxUtilsModule, OPTIONS_TOKEN, ObjectType, ObjectUtils, ObservableUtils, OpenApiService, Oval, PROMISE_SERVICE, PaginationDirective, PaginationItemContext, PaginationItemDirective, PaginationMenuComponent, Point, PopPipe, PromiseService, RESIZE_DELAY, RESIZE_STRATEGY, ROOT_ELEMENT, Rect, ReducePipe, ReflectUtils, RemapPipe, ReplacePipe, ResizeEventPlugin, ResourceIfContext, ResourceIfDirective, ReversePipe, RoundPipe, SCRIPT_PARAMS, STATIC_SCHEMAS, SafeHtmlPipe, ScrollEventPlugin, SetUtils, ShiftPipe, SocketClient, SocketService, SplitPipe, StateService, StaticAuthService, StaticLanguageService, StickyClassDirective, StickyDirective, StorageMode, StorageService, StringUtils, TOASTER_SERVICE, TabsComponent, TabsItemDirective, TabsTemplateDirective, TimerUtils, TranslatePipe, TranslatedUrlSerializer, UniqueUtils, UniversalService, UnorderedListComponent, UnorderedListItemDirective, UnorderedListTemplateDirective, UploadComponent, ValuedPromise, ValuesPipe, addPts, cachedFactory, cancelablePromise, checkTransitions, clamp, computedPrevious, createTypedProvider, cssStyles, cssVariables, distance, distanceSq, dividePts, dotProduct,
|
|
9214
|
+
export { API_SERVICE, APP_BASE_URL, AUTH_SERVICE, AclService, AjaxRequestHandler, ApiService, ArrayUtils, AsyncMethodBase, AsyncMethodDirective, AsyncMethodTargetDirective, AuthGuard, BASE_CONFIG, BUTTON_TYPE, BackgroundDirective, BaseDialogService, BaseHttpClient, BaseHttpService, BaseToasterService, BtnComponent, BtnDefaultComponent, CONFIG_SERVICE, CacheService, CanvasColor, CanvasUtils, ChipsComponent, ChunkPipe, Circle, CloseBtnComponent, ComponentLoaderDirective, ComponentLoaderService, ConfigService, DIALOG_SERVICE, DateUtils, DragDropEventPlugin, DropListComponent, DropdownBoxComponent, DropdownContentDirective, DropdownDirective, DropdownToggleDirective, DynamicTableComponent, DynamicTableTemplateDirective, EPSILON, ERROR_HANDLER, EXPRESS_REQUEST, EntriesPipe, ErrorHandlerService, EventsService, ExtraItemPropertiesPipe, FactoryDependencies, FakeModuleComponent, FileSystemEntry, FileUtils, FilterPipe, FindPipe, ForbiddenZone, FormatNumberPipe, FormatterService, GenericValue, GetOffsetPipe, GetTypePipe, GetValuePipe, GlobalTemplateDirective, GlobalTemplatePipe, GlobalTemplateService, GroupByPipe, ICON_MAP, ICON_SERVICE, ICON_TYPE, IConfiguration, IconComponent, IconDefaultComponent, IconDirective, IconService, IncludesPipe, Initializer, InteractiveCanvasComponent, InteractiveCircleComponent, InteractiveItemComponent, InteractiveRectComponent, IsTypePipe, JSONfn, JoinPipe, KeysPipe, LANGUAGE_SERVICE, LanguageService, LoaderUtils, LocalHttpService, MapPipe, MathUtils, MaxPipe, MinPipe, NgxTemplateOutletDirective, NgxUtilsModule, OPTIONS_TOKEN, ObjectType, ObjectUtils, ObservableUtils, OpenApiService, Oval, PROMISE_SERVICE, PaginationDirective, PaginationItemContext, PaginationItemDirective, PaginationMenuComponent, Point, PopPipe, PromiseService, RESIZE_DELAY, RESIZE_STRATEGY, ROOT_ELEMENT, Rect, ReducePipe, ReflectUtils, RemapPipe, ReplacePipe, ResizeEventPlugin, ResourceIfContext, ResourceIfDirective, ReversePipe, RoundPipe, SCRIPT_PARAMS, STATIC_SCHEMAS, SafeHtmlPipe, ScrollEventPlugin, SetUtils, ShiftPipe, SocketClient, SocketService, SplitPipe, StateService, StaticAuthService, StaticLanguageService, StickyClassDirective, StickyDirective, StorageMode, StorageService, StringUtils, TOASTER_SERVICE, TabsComponent, TabsItemDirective, TabsTemplateDirective, TimerUtils, TranslatePipe, TranslatedUrlSerializer, UniqueUtils, UniversalService, UnorderedListComponent, UnorderedListItemDirective, UnorderedListTemplateDirective, UploadComponent, ValuedPromise, ValuesPipe, addPts, cachedFactory, cancelablePromise, checkTransitions, clamp, computedPrevious, createTypedProvider, cssStyles, cssVariables, distance, distanceSq, dividePts, dotProduct, ensurePoint, getComponentDef, getCssVariables, getRoot, gjkDistance, gjkIntersection, hashCode, impatientPromise, injectOptions, isBrowser, isPoint, lengthOfPt, lerpPts, multiplyPts, negatePt, normalizePt, normalizeRange, overflow, parseSelector, perpendicular, provideEntryComponents, provideOptions, provideWithOptions, rotateDeg, rotateRad, selectorMatchesList, subPts, svgToDataUri, switchClass, toDegrees, toRadians, tripleProduct };
|
|
9208
9215
|
//# sourceMappingURL=stemy-ngx-utils.mjs.map
|