-
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: worksheet subtraction fill in the blanks
Closes #76.
- Loading branch information
Showing
20 changed files
with
406 additions
and
70 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
37 changes: 37 additions & 0 deletions
37
cypress/integration/worksheet_subtraction_fill_in_the_blanks.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,37 @@ | ||
it('can create subtraction fill in the blanks worksheets', () => { | ||
cy.visitWorksheetSubtractionFillInTheBlanks(); | ||
|
||
cy.findByLabelText(/count/i).clearType('15'); | ||
|
||
cy.findByLabelText(/problem.+generation/i).should('have.value', 'minuend'); | ||
cy.findByLabelText(/blank position/i).select('Random'); | ||
cy.setNumberRange(/minuend/i, 3, 4); | ||
|
||
cy.withinPreview(() => { | ||
cy.contains(/[34]\s+-\s+[0-4]\s+=\s+_+/); | ||
cy.contains(/_+\s+-\s+[0-4]\s+=\s+\d/); | ||
}); | ||
|
||
cy.findByLabelText(/problem.+generation/i).select('Subtrahend and Difference'); | ||
cy.setNumberRange(/subtrahend/i, 3, 4); | ||
cy.setNumberRange(/difference/i, 5, 6); | ||
cy.findByLabelText(/count/i).clearType('28'); | ||
cy.findByLabelText(/columns/i).clearType('3'); | ||
cy.findByLabelText(/blank position/i).select('Difference'); | ||
|
||
cy.withinPreview(() => { | ||
// Problems | ||
cy.problemListItems() | ||
.should('have.length', 28) | ||
.each(($li) => { | ||
cy.wrap($li).contains(/([8-9]|10)\s+-\s+[3-6]\s+=\s+_+/); | ||
}); | ||
|
||
// Answers | ||
cy.answerListItems() | ||
.should('have.length', 28) | ||
.each(($li) => { | ||
cy.wrap($li).contains(/([8-9]|10)\s+-\s+[3-6]\s+=\s+\d/); | ||
}); | ||
}); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,54 @@ | ||
import { randomGenerator } from '../RandomNumberGenerator'; | ||
import tryByKey from '../tryByKey'; | ||
import Subtraction from './Subtraction'; | ||
import Range from '../Range'; | ||
|
||
export type ProblemGeneration = 'minuend' | 'subtrahend and difference'; | ||
|
||
export interface SubtractionProblemsProps { | ||
count: number; | ||
problemGeneration: ProblemGeneration; | ||
minuend: Range; | ||
subtrahend: Range; | ||
difference: Range; | ||
} | ||
|
||
export function generateProblemsFromMinuend(minuendRange: Range, count: number): Subtraction[] { | ||
const problems: Subtraction[] = []; | ||
const limitedRetries = tryByKey(); | ||
for (let i = 0; problems.length < count; i++) { | ||
const { from, to } = minuendRange; | ||
const minuend = randomGenerator.integer(to, from); | ||
const subtrahend = randomGenerator.integer(minuend, 0); | ||
limitedRetries(`${minuend}:${subtrahend}`, () => { | ||
problems.push(Subtraction.create({ minuend, subtrahend })); | ||
}); | ||
} | ||
return problems; | ||
} | ||
|
||
export function generateProblemsFromSubAndDiff( | ||
subRange: Range, | ||
diffRange: Range, | ||
count: number, | ||
): Subtraction[] { | ||
const problems: Subtraction[] = []; | ||
const limitedRetries = tryByKey(); | ||
for (let i = 0; problems.length < count; i++) { | ||
const subtrahend = randomGenerator.integer(subRange.to, subRange.from); | ||
const difference = randomGenerator.integer(diffRange.to, diffRange.from); | ||
limitedRetries(`${subtrahend}:${difference}`, () => { | ||
problems.push(Subtraction.create({ subtrahend, difference })); | ||
}); | ||
} | ||
return problems; | ||
} | ||
|
||
export default function generateSubtractionProblems({ | ||
count, problemGeneration, minuend, subtrahend, difference, | ||
}: SubtractionProblemsProps): Array<Subtraction> { | ||
if (problemGeneration === 'minuend') { | ||
return generateProblemsFromMinuend(minuend, count); | ||
} | ||
return generateProblemsFromSubAndDiff(subtrahend, difference, count); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
106 changes: 106 additions & 0 deletions
106
src/pages/subtractionFillInTheBlanks/CustomizeSubtractionFillInTheBlanksForm.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,106 @@ | ||
import React from 'react'; | ||
import { Divider } from '@material-ui/core'; | ||
import CustomizeForm from '../../components/forms/CustomizeForm'; | ||
import SubtractionFillInTheBlanksData, { | ||
BlankPosition, blankPositions, ProblemGeneration, problemGenerationOptions, | ||
} from './SubtractionFillInTheBlanksData'; | ||
import NumberField from '../../components/forms/NumberField'; | ||
import numberOrEmpty from '../../lib/numberOrEmpty'; | ||
import SelectField from '../../components/forms/SelectField'; | ||
import stringMapToOptions from '../../components/forms/stringMapToOptions'; | ||
import NumberRangeSlider from '../../components/forms/NumberRangeSlider'; | ||
import FontSizeField from '../../components/forms/FontSizeField'; | ||
|
||
interface CustomizeSubtractionFillInTheBlanksFormProps { | ||
onChange: (data: SubtractionFillInTheBlanksData) => void; | ||
data: SubtractionFillInTheBlanksData; | ||
} | ||
|
||
function CustomizeSubtractionFillInTheBlanksForm({ | ||
data, onChange, | ||
}: CustomizeSubtractionFillInTheBlanksFormProps): JSX.Element { | ||
const generationFields = data.problemGeneration === 'minuend' | ||
? ( | ||
<NumberRangeSlider | ||
label="Minuend" | ||
id="numberRangeMinuend" | ||
from={data.minuend.from} | ||
to={data.minuend.to} | ||
magnitude={2} | ||
onChange={(minuend) => onChange({ ...data, minuend })} | ||
/> | ||
) | ||
: ( | ||
<> | ||
<NumberRangeSlider | ||
label="Subtrahend" | ||
id="numberRangeSubtrahend" | ||
from={data.subtrahend.from} | ||
to={data.subtrahend.to} | ||
magnitude={2} | ||
onChange={(subtrahend) => onChange({ ...data, subtrahend })} | ||
/> | ||
<NumberRangeSlider | ||
label="Difference" | ||
id="numberRangeDifference" | ||
from={data.difference.from} | ||
to={data.difference.to} | ||
magnitude={2} | ||
onChange={(difference) => onChange({ ...data, difference })} | ||
/> | ||
</> | ||
); | ||
return ( | ||
<CustomizeForm name="Worksheet"> | ||
<NumberField | ||
name="count" | ||
label="Count" | ||
value={numberOrEmpty(data.count)} | ||
onChange={(count) => onChange({ ...data, count })} | ||
/> | ||
<SelectField | ||
name="problemGeneration" | ||
label="Problem Generation" | ||
value={data.problemGeneration} | ||
onChange={(value: unknown) => { | ||
onChange({ | ||
...data, | ||
problemGeneration: value as ProblemGeneration, | ||
}); | ||
}} | ||
> | ||
{stringMapToOptions(problemGenerationOptions)} | ||
</SelectField> | ||
|
||
{generationFields} | ||
|
||
<SelectField | ||
name="blankPosition" | ||
label="Blank Position" | ||
value={data.blankPosition} | ||
onChange={(value: unknown) => { | ||
onChange({ | ||
...data, | ||
blankPosition: value as BlankPosition, | ||
}); | ||
}} | ||
> | ||
{stringMapToOptions(blankPositions)} | ||
</SelectField> | ||
|
||
<Divider variant="middle" /> | ||
<NumberField | ||
name="columns" | ||
label="Columns" | ||
value={numberOrEmpty(data.columns)} | ||
onChange={(columns) => onChange({ ...data, columns })} | ||
/> | ||
<FontSizeField | ||
value={data.fontSize} | ||
onChange={(fontSize) => onChange({ ...data, fontSize })} | ||
/> | ||
</CustomizeForm> | ||
); | ||
} | ||
|
||
export default CustomizeSubtractionFillInTheBlanksForm; |
Oops, something went wrong.