@khanacademy/perseus 3.0.0 → 4.0.0

package/src/widgets/__testdata__/interactive-graph_testdata.js

@@ -1,646 +0,0 @@
-// @flow
-
-import type {Coord} from "../../interactive2/types.js";
-import type {PerseusRenderer} from "../../perseus-types.js";
-
-// Data for the interactive graph widget
-
-export const angleQuestion: PerseusRenderer = {
-    content:
-        "**Drag the vertex of the angle to place the vertex at point $\\text{A}$.**  \n\n**Drag another point on the angle to make one of the rays go through point $\\text{B}$.**\n\n**Make the other ray go through one of the unlabeled black points to create an acute angle.**  \n*The arc symbol near the vertex indicates the angle being measured.*\n\n[[☃ interactive-graph 1]]",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            alignment: "default",
-            graded: true,
-            options: {
-                backgroundImage: {
-                    bottom: 0,
-                    height: 400,
-                    left: 0,
-                    scale: 1,
-                    url: "https://ka-perseus-graphie.s3.amazonaws.com/807ea77cf7031c1b9a45694083f05b5e09b01946.png",
-                    width: 400,
-                },
-                correct: {
-                    allowReflexAngles: false,
-                    angleOffsetDeg: 1,
-                    coords: [
-                        [2.2059851900220853, 2.2059851900220853],
-                        [-2, -2],
-                        [-4.973144353700384, 5.004289159600586],
-                    ],
-                    snapDegrees: 4,
-                    type: "angle",
-                },
-                graph: {
-                    allowReflexAngles: false,
-                    angleOffsetDeg: 1,
-                    snapDegrees: 4,
-                    type: "angle",
-                },
-                gridStep: [1, 1],
-                labels: ["x", "y"],
-                markings: "none",
-                range: [
-                    [-10, 10],
-                    [-10, 10],
-                ],
-                rulerLabel: "",
-                rulerTicks: 10,
-                showProtractor: false,
-                showRuler: false,
-                snapStep: [0.5, 0.5],
-                step: [1, 1],
-            },
-            static: false,
-            type: "interactive-graph",
-            version: {
-                major: 0,
-                minor: 0,
-            },
-        },
-    },
-};
-
-export const circleQuestion: PerseusRenderer = {
-    content:
-        "**Graph the circle $x^2+y^2+4x+8y+16=0$.**\n\n[[☃ interactive-graph 1]]",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            type: "interactive-graph",
-            alignment: "default",
-            static: false,
-            graded: true,
-            options: {
-                step: [1, 1],
-                markings: "graph",
-                labels: ["x", "y"],
-                showProtractor: false,
-                showRuler: false,
-                rulerLabel: "",
-                rulerTicks: 10,
-                range: [
-                    [-10, 10],
-                    [-10, 10],
-                ],
-                gridStep: [1, 1],
-                snapStep: [1, 1],
-                graph: {
-                    type: "circle",
-                },
-                correct: {
-                    type: "circle",
-                    center: [-2, -4],
-                    radius: 2,
-                },
-            },
-            version: {
-                major: 0,
-                minor: 0,
-            },
-        },
-    },
-};
-
-export const linearQuestion: PerseusRenderer = {
-    content:
-        "**Draw the line of reflection that will map $\\triangle{SIM}$ onto the other triangle below.**\n\n\n[[☃ interactive-graph 1]]",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            graded: true,
-            options: {
-                backgroundImage: {
-                    bottom: 0,
-                    height: 425,
-                    left: 0,
-                    scale: 1,
-                    url: "web+graphie://ka-perseus-graphie.s3.amazonaws.com/9b7c68fb9350531c023460f4abdc395522536b5a",
-                    width: 425,
-                },
-                correct: {
-                    coords: [
-                        [-1, 1],
-                        [0, -2],
-                    ],
-                    type: "linear",
-                },
-                graph: {
-                    type: "linear",
-                },
-                gridStep: [1, 1],
-                labels: ["x", "y"],
-                markings: "none",
-                range: [
-                    [-10, 10],
-                    [-10, 10],
-                ],
-                rulerLabel: "",
-                rulerTicks: 10,
-                showProtractor: false,
-                showRuler: false,
-                snapStep: [0.5, 0.5],
-                step: [1, 1],
-            },
-            type: "interactive-graph",
-            version: {
-                major: 0,
-                minor: 0,
-            },
-        },
-    },
-};
-
-export const linearSystemQuestion: PerseusRenderer = {
-    content:
-        "**Drag the lines so one line goes through points $\\text{A}$ and $\\text{B}$, and the other line goes through points $\\text{C}$  and $\\text{D}$.**  \n[[☃ interactive-graph 1]]",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            type: "interactive-graph",
-            alignment: "default",
-            static: false,
-            graded: true,
-            options: {
-                step: [1, 1],
-                backgroundImage: {
-                    url: "https://ka-perseus-graphie.s3.amazonaws.com/6a5f70a361f0f1baeef61eee6726eef944176663.png",
-                    scale: "1",
-                    bottom: 0,
-                    left: 0,
-                    width: 400,
-                    height: 400,
-                },
-                markings: "none",
-                labels: ["x", "y"],
-                showProtractor: false,
-                showRuler: false,
-                rulerLabel: "",
-                rulerTicks: 10,
-                range: [
-                    [-10, 10],
-                    [-10, 10],
-                ],
-                gridStep: [1, 1],
-                snapStep: [0.5, 0.5],
-                graph: {
-                    type: "linear-system",
-                },
-                correct: {
-                    type: "linear-system",
-                    coords: [
-                        [
-                            [-7, 7],
-                            [0, -2],
-                        ],
-                        [
-                            [-3, -7],
-                            [7, -3],
-                        ],
-                    ],
-                },
-            },
-            version: {
-                major: 0,
-                minor: 0,
-            },
-        },
-    },
-};
-
-export const pointQuestion: PerseusRenderer = {
-    content:
-        "We want to find the zeros of this polynomial:\n\n$p(x)=x(2x+5)(x+1)$\n\n**Plot all the zeros ($x$-intercepts) of the polynomial in the interactive graph.**\n\n[[\u2603 interactive-graph 1]]",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            graded: true,
-            version: {
-                major: 0,
-                minor: 0,
-            },
-            static: false,
-            type: "interactive-graph",
-            options: {
-                rulerTicks: 10,
-                showProtractor: false,
-                graph: {
-                    type: "point",
-                    numPoints: "unlimited",
-                },
-                snapStep: [0.5, 0.5],
-                labels: ["x", "y"],
-                step: [1, 1],
-                gridStep: [0.5, 0.5],
-                backgroundImage: {
-                    url: "web+graphie://ka-perseus-graphie.s3.amazonaws.com/9e825947f778170369f22da5f87239cbf4c1ebe3",
-                    width: 425,
-                    height: 425,
-                },
-                range: [
-                    [-4, 4],
-                    [-4, 4],
-                ],
-                showRuler: false,
-                markings: "none",
-                showTooltips: false,
-                rulerLabel: "",
-                correct: {
-                    coords: [
-                        [0, 0],
-                        [-2.5, 0],
-                        [-1, 0],
-                    ],
-                    numPoints: "unlimited",
-                    type: "point",
-                },
-            },
-            alignment: "default",
-        },
-    },
-};
-
-export const polygonQuestion: PerseusRenderer = {
-    content:
-        "**Drag the vertices of the triangle below to draw a right triangle with side lengths $3$, $4$, and $5$.** \n[[\u2603 interactive-graph 1]] \n",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            graded: true,
-            version: {
-                major: 0,
-                minor: 0,
-            },
-            static: false,
-            type: "interactive-graph",
-            options: {
-                rulerTicks: 10,
-                showProtractor: false,
-                graph: {
-                    showSides: true,
-                    snapTo: "grid",
-                    type: "polygon",
-                },
-                snapStep: [0.25, 0.25],
-                labels: ["x", "y"],
-                step: [0.5, 0.5],
-                gridStep: [0.5, 0.5],
-                backgroundImage: {
-                    scale: 1,
-                    bottom: 0,
-                    url: "",
-                    height: 0,
-                    width: 0,
-                    left: 0,
-                },
-                range: [
-                    [-1, 6],
-                    [-1, 6],
-                ],
-                showRuler: false,
-                markings: "none",
-                showTooltips: false,
-                rulerLabel: "",
-                correct: {
-                    showSides: true,
-                    type: "polygon",
-                    coords: [
-                        [3.5, 2],
-                        [3.5, 5],
-                        [-0.5, 2],
-                    ],
-                    match: "congruent",
-                    snapTo: "grid",
-                },
-            },
-            alignment: "default",
-        },
-    },
-};
-
-export const rayQuestion: PerseusRenderer = {
-    content:
-        "**Move the ray so it has an endpoint at point $\\text{B}$ and goes through point $\\text{A}$. Then complete the statement below.**\n\n[[☃ interactive-graph 1]]",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            alignment: "default",
-            graded: true,
-            options: {
-                backgroundImage: {
-                    bottom: 0,
-                    height: 400,
-                    left: 0,
-                    scale: "1",
-                    url: "https://ka-perseus-graphie.s3.amazonaws.com/140993e12589b317f7bdbd667555ef1c48b26911.png",
-                    width: 400,
-                },
-                correct: {
-                    coords: [
-                        [5, 3],
-                        [-5, -5],
-                    ],
-                    type: "ray",
-                },
-                graph: {
-                    type: "ray",
-                },
-                gridStep: [1, 1],
-                labels: ["x", "y"],
-                markings: "none",
-                range: [
-                    [-10, 10],
-                    [-10, 10],
-                ],
-                rulerLabel: "",
-                rulerTicks: 10,
-                showProtractor: false,
-                showRuler: false,
-                snapStep: [0.5, 0.5],
-                step: [1, 1],
-            },
-            static: false,
-            type: "interactive-graph",
-            version: {
-                major: 0,
-                minor: 0,
-            },
-        },
-    },
-};
-
-export const segmentQuestion: PerseusRenderer = {
-    content:
-        "Line segment $\\overline{OG}$ is rotated $180^\\circ$ about the point $(-2,4)$.  \n\n**Draw the image of this rotation using the interactive graph.**\n\n*The direction of a rotation by a positive angle is counter-clockwise.* \n\n[[☃ interactive-graph 1]]\n\n",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            graded: true,
-            options: {
-                backgroundImage: {
-                    bottom: 0,
-                    height: 425,
-                    left: 0,
-                    scale: 1,
-                    url: "web+graphie://ka-perseus-graphie.s3.amazonaws.com/567155d84afcfa01baf0a44afd994fce3df17b5c",
-                    width: 425,
-                },
-                correct: {
-                    coords: [
-                        [
-                            [-7, 7],
-                            [2, 5],
-                        ],
-                    ],
-                    type: "segment",
-                },
-                graph: {
-                    type: "segment",
-                },
-                gridStep: [1, 1],
-                labels: ["x", "y"],
-                markings: "none",
-                range: [
-                    [-10, 10],
-                    [-10, 10],
-                ],
-                rulerLabel: "",
-                rulerTicks: 10,
-                showProtractor: false,
-                showRuler: false,
-                snapStep: [0.5, 0.5],
-                step: [1, 1],
-            },
-            type: "interactive-graph",
-            version: {
-                major: 0,
-                minor: 0,
-            },
-        },
-    },
-};
-
-export const sinusoidQuestion: PerseusRenderer = {
-    content:
-        "**Graph $h(x)=3\\sin(2x-\\pi)+2$ in the interactive widget.**  \n*Note that one moveable point always defines an extremum point in the graph and the other point always defines a neighbouring intersection with the midline.*\n\n[[☃ interactive-graph 1]]",
-    images: {},
-    widgets: {
-        "interactive-graph 1": {
-            type: "interactive-graph",
-            alignment: "default",
-            static: false,
-            graded: true,
-            options: {
-                step: [1, 1],
-                backgroundImage: {
-                    url: "https://ka-perseus-graphie.s3.amazonaws.com/ba6cf7327a7aaed2386ca00d48b6d554a357ac57.png",
-                    scale: 1,
-                    bottom: 0,
-                    left: 0,
-                    width: 425,
-                    height: 425,
-                },
-                markings: "none",
-                labels: ["x", "y"],
-                showProtractor: false,
-                showRuler: false,
-                showTooltips: false,
-                rulerLabel: "",
-                rulerTicks: 10,
-                range: [
-                    [-10, 10],
-                    [-10, 10],
-                ],
-                gridStep: [1, 1],
-                snapStep: [0.5, 0.5],
-                graph: {
-                    type: "sinusoid",
-                },
-                correct: {
-                    type: "sinusoid",
-                    coords: [
-                        [1, 2],
-                        [1.5, 5],
-                    ],
-                },
-            },
-            version: {
-                major: 0,
-                minor: 0,
-            },
-        },
-    },
-};
-
-export const questionsAndAnswers: $ReadOnlyArray<
-    [
-        PerseusRenderer,
-        $ReadOnlyArray<Coord>, // Correct answer
-        $ReadOnlyArray<Coord>, // Incorrect answer
-    ],
-> = [
-    [
-        polygonQuestion,
-        [
-            [5.5, 2],
-            [1.5, 5],
-            [1.5, 2],
-        ],
-        [
-            // [1, 2],
-            // [1, 3],
-            // [3, 3],
-            [5.0, 2],
-            [1.5, 5],
-            [1.5, 2],
-        ],
-    ],
-    [
-        {
-            content:
-                "**Plot the image of triangle $\\triangle ABC$ under a reflection across line $\\ell$.**\n\n[[\u2603 interactive-graph 1]]",
-            images: {},
-            widgets: {
-                "interactive-graph 1": {
-                    graded: true,
-                    version: {
-                        major: 0,
-                        minor: 0,
-                    },
-                    static: false,
-                    type: "interactive-graph",
-                    options: {
-                        rulerTicks: 10,
-                        showProtractor: false,
-                        graph: {
-                            type: "polygon",
-                        },
-                        snapStep: [1, 1],
-                        labels: ["x", "y"],
-                        step: [1, 1],
-                        gridStep: [1, 1],
-                        backgroundImage: {
-                            url: "web+graphie://ka-perseus-graphie.s3.amazonaws.com/1aa858afa68530210704235a0134a165b4b66d43",
-                            width: 400,
-                            height: 400,
-                        },
-                        range: [
-                            [-8, 8],
-                            [-8, 8],
-                        ],
-                        showRuler: false,
-                        markings: "none",
-                        showTooltips: false,
-                        rulerLabel: "",
-                        correct: {
-                            type: "polygon",
-                            coords: [
-                                [-6, -7],
-                                [1, -4],
-                                [-3, -4],
-                            ],
-                        },
-                    },
-                    alignment: "default",
-                },
-            },
-        },
-        [
-            [-6, -7],
-            [1, -4],
-            [-3, -4],
-        ],
-        [
-            [-8, -7],
-            [1, -4],
-            [-3, -4],
-        ],
-    ],
-    [
-        pointQuestion,
-        [
-            [0, 0],
-            [-2.5, 0],
-            [-1, 0],
-        ],
-        [
-            [3, 0],
-            [-2.5, 0],
-            [-1, 0],
-        ],
-    ],
-    [
-        {
-            content:
-                "The graph below contains quadrilateral $TREK$ and the point $P(-8,-6)$.  \n  \n**Draw the image of quadrilateral $TREK$ under a dilation whose center is $P$ and scale factor is $3$.**  \n  \n[[\u2603 interactive-graph 1]]",
-            images: {},
-            widgets: {
-                "interactive-graph 1": {
-                    graded: true,
-                    version: {
-                        major: 0,
-                        minor: 0,
-                    },
-                    static: false,
-                    type: "interactive-graph",
-                    options: {
-                        rulerTicks: 10,
-                        showProtractor: false,
-                        graph: {
-                            numSides: "unlimited",
-                            snapTo: "grid",
-                            type: "polygon",
-                            showAngles: false,
-                        },
-                        snapStep: [1, 1],
-                        labels: ["x", "y"],
-                        step: [2, 2],
-                        gridStep: [1, 1],
-                        backgroundImage: {
-                            scale: 1,
-                            bottom: 0,
-                            url: "web+graphie://ka-perseus-graphie.s3.amazonaws.com/a1b7a05c177742523250b64a3995c9b37aac3399",
-                            height: 425,
-                            width: 425,
-                            left: 0,
-                        },
-                        range: [
-                            [-12, 12],
-                            [-8, 16],
-                        ],
-                        showRuler: false,
-                        markings: "none",
-                        rulerLabel: "",
-                        correct: {
-                            numSides: "unlimited",
-                            type: "polygon",
-                            coords: [
-                                [-5, 0],
-                                [4, 15],
-                                [4, 0],
-                                [1, 3],
-                            ],
-                            showAngles: false,
-                            snapTo: "grid",
-                        },
-                    },
-                    alignment: "default",
-                },
-            },
-        },
-        [
-            [-5, 0],
-            [4, 15],
-            [4, 0],
-            [1, 3],
-        ],
-        [
-            [-5, 0],
-            [0, 15],
-            [4, 0],
-            [1, 3],
-        ],
-    ],
-];

package/src/widgets/__testdata__/matcher_testdata.js

@@ -1,34 +0,0 @@
-// @flow
-import type {PerseusRenderer} from "../../perseus-types.js";
-
-export const question1: PerseusRenderer = {
-    content:
-        "**Match each claim with its supporting evidence.**\n\n[[\u2603 matcher 1]]",
-    images: {},
-    widgets: {
-        "matcher 1": {
-            version: {major: 0, minor: 0},
-            type: "matcher",
-            graded: true,
-            options: {
-                labels: ["**Claims**", "**Evidence**"],
-                padding: true,
-                orderMatters: false,
-                right: [
-                    "Medium-sized stars typically exist for roughly 10 billion years",
-                    "The current trajectory of the Earth\u2019s tectonic plate movement",
-                    "The life cycle of medium-sized stars includes a red giant stage and ends in a whimper as a white dwarf",
-                    "Rapid escalation of greenhouse gas emissions",
-                    "The current trajectory of the Milky Way galaxy and those in its immediate proximity",
-                ],
-                left: [
-                    "Our Sun will run out of fuel and die in around 5 billion years ",
-                    "Plate tectonics will rearrange the continents: the Pacific will narrow, bringing Australia closer to the Americas, and the Atlantic will expand to form the largest of the oceans ",
-                    "Our Sun will run out of hydrogen, swell into a red giant, gobble up the inner rocky planets, and then collapse and die ",
-                    "Average global temperatures will rise ",
-                    "In 3 to 4 billion years, our galaxy will begin a slow collision with its closest large neighbor, Andromeda ",
-                ],
-            },
-        },
-    },
-};

package/src/widgets/__testdata__/matrix_testdata.js

@@ -1,29 +0,0 @@
-// @flow
-import type {PerseusRenderer} from "../../perseus-types.js";
-
-export const question1: PerseusRenderer = {
-    content:
-        "**Perform the row operation, $R_3 \\leftrightarrow R_2$, on the following matrix.**\n\n$\\left[\\begin{array} {ccc}\n5 & -2 & 1 & 1 \\\\\n3 & 0 & 0 & -2 \\\\\n1 & 1 & 7 & -3 \\end{array} \\right] $\n\n[[\u2603 matrix 1]]\n",
-    images: {},
-    widgets: {
-        "matrix 1": {
-            graded: true,
-            version: {major: 0, minor: 0},
-            static: false,
-            type: "matrix",
-            options: {
-                cursorPosition: [0, 0],
-                suffix: "",
-                answers: [
-                    [5, -2, 1, 1],
-                    [1, 1, 7, -3],
-                    [3, 0, 0, -2],
-                ],
-                prefix: "",
-                static: false,
-                matrixBoardSize: [3, 4],
-            },
-            alignment: "default",
-        },
-    },
-};