Michael Czechowski
b9c90112a3
Implementation following plan: - S01: Foundation: schema, section config, and router - S02: Install CodeMirror JavaScript language support - S03: Create JavaScript lesson JSON files (variables, DOM, events) - S04: Register JavaScript lessons in module stores - S05: Add JavaScript validation logic - S06: Add JavaScript mode to LessonEngine preview rendering - S07: Add JavaScript mode to CodeEditor - S08: Update app.js for JavaScript mode support - S09: Update navigation HTML and CSS theming for JavaScript section - S10: Add section grouping headers in sidebar navigation - S11: Update and write tests
216 lines
6.2 KiB
JSON
216 lines
6.2 KiB
JSON
{
|
|
"$schema": "http://json-schema.org/draft-07/schema#",
|
|
"title": "Code Crispies Module Schema",
|
|
"description": "Schema for CSS course modules with lessons",
|
|
"type": "object",
|
|
"required": ["id", "title", "description", "difficulty", "lessons"],
|
|
"properties": {
|
|
"id": {
|
|
"type": "string",
|
|
"description": "Unique identifier for the module"
|
|
},
|
|
"title": {
|
|
"type": "string",
|
|
"description": "Title of the module"
|
|
},
|
|
"description": {
|
|
"type": "string",
|
|
"description": "Detailed description of the module content and purpose"
|
|
},
|
|
"mode": {
|
|
"type": "string",
|
|
"enum": ["css", "tailwind", "html", "markdown", "javascript"],
|
|
"description": "Whether this module teaches CSS, Tailwind, HTML, Markdown, or JavaScript"
|
|
},
|
|
"difficulty": {
|
|
"type": "string",
|
|
"enum": ["beginner", "intermediate", "advanced"],
|
|
"description": "Difficulty level of the module"
|
|
},
|
|
"lessons": {
|
|
"type": "array",
|
|
"description": "Collection of lessons within the module",
|
|
"minItems": 1,
|
|
"items": {
|
|
"type": "object",
|
|
"required": [
|
|
"id",
|
|
"title",
|
|
"description",
|
|
"task",
|
|
"previewHTML",
|
|
"previewBaseCSS",
|
|
"sandboxCSS",
|
|
"initialCode",
|
|
"previewContainer",
|
|
"validations"
|
|
],
|
|
"properties": {
|
|
"id": {
|
|
"type": "string",
|
|
"description": "Unique identifier for the lesson"
|
|
},
|
|
"title": {
|
|
"type": "string",
|
|
"description": "Title of the lesson"
|
|
},
|
|
"description": {
|
|
"type": "string",
|
|
"description": "Detailed description of the lesson content and concepts"
|
|
},
|
|
"mode": {
|
|
"type": "string",
|
|
"enum": ["css", "tailwind", "html", "markdown", "javascript"],
|
|
"description": "Override module mode for individual lessons"
|
|
},
|
|
"tailwindConfig": {
|
|
"type": "object",
|
|
"description": "Custom Tailwind configuration if needed"
|
|
},
|
|
"task": {
|
|
"type": "string",
|
|
"description": "The specific task instructions for the student to complete"
|
|
},
|
|
"previewHTML": {
|
|
"type": "string",
|
|
"description": "HTML content used for the interactive preview"
|
|
},
|
|
"previewBaseCSS": {
|
|
"type": "string",
|
|
"description": "Base CSS styles applied to the preview environment"
|
|
},
|
|
"sandboxCSS": {
|
|
"type": "string",
|
|
"description": "Additional CSS for the sandbox environment"
|
|
},
|
|
"initialCode": {
|
|
"type": "string",
|
|
"description": "Initial code provided in the editor"
|
|
},
|
|
"solution": {
|
|
"type": "string",
|
|
"description": "Solution code for the lesson, if applicable"
|
|
},
|
|
"solutionCode": {
|
|
"type": "string",
|
|
"description": "Expected correct code used to render the expected preview for comparison"
|
|
},
|
|
"previewContainer": {
|
|
"type": "string",
|
|
"description": "ID of the container element for the preview"
|
|
},
|
|
"validations": {
|
|
"type": "array",
|
|
"description": "Rules to validate user input",
|
|
"minItems": 1,
|
|
"items": {
|
|
"type": "object",
|
|
"required": ["type", "value", "message"],
|
|
"properties": {
|
|
"type": {
|
|
"type": "string",
|
|
"enum": [
|
|
"contains",
|
|
"contains_class",
|
|
"contains_pattern",
|
|
"not_contains",
|
|
"regex",
|
|
"property_value",
|
|
"syntax",
|
|
"custom",
|
|
"element_exists",
|
|
"element_count",
|
|
"attribute_value",
|
|
"element_text",
|
|
"parent_child",
|
|
"sibling"
|
|
],
|
|
"description": "Type of validation to perform"
|
|
},
|
|
"value": {
|
|
"description": "Value to check against, format depends on validation type. String for simple checks, object for complex validations.",
|
|
"oneOf": [
|
|
{
|
|
"type": "string"
|
|
},
|
|
{
|
|
"type": "boolean"
|
|
},
|
|
{
|
|
"type": "object",
|
|
"description": "Object format for property_value, element_count, attribute_value, element_text, parent_child validations",
|
|
"properties": {
|
|
"property": {
|
|
"type": "string",
|
|
"description": "CSS property name (for property_value)"
|
|
},
|
|
"expected": {
|
|
"type": "string",
|
|
"description": "Expected value (for property_value)"
|
|
},
|
|
"selector": {
|
|
"type": "string",
|
|
"description": "CSS selector to target element (for HTML validations)"
|
|
},
|
|
"count": {
|
|
"type": "integer",
|
|
"description": "Expected count of elements (for element_count)"
|
|
},
|
|
"min": {
|
|
"type": "integer",
|
|
"description": "Minimum count of elements (for element_count)"
|
|
},
|
|
"attr": {
|
|
"type": "string",
|
|
"description": "Attribute name to check (for attribute_value)"
|
|
},
|
|
"value": {
|
|
"description": "Expected attribute value (for attribute_value). Use true to check existence only."
|
|
},
|
|
"text": {
|
|
"type": "string",
|
|
"description": "Expected text content (for element_text)"
|
|
},
|
|
"parent": {
|
|
"type": "string",
|
|
"description": "Parent selector (for parent_child)"
|
|
},
|
|
"child": {
|
|
"type": "string",
|
|
"description": "Child selector (for parent_child)"
|
|
},
|
|
"first": {
|
|
"type": "string",
|
|
"description": "First sibling selector (for sibling)"
|
|
},
|
|
"then": {
|
|
"type": "string",
|
|
"description": "Following sibling selector (for sibling)"
|
|
}
|
|
}
|
|
}
|
|
]
|
|
},
|
|
"message": {
|
|
"type": "string",
|
|
"description": "Feedback message shown when validation fails"
|
|
},
|
|
"options": {
|
|
"type": "object",
|
|
"description": "Additional options for validation",
|
|
"properties": {
|
|
"caseSensitive": {
|
|
"type": "boolean",
|
|
"description": "Whether the validation should be case sensitive"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|