diff --git a/README.md b/README.md index f7c4b2f..cdfcaf7 100644 --- a/README.md +++ b/README.md @@ -40,7 +40,7 @@ npm install @memgraph/orb ``` Below you can find a simple Typescript example using Orb to visualize a small graph. Feel -free to check other Javascript examples in `examples/` directory. +free to check other JavaScript examples in `examples/` directory. ```typescript import { Orb } from '@memgraph/orb'; @@ -84,8 +84,8 @@ orb.view.render(() => { ``` -Below you can find a simple Javascript example using Orb to visualize a small graph. Feel -free to check other Javascript examples in `examples/` directory. +Below you can find a simple JavaScript example using Orb to visualize a small graph. Feel +free to check other JavaScript examples in `examples/` directory. ```html diff --git a/docs/styles.md b/docs/styles.md index f59e93b..e3c1037 100644 --- a/docs/styles.md +++ b/docs/styles.md @@ -168,7 +168,7 @@ import { Color } from '@memgraph/orb'; // Constructor always receives a color HEX code const red = new Color('#FF0000'); -// Returns darker or ligher color by input factor (default is 0.3) +// Returns darker or lighter color by input factor (default is 0.3) const darkerRed = red.getDarkerColor(); const lighterRed = red.getLighterColor(); @@ -183,7 +183,7 @@ const randomColor = Color.getRandomColor(); ``` If you would like to have a lighter/darker tone of a node on node select/hover, then you can easily do -that with `getLigherColor` or `getDarkerColor` functions: +that with `getLighterColor` or `getDarkerColor` functions: ```typescript const nodeBaseColor = new Color('#FF0000'); diff --git a/src/renderer/canvas/canvas-renderer.ts b/src/renderer/canvas/canvas-renderer.ts index 9f65dde..0625c9b 100644 --- a/src/renderer/canvas/canvas-renderer.ts +++ b/src/renderer/canvas/canvas-renderer.ts @@ -260,7 +260,7 @@ export class CanvasRenderer extends Em /** * Returns the visible rectangle view in the simulation coordinates. * - * @return {IRectangle} Visible view in teh simulation coordinates + * @return {IRectangle} Visible view in the simulation coordinates */ getSimulationViewRectangle(): IRectangle { const topLeftPosition = this.getSimulationPosition({ x: 0, y: 0 }); diff --git a/src/renderer/canvas/edge/types/edge-curved.ts b/src/renderer/canvas/edge/types/edge-curved.ts index 017dbea..184d1e8 100644 --- a/src/renderer/canvas/edge/types/edge-curved.ts +++ b/src/renderer/canvas/edge/types/edge-curved.ts @@ -36,7 +36,7 @@ export const getCurvedArrowShape = (ed const controlPoint = edge.getCurvedControlPoint(); const arrowPoint = findBorderPoint(edge, target); - const guidePos = getPointBrezier(edge, Math.max(0.0, Math.min(1.0, arrowPoint.t + guideOffset)), controlPoint); + const guidePos = getPointBezier(edge, Math.max(0.0, Math.min(1.0, arrowPoint.t + guideOffset)), controlPoint); const angle = Math.atan2(arrowPoint.y - guidePos.y, arrowPoint.x - guidePos.x); const length = 1.5 * scaleFactor + 3 * lineWidth; // 3* lineWidth is the width of the edge. @@ -55,10 +55,10 @@ export const getCurvedArrowShape = (ed * * @param {EdgeCurved} edge Edge * @param {number} percentage Percentage of the line to get position from - * @param {IPosition} viaNode Brezier node on the curved line + * @param {IPosition} viaNode Bezier node on the curved line * @return {IPosition} Position on the line */ -const getPointBrezier = ( +const getPointBezier = ( edge: EdgeCurved, percentage: number, viaNode: IPosition, @@ -111,7 +111,7 @@ const findBorderPoint = ( while (low <= high && iteration < maxIterations) { middle = (low + high) * 0.5; - pos = { ...getPointBrezier(edge, middle, viaNode), t: 0 }; + pos = { ...getPointBezier(edge, middle, viaNode), t: 0 }; // angle = Math.atan2(nodePoints.y - pos.y, nodePoints.x - pos.x); // distanceToBorder = node.getDistanceToBorder(angle); distanceToBorder = node.getDistanceToBorder(); diff --git a/src/renderer/shared.ts b/src/renderer/shared.ts index 865c891..fe945b0 100644 --- a/src/renderer/shared.ts +++ b/src/renderer/shared.ts @@ -64,7 +64,7 @@ export interface IRenderer extends IEm /** * Returns the visible rectangle view in the simulation coordinates. * - * @return {IRectangle} Visible view in teh simulation coordinates + * @return {IRectangle} Visible view in the simulation coordinates */ getSimulationViewRectangle(): IRectangle; diff --git a/src/utils/emitter.utils.ts b/src/utils/emitter.utils.ts index 6e70976..b3664c1 100644 --- a/src/utils/emitter.utils.ts +++ b/src/utils/emitter.utils.ts @@ -16,13 +16,13 @@ export interface IEmitter { removeAllListeners>(eventName?: K): IEmitter; } -interface IEmmiterListener { +interface IEmitterListener { callable: IEventReceiver; isOnce?: boolean; } export class Emitter implements IEmitter { - private readonly _listeners = new Map, IEmmiterListener[]>(); + private readonly _listeners = new Map, IEmitterListener[]>(); /** * Adds a one-time listener function for the event named eventName. The next time eventName is @@ -34,7 +34,7 @@ export class Emitter implements IEmitter { * @return {IEmitter} Reference to the EventEmitter, so that calls can be chained */ once>(eventName: K, func: IEventReceiver): IEmitter { - const newListener: IEmmiterListener = { + const newListener: IEmitterListener = { callable: func, isOnce: true, }; @@ -61,7 +61,7 @@ export class Emitter implements IEmitter { * @return {IEmitter} Reference to the EventEmitter, so that calls can be chained */ on>(eventName: K, func: IEventReceiver): IEmitter { - const newListener: IEmmiterListener = { + const newListener: IEmitterListener = { callable: func, }; diff --git a/src/utils/entity.utils.ts b/src/utils/entity.utils.ts index 736feeb..0267c24 100644 --- a/src/utils/entity.utils.ts +++ b/src/utils/entity.utils.ts @@ -2,7 +2,7 @@ * A key-value model that keeps an order of the elements by * the input sort function. * - * Insipration by NgRx/EntityState: https://github.com/ngrx/platform + * Inspired by NgRx/EntityState: https://github.com/ngrx/platform */ export interface IEntityState { getOne(id: K): V | undefined; diff --git a/src/utils/html.utils.ts b/src/utils/html.utils.ts index 9c96e02..0b02415 100644 --- a/src/utils/html.utils.ts +++ b/src/utils/html.utils.ts @@ -17,7 +17,7 @@ export const setupContainer = (container: HTMLElement, areCollapsedDimensionsAll "[Orb] The graph container element and its parent don't have defined width properties.", 'If you are using percentage values,', 'please make sure that the parent element of the graph container has a defined position and width.', - "Setting the width of the graph container to an arbirtrary value of '400px'...", + "Setting the width of the graph container to an arbitrary value of '400px'...", ); } else { console.warn("[Orb] The graph container element doesn't have defined width. Setting width to 100%...");