grades.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Lab 6: Grades Function Planner</title>
    <link rel="icon" type="image/png" href="favicon.png" />
    <link rel="shortcut icon" href="favicon.ico" />
    <style>
        body { margin: 0; padding: 0; }
        #planner {
            position: absolute;
            top: 0; left: 0;
            bottom: 0; right: 0;
            overflow: hidden;
        }
    </style>
    <script type="module">
    import init from "./function-planner.js";
    const initialModel = {
        functions: [
            {
                key: 1,
                name: "main",
                io: "indirect",
            },
            {
                key: 2,
                name: "read_list_of_students",
                desc: "Read all of the names of students from the given file into a list.",
                params: [],
                returns: [{"type": "list[str]", "desc": "the student names from the file"}],
                io: "none",
                testable: false,
                code: "with open(\"students.txt\") as file:\n    return [line.strip() for line in file]",
            },
            {
                key: 3,
                name: "get_new_grade",
                desc: "Get a new grade for the given student from the user. It is required to be an int between 0 and 100. If the user enters an invalid grade, they will be shown an error and prompted to enter a new one.",
                params: [{"name": "student_name", "type": "str", "desc": "the student to get a grade for"}],
                returns: [{"type": "int", "desc": "the new grade for the student"}],
                io: "validation",
                testable: false,
                code: "while True:\n    try:\n        grade = int(input(f\"Enter the grade for {student_name}: \"))\n        if 0 <= grade <= 100:\n            return grade\n        else:\n            print(\"Grade must be between 0 and 100.\")\n    except ValueError:\n        print(\"Grade must be a number.\")",
            },
            {
                key: 4,
                name: "median",
                desc: "Calculate the median of the given list of grades.",
                params: [{"name": "list_of_grades", "type": "list[int]", "desc": "the grades to calculate the median of"}],
                returns: [{"type": "float", "desc": "the median of the grades"}],
                io: "none",
                testable: true,
                testCode: "assert grades.median([1, 2, 3]) == 2\nassert grades.median([100, 1, 3]) == 3\nassert grades.median([1]) == 1\nassert grades.median([2, 1]) == 1.5\nassert grades.median([1, 2]) == 1.5\nassert grades.median([0, 0]) == 0\nassert grades.median([100, -1, 100, 100]) == 100\nassert grades.median([0, 100, 100, 0]) == 50\n",
            }
        ],
        calls: [{from: 1, to: 2}]
    };
    window.addEventListener('DOMContentLoaded', () => {
        init('planner', "grades", {
            initialModel: initialModel,
            allowedTypes: ['int', 'float', 'str', 'bool', 'list'],
            minFunctions: 8,
            minTestable: 3,
            adminMode: false,
            showCodeFor: '^(read_list_of_students|get_new_grade)$',
            showTestCodeFor: '^median$',
            functionReadOnly: [
                { for: '^main$', fields: ['name', 'desc', 'params', 'returns'] },
                { for: '^read_list_of_students$', fields: true },
                {
                    for: '^get_new_grade$',
                    fields: ['name', 'desc', 'params', 'returns', 'io', 'testable', 'code'],
                },
                {
                    for: '^median$',
                    fields: ['name', 'desc', 'params', 'returns', 'io', 'testable', 'testCode'],
                },
            ],
        });
    });
    </script>
</head>
<body>
    <div id="planner"></div>
</body>
</html>