Fixed two critical bugs preventing ten-frames from rendering: 1. **Mastery mode not handled** (typstGenerator.ts:61) - Code only checked for 'smart' | 'manual' modes - Mastery mode fell into manual path, tried to use boolean flags that don't exist - Resulted in all display options being `undefined` - Fix: Check for both 'smart' OR 'mastery' modes (both use displayRules) 2. **Typst array membership syntax** (already fixed in previous commit) - Used `(i in array)` which doesn't work in Typst - Changed to `array.contains(i)` Added comprehensive unit tests (tenFrames.test.ts): - Problem analysis tests (regrouping detection) - Display rule evaluation tests - Full Typst template generation tests - Mastery mode specific tests - All 14 tests now passing Added debug logging to trace display rules resolution: - displayRules.ts: Shows rule evaluation per problem - typstGenerator.ts: Shows enriched problems and Typst data - Helps diagnose future issues The issue was that mastery mode (which uses displayRules like smart mode) was being treated as manual mode (which uses boolean flags), resulting in undefined display options. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
198 lines
5.7 KiB
TypeScript
198 lines
5.7 KiB
TypeScript
// Script to generate multi-digit (>2 digits) worksheet examples for the blog post
|
|
// Shows how scaffolding adapts to different digit ranges
|
|
|
|
import fs from 'fs'
|
|
import path from 'path'
|
|
import { generateWorksheetPreview } from '../src/app/create/worksheets/addition/generatePreview'
|
|
|
|
// Output directory
|
|
const outputDir = path.join(process.cwd(), 'public', 'blog', 'multi-digit-examples')
|
|
|
|
// Ensure output directory exists
|
|
if (!fs.existsSync(outputDir)) {
|
|
fs.mkdirSync(outputDir, { recursive: true })
|
|
}
|
|
|
|
// Generate examples showing different digit ranges and adaptive scaffolding
|
|
const examples = [
|
|
{
|
|
name: 'two-digit-addition',
|
|
filename: 'two-digit.svg',
|
|
description: '2-digit addition (baseline)',
|
|
config: {
|
|
operator: 'addition' as const,
|
|
pAllStart: 0.0,
|
|
pAnyStart: 0.5,
|
|
digitRange: { min: 2, max: 2 },
|
|
mode: 'manual' as const,
|
|
displayRules: {
|
|
carryBoxes: 'always' as const,
|
|
answerBoxes: 'always' as const,
|
|
placeValueColors: 'never' as const,
|
|
tenFrames: 'never' as const,
|
|
problemNumbers: 'always' as const,
|
|
cellBorders: 'always' as const,
|
|
},
|
|
showBorrowNotation: false,
|
|
showBorrowingHints: false,
|
|
showCarryBoxes: true,
|
|
},
|
|
},
|
|
{
|
|
name: 'three-digit-with-colors',
|
|
filename: 'three-digit-colors.svg',
|
|
description: '3-digit addition with place value colors',
|
|
config: {
|
|
operator: 'addition' as const,
|
|
pAllStart: 0.0,
|
|
pAnyStart: 0.5,
|
|
digitRange: { min: 3, max: 3 },
|
|
mode: 'manual' as const,
|
|
displayRules: {
|
|
carryBoxes: 'always' as const,
|
|
answerBoxes: 'always' as const,
|
|
placeValueColors: 'always' as const,
|
|
tenFrames: 'never' as const,
|
|
problemNumbers: 'always' as const,
|
|
cellBorders: 'always' as const,
|
|
},
|
|
showBorrowNotation: false,
|
|
showBorrowingHints: false,
|
|
showCarryBoxes: true,
|
|
showPlaceValueColors: true,
|
|
},
|
|
},
|
|
{
|
|
name: 'four-digit-addition',
|
|
filename: 'four-digit.svg',
|
|
description: '4-digit addition with adaptive scaffolding',
|
|
config: {
|
|
operator: 'addition' as const,
|
|
pAllStart: 0.0,
|
|
pAnyStart: 0.6,
|
|
digitRange: { min: 4, max: 4 },
|
|
mode: 'manual' as const,
|
|
displayRules: {
|
|
carryBoxes: 'always' as const,
|
|
answerBoxes: 'always' as const,
|
|
placeValueColors: 'always' as const,
|
|
tenFrames: 'never' as const,
|
|
problemNumbers: 'always' as const,
|
|
cellBorders: 'always' as const,
|
|
},
|
|
showBorrowNotation: false,
|
|
showBorrowingHints: false,
|
|
showCarryBoxes: true,
|
|
showPlaceValueColors: true,
|
|
},
|
|
},
|
|
{
|
|
name: 'five-digit-addition',
|
|
filename: 'five-digit.svg',
|
|
description: '5-digit addition (maximum complexity)',
|
|
config: {
|
|
operator: 'addition' as const,
|
|
pAllStart: 0.3,
|
|
pAnyStart: 0.8,
|
|
digitRange: { min: 5, max: 5 },
|
|
mode: 'manual' as const,
|
|
displayRules: {
|
|
carryBoxes: 'always' as const,
|
|
answerBoxes: 'always' as const,
|
|
placeValueColors: 'always' as const,
|
|
tenFrames: 'never' as const,
|
|
problemNumbers: 'always' as const,
|
|
cellBorders: 'always' as const,
|
|
},
|
|
showBorrowNotation: false,
|
|
showBorrowingHints: false,
|
|
showCarryBoxes: true,
|
|
showPlaceValueColors: true,
|
|
},
|
|
},
|
|
{
|
|
name: 'mixed-digit-range',
|
|
filename: 'mixed-range.svg',
|
|
description: 'Mixed problem sizes (2-4 digits)',
|
|
config: {
|
|
operator: 'addition' as const,
|
|
pAllStart: 0.0,
|
|
pAnyStart: 0.5,
|
|
digitRange: { min: 2, max: 4 },
|
|
mode: 'manual' as const,
|
|
displayRules: {
|
|
carryBoxes: 'always' as const,
|
|
answerBoxes: 'always' as const,
|
|
placeValueColors: 'always' as const,
|
|
tenFrames: 'never' as const,
|
|
problemNumbers: 'always' as const,
|
|
cellBorders: 'always' as const,
|
|
},
|
|
showBorrowNotation: false,
|
|
showBorrowingHints: false,
|
|
showCarryBoxes: true,
|
|
showPlaceValueColors: true,
|
|
},
|
|
},
|
|
{
|
|
name: 'three-digit-subtraction',
|
|
filename: 'three-digit-subtraction.svg',
|
|
description: '3-digit subtraction with borrowing',
|
|
config: {
|
|
operator: 'subtraction' as const,
|
|
pAllStart: 0.0,
|
|
pAnyStart: 0.8,
|
|
digitRange: { min: 3, max: 3 },
|
|
mode: 'manual' as const,
|
|
displayRules: {
|
|
carryBoxes: 'never' as const,
|
|
answerBoxes: 'always' as const,
|
|
placeValueColors: 'always' as const,
|
|
tenFrames: 'never' as const,
|
|
problemNumbers: 'always' as const,
|
|
cellBorders: 'always' as const,
|
|
},
|
|
showBorrowNotation: true,
|
|
showBorrowingHints: false,
|
|
},
|
|
},
|
|
] as const
|
|
|
|
console.log('Generating multi-digit example worksheets...\n')
|
|
|
|
for (const example of examples) {
|
|
console.log(`Generating ${example.description}...`)
|
|
|
|
const config = {
|
|
...example.config,
|
|
problemsPerPage: 4,
|
|
pages: 1,
|
|
cols: 2,
|
|
seed: 54321, // Fixed seed for consistent examples
|
|
}
|
|
|
|
try {
|
|
const result = generateWorksheetPreview(config)
|
|
|
|
if (!result.success || !result.pages || result.pages.length === 0) {
|
|
console.error(`Failed to generate ${example.name}:`, result.error)
|
|
console.error(`Details:`, result.details)
|
|
continue
|
|
}
|
|
|
|
// Get the first page's SVG
|
|
const svg = result.pages[0]
|
|
|
|
// Save to file
|
|
const outputPath = path.join(outputDir, example.filename)
|
|
fs.writeFileSync(outputPath, svg, 'utf-8')
|
|
|
|
console.log(` ✓ Saved to ${outputPath}`)
|
|
} catch (error) {
|
|
console.error(` ✗ Error generating ${example.name}:`, error)
|
|
}
|
|
}
|
|
|
|
console.log('\nDone! Multi-digit example worksheets generated.')
|
|
console.log(`\nFiles saved to: ${outputDir}`)
|