@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,132 +1,132 @@
1
- # omdPowerNode
2
-
3
- Represents an exponentiation in a mathematical expression, such as `x^2` or `(a+b)^c`. This node handles the specific layout requirements of a base and a superscripted exponent, ensuring correct visual hierarchy and alignment.
4
-
5
- ## Class Definition
6
-
7
- ```javascript
8
- export class omdPowerNode extends omdNode
9
- ```
10
-
11
- ## Constructor
12
-
13
- ### `new omdPowerNode(ast)`
14
-
15
- Creates a new `omdPowerNode` instance.
16
-
17
- - **`ast`** (`object`): The math.js AST for the power operation. It must be an `OperatorNode` with `op: '^'` and an `args` array containing exactly two elements: the base and the exponent. Throws an error if the AST is invalid.
18
-
19
- ## Static Methods
20
-
21
- ### `fromString(expressionString)`
22
-
23
- Creates an `omdPowerNode` from a string representation of a power expression. Requires `window.math` (math.js) to be available globally for parsing.
24
-
25
- - **`expressionString`** (`string`): The power expression as a string (e.g., `"x^2"`, `"(a+b)^c"`).
26
- - **Returns**: `omdPowerNode` - A new instance.
27
- - **Throws**: `Error` if `math.js` is not available, if the string cannot be parsed, or if it does not represent a valid power expression.
28
-
29
- ## Public Properties
30
-
31
- - **`base`** (`omdNode`): The node representing the base of the power operation.
32
- - **`exponent`** (`omdNode`): The node representing the exponent.
33
- - **`value`** (`string`): The operator symbol for power, which is `"^"`.
34
-
35
- ## Public Methods
36
-
37
- ### `computeDimensions()`
38
-
39
- Calculates the dimensions of the power node. It computes the dimensions of the base and exponent (scaling the exponent's font size down). The total width is the sum of their widths, and the total height accounts for the base's height plus the vertical offset needed for the superscripted exponent.
40
-
41
- - **Overrides**: `omdNode.computeDimensions()`.
42
-
43
- ### `updateLayout()`
44
-
45
- Updates the layout of the power node. It positions the `base` at the bottom of the node's bounding box to ensure space for the exponent above it. The `exponent` is then positioned to the right of the base and shifted upwards by a calculated superscript offset.
46
-
47
- - **Overrides**: `omdNode.updateLayout()`.
48
-
49
- ### `getSuperscriptOffset()`
50
-
51
- Calculates the vertical offset (in pixels) by which the exponent should be raised above the base. This offset is a proportion of the current font size to ensure consistent scaling.
52
-
53
- - **Returns**: `number` - The vertical offset.
54
-
55
- ### `getAlignmentBaseline()`
56
-
57
- Calculates the vertical alignment point for the node. For a power node, the baseline is determined by the baseline of its `base` expression, ensuring proper alignment with other mathematical elements.
58
-
59
- - **Overrides**: `omdNode.getAlignmentBaseline()`.
60
-
61
- ### `clone()`
62
-
63
- Creates a deep, structural clone of the power node, including its `base` and `exponent` nodes. The cloned node's `provenance` array is updated to include the original node's ID.
64
-
65
- - **Returns**: `omdPowerNode` - A new, identical instance of the power node.
66
-
67
- ### `toMathJSNode()`
68
-
69
- Converts the `omdPowerNode` back into its math.js AST representation. It creates an `OperatorNode` with `op: '^'` and `fn: 'pow'`, containing the converted base and exponent ASTs.
70
-
71
- - **Returns**: `object` - A math.js `OperatorNode` for the power operation. The returned object also includes a `clone` method for compatibility.
72
-
73
- ### `toString()`
74
-
75
- Converts the node to its string representation, adding parentheses where necessary to preserve the correct order of operations for both the base and the exponent.
76
-
77
- - **Returns**: `string` - e.g., `"(x+1)^2"`.
78
-
79
- ### `evaluate(variables)`
80
-
81
- Evaluates the power expression by raising the evaluated base to the power of the evaluated exponent. It handles cases where base or exponent might not be numerical.
82
-
83
- - **`variables`** (`object`): A map of variable names to their numeric values.
84
- - **Returns**: `number` - The result of the exponentiation, or `NaN` if base or exponent cannot be evaluated to a number.
85
-
86
- ### `isSquare()`
87
-
88
- Checks if the exponent of the power node is the constant value `2`.
89
-
90
- - **Returns**: `boolean`.
91
-
92
- ### `isCube()`
93
-
94
- Checks if the exponent of the power node is the constant value `3`.
95
-
96
- - **Returns**: `boolean`.
97
-
98
- ## Internal Methods
99
-
100
- - **`parseValue()`**: Sets the `value` property to `"^"`.
101
- - **`createOperand(ast)`**: Creates an `omdNode` instance for the base or exponent from its AST.
102
-
103
- ## Example
104
-
105
- ```javascript
106
- import { omdPowerNode } from '@teachinglab/omd';
107
- import * as math from 'mathjs';
108
-
109
- // Create a node representing x^2
110
- const ast = math.parse('x^2');
111
- const powerNode = new omdPowerNode(ast);
112
-
113
- // Set font size and render
114
- powerNode.setFontSize(32);
115
- powerNode.initialize();
116
-
117
- // Check properties
118
- console.log(powerNode.isSquare()); // true
119
-
120
- // Evaluate
121
- console.log(powerNode.evaluate({ x: 5 })); // 25
122
-
123
- // Add to an SVG container to display
124
- // const svgContainer = new jsvgContainer();
125
- // svgContainer.addChild(powerNode);
126
- // document.body.appendChild(svgContainer.svgObject);
127
- ```
128
-
129
- ## See Also
130
-
131
- - [`omdNode`](./omdNode.md) - The base class for all OMD nodes.
1
+ # omdPowerNode
2
+
3
+ Represents an exponentiation in a mathematical expression, such as `x^2` or `(a+b)^c`. This node handles the specific layout requirements of a base and a superscripted exponent, ensuring correct visual hierarchy and alignment.
4
+
5
+ ## Class Definition
6
+
7
+ ```javascript
8
+ export class omdPowerNode extends omdNode
9
+ ```
10
+
11
+ ## Constructor
12
+
13
+ ### `new omdPowerNode(ast)`
14
+
15
+ Creates a new `omdPowerNode` instance.
16
+
17
+ - **`ast`** (`object`): The math.js AST for the power operation. It must be an `OperatorNode` with `op: '^'` and an `args` array containing exactly two elements: the base and the exponent. Throws an error if the AST is invalid.
18
+
19
+ ## Static Methods
20
+
21
+ ### `fromString(expressionString)`
22
+
23
+ Creates an `omdPowerNode` from a string representation of a power expression. Requires `window.math` (math.js) to be available globally for parsing.
24
+
25
+ - **`expressionString`** (`string`): The power expression as a string (e.g., `"x^2"`, `"(a+b)^c"`).
26
+ - **Returns**: `omdPowerNode` - A new instance.
27
+ - **Throws**: `Error` if `math.js` is not available, if the string cannot be parsed, or if it does not represent a valid power expression.
28
+
29
+ ## Public Properties
30
+
31
+ - **`base`** (`omdNode`): The node representing the base of the power operation.
32
+ - **`exponent`** (`omdNode`): The node representing the exponent.
33
+ - **`value`** (`string`): The operator symbol for power, which is `"^"`.
34
+
35
+ ## Public Methods
36
+
37
+ ### `computeDimensions()`
38
+
39
+ Calculates the dimensions of the power node. It computes the dimensions of the base and exponent (scaling the exponent's font size down). The total width is the sum of their widths, and the total height accounts for the base's height plus the vertical offset needed for the superscripted exponent.
40
+
41
+ - **Overrides**: `omdNode.computeDimensions()`.
42
+
43
+ ### `updateLayout()`
44
+
45
+ Updates the layout of the power node. It positions the `base` at the bottom of the node's bounding box to ensure space for the exponent above it. The `exponent` is then positioned to the right of the base and shifted upwards by a calculated superscript offset.
46
+
47
+ - **Overrides**: `omdNode.updateLayout()`.
48
+
49
+ ### `getSuperscriptOffset()`
50
+
51
+ Calculates the vertical offset (in pixels) by which the exponent should be raised above the base. This offset is a proportion of the current font size to ensure consistent scaling.
52
+
53
+ - **Returns**: `number` - The vertical offset.
54
+
55
+ ### `getAlignmentBaseline()`
56
+
57
+ Calculates the vertical alignment point for the node. For a power node, the baseline is determined by the baseline of its `base` expression, ensuring proper alignment with other mathematical elements.
58
+
59
+ - **Overrides**: `omdNode.getAlignmentBaseline()`.
60
+
61
+ ### `clone()`
62
+
63
+ Creates a deep, structural clone of the power node, including its `base` and `exponent` nodes. The cloned node's `provenance` array is updated to include the original node's ID.
64
+
65
+ - **Returns**: `omdPowerNode` - A new, identical instance of the power node.
66
+
67
+ ### `toMathJSNode()`
68
+
69
+ Converts the `omdPowerNode` back into its math.js AST representation. It creates an `OperatorNode` with `op: '^'` and `fn: 'pow'`, containing the converted base and exponent ASTs.
70
+
71
+ - **Returns**: `object` - A math.js `OperatorNode` for the power operation. The returned object also includes a `clone` method for compatibility.
72
+
73
+ ### `toString()`
74
+
75
+ Converts the node to its string representation, adding parentheses where necessary to preserve the correct order of operations for both the base and the exponent.
76
+
77
+ - **Returns**: `string` - e.g., `"(x+1)^2"`.
78
+
79
+ ### `evaluate(variables)`
80
+
81
+ Evaluates the power expression by raising the evaluated base to the power of the evaluated exponent. It handles cases where base or exponent might not be numerical.
82
+
83
+ - **`variables`** (`object`): A map of variable names to their numeric values.
84
+ - **Returns**: `number` - The result of the exponentiation, or `NaN` if base or exponent cannot be evaluated to a number.
85
+
86
+ ### `isSquare()`
87
+
88
+ Checks if the exponent of the power node is the constant value `2`.
89
+
90
+ - **Returns**: `boolean`.
91
+
92
+ ### `isCube()`
93
+
94
+ Checks if the exponent of the power node is the constant value `3`.
95
+
96
+ - **Returns**: `boolean`.
97
+
98
+ ## Internal Methods
99
+
100
+ - **`parseValue()`**: Sets the `value` property to `"^"`.
101
+ - **`createOperand(ast)`**: Creates an `omdNode` instance for the base or exponent from its AST.
102
+
103
+ ## Example
104
+
105
+ ```javascript
106
+ import { omdPowerNode } from '@teachinglab/omd';
107
+ import * as math from 'mathjs';
108
+
109
+ // Create a node representing x^2
110
+ const ast = math.parse('x^2');
111
+ const powerNode = new omdPowerNode(ast);
112
+
113
+ // Set font size and render
114
+ powerNode.setFontSize(32);
115
+ powerNode.initialize();
116
+
117
+ // Check properties
118
+ console.log(powerNode.isSquare()); // true
119
+
120
+ // Evaluate
121
+ console.log(powerNode.evaluate({ x: 5 })); // 25
122
+
123
+ // Add to an SVG container to display
124
+ // const svgContainer = new jsvgContainer();
125
+ // svgContainer.addChild(powerNode);
126
+ // document.body.appendChild(svgContainer.svgObject);
127
+ ```
128
+
129
+ ## See Also
130
+
131
+ - [`omdNode`](./omdNode.md) - The base class for all OMD nodes.
132
132
  - [`omdBinaryExpressionNode`](./omdBinaryExpressionNode.md) - Can be used for complex bases or exponents.
@@ -1,145 +1,145 @@
1
- # omdRationalNode
2
-
3
- Represents a fraction, with a numerator and a denominator, such as `1/2` or `(x+1)/(x-1)`. It handles the distinct visual layout of a fraction, with the numerator positioned above the denominator, separated by a horizontal line.
4
-
5
- ## Class Definition
6
-
7
- ```javascript
8
- export class omdRationalNode extends omdNode
9
- ```
10
-
11
- ## Constructor
12
-
13
- ### `new omdRationalNode(astNodeData)`
14
-
15
- Creates a new `omdRationalNode` instance.
16
-
17
- - **`astNodeData`** (`object`): The math.js AST for the division operation. It must be an `OperatorNode` with `op: '/'` and an `args` array containing two elements: the numerator and the denominator. The constructor also creates and initializes the visual `fractionLine`.
18
-
19
- ## Static Methods
20
-
21
- ### `fromString(expressionString)`
22
-
23
- Creates an `omdRationalNode` from a string containing a division. Requires `window.math` (math.js) to be available globally for parsing.
24
-
25
- - **`expressionString`** (`string`): The fractional expression as a string (e.g., `"x / 2"`, `"(a+b)/(a-b)"`).
26
- - **Returns**: `omdRationalNode` - A new instance.
27
- - **Throws**: `Error` if `math.js` is not available, if the string cannot be parsed, or if it does not represent a valid division expression.
28
-
29
- ## Public Properties
30
-
31
- - **`numerator`** (`omdNode`): The node representing the top part of the fraction.
32
- - **`denominator`** (`omdNode`): The node representing the bottom part of the fraction.
33
- - **`fractionLine`** (`jsvgLine`): The visual horizontal line separating the numerator and denominator.
34
-
35
- ## Public Methods
36
-
37
- ### `computeDimensions()`
38
-
39
- Calculates the dimensions of the rational node. It scales down the font size of the numerator and denominator, computes their individual dimensions, and then determines the total width (maximum of numerator/denominator width plus spacing) and total height (sum of numerator, denominator, and padding for the fraction line).
40
-
41
- - **Overrides**: `omdNode.computeDimensions()`.
42
-
43
- ### `updateLayout()`
44
-
45
- Updates the layout of the rational node. It positions the `numerator` at the top, the `fractionLine` in the middle, and the `denominator` at the bottom, ensuring they are horizontally centered and have appropriate vertical spacing.
46
-
47
- - **Overrides**: `omdNode.updateLayout()`.
48
-
49
- ### `getAlignmentBaseline()`
50
-
51
- Calculates the vertical alignment point for the node. For a rational node, this is the y-position of the fraction bar, which serves as the visual baseline.
52
-
53
- - **Overrides**: `omdNode.getAlignmentBaseline()`.
54
-
55
- ### `isConstant()`
56
-
57
- Checks if both the numerator and the denominator are constant numerical values.
58
-
59
- - **Returns**: `boolean`.
60
-
61
- ### `getRationalValue()`
62
-
63
- Retrieves the rational value of the node as a numerator/denominator pair. This method only works if the fraction is constant.
64
-
65
- - **Returns**: `{ num: number, den: number }`.
66
- - **Throws**: `Error` if the rational node is not constant.
67
-
68
- ### `getValue()`
69
-
70
- Retrieves the numerical value of the rational node by dividing the numerator's value by the denominator's value. This method only works if the fraction is constant.
71
-
72
- - **Returns**: `number`.
73
- - **Throws**: `Error` if the rational node is not constant or if division by zero occurs.
74
-
75
- ### `clone()`
76
-
77
- Creates a deep, structural clone of the rational node, including its `numerator` and `denominator` nodes. The `fractionLine` is also recreated. The cloned node's `provenance` array is updated to include the original node's ID.
78
-
79
- - **Returns**: `omdRationalNode` - A new, identical instance of the rational node.
80
-
81
- ### `toMathJSNode()`
82
-
83
- Converts the `omdRationalNode` back into its math.js AST representation. It creates an `OperatorNode` with `op: '/'` and `fn: 'divide'`, containing the converted numerator and denominator ASTs.
84
-
85
- - **Returns**: `object` - A math.js `OperatorNode` for division. The returned object also includes a `clone` method for compatibility.
86
-
87
- ### `toString()`
88
-
89
- Converts the node to its string representation, adding parentheses around the numerator and/or denominator if they are complex expressions (e.g., binary expressions) to maintain correct order of operations.
90
-
91
- - **Returns**: `string` - e.g., `"(x + 1) / (x - 1)"`.
92
-
93
- ### `evaluate(variables)`
94
-
95
- Evaluates the rational expression by evaluating the numerator and denominator and then performing the division.
96
-
97
- - **`variables`** (`object`): A map of variable names to their values.
98
- - **Returns**: `number` - The result of the division.
99
- - **Throws**: `Error` if the denominator evaluates to zero.
100
-
101
- ### `reduce()`
102
-
103
- If the fraction is constant, this method reduces it to its lowest terms (e.g., `4/8` becomes `1/2`). If the reduced denominator is `1`, it returns an `omdConstantNode` representing the integer value. It uses a `gcd` (greatest common divisor) helper function internally.
104
-
105
- - **Returns**: `omdRationalNode` | `omdConstantNode` - The reduced fraction node, or an `omdConstantNode` if it simplifies to an integer.
106
-
107
- ### `isProper()`
108
-
109
- Checks if the fraction is proper (the absolute value of the numerator is less than the absolute value of the denominator). This check only applies to constant fractions.
110
-
111
- - **Returns**: `boolean` | `null` - `true` if proper, `false` if improper, `null` if the fraction is not constant.
112
-
113
- ## Internal Methods
114
-
115
- - **`parseValue()`**: Sets the `value` property to `"/"`.
116
- - **`createOperand(ast)`**: Creates an `omdNode` instance for the numerator or denominator from its AST, attempting to preserve provenance.
117
-
118
- ## Example
119
-
120
- ```javascript
121
- import { omdRationalNode } from '@teachinglab/omd';
122
- import * as math from 'mathjs';
123
-
124
- // Create a fraction from a string
125
- const fraction = omdRationalNode.fromString('(a+b)/(a-b)');
126
-
127
- // Set font size and render
128
- fraction.setFontSize(28);
129
- fraction.initialize();
130
-
131
- // Evaluate with given variables
132
- const result = fraction.evaluate({ a: 3, b: 1 });
133
- console.log(result); // Output: 2 (since (3+1)/(3-1) = 4/2 = 2)
134
-
135
- // Add to an SVG container to display
136
- // const svgContainer = new jsvgContainer();
137
- // svgContainer.addChild(fraction);
138
- // document.body.appendChild(svgContainer.svgObject);
139
- ```
140
-
141
- ## See Also
142
-
143
- - [`omdNode`](./omdNode.md) - The base class.
144
- - [`omdConstantNode`](./omdConstantNode.md) - For constant numerators/denominators.
1
+ # omdRationalNode
2
+
3
+ Represents a fraction, with a numerator and a denominator, such as `1/2` or `(x+1)/(x-1)`. It handles the distinct visual layout of a fraction, with the numerator positioned above the denominator, separated by a horizontal line.
4
+
5
+ ## Class Definition
6
+
7
+ ```javascript
8
+ export class omdRationalNode extends omdNode
9
+ ```
10
+
11
+ ## Constructor
12
+
13
+ ### `new omdRationalNode(astNodeData)`
14
+
15
+ Creates a new `omdRationalNode` instance.
16
+
17
+ - **`astNodeData`** (`object`): The math.js AST for the division operation. It must be an `OperatorNode` with `op: '/'` and an `args` array containing two elements: the numerator and the denominator. The constructor also creates and initializes the visual `fractionLine`.
18
+
19
+ ## Static Methods
20
+
21
+ ### `fromString(expressionString)`
22
+
23
+ Creates an `omdRationalNode` from a string containing a division. Requires `window.math` (math.js) to be available globally for parsing.
24
+
25
+ - **`expressionString`** (`string`): The fractional expression as a string (e.g., `"x / 2"`, `"(a+b)/(a-b)"`).
26
+ - **Returns**: `omdRationalNode` - A new instance.
27
+ - **Throws**: `Error` if `math.js` is not available, if the string cannot be parsed, or if it does not represent a valid division expression.
28
+
29
+ ## Public Properties
30
+
31
+ - **`numerator`** (`omdNode`): The node representing the top part of the fraction.
32
+ - **`denominator`** (`omdNode`): The node representing the bottom part of the fraction.
33
+ - **`fractionLine`** (`jsvgLine`): The visual horizontal line separating the numerator and denominator.
34
+
35
+ ## Public Methods
36
+
37
+ ### `computeDimensions()`
38
+
39
+ Calculates the dimensions of the rational node. It scales down the font size of the numerator and denominator, computes their individual dimensions, and then determines the total width (maximum of numerator/denominator width plus spacing) and total height (sum of numerator, denominator, and padding for the fraction line).
40
+
41
+ - **Overrides**: `omdNode.computeDimensions()`.
42
+
43
+ ### `updateLayout()`
44
+
45
+ Updates the layout of the rational node. It positions the `numerator` at the top, the `fractionLine` in the middle, and the `denominator` at the bottom, ensuring they are horizontally centered and have appropriate vertical spacing.
46
+
47
+ - **Overrides**: `omdNode.updateLayout()`.
48
+
49
+ ### `getAlignmentBaseline()`
50
+
51
+ Calculates the vertical alignment point for the node. For a rational node, this is the y-position of the fraction bar, which serves as the visual baseline.
52
+
53
+ - **Overrides**: `omdNode.getAlignmentBaseline()`.
54
+
55
+ ### `isConstant()`
56
+
57
+ Checks if both the numerator and the denominator are constant numerical values.
58
+
59
+ - **Returns**: `boolean`.
60
+
61
+ ### `getRationalValue()`
62
+
63
+ Retrieves the rational value of the node as a numerator/denominator pair. This method only works if the fraction is constant.
64
+
65
+ - **Returns**: `{ num: number, den: number }`.
66
+ - **Throws**: `Error` if the rational node is not constant.
67
+
68
+ ### `getValue()`
69
+
70
+ Retrieves the numerical value of the rational node by dividing the numerator's value by the denominator's value. This method only works if the fraction is constant.
71
+
72
+ - **Returns**: `number`.
73
+ - **Throws**: `Error` if the rational node is not constant or if division by zero occurs.
74
+
75
+ ### `clone()`
76
+
77
+ Creates a deep, structural clone of the rational node, including its `numerator` and `denominator` nodes. The `fractionLine` is also recreated. The cloned node's `provenance` array is updated to include the original node's ID.
78
+
79
+ - **Returns**: `omdRationalNode` - A new, identical instance of the rational node.
80
+
81
+ ### `toMathJSNode()`
82
+
83
+ Converts the `omdRationalNode` back into its math.js AST representation. It creates an `OperatorNode` with `op: '/'` and `fn: 'divide'`, containing the converted numerator and denominator ASTs.
84
+
85
+ - **Returns**: `object` - A math.js `OperatorNode` for division. The returned object also includes a `clone` method for compatibility.
86
+
87
+ ### `toString()`
88
+
89
+ Converts the node to its string representation, adding parentheses around the numerator and/or denominator if they are complex expressions (e.g., binary expressions) to maintain correct order of operations.
90
+
91
+ - **Returns**: `string` - e.g., `"(x + 1) / (x - 1)"`.
92
+
93
+ ### `evaluate(variables)`
94
+
95
+ Evaluates the rational expression by evaluating the numerator and denominator and then performing the division.
96
+
97
+ - **`variables`** (`object`): A map of variable names to their values.
98
+ - **Returns**: `number` - The result of the division.
99
+ - **Throws**: `Error` if the denominator evaluates to zero.
100
+
101
+ ### `reduce()`
102
+
103
+ If the fraction is constant, this method reduces it to its lowest terms (e.g., `4/8` becomes `1/2`). If the reduced denominator is `1`, it returns an `omdConstantNode` representing the integer value. It uses a `gcd` (greatest common divisor) helper function internally.
104
+
105
+ - **Returns**: `omdRationalNode` | `omdConstantNode` - The reduced fraction node, or an `omdConstantNode` if it simplifies to an integer.
106
+
107
+ ### `isProper()`
108
+
109
+ Checks if the fraction is proper (the absolute value of the numerator is less than the absolute value of the denominator). This check only applies to constant fractions.
110
+
111
+ - **Returns**: `boolean` | `null` - `true` if proper, `false` if improper, `null` if the fraction is not constant.
112
+
113
+ ## Internal Methods
114
+
115
+ - **`parseValue()`**: Sets the `value` property to `"/"`.
116
+ - **`createOperand(ast)`**: Creates an `omdNode` instance for the numerator or denominator from its AST, attempting to preserve provenance.
117
+
118
+ ## Example
119
+
120
+ ```javascript
121
+ import { omdRationalNode } from '@teachinglab/omd';
122
+ import * as math from 'mathjs';
123
+
124
+ // Create a fraction from a string
125
+ const fraction = omdRationalNode.fromString('(a+b)/(a-b)');
126
+
127
+ // Set font size and render
128
+ fraction.setFontSize(28);
129
+ fraction.initialize();
130
+
131
+ // Evaluate with given variables
132
+ const result = fraction.evaluate({ a: 3, b: 1 });
133
+ console.log(result); // Output: 2 (since (3+1)/(3-1) = 4/2 = 2)
134
+
135
+ // Add to an SVG container to display
136
+ // const svgContainer = new jsvgContainer();
137
+ // svgContainer.addChild(fraction);
138
+ // document.body.appendChild(svgContainer.svgObject);
139
+ ```
140
+
141
+ ## See Also
142
+
143
+ - [`omdNode`](./omdNode.md) - The base class.
144
+ - [`omdConstantNode`](./omdConstantNode.md) - For constant numerators/denominators.
145
145
  - [`omdBinaryExpressionNode`](./omdBinaryExpressionNode.md) - For complex numerators/denominators.