From 8dac56b85891f546587e5383caaa1ee9f75d94e1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Iv=C3=A1n=20Pereira=20Mu=C3=B1oz?= Date: Sun, 22 Dec 2024 01:22:38 +0100 Subject: [PATCH] Small changes in the documentation --- README.md | 32 +++++++++---------- .../IsometricGraphicAbstract.ts | 18 +++++------ 2 files changed, 24 insertions(+), 26 deletions(-) diff --git a/README.md b/README.md index de8a300..263518e 100644 --- a/README.md +++ b/README.md @@ -645,7 +645,7 @@ const path = new IsometricRectangle(properties); | strokeLinejoin | string | "round" | Sets the [SVG stroke linejoin][3] of the isometric rectangle | | strokeWidth | number | 1 | Sets the stroke width of the isometric rectangle | | texture | Texture (`object`) | - | Sets the texture of the isometric rectangle | -| className | string | - | Sets the CSS class of the isometric rectangle | +| className | string | - | Sets the CSS class of the isometric rectangle | `planeView values` >"TOP" | "FRONT" | "SIDE" @@ -834,8 +834,8 @@ removeEventListener(type, listener, [useCapture]) | strokeWidth | number | Gets and sets the stroke width of the isometric rectangle | | texture | Texture (`object`) | Gets and sets the texture of the isometric rectangle | | drag \* | PlaneView (`string`) / false | Gets an sets the dragging plane of the isometric rectangle | -| bounds | object / false | Gets and sets the boundaries of the isometric rectangle position | -| className | string | Gets and sets the CSS class of the isometric rectangle +| bounds | object / false | Gets and sets the boundaries of the isometric rectangle position | +| className | string | Gets and sets the CSS class of the isometric rectangle | >\* When dragging an isometric rectangle, the events `dragstart`, `drag` and `dragend` will be fired in that order. These events will be `CustomEvents` with a `detail` property containing the `right`, `left` and `top` properties that the isometric rectangle will receive. The `drag` event can be prevented using `preventDefault` so, if it is prevented, the isometric rectangle will not change its position when it is dragged. @@ -887,7 +887,7 @@ const path = new IsometricCircle(properties); | strokeLinejoin | string | "round" | Sets the [SVG stroke linejoin][3] of the isometric circle | | strokeWidth | number | 1 | Sets the stroke width of the isometric circle | | texture | Texture (`object`) | - | Sets the texture of the isometric circle | -| className | string | Sets the CSS class of the isometric circle +| className | string | - | Sets the CSS class of the isometric circle | `planeView values` >"TOP" | "FRONT" | "SIDE" @@ -1075,7 +1075,7 @@ removeEventListener(type, listener, [useCapture]) | texture | Texture (`object`) | Gets and sets the texture of the isometric circle | | drag \* | PlaneView (`string`) / false | Gets an sets the dragging plane of the isometric circle | | bounds | object / false | Gets an sets the boundaries of the isometric circle position | -| className | string | Gets and sets the CSS class of the isometric circle +| className | string | Gets and sets the CSS class of the isometric circle | >\* When dragging an isometric circle, the events `dragstart`, `drag` and `dragend` will be fired in that order. These events will be `CustomEvents` with a `detail` property containing the `right`, `left` and `top` properties that the isometric circle will receive. The `drag` event can be prevented using `preventDefault` so, if it is prevented, the isometric circle will not change its position when it is dragged. @@ -1130,7 +1130,7 @@ const path = new IsometricStarPolygon(properties); | strokeLinejoin | string | "round" | Sets the [SVG stroke linejoin][3] of the isometric star polygon | | strokeWidth | number | 1 | Sets the stroke width of the isometric star polygon | | texture | Texture (`object`) | - | Sets the texture of the isometric star polygon | -| className | string | Sets the CSS class of the isometric star polygon +| className | string | - | Sets the CSS class of the isometric star polygon | `planeView values` >"TOP" | "FRONT" | "SIDE" @@ -1322,8 +1322,8 @@ removeEventListener(type, listener, [useCapture]) | strokeWidth | number | Gets and sets the stroke width of the isometric star polygon | | texture | Texture (`object`) | Gets and sets the texture of the isometric star polygon | | drag \* | PlaneView (`string`) / false | Gets an sets the dragging plane of the isometric star polygon | -| bounds | object / false | Gets and sets the boundaries of the isometric star polygon position | -| className | string | Gets and sets the CSS class of the isometric star polygon +| bounds | object / false | Gets and sets the boundaries of the isometric star polygon position | +| className | string | Gets and sets the CSS class of the isometric star polygon | >\* When dragging an isometric star polygon, the events `dragstart`, `drag` and `dragend` will be fired in that order. These events will be `CustomEvents` with a `detail` property containing the `right`, `left` and `top` properties that the isometric star polygon will receive. The `drag` event can be prevented using `preventDefault` so, if it is prevented, the isometric star polygon will not change its position when it is dragged. @@ -1376,7 +1376,7 @@ const path = new IsometricPentagram(properties); | strokeLinejoin | string | "round" | Sets the [SVG stroke linejoin][3] of the isometric pentagram | | strokeWidth | number | 1 | Sets the stroke width of the isometric pentagram | | texture | Texture (`object`) | - | Sets the texture of the isometric pentagram | -| className | string | Sets the CSS class of the isometric pentagram +| className | string | - | Sets the CSS class of the isometric pentagram | `planeView values` >"TOP" | "FRONT" | "SIDE" @@ -1564,9 +1564,9 @@ removeEventListener(type, listener, [useCapture]) | strokeLinejoin | string | Gets and sets the [SVG stroke linejoin][3] of the isometric pentagram | | strokeWidth | number | Gets and sets the stroke width of the isometric pentagram | | texture | Texture (`object`) | Gets and sets the texture of the isometric pentagram | -| drag \* | PlaneView (`string`) / false | Gets an sets the dragging plane of the isometric pentagram | -| bounds | object / false | Gets and sets the boundaries of the isometric pentagram position | -| className | string | Gets and sets the CSS class of the isometric pentagram +| drag \* | PlaneView (`string`) / false | Gets an sets the dragging plane of the isometric pentagram | +| bounds | object / false | Gets and sets the boundaries of the isometric pentagram position | +| className | string | Gets and sets the CSS class of the isometric pentagram | >\* When dragging an isometric pentagram, the events `dragstart`, `drag` and `dragend` will be fired in that order. These events will be `CustomEvents` with a `detail` property containing the `right`, `left` and `top` properties that the isometric pentagram will receive. The `drag` event can be prevented using `preventDefault` so, if it is prevented, the isometric pentagram will not change its position when it is dragged. @@ -1614,7 +1614,7 @@ const path = new IsometricPath([properties]); | strokeWidth | number | 1 | Sets the stroke width of the isometric path | | texture | Texture (`object`) | - | Sets the texture of the isometric path | | autoclose | boolean | true | Sets if the path should close automatically or not | -| className | string | Sets the CSS class of the isometric path +| className | string | - | Sets the CSS class of the isometric path | `texture properties` >Object to set the texture of the isometric path @@ -1848,7 +1848,7 @@ removeEventListener(type, listener, [useCapture]) | strokeWidth | number | Gets and sets the stroke width of the isometric path | | texture | Texture (`object`) | Gets and sets the texture of the isometric path | | autoclose | boolean | Gets and sets the autoclose property of the isometric path | -| className | string | Gets and sets the CSS class of the isometric path +| className | string | Gets and sets the CSS class of the isometric path |

@@ -1893,7 +1893,7 @@ const path = new IsometricText(properties); | strokeLinejoin | string | "round" | Sets the [SVG stroke linejoin][3] of the isometric text | | strokeWidth | number | 1 | Sets the stroke width of the isometric text | | texture | Texture (`object`) | - | Sets the texture of the isometric text | -| className | string | Sets the CSS class of the isometric text +| className | string | - | Sets the CSS class of the isometric text | `planeView values` >"TOP" | "FRONT" | "SIDE" @@ -2094,7 +2094,7 @@ removeEventListener(type, listener, [useCapture]) | strokeLinejoin | string | Gets and sets the [SVG stroke linejoin][3] of the isometric text | | strokeWidth | number | Gets and sets the stroke width of the isometric text | | texture | Texture (`object`) | Gets and sets the texture of the isometric text | -| className | string | Gets and sets the CSS class of the isometric text +| className | string | Gets and sets the CSS class of the isometric text | `planeView values` >"TOP" | "FRONT" | "SIDE" diff --git a/src/@classes/abstract/IsometricGraphicAbstract/IsometricGraphicAbstract.ts b/src/@classes/abstract/IsometricGraphicAbstract/IsometricGraphicAbstract.ts index a0fbd22..10df040 100644 --- a/src/@classes/abstract/IsometricGraphicAbstract/IsometricGraphicAbstract.ts +++ b/src/@classes/abstract/IsometricGraphicAbstract/IsometricGraphicAbstract.ts @@ -13,8 +13,7 @@ import { StrokeLinejoin, SVGAnimation, SVGAnimationObject, - Texture, - SVGProps + Texture } from '@types'; import { addSVGProperties, @@ -59,7 +58,7 @@ export abstract class IsometricGraphicAbstract extends IsometricElementAbstract this.createTexture(this.props.texture); } - const propsToSet: SVGProps = { + addSVGProperties(this.element, { 'fill': this.props.texture ? `url(#${this.patternId}) ${this.fillColor}` : this.fillColor, @@ -70,13 +69,12 @@ export abstract class IsometricGraphicAbstract extends IsometricElementAbstract 'stroke-linejoin': this.strokeLinejoin, 'stroke-opacity': `${this.strokeOpacity}`, 'stroke-width': `${this.strokeWidth}`, - }; - - if (this.props.className) { - propsToSet['class'] = this.props.className; - } - - addSVGProperties(this.element, propsToSet); + ...( + this.props.className && { + class: this.props.className + } + ) + }); }