@teachinglab/omd 0.6.0 → 0.6.2

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.
Files changed (198) hide show
  1. package/README.md +257 -251
  2. package/README.old.md +137 -137
  3. package/canvas/core/canvasConfig.js +202 -202
  4. package/canvas/drawing/segment.js +167 -167
  5. package/canvas/drawing/stroke.js +385 -385
  6. package/canvas/events/eventManager.js +444 -444
  7. package/canvas/events/pointerEventHandler.js +262 -262
  8. package/canvas/index.js +48 -48
  9. package/canvas/tools/PointerTool.js +71 -71
  10. package/canvas/tools/tool.js +222 -222
  11. package/canvas/utils/boundingBox.js +377 -377
  12. package/canvas/utils/mathUtils.js +258 -258
  13. package/docs/api/configuration-options.md +198 -198
  14. package/docs/api/eventManager.md +82 -82
  15. package/docs/api/focusFrameManager.md +144 -144
  16. package/docs/api/index.md +105 -105
  17. package/docs/api/main.md +62 -62
  18. package/docs/api/omdBinaryExpressionNode.md +86 -86
  19. package/docs/api/omdCanvas.md +83 -83
  20. package/docs/api/omdConfigManager.md +112 -112
  21. package/docs/api/omdConstantNode.md +52 -52
  22. package/docs/api/omdDisplay.md +87 -87
  23. package/docs/api/omdEquationNode.md +174 -174
  24. package/docs/api/omdEquationSequenceNode.md +258 -258
  25. package/docs/api/omdEquationStack.md +192 -192
  26. package/docs/api/omdFunctionNode.md +82 -82
  27. package/docs/api/omdGroupNode.md +78 -78
  28. package/docs/api/omdHelpers.md +87 -87
  29. package/docs/api/omdLeafNode.md +85 -85
  30. package/docs/api/omdNode.md +201 -201
  31. package/docs/api/omdOperationDisplayNode.md +117 -117
  32. package/docs/api/omdOperatorNode.md +91 -91
  33. package/docs/api/omdParenthesisNode.md +133 -133
  34. package/docs/api/omdPopup.md +191 -191
  35. package/docs/api/omdPowerNode.md +131 -131
  36. package/docs/api/omdRationalNode.md +144 -144
  37. package/docs/api/omdSequenceNode.md +128 -128
  38. package/docs/api/omdSimplification.md +78 -78
  39. package/docs/api/omdSqrtNode.md +144 -144
  40. package/docs/api/omdStepVisualizer.md +146 -146
  41. package/docs/api/omdStepVisualizerHighlighting.md +65 -65
  42. package/docs/api/omdStepVisualizerInteractiveSteps.md +108 -108
  43. package/docs/api/omdStepVisualizerLayout.md +70 -70
  44. package/docs/api/omdStepVisualizerNodeUtils.md +140 -140
  45. package/docs/api/omdStepVisualizerTextBoxes.md +76 -76
  46. package/docs/api/omdToolbar.md +130 -130
  47. package/docs/api/omdTranscriptionService.md +95 -95
  48. package/docs/api/omdTreeDiff.md +169 -169
  49. package/docs/api/omdUnaryExpressionNode.md +137 -137
  50. package/docs/api/omdUtilities.md +82 -82
  51. package/docs/api/omdVariableNode.md +123 -123
  52. package/docs/api/selectTool.md +74 -74
  53. package/docs/api/simplificationEngine.md +97 -97
  54. package/docs/api/simplificationRules.md +76 -76
  55. package/docs/api/simplificationUtils.md +64 -64
  56. package/docs/api/transcribe.md +43 -43
  57. package/docs/api-reference.md +85 -85
  58. package/docs/index.html +453 -453
  59. package/docs/index.md +38 -38
  60. package/docs/omd-objects.md +258 -258
  61. package/index.js +79 -79
  62. package/jsvg/index.js +3 -0
  63. package/jsvg/jsvg.js +898 -898
  64. package/jsvg/jsvgComponents.js +357 -358
  65. package/npm-docs/DOCUMENTATION_SUMMARY.md +220 -220
  66. package/npm-docs/README.md +251 -251
  67. package/npm-docs/api/api-reference.md +85 -85
  68. package/npm-docs/api/configuration-options.md +198 -198
  69. package/npm-docs/api/eventManager.md +82 -82
  70. package/npm-docs/api/expression-nodes.md +561 -561
  71. package/npm-docs/api/focusFrameManager.md +144 -144
  72. package/npm-docs/api/index.md +105 -105
  73. package/npm-docs/api/main.md +62 -62
  74. package/npm-docs/api/omdBinaryExpressionNode.md +86 -86
  75. package/npm-docs/api/omdCanvas.md +83 -83
  76. package/npm-docs/api/omdConfigManager.md +112 -112
  77. package/npm-docs/api/omdConstantNode.md +52 -52
  78. package/npm-docs/api/omdDisplay.md +87 -87
  79. package/npm-docs/api/omdEquationNode.md +174 -174
  80. package/npm-docs/api/omdEquationSequenceNode.md +258 -258
  81. package/npm-docs/api/omdEquationStack.md +192 -192
  82. package/npm-docs/api/omdFunctionNode.md +82 -82
  83. package/npm-docs/api/omdGroupNode.md +78 -78
  84. package/npm-docs/api/omdHelpers.md +87 -87
  85. package/npm-docs/api/omdLeafNode.md +85 -85
  86. package/npm-docs/api/omdNode.md +201 -201
  87. package/npm-docs/api/omdOperationDisplayNode.md +117 -117
  88. package/npm-docs/api/omdOperatorNode.md +91 -91
  89. package/npm-docs/api/omdParenthesisNode.md +133 -133
  90. package/npm-docs/api/omdPopup.md +191 -191
  91. package/npm-docs/api/omdPowerNode.md +131 -131
  92. package/npm-docs/api/omdRationalNode.md +144 -144
  93. package/npm-docs/api/omdSequenceNode.md +128 -128
  94. package/npm-docs/api/omdSimplification.md +78 -78
  95. package/npm-docs/api/omdSqrtNode.md +144 -144
  96. package/npm-docs/api/omdStepVisualizer.md +146 -146
  97. package/npm-docs/api/omdStepVisualizerHighlighting.md +65 -65
  98. package/npm-docs/api/omdStepVisualizerInteractiveSteps.md +108 -108
  99. package/npm-docs/api/omdStepVisualizerLayout.md +70 -70
  100. package/npm-docs/api/omdStepVisualizerNodeUtils.md +140 -140
  101. package/npm-docs/api/omdStepVisualizerTextBoxes.md +76 -76
  102. package/npm-docs/api/omdToolbar.md +130 -130
  103. package/npm-docs/api/omdTranscriptionService.md +95 -95
  104. package/npm-docs/api/omdTreeDiff.md +169 -169
  105. package/npm-docs/api/omdUnaryExpressionNode.md +137 -137
  106. package/npm-docs/api/omdUtilities.md +82 -82
  107. package/npm-docs/api/omdVariableNode.md +123 -123
  108. package/npm-docs/api/selectTool.md +74 -74
  109. package/npm-docs/api/simplificationEngine.md +97 -97
  110. package/npm-docs/api/simplificationRules.md +76 -76
  111. package/npm-docs/api/simplificationUtils.md +64 -64
  112. package/npm-docs/api/transcribe.md +43 -43
  113. package/npm-docs/guides/equations.md +854 -854
  114. package/npm-docs/guides/factory-functions.md +354 -354
  115. package/npm-docs/guides/getting-started.md +318 -318
  116. package/npm-docs/guides/quick-examples.md +525 -525
  117. package/npm-docs/guides/visualizations.md +682 -682
  118. package/npm-docs/index.html +12 -0
  119. package/npm-docs/json-schemas.md +826 -826
  120. package/omd/config/omdConfigManager.js +279 -267
  121. package/omd/core/index.js +158 -158
  122. package/omd/core/omdEquationStack.js +546 -546
  123. package/omd/core/omdUtilities.js +113 -113
  124. package/omd/display/omdDisplay.js +969 -962
  125. package/omd/display/omdToolbar.js +501 -501
  126. package/omd/nodes/omdBinaryExpressionNode.js +459 -459
  127. package/omd/nodes/omdConstantNode.js +141 -141
  128. package/omd/nodes/omdEquationNode.js +1327 -1327
  129. package/omd/nodes/omdFunctionNode.js +351 -351
  130. package/omd/nodes/omdGroupNode.js +67 -67
  131. package/omd/nodes/omdLeafNode.js +76 -76
  132. package/omd/nodes/omdNode.js +556 -556
  133. package/omd/nodes/omdOperationDisplayNode.js +321 -321
  134. package/omd/nodes/omdOperatorNode.js +108 -108
  135. package/omd/nodes/omdParenthesisNode.js +292 -292
  136. package/omd/nodes/omdPowerNode.js +235 -235
  137. package/omd/nodes/omdRationalNode.js +295 -295
  138. package/omd/nodes/omdSqrtNode.js +307 -307
  139. package/omd/nodes/omdUnaryExpressionNode.js +227 -227
  140. package/omd/nodes/omdVariableNode.js +122 -122
  141. package/omd/simplification/omdSimplification.js +140 -140
  142. package/omd/simplification/omdSimplificationEngine.js +887 -887
  143. package/omd/simplification/package.json +5 -5
  144. package/omd/simplification/rules/binaryRules.js +1037 -1037
  145. package/omd/simplification/rules/functionRules.js +111 -111
  146. package/omd/simplification/rules/index.js +48 -48
  147. package/omd/simplification/rules/parenthesisRules.js +19 -19
  148. package/omd/simplification/rules/powerRules.js +143 -143
  149. package/omd/simplification/rules/rationalRules.js +725 -725
  150. package/omd/simplification/rules/sqrtRules.js +48 -48
  151. package/omd/simplification/rules/unaryRules.js +37 -37
  152. package/omd/simplification/simplificationRules.js +31 -31
  153. package/omd/simplification/simplificationUtils.js +1055 -1055
  154. package/omd/step-visualizer/omdStepVisualizer.js +947 -947
  155. package/omd/step-visualizer/omdStepVisualizerHighlighting.js +246 -246
  156. package/omd/step-visualizer/omdStepVisualizerLayout.js +892 -892
  157. package/omd/step-visualizer/omdStepVisualizerTextBoxes.js +200 -200
  158. package/omd/utils/aiNextEquationStep.js +106 -106
  159. package/omd/utils/omdNodeOverlay.js +638 -638
  160. package/omd/utils/omdPopup.js +1203 -1203
  161. package/omd/utils/omdStepVisualizerInteractiveSteps.js +684 -684
  162. package/omd/utils/omdStepVisualizerNodeUtils.js +267 -267
  163. package/omd/utils/omdTranscriptionService.js +123 -123
  164. package/omd/utils/omdTreeDiff.js +733 -733
  165. package/package.json +59 -56
  166. package/readme.html +184 -120
  167. package/src/index.js +74 -74
  168. package/src/json-schemas.md +576 -576
  169. package/src/omd-json-samples.js +147 -147
  170. package/src/omdApp.js +391 -391
  171. package/src/omdAppCanvas.js +335 -335
  172. package/src/omdBalanceHanger.js +199 -199
  173. package/src/omdColor.js +13 -13
  174. package/src/omdCoordinatePlane.js +541 -541
  175. package/src/omdExpression.js +115 -115
  176. package/src/omdFactory.js +150 -150
  177. package/src/omdFunction.js +114 -114
  178. package/src/omdMetaExpression.js +290 -290
  179. package/src/omdNaturalExpression.js +563 -563
  180. package/src/omdNode.js +383 -383
  181. package/src/omdNumber.js +52 -52
  182. package/src/omdNumberLine.js +114 -112
  183. package/src/omdNumberTile.js +118 -118
  184. package/src/omdOperator.js +72 -72
  185. package/src/omdPowerExpression.js +91 -91
  186. package/src/omdProblem.js +259 -259
  187. package/src/omdRatioChart.js +251 -251
  188. package/src/omdRationalExpression.js +114 -114
  189. package/src/omdSampleData.js +215 -215
  190. package/src/omdShapes.js +512 -512
  191. package/src/omdSpinner.js +151 -151
  192. package/src/omdString.js +49 -49
  193. package/src/omdTable.js +498 -498
  194. package/src/omdTapeDiagram.js +244 -244
  195. package/src/omdTerm.js +91 -91
  196. package/src/omdTileEquation.js +349 -349
  197. package/src/omdUtils.js +84 -84
  198. package/src/omdVariable.js +51 -51
@@ -1,53 +1,53 @@
1
- # omdConstantNode
2
-
3
- Represents a numeric constant in a mathematical expression. This node is a leaf node in the expression tree, meaning it does not have any children.
4
-
5
- ## Class Definition
6
-
7
- ```javascript
8
- export class omdConstantNode extends omdLeafNode
9
- ```
10
-
11
- ## Constructor
12
-
13
- ### `new omdConstantNode(ast)`
14
-
15
- Creates a new `omdConstantNode` instance.
16
-
17
- - **`ast`** (`object`): The abstract syntax tree (AST) node from a parser like math.js. It must contain:
18
- - `value`: The numeric value of the constant.
19
-
20
- ## Public Properties
21
-
22
- - **`value`** (`number`): The numeric value of the constant.
23
-
24
- ## Public Methods
25
-
26
- ### `isConstant()`
27
-
28
- Checks if the node represents a constant value.
29
-
30
- - **Returns**: `boolean` - Always `true` for `omdConstantNode`.
31
-
32
- ### `evaluate()`
33
-
34
- Evaluates the constant node. Since it's a constant, it simply returns its value.
35
-
36
- - **Returns**: `number` - The numeric value of the constant.
37
-
38
- ### `toMathJSNode()`
39
-
40
- Converts the node back into a math.js-compatible AST format.
41
-
42
- - **Returns**: `object` - A math.js ConstantNode.
43
-
44
- ### `toString()`
45
-
46
- Converts the constant node into its string representation.
47
-
48
- - **Returns**: `string` - The string representation of the constant.
49
-
50
- ## Internal Methods
51
-
52
- - **`computeDimensions()`**: Calculates the bounding box of the constant.
1
+ # omdConstantNode
2
+
3
+ Represents a numeric constant in a mathematical expression. This node is a leaf node in the expression tree, meaning it does not have any children.
4
+
5
+ ## Class Definition
6
+
7
+ ```javascript
8
+ export class omdConstantNode extends omdLeafNode
9
+ ```
10
+
11
+ ## Constructor
12
+
13
+ ### `new omdConstantNode(ast)`
14
+
15
+ Creates a new `omdConstantNode` instance.
16
+
17
+ - **`ast`** (`object`): The abstract syntax tree (AST) node from a parser like math.js. It must contain:
18
+ - `value`: The numeric value of the constant.
19
+
20
+ ## Public Properties
21
+
22
+ - **`value`** (`number`): The numeric value of the constant.
23
+
24
+ ## Public Methods
25
+
26
+ ### `isConstant()`
27
+
28
+ Checks if the node represents a constant value.
29
+
30
+ - **Returns**: `boolean` - Always `true` for `omdConstantNode`.
31
+
32
+ ### `evaluate()`
33
+
34
+ Evaluates the constant node. Since it's a constant, it simply returns its value.
35
+
36
+ - **Returns**: `number` - The numeric value of the constant.
37
+
38
+ ### `toMathJSNode()`
39
+
40
+ Converts the node back into a math.js-compatible AST format.
41
+
42
+ - **Returns**: `object` - A math.js ConstantNode.
43
+
44
+ ### `toString()`
45
+
46
+ Converts the constant node into its string representation.
47
+
48
+ - **Returns**: `string` - The string representation of the constant.
49
+
50
+ ## Internal Methods
51
+
52
+ - **`computeDimensions()`**: Calculates the bounding box of the constant.
53
53
  - **`updateLayout()`**: Positions the constant within its bounding box.
@@ -1,87 +1,87 @@
1
- # omdDisplay
2
-
3
- A high-level component for displaying mathematical expressions or a series of equation steps. It handles rendering, automatic centering, scaling, and layout management within a given HTML container.
4
-
5
- ## Class Definition
6
-
7
- ```javascript
8
- export class omdDisplay
9
- ```
10
-
11
- ## Constructor
12
-
13
- ### `new omdDisplay(container, [options])`
14
-
15
- Creates a new `omdDisplay` instance.
16
-
17
- - **`container`** (`HTMLElement`): The DOM element where the expression will be rendered.
18
- - **`options`** (`object`, optional): Configuration options:
19
- - `fontSize` (`number`): The base font size in pixels for the expression. Default: `32`.
20
- - `centerContent` (`boolean`): If `true`, the content is automatically centered within the container. Default: `true`.
21
- - `topMargin` (`number`): The top margin in pixels, used when centering content. Default: `40`.
22
- - `bottomMargin` (`number`): The bottom margin in pixels. Default: `16`.
23
- - `fitToContent` (`boolean`): If `true`, the SVG container will resize to tightly fit the content. Default: `false`.
24
- - `autoScale` (`boolean`): If `true`, content will automatically scale down to fit the container. Default: `true`.
25
- - `maxScale` (`number`): Maximum scale factor for `autoScale`. Default: `1` (no upscaling).
26
- - `edgePadding` (`number`): Horizontal padding from edges when `autoScale` is enabled. Default: `16`.
27
-
28
- ## Public Methods
29
-
30
- ### `render(expression)`
31
-
32
- Renders a mathematical expression or equation within the display. It intelligently handles different input types:
33
-
34
- - If `expression` is a string containing semicolons (`;`), it's treated as a sequence of equations and rendered as an `omdStepVisualizer`.
35
- - If `expression` is a string containing an equals sign (`=`), it's treated as a single equation and wrapped in an `omdStepVisualizer`.
36
- - Otherwise, if `expression` is a string, it's parsed as a single mathematical expression.
37
- - If `expression` is already an `omdNode` instance, it's rendered directly.
38
-
39
- - **`expression`** (`string` | `omdNode`): The mathematical expression string or a pre-existing `omdNode` instance.
40
- - **Returns**: `omdNode` - The root node of the rendered content (often an `omdStepVisualizer`).
41
-
42
- ### `update(newNode)`
43
-
44
- Replaces the currently displayed node with a new one, applying the current font size and centering if enabled. The new node is initialized before being added to the display.
45
-
46
- - **`newNode`** (`omdNode`): The new node to display.
47
-
48
- ### `getCurrentNode()`
49
-
50
- Returns the node currently being displayed.
51
-
52
- - **Returns**: `omdNode` | `null` - The current root node, or `null` if nothing is displayed.
53
-
54
- ### `centerNode()`
55
-
56
- Manually triggers the centering and scaling logic for the current node. This is particularly useful for `omdEquationSequenceNode` instances to align them by their equals signs, and for ensuring content fits within the container based on `autoScale` and `maxScale` options.
57
-
58
- ### `fitToContent()`
59
-
60
- Adjusts the SVG container's dimensions to tightly fit the rendered content, adding a small padding. This is useful for generating images or when the display needs to precisely match the content size.
61
-
62
- ### `setFontSize(size)`
63
-
64
- Updates the base font size for the currently displayed node and for any future content rendered. This will trigger a re-layout and re-centering.
65
-
66
- - **`size`** (`number`): The new font size in pixels.
67
-
68
- ### `setFont(fontFamily, fontWeight)`
69
-
70
- Applies a specific font family and weight to all text elements within the rendered SVG. This setting is also stored for future content.
71
-
72
- - **`fontFamily`** (`string`): CSS `font-family` string (e.g., `'"Shantell Sans", cursive'`).
73
- - **`fontWeight`** (`string`, optional): CSS `font-weight` (e.g., `'400'`, `'bold'`). Default: `'400'`.
74
-
75
- ### `clear()`
76
-
77
- Removes the current expression from the display.
78
-
79
- ### `destroy()`
80
-
81
- Cleans up the component, removing all DOM elements and detaching the resize observer.
82
-
83
- ## Internal Methods
84
-
85
- - **`_setupSVG()`**: Initializes the main SVG element, sets its viewBox, and attaches a `ResizeObserver` to the container.
86
- - **`_handleResize()`**: Callback for the `ResizeObserver` that updates the SVG viewBox and re-centers the content on container resize.
87
- - **`_repositionOverlayToolbar()`**: Positions any overlay toolbars associated with the current node (e.g., for interactive step visualizers).
1
+ # omdDisplay
2
+
3
+ A high-level component for displaying mathematical expressions or a series of equation steps. It handles rendering, automatic centering, scaling, and layout management within a given HTML container.
4
+
5
+ ## Class Definition
6
+
7
+ ```javascript
8
+ export class omdDisplay
9
+ ```
10
+
11
+ ## Constructor
12
+
13
+ ### `new omdDisplay(container, [options])`
14
+
15
+ Creates a new `omdDisplay` instance.
16
+
17
+ - **`container`** (`HTMLElement`): The DOM element where the expression will be rendered.
18
+ - **`options`** (`object`, optional): Configuration options:
19
+ - `fontSize` (`number`): The base font size in pixels for the expression. Default: `32`.
20
+ - `centerContent` (`boolean`): If `true`, the content is automatically centered within the container. Default: `true`.
21
+ - `topMargin` (`number`): The top margin in pixels, used when centering content. Default: `40`.
22
+ - `bottomMargin` (`number`): The bottom margin in pixels. Default: `16`.
23
+ - `fitToContent` (`boolean`): If `true`, the SVG container will resize to tightly fit the content. Default: `false`.
24
+ - `autoScale` (`boolean`): If `true`, content will automatically scale down to fit the container. Default: `true`.
25
+ - `maxScale` (`number`): Maximum scale factor for `autoScale`. Default: `1` (no upscaling).
26
+ - `edgePadding` (`number`): Horizontal padding from edges when `autoScale` is enabled. Default: `16`.
27
+
28
+ ## Public Methods
29
+
30
+ ### `render(expression)`
31
+
32
+ Renders a mathematical expression or equation within the display. It intelligently handles different input types:
33
+
34
+ - If `expression` is a string containing semicolons (`;`), it's treated as a sequence of equations and rendered as an `omdStepVisualizer`.
35
+ - If `expression` is a string containing an equals sign (`=`), it's treated as a single equation and wrapped in an `omdStepVisualizer`.
36
+ - Otherwise, if `expression` is a string, it's parsed as a single mathematical expression.
37
+ - If `expression` is already an `omdNode` instance, it's rendered directly.
38
+
39
+ - **`expression`** (`string` | `omdNode`): The mathematical expression string or a pre-existing `omdNode` instance.
40
+ - **Returns**: `omdNode` - The root node of the rendered content (often an `omdStepVisualizer`).
41
+
42
+ ### `update(newNode)`
43
+
44
+ Replaces the currently displayed node with a new one, applying the current font size and centering if enabled. The new node is initialized before being added to the display.
45
+
46
+ - **`newNode`** (`omdNode`): The new node to display.
47
+
48
+ ### `getCurrentNode()`
49
+
50
+ Returns the node currently being displayed.
51
+
52
+ - **Returns**: `omdNode` | `null` - The current root node, or `null` if nothing is displayed.
53
+
54
+ ### `centerNode()`
55
+
56
+ Manually triggers the centering and scaling logic for the current node. This is particularly useful for `omdEquationSequenceNode` instances to align them by their equals signs, and for ensuring content fits within the container based on `autoScale` and `maxScale` options.
57
+
58
+ ### `fitToContent()`
59
+
60
+ Adjusts the SVG container's dimensions to tightly fit the rendered content, adding a small padding. This is useful for generating images or when the display needs to precisely match the content size.
61
+
62
+ ### `setFontSize(size)`
63
+
64
+ Updates the base font size for the currently displayed node and for any future content rendered. This will trigger a re-layout and re-centering.
65
+
66
+ - **`size`** (`number`): The new font size in pixels.
67
+
68
+ ### `setFont(fontFamily, fontWeight)`
69
+
70
+ Applies a specific font family and weight to all text elements within the rendered SVG. This setting is also stored for future content.
71
+
72
+ - **`fontFamily`** (`string`): CSS `font-family` string (e.g., `'"Shantell Sans", cursive'`).
73
+ - **`fontWeight`** (`string`, optional): CSS `font-weight` (e.g., `'400'`, `'bold'`). Default: `'400'`.
74
+
75
+ ### `clear()`
76
+
77
+ Removes the current expression from the display.
78
+
79
+ ### `destroy()`
80
+
81
+ Cleans up the component, removing all DOM elements and detaching the resize observer.
82
+
83
+ ## Internal Methods
84
+
85
+ - **`_setupSVG()`**: Initializes the main SVG element, sets its viewBox, and attaches a `ResizeObserver` to the container.
86
+ - **`_handleResize()`**: Callback for the `ResizeObserver` that updates the SVG viewBox and re-centers the content on container resize.
87
+ - **`_repositionOverlayToolbar()`**: Positions any overlay toolbars associated with the current node (e.g., for interactive step visualizers).
@@ -1,174 +1,174 @@
1
- # omdEquationNode
2
-
3
- Represents a mathematical equation, consisting of a left side, a right side, and an equals sign. This class provides extensive functionality for manipulating the equation, such as applying operations to both sides, swapping sides, simplification, and rendering to various visualization formats.
4
-
5
- ## Class Definition
6
-
7
- ```javascript
8
- export class omdEquationNode extends omdNode
9
- ```
10
-
11
- ## Constructor
12
-
13
- ### `new omdEquationNode(ast)`
14
-
15
- Creates a new `omdEquationNode` instance.
16
-
17
- - **`ast`** (`object`): The math.js Abstract Syntax Tree (AST) for the equation. It typically expects an `AssignmentNode` (with `object` for the left side and `value` for the right side) or an `OperatorNode` (with `op: '='` and two arguments).
18
-
19
- ## Static Methods
20
-
21
- ### `fromString(equationString)`
22
-
23
- Creates an `omdEquationNode` instance from a string representation of an equation.
24
-
25
- - **`equationString`** (`string`): The string to parse (e.g., `"2x + 4 = 10"`).
26
- - **Returns**: `omdEquationNode` - A new instance of `omdEquationNode`.
27
- - **Throws**: `Error` if the string is not a valid equation (must contain exactly one `'='` and both sides must be non-empty).
28
-
29
- ## Public Properties
30
-
31
- - **`left`** ([`omdNode`](./omdNode.md)): The node representing the left side of the equation.
32
- - **`right`** ([`omdNode`](./omdNode.md)): The node representing the right side of the equation.
33
- - **`equalsSign`** ([`omdOperatorNode`](./omdOperatorNode.md)): The node for the equals sign.
34
-
35
- ## Public Methods
36
-
37
- ### `addToBothSides(value)`
38
-
39
- Returns a new equation with a value added to both sides.
40
-
41
- - **`value`** (`number` | `object`): The value (number or math.js AST) to add.
42
- - **Returns**: `omdEquationNode` - A new equation node with the operation applied.
43
-
44
- ### `subtractFromBothSides(value)`
45
-
46
- Returns a new equation with a value subtracted from both sides.
47
-
48
- - **`value`** (`number` | `object`): The value (number or math.js AST) to subtract.
49
- - **Returns**: `omdEquationNode` - A new equation node.
50
-
51
- ### `multiplyBothSides(value)`
52
-
53
- Returns a new equation with both sides multiplied by a value.
54
-
55
- - **`value`** (`number` | `object`): The value (number or math.js AST) to multiply by.
56
- - **Returns**: `omdEquationNode` - A new equation node.
57
-
58
- ### `divideBothSides(value)`
59
-
60
- Returns a new equation with both sides divided by a value.
61
-
62
- - **`value`** (`number` | `object`): The value (number or math.js AST) to divide by.
63
- - **Returns**: `omdEquationNode` - A new equation node.
64
-
65
- ### `applyFunction(functionName)`
66
-
67
- Applies a function (e.g., `sqrt`, `log`) to both sides of the equation.
68
-
69
- - **`functionName`** (`string`): The name of the function to apply.
70
- - **Returns**: `omdEquationNode` - A new equation with the function applied to both sides.
71
-
72
- ### `applyOperation(value, operation, side = 'both')`
73
-
74
- Applies an arithmetic operation to one or both sides of the equation.
75
-
76
- - **`value`** (`number` | `omdNode`): The value to apply.
77
- - **`operation`** (`string`): The operation to perform: `'add'`, `'subtract'`, `'multiply'`, or `'divide'`.
78
- - **`side`** (`string`): The side to apply the operation to: `'left'`, `'right'`, or `'both'`. Defaults to `'both'`.
79
- - **Returns**: `omdEquationNode` - A new equation node with the operation applied.
80
-
81
- ### `swapSides()`
82
-
83
- Swaps the left and right sides of the equation.
84
-
85
- - **Returns**: `omdEquationNode` - A new equation node with the sides swapped.
86
-
87
- ### `simplify()`
88
-
89
- Simplifies both sides of the equation using the simplification engine.
90
-
91
- - **Returns**: `object` - An object containing `{ success, newRoot, message }`.
92
-
93
- ### `clone()`
94
-
95
- Creates a deep clone of the equation node, preserving its structure and provenance.
96
-
97
- - **Returns**: `omdEquationNode` - A new, identical instance of the equation node.
98
-
99
- ### `toString()`
100
-
101
- Converts the equation to its string representation.
102
-
103
- - **Returns**: `string` - The equation as a string (e.g., `"x + 1 = 5"`).
104
-
105
- ### `evaluate(variables)`
106
-
107
- Evaluates both sides of the equation with a given set of variables.
108
-
109
- - **`variables`** (`object`): A map of variable names to their numeric values (e.g., `{ x: 2 }`).
110
- - **Returns**: `object` - An object with the evaluated `left` and `right` side values.
111
-
112
- ### `setBackgroundStyle(style)`
113
-
114
- Configures the background styling for the equation node. This can include `backgroundColor`, `cornerRadius`, and `pill` (for a pill-shaped background).
115
-
116
- - **`style`** (`object`): An object containing style properties.
117
-
118
- ### `getEqualsAnchorX()`
119
-
120
- Returns the horizontal X-coordinate of the center of the equals sign relative to this node's origin. Useful for aligning equations in a sequence.
121
-
122
- - **Returns**: `number`.
123
-
124
- ### `getBackgroundPaddingX()`
125
-
126
- Returns the horizontal padding applied by the background style.
127
-
128
- - **Returns**: `number`.
129
-
130
- ### `getEffectiveBackgroundPaddingX()`
131
-
132
- Returns the effective horizontal padding used in layout, accounting for factors like pill clamping.
133
-
134
- - **Returns**: `number`.
135
-
136
- ### `renderTo(visualizationType, options)`
137
-
138
- Renders the equation to different visualization formats (e.g., graph, table, balance hanger, tile equation).
139
-
140
- - **`visualizationType`** (`string`): The type of visualization (`"graph"`, `"table"`, `"hanger"`, `"tileequation"`).
141
- - **`options`** (`object`, optional): Configuration options specific to the visualization type.
142
- - **Returns**: `object` - A JSON object conforming to the schemas defined in `src/json-schemas.md`.
143
-
144
- ### `getLeft()`
145
-
146
- Returns the `omdNode` representing the left side of the equation.
147
-
148
- - **Returns**: `omdNode`.
149
-
150
- ### `getRight()`
151
-
152
- Returns the `omdNode` representing the right side of the equation.
153
-
154
- - **Returns**: `omdNode`.
155
-
156
- ## Internal Methods
157
-
158
- - **`_applyOperation(value, op, fn)`**: Internal helper for applying arithmetic operations to both sides.
159
- - **`_needsParenthesesForOperation(node, operation)`**: Determines if a child node needs parentheses when an operation is applied, based on operator precedence.
160
- - **`_createNodeFromValue(value)`**: Converts a number or math.js AST into an appropriate `omdNode`.
161
- - **`_establishGranularProvenance(newNode, originalNode, operationValue, operation)`**: Manages provenance tracking for equation operations, linking new nodes to their origins.
162
- - **`_isMultiplicationOperation(node)`**: Checks if a given node represents a multiplication operation.
163
- - **`_copyProvenanceStructure(target, source)`**: Recursively copies provenance information from a source node to a target node.
164
- - **`_createFunctionNode(functionName, argument)`**: Creates an `omdFunctionNode` wrapping a given argument.
165
- - **`_createNewEquation(left, right)`**: Creates a new `omdEquationNode` from two `omdNode` instances.
166
- - **`_getEffectivePadding(contentHeight)`**: Computes effective padding for background styling, considering pill radius clamping.
167
- - **`_applyPillToDescendants()`**: Applies pill-shaped corner radius to all descendant nodes' backgrounds when the parent equation uses a pill style.
168
- - **`_matchChildBackgrounds(color)`**: Hides child node backgrounds by setting their color to match the parent equation's background.
169
- - **`_renderToGraph(options)`**: Generates JSON for a coordinate plane graph visualization.
170
- - **`_renderToTable(options)`**: Generates JSON for a table visualization.
171
- - **`_renderSingleSideTable(side, title, options)`**: Helper for generating tables for a single side of the equation.
172
- - **`_renderToHanger()`**: Generates JSON for a balance hanger visualization.
173
- - **`_normalizeExpressionString(expr)`**: Normalizes expression strings for evaluation/graphing (e.g., inserts `*` for implicit multiplication).
174
- - **`_convertToHangerValues(node)`**: Converts an equation side into values suitable for a balance hanger visualization.
1
+ # omdEquationNode
2
+
3
+ Represents a mathematical equation, consisting of a left side, a right side, and an equals sign. This class provides extensive functionality for manipulating the equation, such as applying operations to both sides, swapping sides, simplification, and rendering to various visualization formats.
4
+
5
+ ## Class Definition
6
+
7
+ ```javascript
8
+ export class omdEquationNode extends omdNode
9
+ ```
10
+
11
+ ## Constructor
12
+
13
+ ### `new omdEquationNode(ast)`
14
+
15
+ Creates a new `omdEquationNode` instance.
16
+
17
+ - **`ast`** (`object`): The math.js Abstract Syntax Tree (AST) for the equation. It typically expects an `AssignmentNode` (with `object` for the left side and `value` for the right side) or an `OperatorNode` (with `op: '='` and two arguments).
18
+
19
+ ## Static Methods
20
+
21
+ ### `fromString(equationString)`
22
+
23
+ Creates an `omdEquationNode` instance from a string representation of an equation.
24
+
25
+ - **`equationString`** (`string`): The string to parse (e.g., `"2x + 4 = 10"`).
26
+ - **Returns**: `omdEquationNode` - A new instance of `omdEquationNode`.
27
+ - **Throws**: `Error` if the string is not a valid equation (must contain exactly one `'='` and both sides must be non-empty).
28
+
29
+ ## Public Properties
30
+
31
+ - **`left`** ([`omdNode`](./omdNode.md)): The node representing the left side of the equation.
32
+ - **`right`** ([`omdNode`](./omdNode.md)): The node representing the right side of the equation.
33
+ - **`equalsSign`** ([`omdOperatorNode`](./omdOperatorNode.md)): The node for the equals sign.
34
+
35
+ ## Public Methods
36
+
37
+ ### `addToBothSides(value)`
38
+
39
+ Returns a new equation with a value added to both sides.
40
+
41
+ - **`value`** (`number` | `object`): The value (number or math.js AST) to add.
42
+ - **Returns**: `omdEquationNode` - A new equation node with the operation applied.
43
+
44
+ ### `subtractFromBothSides(value)`
45
+
46
+ Returns a new equation with a value subtracted from both sides.
47
+
48
+ - **`value`** (`number` | `object`): The value (number or math.js AST) to subtract.
49
+ - **Returns**: `omdEquationNode` - A new equation node.
50
+
51
+ ### `multiplyBothSides(value)`
52
+
53
+ Returns a new equation with both sides multiplied by a value.
54
+
55
+ - **`value`** (`number` | `object`): The value (number or math.js AST) to multiply by.
56
+ - **Returns**: `omdEquationNode` - A new equation node.
57
+
58
+ ### `divideBothSides(value)`
59
+
60
+ Returns a new equation with both sides divided by a value.
61
+
62
+ - **`value`** (`number` | `object`): The value (number or math.js AST) to divide by.
63
+ - **Returns**: `omdEquationNode` - A new equation node.
64
+
65
+ ### `applyFunction(functionName)`
66
+
67
+ Applies a function (e.g., `sqrt`, `log`) to both sides of the equation.
68
+
69
+ - **`functionName`** (`string`): The name of the function to apply.
70
+ - **Returns**: `omdEquationNode` - A new equation with the function applied to both sides.
71
+
72
+ ### `applyOperation(value, operation, side = 'both')`
73
+
74
+ Applies an arithmetic operation to one or both sides of the equation.
75
+
76
+ - **`value`** (`number` | `omdNode`): The value to apply.
77
+ - **`operation`** (`string`): The operation to perform: `'add'`, `'subtract'`, `'multiply'`, or `'divide'`.
78
+ - **`side`** (`string`): The side to apply the operation to: `'left'`, `'right'`, or `'both'`. Defaults to `'both'`.
79
+ - **Returns**: `omdEquationNode` - A new equation node with the operation applied.
80
+
81
+ ### `swapSides()`
82
+
83
+ Swaps the left and right sides of the equation.
84
+
85
+ - **Returns**: `omdEquationNode` - A new equation node with the sides swapped.
86
+
87
+ ### `simplify()`
88
+
89
+ Simplifies both sides of the equation using the simplification engine.
90
+
91
+ - **Returns**: `object` - An object containing `{ success, newRoot, message }`.
92
+
93
+ ### `clone()`
94
+
95
+ Creates a deep clone of the equation node, preserving its structure and provenance.
96
+
97
+ - **Returns**: `omdEquationNode` - A new, identical instance of the equation node.
98
+
99
+ ### `toString()`
100
+
101
+ Converts the equation to its string representation.
102
+
103
+ - **Returns**: `string` - The equation as a string (e.g., `"x + 1 = 5"`).
104
+
105
+ ### `evaluate(variables)`
106
+
107
+ Evaluates both sides of the equation with a given set of variables.
108
+
109
+ - **`variables`** (`object`): A map of variable names to their numeric values (e.g., `{ x: 2 }`).
110
+ - **Returns**: `object` - An object with the evaluated `left` and `right` side values.
111
+
112
+ ### `setBackgroundStyle(style)`
113
+
114
+ Configures the background styling for the equation node. This can include `backgroundColor`, `cornerRadius`, and `pill` (for a pill-shaped background).
115
+
116
+ - **`style`** (`object`): An object containing style properties.
117
+
118
+ ### `getEqualsAnchorX()`
119
+
120
+ Returns the horizontal X-coordinate of the center of the equals sign relative to this node's origin. Useful for aligning equations in a sequence.
121
+
122
+ - **Returns**: `number`.
123
+
124
+ ### `getBackgroundPaddingX()`
125
+
126
+ Returns the horizontal padding applied by the background style.
127
+
128
+ - **Returns**: `number`.
129
+
130
+ ### `getEffectiveBackgroundPaddingX()`
131
+
132
+ Returns the effective horizontal padding used in layout, accounting for factors like pill clamping.
133
+
134
+ - **Returns**: `number`.
135
+
136
+ ### `renderTo(visualizationType, options)`
137
+
138
+ Renders the equation to different visualization formats (e.g., graph, table, balance hanger, tile equation).
139
+
140
+ - **`visualizationType`** (`string`): The type of visualization (`"graph"`, `"table"`, `"hanger"`, `"tileequation"`).
141
+ - **`options`** (`object`, optional): Configuration options specific to the visualization type.
142
+ - **Returns**: `object` - A JSON object conforming to the schemas defined in `src/json-schemas.md`.
143
+
144
+ ### `getLeft()`
145
+
146
+ Returns the `omdNode` representing the left side of the equation.
147
+
148
+ - **Returns**: `omdNode`.
149
+
150
+ ### `getRight()`
151
+
152
+ Returns the `omdNode` representing the right side of the equation.
153
+
154
+ - **Returns**: `omdNode`.
155
+
156
+ ## Internal Methods
157
+
158
+ - **`_applyOperation(value, op, fn)`**: Internal helper for applying arithmetic operations to both sides.
159
+ - **`_needsParenthesesForOperation(node, operation)`**: Determines if a child node needs parentheses when an operation is applied, based on operator precedence.
160
+ - **`_createNodeFromValue(value)`**: Converts a number or math.js AST into an appropriate `omdNode`.
161
+ - **`_establishGranularProvenance(newNode, originalNode, operationValue, operation)`**: Manages provenance tracking for equation operations, linking new nodes to their origins.
162
+ - **`_isMultiplicationOperation(node)`**: Checks if a given node represents a multiplication operation.
163
+ - **`_copyProvenanceStructure(target, source)`**: Recursively copies provenance information from a source node to a target node.
164
+ - **`_createFunctionNode(functionName, argument)`**: Creates an `omdFunctionNode` wrapping a given argument.
165
+ - **`_createNewEquation(left, right)`**: Creates a new `omdEquationNode` from two `omdNode` instances.
166
+ - **`_getEffectivePadding(contentHeight)`**: Computes effective padding for background styling, considering pill radius clamping.
167
+ - **`_applyPillToDescendants()`**: Applies pill-shaped corner radius to all descendant nodes' backgrounds when the parent equation uses a pill style.
168
+ - **`_matchChildBackgrounds(color)`**: Hides child node backgrounds by setting their color to match the parent equation's background.
169
+ - **`_renderToGraph(options)`**: Generates JSON for a coordinate plane graph visualization.
170
+ - **`_renderToTable(options)`**: Generates JSON for a table visualization.
171
+ - **`_renderSingleSideTable(side, title, options)`**: Helper for generating tables for a single side of the equation.
172
+ - **`_renderToHanger()`**: Generates JSON for a balance hanger visualization.
173
+ - **`_normalizeExpressionString(expr)`**: Normalizes expression strings for evaluation/graphing (e.g., inserts `*` for implicit multiplication).
174
+ - **`_convertToHangerValues(node)`**: Converts an equation side into values suitable for a balance hanger visualization.