js-draw 0.1.11 → 0.2.0

package/src/math/rounding.ts

@@ -0,0 +1,147 @@
+// @packageDocumentation @internal
+
+// Clean up stringified numbers
+const cleanUpNumber = (text: string) => {
+	// Regular expression substitions can be somewhat expensive. Only do them
+	// if necessary.
+	const lastChar = text.charAt(text.length - 1);
+	if (lastChar === '0' || lastChar === '.') {
+		// Remove trailing zeroes
+		text = text.replace(/([.]\d*[^0]+)0+$/, '$1');
+		text = text.replace(/[.]0+$/, '.');
+
+		// Remove trailing period
+		text = text.replace(/[.]$/, '');
+
+		if (text === '-0') {
+			return '0';
+		}
+	}
+
+	const firstChar = text.charAt(0);
+	if (firstChar === '0' || firstChar === '-') {
+		// Remove unnecessary leading zeroes.
+		text = text.replace(/^(0+)[.]/, '.');
+		text = text.replace(/^-(0+)[.]/, '-.');
+	}
+
+	return text;
+};
+
+export const toRoundedString = (num: number): string => {
+	// Try to remove rounding errors. If the number ends in at least three/four zeroes
+	// (or nines) just one or two digits, it's probably a rounding error.
+	const fixRoundingUpExp = /^([-]?\d*\.\d{3,})0{4,}\d{1,2}$/;
+	const hasRoundingDownExp = /^([-]?)(\d*)\.(\d{3,}9{4,})\d{1,2}$/;
+
+	let text = num.toString(10);
+	if (text.indexOf('.') === -1) {
+		return text;
+	}
+
+	const roundingDownMatch = hasRoundingDownExp.exec(text);
+	if (roundingDownMatch) {
+		const negativeSign = roundingDownMatch[1];
+		const postDecimalString = roundingDownMatch[3];
+		const lastDigit = parseInt(postDecimalString.charAt(postDecimalString.length - 1), 10);
+		const postDecimal = parseInt(postDecimalString, 10);
+		const preDecimal = parseInt(roundingDownMatch[2], 10);
+
+		const origPostDecimalString = roundingDownMatch[3];
+
+		let newPostDecimal = (postDecimal + 10 - lastDigit).toString();
+		let carry = 0;
+		if (newPostDecimal.length > postDecimal.toString().length) {
+			// Left-shift
+			newPostDecimal = newPostDecimal.substring(1);
+			carry = 1;
+		}
+
+		// parseInt(...).toString() removes leading zeroes. Add them back.
+		while (newPostDecimal.length < origPostDecimalString.length) {
+			newPostDecimal = carry.toString(10) + newPostDecimal;
+			carry = 0;
+		}
+
+		text = `${negativeSign + (preDecimal + carry).toString()}.${newPostDecimal}`;
+	}
+
+	text = text.replace(fixRoundingUpExp, '$1');
+
+	return cleanUpNumber(text);
+};
+
+const numberExp = /^([-]?)(\d*)[.](\d+)$/;
+export const getLenAfterDecimal = (numberAsString: string) => {
+	const numberMatch = numberExp.exec(numberAsString);
+	if (!numberMatch) {
+		// If not a match, either the number is exponential notation (or is something
+		// like NaN or Infinity)
+		if (numberAsString.search(/[eE]/) !== -1 || /^[a-zA-Z]+$/.exec(numberAsString)) {
+			return -1;
+		// Or it has no decimal point
+		} else {
+			return 0;
+		}
+	}
+
+	const afterDecimalLen = numberMatch[3].length;
+	return afterDecimalLen;
+};
+
+// [reference] should be a string representation of a base-10 number (no exponential (e.g. 10e10))
+export const toStringOfSamePrecision = (num: number, ...references: string[]): string => {
+	const text = num.toString(10);
+	const textMatch = numberExp.exec(text);
+	if (!textMatch) {
+		return text;
+	}
+
+	let decimalPlaces = -1;
+	for (const reference of references) {
+		decimalPlaces = Math.max(getLenAfterDecimal(reference), decimalPlaces);
+	}
+
+	if (decimalPlaces === -1) {
+		return toRoundedString(num);
+	}
+
+	// Make text's after decimal length match [afterDecimalLen].
+	let postDecimal = textMatch[3].substring(0, decimalPlaces);
+	let preDecimal = textMatch[2];
+	const nextDigit = textMatch[3].charAt(decimalPlaces);
+
+	if (nextDigit !== '') {
+		const asNumber = parseInt(nextDigit, 10);
+		if (asNumber >= 5) {
+			// Don't attempt to parseInt() an empty string.
+			if (postDecimal.length > 0) {
+				const leadingZeroMatch = /^(0+)(\d*)$/.exec(postDecimal);
+
+				let leadingZeroes = '';
+				let postLeading = postDecimal;
+				if (leadingZeroMatch) {
+					leadingZeroes = leadingZeroMatch[1];
+					postLeading = leadingZeroMatch[2];
+				}
+
+				postDecimal = (parseInt(postDecimal) + 1).toString();
+
+				// If postDecimal got longer, remove leading zeroes if possible
+				if (postDecimal.length > postLeading.length && leadingZeroes.length > 0) {
+					leadingZeroes = leadingZeroes.substring(1);
+				}
+
+				postDecimal = leadingZeroes + postDecimal;
+			}
+
+			if (postDecimal.length === 0 || postDecimal.length > decimalPlaces) {
+				preDecimal = (parseInt(preDecimal) + 1).toString();
+				postDecimal = postDecimal.substring(1);
+			}
+		}
+	}
+
+	const negativeSign = textMatch[1];
+	return cleanUpNumber(`${negativeSign}${preDecimal}.${postDecimal}`);
+};

package/src/rendering/Display.ts

@@ -1,9 +1,24 @@
+/**
+ * Handles `HTMLCanvasElement`s (or other drawing surfaces if being used) used to display the editor's contents.
+ *
+ * @example
+ * ```
+ * const editor = new Editor(document.body);
+ * const w = editor.display.width;
+ * const h = editor.display.height;
+ * const center = Vec2.of(w / 2, h / 2);
+ * const colorAtCenter = editor.display.getColorAt(center);
+ * ```
+ * 
+ * @packageDocumentation
+ */
+
 import AbstractRenderer from './renderers/AbstractRenderer';
 import CanvasRenderer from './renderers/CanvasRenderer';
 import { Editor } from '../Editor';
 import { EditorEventType } from '../types';
 import DummyRenderer from './renderers/DummyRenderer';
-import { Point2, Vec2 } from '../geometry/Vec2';
+import { Point2, Vec2 } from '../math/Vec2';
 import RenderingCache from './caching/RenderingCache';
 import TextOnlyRenderer from './renderers/TextOnlyRenderer';
 import Color4 from '../Color4';
@@ -18,10 +33,12 @@ export default class Display {
 	private dryInkRenderer: AbstractRenderer;
 	private wetInkRenderer: AbstractRenderer;
 	private textRenderer: TextOnlyRenderer;
+	private textRerenderOutput: HTMLElement|null = null;
 	private cache: RenderingCache;
 	private resizeSurfacesCallback?: ()=> void;
 	private flattenCallback?: ()=> void;
 
+	/** @internal */
 	public constructor(
 		private editor: Editor, mode: RenderingMode, private parent: HTMLElement|null
 	) {
@@ -59,10 +76,10 @@ export default class Display {
 				return this.dryInkRenderer.canRenderFromWithoutDataLoss(renderer);
 			},
 			blockResolution: cacheBlockResolution,
-			cacheSize: 500 * 500 * 4 * 200,
+			cacheSize: 500 * 500 * 4 * 150,
 			maxScale: 1.5,
-			minComponentsPerCache: 50,
-			minComponentsToUseCache: 120,
+			minComponentsPerCache: 45,
+			minComponentsToUseCache: 105,
 		});
 
 		this.editor.notifier.on(EditorEventType.DisplayResized, event => {
@@ -74,9 +91,11 @@ export default class Display {
 		});
 	}
 
-	// Returns the visible width of the display (e.g. how much
-	// space the display's element takes up in the x direction
-	// in the DOM).
+	/**
+	 * @returns the visible width of the display (e.g. how much
+	 * space the display's element takes up in the x direction
+	 * in the DOM).
+	 */
 	public get width(): number {
 		return this.dryInkRenderer.displaySize().x;
 	}
@@ -85,10 +104,15 @@ export default class Display {
 		return this.dryInkRenderer.displaySize().y;
 	}
 
+	/** @internal */
 	public getCache() {
 		return this.cache;
 	}
 
+	/**
+	 * @returns the color at the given point on the dry ink renderer, or `null` if `screenPos`
+	 * 	is not on the display.
+	 */
 	public getColorAt = (_screenPos: Point2): Color4|null => {
 		return null;
 	};
@@ -158,20 +182,35 @@ export default class Display {
 		rerenderButton.classList.add('rerenderButton');
 		rerenderButton.innerText = this.editor.localization.rerenderAsText;
 
-		const rerenderOutput = document.createElement('div');
-		rerenderOutput.ariaLive = 'polite';
+		this.textRerenderOutput = document.createElement('div');
+		this.textRerenderOutput.setAttribute('aria-live', 'polite');
 
 		rerenderButton.onclick = () => {
-			this.textRenderer.clear();
-			this.editor.image.render(this.textRenderer, this.editor.viewport);
-			rerenderOutput.innerText = this.textRenderer.getDescription();
+			this.rerenderAsText();
 		};
 
-		textRendererOutputContainer.replaceChildren(rerenderButton, rerenderOutput);
+		textRendererOutputContainer.replaceChildren(rerenderButton, this.textRerenderOutput);
 		this.editor.createHTMLOverlay(textRendererOutputContainer);
 	}
 
-	// Clears the drawing surfaces and otherwise prepares for a rerender.
+	/**
+	 * Rerenders the text-based display.
+	 * The text-based display is intended for screen readers and can be navigated to by pressing `tab`.
+	 */
+	public rerenderAsText() {
+		this.textRenderer.clear();
+		this.editor.image.render(this.textRenderer, this.editor.viewport);
+		
+		if (this.textRerenderOutput) {
+			this.textRerenderOutput.innerText = this.textRenderer.getDescription();
+		}
+	}
+
+	/**
+	 * Clears the drawing surfaces and otherwise prepares for a rerender.
+	 * 
+	 * @returns the dry ink renderer.
+	 */
 	public startRerender(): AbstractRenderer {
 		this.resizeSurfacesCallback?.();
 		this.wetInkRenderer.clear();
@@ -180,19 +219,28 @@ export default class Display {
 		return this.dryInkRenderer;
 	}
 
+	/**
+	 * If `draftMode`, the dry ink renderer is configured to render
+	 * low-quality output.
+	 */
 	public setDraftMode(draftMode: boolean) {
 		this.dryInkRenderer.setDraftMode(draftMode);
 	}
 
+	/** @internal */
 	public getDryInkRenderer(): AbstractRenderer {
 		return this.dryInkRenderer;
 	}
 
+	/**
+	 * @returns The renderer used for showing action previews (e.g. an unfinished stroke).
+	 * The `wetInkRenderer`'s surface is stacked above the `dryInkRenderer`'s.
+	 */
 	public getWetInkRenderer(): AbstractRenderer {
 		return this.wetInkRenderer;
 	}
 
-	// Re-renders the contents of the wetInkRenderer onto the dryInkRenderer
+	/** Re-renders the contents of the wetInkRenderer onto the dryInkRenderer. */
 	public flatten() {
 		this.flattenCallback?.();
 	}

package/src/rendering/caching/CacheRecord.test.ts

@@ -1,7 +1,7 @@
 /* @jest-environment jsdom */
 
-import Rect2 from '../../geometry/Rect2';
-import { Vec2 } from '../../geometry/Vec2';
+import Rect2 from '../../math/Rect2';
+import { Vec2 } from '../../math/Vec2';
 import CacheRecord from './CacheRecord';
 import { createCache } from './testUtils';
 
@@ -11,7 +11,7 @@ describe('CacheRecord', () => {
 		const { cache } = createCache(undefined, {
 			blockResolution,
 		});
-		const state = cache.getSharedState();
+		const state = cache['sharedState'];
 
 		const record = new CacheRecord(() => {}, state);
 

package/src/rendering/caching/CacheRecord.ts

@@ -1,5 +1,5 @@
-import Mat33 from '../../geometry/Mat33';
-import Rect2 from '../../geometry/Rect2';
+import Mat33 from '../../math/Mat33';
+import Rect2 from '../../math/Rect2';
 import AbstractRenderer from '../renderers/AbstractRenderer';
 import { BeforeDeallocCallback, CacheState } from './types';
 
@@ -11,6 +11,9 @@ export default class CacheRecord {
 	private lastUsedCycle: number;
 	private allocd: boolean = false;
 
+	// For debugging
+	public allocCount: number = 0;
+
 	public constructor(
 		private onBeforeDeallocCallback: BeforeDeallocCallback|null,
 		private cacheState: CacheState,
@@ -46,6 +49,7 @@ export default class CacheRecord {
 		this.allocd = true;
 		this.onBeforeDeallocCallback = newDeallocCallback;
 		this.lastUsedCycle = this.cacheState.currentRenderingCycle;
+		this.allocCount ++;
 	}
 
 	public getLastUsedCycle(): number {

package/src/rendering/caching/CacheRecordManager.ts

@@ -1,38 +1,64 @@
-import { BeforeDeallocCallback, PartialCacheState } from './types';
+import { BeforeDeallocCallback, CacheProps, CacheState } from './types';
 import CacheRecord from './CacheRecord';
-import Rect2 from '../../geometry/Rect2';
+import Rect2 from '../../math/Rect2';
 
+const debugMode = false;
 
 export class CacheRecordManager {
 	// Fixed-size array: Cache blocks are assigned indicies into [cachedCanvases].
 	private cacheRecords: CacheRecord[] = [];
 	private maxCanvases: number;
+	private cacheState: CacheState;
 
-	public constructor(private readonly cacheState: PartialCacheState) {
-		const cacheProps = cacheState.props;
+	public constructor(cacheProps: CacheProps) {
 		this.maxCanvases = Math.ceil(
 			// Assuming four components per pixel:
 			cacheProps.cacheSize / 4 / cacheProps.blockResolution.x / cacheProps.blockResolution.y
 		);
 	}
 
+	public setSharedState(state: CacheState) {
+		this.cacheState = state;
+	}
+
 	public allocCanvas(drawTo: Rect2, onDealloc: BeforeDeallocCallback): CacheRecord {
 		if (this.cacheRecords.length < this.maxCanvases) {
 			const record: CacheRecord = new CacheRecord(
 				onDealloc,
-				{
-					...this.cacheState,
-					recordManager: this,
-				},
+				this.cacheState,
 			);
 			record.setRenderingRegion(drawTo);
 			this.cacheRecords.push(record);
 
+			if (debugMode) {
+				console.log('[Cache] Cache spaces used: ', this.cacheRecords.length, ' of ', this.maxCanvases);
+			}
+
 			return record;
 		} else {
 			const lru = this.getLeastRecentlyUsedRecord()!;
+
+			if (debugMode) {
+				console.log(
+					'[Cache] Re-alloc. Times allocated: ', lru.allocCount,
+					'\nLast used cycle: ', lru.getLastUsedCycle(),
+					'\nCurrent cycle: ', this.cacheState.currentRenderingCycle
+				);
+			}
+
 			lru.realloc(onDealloc);
 			lru.setRenderingRegion(drawTo);
+
+			if (debugMode) {
+				console.log(
+					'[Cache] Now re-alloc\'d. Last used cycle: ', lru.getLastUsedCycle()
+				);
+				console.assert(
+					lru['cacheState'] === this.cacheState,
+					'[Cache] Unequal cache states! cacheState should be a shared object!'
+				);
+			}
+
 			return lru;
 		}
 	}

package/src/rendering/caching/RenderingCache.test.ts

@@ -3,11 +3,11 @@
 import DummyRenderer from '../renderers/DummyRenderer';
 import { createCache } from './testUtils';
 import Stroke from '../../components/Stroke';
-import Path from '../../geometry/Path';
+import Path from '../../math/Path';
 import Color4 from '../../Color4';
 import EditorImage from '../../EditorImage';
 import Viewport from '../../Viewport';
-import Mat33 from '../../geometry/Mat33';
+import Mat33 from '../../math/Mat33';
 
 describe('RenderingCache', () => {
 	const testPath = Path.fromString('M0,0 l100,500 l-20,20 L-100,-100');
@@ -35,7 +35,7 @@ describe('RenderingCache', () => {
 		expect(lastRenderer).not.toBeNull();
 		expect(lastRenderer!.renderedPathCount).toBe(1);
 
-		editor.dispatch(new Viewport.ViewportTransform(Mat33.scaling2D(0.1)));
+		editor.dispatch(Viewport.transformBy(Mat33.scaling2D(0.1)));
 		editor.image.renderWithCache(screenRenderer, cache, editor.viewport);
 		expect(allocdRenderers).toBe(1);
 		expect(lastRenderer!.renderedPathCount).toBe(1);

package/src/rendering/caching/RenderingCache.ts

@@ -1,49 +1,44 @@
 import { ImageNode } from '../../EditorImage';
-import Rect2 from '../../geometry/Rect2';
+import Rect2 from '../../math/Rect2';
 import Viewport from '../../Viewport';
 import AbstractRenderer from '../renderers/AbstractRenderer';
 import RenderingCacheNode from './RenderingCacheNode';
 import { CacheRecordManager } from './CacheRecordManager';
-import { CacheProps, CacheState, PartialCacheState } from './types';
+import { CacheProps, CacheState } from './types';
 
 export default class RenderingCache {
-	private partialSharedState: PartialCacheState;
+	private sharedState: CacheState;
 	private recordManager: CacheRecordManager;
 	private rootNode: RenderingCacheNode|null;
 
 	public constructor(cacheProps: CacheProps) {
-		this.partialSharedState = {
+		this.recordManager = new CacheRecordManager(cacheProps);
+		this.sharedState = {
 			props: cacheProps,
 			currentRenderingCycle: 0,
-		};
-		this.recordManager = new CacheRecordManager(this.partialSharedState);
-	}
-
-	public getSharedState(): CacheState {
-		return {
-			...this.partialSharedState,
 			recordManager: this.recordManager,
 		};
+		this.recordManager.setSharedState(this.sharedState);
 	}
 
 	public render(screenRenderer: AbstractRenderer, image: ImageNode, viewport: Viewport) {
 		const visibleRect = viewport.visibleRect;
-		this.partialSharedState.currentRenderingCycle ++;
+		this.sharedState.currentRenderingCycle ++;
 
 		// If we can't use the cache,
-		if (!this.partialSharedState.props.isOfCorrectType(screenRenderer)) {
+		if (!this.sharedState.props.isOfCorrectType(screenRenderer)) {
 			image.render(screenRenderer, visibleRect);
 			return;
 		}
 
 		if (!this.rootNode) {
 			// Adjust the node so that it has the correct aspect ratio
-			const res = this.partialSharedState.props.blockResolution;
+			const res = this.sharedState.props.blockResolution;
 
 			const topLeft = visibleRect.topLeft;
 			this.rootNode = new RenderingCacheNode(
 				new Rect2(topLeft.x, topLeft.y, res.x, res.y),
-				this.getSharedState()
+				this.sharedState
 			);
 		}
 
@@ -54,7 +49,7 @@ export default class RenderingCache {
 		this.rootNode = this.rootNode!.smallestChildContaining(visibleRect) ?? this.rootNode;
 
 		const visibleLeaves = image.getLeavesIntersectingRegion(viewport.visibleRect, rect => screenRenderer.isTooSmallToRender(rect));
-		if (visibleLeaves.length > this.partialSharedState.props.minComponentsToUseCache) {
+		if (visibleLeaves.length > this.sharedState.props.minComponentsToUseCache) {
 			this.rootNode!.renderItems(screenRenderer, [ image ], viewport);
 		} else {
 			image.render(screenRenderer, visibleRect);

package/src/rendering/caching/RenderingCacheNode.ts

@@ -3,7 +3,7 @@
 
 import Color4 from '../../Color4';
 import { ImageNode, sortLeavesByZIndex } from '../../EditorImage';
-import Rect2 from '../../geometry/Rect2';
+import Rect2 from '../../math/Rect2';
 import Viewport from '../../Viewport';
 import AbstractRenderer from '../renderers/AbstractRenderer';
 import CacheRecord from './CacheRecord';
@@ -151,12 +151,15 @@ export default class RenderingCacheNode {
 		return result;
 	}
 
-	private renderingIsUpToDate(sortedIds: number[]) {
-		if (this.cachedRenderer === null || sortedIds.length !== this.renderedIds.length) {
+	// Returns true iff all elems of this.renderedIds are in sortedIds.
+	// sortedIds should be sorted by z-index (or some other order, so long as they are
+	// sorted by the same thing as this.renderedIds.)
+	private allRenderedIdsIn(sortedIds: number[]) {
+		if (this.renderedIds.length > sortedIds.length) {
 			return false;
 		}
 
-		for (let i = 0; i < sortedIds.length; i++) {
+		for (let i = 0; i < this.renderedIds.length; i++) {
 			if (sortedIds[i] !== this.renderedIds[i]) {
 				return false;
 			}
@@ -165,6 +168,14 @@ export default class RenderingCacheNode {
 		return true;
 	}
 
+	private renderingIsUpToDate(sortedIds: number[]) {
+		if (this.cachedRenderer === null || sortedIds.length !== this.renderedIds.length) {
+			return false;
+		}
+
+		return this.allRenderedIdsIn(sortedIds);
+	}
+
 	// Render all [items] within [viewport]
 	public renderItems(screenRenderer: AbstractRenderer, items: ImageNode[], viewport: Viewport) {
 		if (
@@ -238,8 +249,7 @@ export default class RenderingCacheNode {
 				}
 
 				// Is it worth it to render the items?
-				// TODO: Replace this with something performace based.
-				// TODO: Determine whether it is 'worth it' to cache this depending on rendering time.
+				// TODO: Consider replacing this with something performace based.
 				if (leavesByIds.length > this.cacheState.props.minComponentsPerCache) {
 					let fullRerenderNeeded = true;
 					if (!this.cachedRenderer) {
@@ -247,7 +257,7 @@ export default class RenderingCacheNode {
 							this.region,
 							() => this.onRegionDealloc()
 						);
-					} else if (leavesByIds.length > this.renderedIds.length && this.renderedMaxZIndex !== null) {
+					} else if (leavesByIds.length > this.renderedIds.length && this.allRenderedIdsIn(leafIds) && this.renderedMaxZIndex !== null) {
 						// We often don't need to do a full re-render even if something's changed.
 						// Check whether we can just draw on top of the existing cache.
 						const newLeaves = [];
@@ -287,6 +297,12 @@ export default class RenderingCacheNode {
 								screenRenderer.drawRect(this.region, viewport.getSizeOfPixelOnCanvas(), { fill: Color4.clay });
 							}
 						}
+					} else if (debugMode) {
+						console.log('Decided on a full re-render. Reason: At least one of the following is false:',
+							'\n leafIds.length > this.renderedIds.length: ', leafIds.length > this.renderedIds.length,
+							'\n this.allRenderedIdsIn(leafIds): ', this.allRenderedIdsIn(leafIds),
+							'\n this.renderedMaxZIndex !== null: ', this.renderedMaxZIndex !== null,
+							'\n\nthis.rerenderedIds: ', this.renderedIds, ', leafIds: ', leafIds);
 					}
 
 					if (fullRerenderNeeded) {

package/src/rendering/caching/testUtils.ts

@@ -1,4 +1,4 @@
-import { Vec2 } from '../../geometry/Vec2';
+import { Vec2 } from '../../math/Vec2';
 import DummyRenderer from '../renderers/DummyRenderer';
 import createEditor from '../../testing/createEditor';
 import AbstractRenderer from '../renderers/AbstractRenderer';

package/src/rendering/caching/types.ts

@@ -1,4 +1,4 @@
-import { Vec2 } from '../../geometry/Vec2';
+import { Vec2 } from '../../math/Vec2';
 import AbstractRenderer from '../renderers/AbstractRenderer';
 import { CacheRecordManager } from './CacheRecordManager';
 
@@ -27,13 +27,8 @@ export interface CacheProps {
     minComponentsToUseCache: number;
 }
 
-// CacheRecordManager relies on a partial copy of the shared state. Thus,
-// we need to separate partial/non-partial state.
-export interface PartialCacheState {
+export interface CacheState {
     currentRenderingCycle: number;
     props: CacheProps;
-}
-
-export interface CacheState extends PartialCacheState {
     recordManager: CacheRecordManager;
 }

package/src/rendering/localization.ts

@@ -1,10 +1,14 @@
 
 export interface TextRendererLocalization {
+	pathNodeCount(pathCount: number): string;
+	textNodeCount(nodeCount: number): string;
     textNode(content: string): string;
     rerenderAsText: string;
 }
 
 export const defaultTextRendererLocalization: TextRendererLocalization = {
+	pathNodeCount: (count: number) => `There are ${count} visible path objects.`,
+	textNodeCount: (count: number) => `There are ${count} visible text nodes.`,
 	textNode: (content: string) => `Text: ${content}`,
 	rerenderAsText: 'Re-render as text',
 };

package/src/rendering/renderers/AbstractRenderer.ts

@@ -1,9 +1,9 @@
 import { LoadSaveDataTable } from '../../components/AbstractComponent';
 import { TextStyle } from '../../components/Text';
-import Mat33 from '../../geometry/Mat33';
-import Path, { PathCommand, PathCommandType } from '../../geometry/Path';
-import Rect2 from '../../geometry/Rect2';
-import { Point2, Vec2 } from '../../geometry/Vec2';
+import Mat33 from '../../math/Mat33';
+import Path, { PathCommand, PathCommandType } from '../../math/Path';
+import Rect2 from '../../math/Rect2';
+import { Point2, Vec2 } from '../../math/Vec2';
 import Viewport from '../../Viewport';
 import RenderingStyle, { stylesEqual } from '../RenderingStyle';
 

package/src/rendering/renderers/CanvasRenderer.ts

@@ -1,9 +1,9 @@
 import Color4 from '../../Color4';
 import Text, { TextStyle } from '../../components/Text';
-import Mat33 from '../../geometry/Mat33';
-import Rect2 from '../../geometry/Rect2';
-import { Point2, Vec2 } from '../../geometry/Vec2';
-import Vec3 from '../../geometry/Vec3';
+import Mat33 from '../../math/Mat33';
+import Rect2 from '../../math/Rect2';
+import { Point2, Vec2 } from '../../math/Vec2';
+import Vec3 from '../../math/Vec3';
 import Viewport from '../../Viewport';
 import RenderingStyle from '../RenderingStyle';
 import AbstractRenderer, { RenderablePathSpec } from './AbstractRenderer';
@@ -64,7 +64,7 @@ export default class CanvasRenderer extends AbstractRenderer {
 			this.minRenderSizeAnyDimen = 2;
 		} else {
 			this.minSquareCurveApproxDist = 1;
-			this.minRenderSizeBothDimens = 1;
+			this.minRenderSizeBothDimens = 0.5;
 			this.minRenderSizeAnyDimen = 0;
 		}
 	}