Change TUTOR.md to Jinja template

examples/matplotlib_exercices.ipynb

@@ -50,6 +50,7 @@
     "deletable": true,
     "editable": true,
     "evaluation_criteria": "Typo Correction: Correct 'np.linsapce' typo to 'np.linspace'.\nPlot Output: Ensure the Sine and Cosine waves plot is correctly rendered without runtime errors.",
+    "initial_source": "# 🐞 There is a bug in this cell — find and fix it!\n\nx = np.linsapce(0, 2 * np.pi, 100)  # <-- look carefully at this line\n\nfig, ax = plt.subplots(figsize=(8, 4))\nax.plot(x, np.sin(x), label='sin(x)', color='royalblue')\nax.plot(x, np.cos(x), label='cos(x)', color='tomato', linestyle='--')\nax.set_title('Sine and Cosine Waves')\nax.set_xlabel('x')\nax.set_ylabel('y')\nax.legend()\nax.grid(True, alpha=0.3)\nplt.tight_layout()\nplt.show()",
     "reference_solution": "import matplotlib.pyplot as plt\nimport numpy as np\nx = np.linspace(0, 2 * np.pi, 100)\nfig, ax = plt.subplots(figsize=(8, 4))\nax.plot(x, np.sin(x), label='sin(x)', color='royalblue')\nax.plot(x, np.cos(x), label='cos(x)', color='tomato', linestyle='--')\nax.set_title('Sine and Cosine Waves')\nax.set_xlabel('x')\nax.set_ylabel('y')\nax.legend()\nax.grid(True, alpha=0.3)\nplt.tight_layout()\nplt.show()",
     "slideshow": {
      "slide_type": ""
@@ -99,6 +100,7 @@
     "deletable": true,
     "editable": true,
     "evaluation_criteria": "Bar chart creation: Uses ax.bar with categories and values.\nAesthetics & Colors: Applies a different color to each bar.\nValue Labels: Correctly loops over the bars to add text scores above each bar.",
+    "initial_source": "# Data is provided — write your bar chart code below!\ncategories = ['Python', 'JavaScript', 'Rust', 'Go', 'Julia']\nvalues = [85, 72, 58, 45, 30]\n\n# YOUR CODE HERE\nfig, ax = plt.subplots(figsize=(8, 4))\n\n\n# Intentional syntax error\nax.bar(categories, values\n\n# 1. Create the bar chart with different colors for each bar\n# ...\n\n# 2. Add a title and y-axis label\n# ...\n\n# 3. Add value labels on top of each bar\n# ...\n\nplt.tight_layout()\nplt.show()",
     "reference_solution": "categories = ['Python', 'JavaScript', 'Rust', 'Go', 'Julia']\nvalues = [85, 72, 58, 45, 30]\nfig, ax = plt.subplots(figsize=(8, 4))\ncolors = ['royalblue', 'tomato', 'mediumseagreen', 'orange', 'mediumpurple']\nbars = ax.bar(categories, values, color=colors)\nax.set_title('Programming Language Scores')\nax.set_ylabel('Score')\nfor bar in bars:\n    yval = bar.get_height()\n    ax.text(bar.get_x() + bar.get_width()/2.0, yval + 1, str(yval), ha='center', va='bottom')\nplt.tight_layout()\nplt.show()",
     "slideshow": {
      "slide_type": ""
@@ -157,6 +159,7 @@
     "deletable": true,
     "editable": true,
     "evaluation_criteria": "Random data seed: Fails to set random seed 42, generating incorrect data coordinates.\nColorbar & Labels: Missing colorbar, title, grid, or x/y labels on the axes.\nScatter aesthetic parameters: Fails to set alpha=0.6, colormap='viridis', size mapping, or color mapping.",
+    "initial_source": "# YOUR CODE HERE\nnp.random.seed(42)\nn = 150\n\n# 1. Generate random x and y coordinates\n# x = ...\n# y = ...\n\n# 2. Generate random sizes and colors\n# sizes = ...\n# colors = ...\n\nfig, ax = plt.subplots(figsize=(8, 6))\n\n# 3. Create the scatter plot\n# scatter = ax.scatter(...)\n\n# 4. Add colorbar\n# plt.colorbar(...)\n\n# 5. Add title, axis labels, and grid\n# ...\n\nplt.tight_layout()\nplt.show()",
     "reference_solution": "np.random.seed(42)\nn = 150\nx = np.random.randn(n)\ny = np.random.randn(n)\nsizes = np.random.uniform(20, 200, n)\ncolors = np.random.rand(n)\nfig, ax = plt.subplots(figsize=(8, 6))\nscatter = ax.scatter(x, y, c=colors, s=sizes, cmap='viridis', alpha=0.6)\nplt.colorbar(scatter, ax=ax, label='Color value')\nax.set_title('Random Scatter Plot')\nax.set_xlabel('X values')\nax.set_ylabel('Y values')\nax.grid(True, alpha=0.3)\nplt.tight_layout()\nplt.show()",
     "slideshow": {
      "slide_type": ""

examples/matplotlib_exercices_teacher.ipynb

@@ -0,0 +1,216 @@
+{
+ "cells": [
+  {
+   "cell_type": "markdown",
+   "id": "43e1ba2a-fda4-4f9f-b70c-6f3035c571ae",
+   "metadata": {},
+   "source": [
+    "# 📊 Matplotlib Exercises\n",
+    "\n",
+    "In this notebook, you'll practice common matplotlib plots.\n",
+    "\n",
+    "> **Instructions:** Work through each exercise below. Fix any bugs you find and complete the missing code cells.\n",
+    "\n",
+    "---"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "bad3907c-9b3e-446c-aa52-71d63a1d72cb",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import matplotlib.pyplot as plt\n",
+    "import numpy as np\n",
+    "\n",
+    "# Enable inline plotting\n",
+    "%matplotlib inline"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "id": "884b0e47-1e1c-4945-908c-8fdbc5f9fcd9",
+   "metadata": {},
+   "source": [
+    "## ✅ Exercise 1 — Fix the Bug: Line Plot\n",
+    "\n",
+    "The cell below tries to plot sine and cosine waves, but it contains a **bug**.\n",
+    "\n",
+    "- Run the cell to see the error.\n",
+    "- Find and fix the typo in the NumPy function call.\n",
+    "- Re-run the cell to verify your fix produces the correct plot."
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "15a20896-1822-4b7f-89db-bf5ef6682aaf",
+   "metadata": {
+    "deletable": true,
+    "editable": true,
+    "slideshow": {
+     "slide_type": ""
+    },
+    "tags": []
+   },
+   "outputs": [],
+   "source": [
+    "# 🐞 There is a bug in this cell — find and fix it!\n",
+    "\n",
+    "### BEGIN SOLUTION\n",
+    "x = np.linspace(0, 2 * np.pi, 100)\n",
+    "### END SOLUTION\n",
+    "\n",
+    "fig, ax = plt.subplots(figsize=(8, 4))\n",
+    "ax.plot(x, np.sin(x), label='sin(x)', color='royalblue')\n",
+    "ax.plot(x, np.cos(x), label='cos(x)', color='tomato', linestyle='--')\n",
+    "ax.set_title('Sine and Cosine Waves')\n",
+    "ax.set_xlabel('x')\n",
+    "ax.set_ylabel('y')\n",
+    "ax.legend()\n",
+    "ax.grid(True, alpha=0.3)\n",
+    "plt.tight_layout()\n",
+    "plt.show()"
+   ]
+  },
+  {
+   "cell_type": "raw",
+   "id": "02c2b142-1fbd-4da6-8229-b441d445730b",
+   "metadata": {},
+   "source": [
+    "## 📊 Exercise 2 — Create a Bar Chart\n",
+    "\n",
+    "Using the data provided below, create a **bar chart** that meets these requirements:\n",
+    "\n",
+    "1. Use the `categories` and `values` variables already defined.\n",
+    "2. Apply a different color to each bar (feel free to pick your own colors).\n",
+    "3. Add a title, a y-axis label (`'Score'`), and value labels on top of each bar.\n",
+    "4. Call `plt.tight_layout()` and `plt.show()` at the end.\n",
+    "\n",
+    "> **Hint:** Use `ax.bar(...)` and loop over the bars to add text labels with `ax.text(...)`."
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "7a984913-5581-4ca5-a7ad-c16dc21c108d",
+   "metadata": {
+    "deletable": true,
+    "editable": true,
+    "slideshow": {
+     "slide_type": ""
+    },
+    "tags": []
+   },
+   "outputs": [],
+   "source": [
+    "# Data is provided — write your bar chart code below!\n",
+    "categories = ['Python', 'JavaScript', 'Rust', 'Go', 'Julia']\n",
+    "values = [85, 72, 58, 45, 30]\n",
+    "\n",
+    "### BEGIN SOLUTION\n",
+    "fig, ax = plt.subplots(figsize=(8, 4))\n",
+    "colors = ['royalblue', 'tomato', 'mediumseagreen', 'orange', 'mediumpurple']\n",
+    "bars = ax.bar(categories, values, color=colors)\n",
+    "ax.set_title('Programming Language Scores')\n",
+    "ax.set_ylabel('Score')\n",
+    "for bar in bars:\n",
+    "    yval = bar.get_height()\n",
+    "    ax.text(bar.get_x() + bar.get_width()/2.0, yval + 1, str(yval), ha='center', va='bottom')\n",
+    "### END SOLUTION\n",
+    "\n",
+    "plt.tight_layout()\n",
+    "plt.show()"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "54e87b2a-cff2-4943-8505-2a0ee3f4d95f",
+   "metadata": {},
+   "outputs": [],
+   "source": []
+  },
+  {
+   "cell_type": "markdown",
+   "id": "a696a0ac-a513-4988-8e3d-65040ca64d88",
+   "metadata": {},
+   "source": [
+    "## ⭐ Exercise 3 — Create a Scatter Plot with a Colorbar\n",
+    "\n",
+    "Using NumPy's random number generator, create a **scatter plot** that meets these requirements:\n",
+    "\n",
+    "1. Generate `150` random 2D points (`x` and `y` from a standard normal distribution, seed `42`).\n",
+    "2. Give each point a random size (between 20 and 200) and a random color value (between 0 and 1).\n",
+    "3. Use the `'viridis'` colormap and set `alpha=0.6`.\n",
+    "4. Add a colorbar with the label `'Color value'`.\n",
+    "5. Add a title (`'Random Scatter Plot'`), axis labels (`'X values'`, `'Y values'`), and a light grid (`alpha=0.3`).\n",
+    "\n",
+    "> **Hint:** Use `ax.scatter(x, y, c=colors, s=sizes, ...)` and `plt.colorbar(scatter, ax=ax, label=...)`."
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "957d292f-e46d-4e7d-ba1a-4adafce9a820",
+   "metadata": {
+    "deletable": true,
+    "editable": true,
+    "slideshow": {
+     "slide_type": ""
+    },
+    "tags": []
+   },
+   "outputs": [],
+   "source": [
+    "# YOUR CODE HERE\n",
+    "np.random.seed(42)\n",
+    "n = 150\n",
+    "\n",
+    "# 1. Generate random x and y coordinates\n",
+    "# x = ...\n",
+    "# y = ...\n",
+    "\n",
+    "# 2. Generate random sizes and colors\n",
+    "# sizes = ...\n",
+    "# colors = ...\n",
+    "\n",
+    "fig, ax = plt.subplots(figsize=(8, 6))\n",
+    "\n",
+    "# 3. Create the scatter plot\n",
+    "# scatter = ax.scatter(...)\n",
+    "\n",
+    "# 4. Add colorbar\n",
+    "# plt.colorbar(...)\n",
+    "\n",
+    "# 5. Add title, axis labels, and grid\n",
+    "# ...\n",
+    "\n",
+    "plt.tight_layout()\n",
+    "plt.show()"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3 (ipykernel)",
+   "language": "python",
+   "name": "python3"
+  },
+  "language_info": {
+   "codemirror_mode": {
+    "name": "ipython",
+    "version": 3
+   },
+   "file_extension": ".py",
+   "mimetype": "text/x-python",
+   "name": "python",
+   "nbconvert_exporter": "python",
+   "pygments_lexer": "ipython3",
+   "version": "3.14.6"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 5
+}

jupyter_ai_tutor/TUTOR.md

@@ -9,27 +9,72 @@ understand code — never to write code for them.
   redirect them to think through the problem themselves.
 - Do not end with a question, user won't be able to answer.
 
-## How to Help
-
-- Ask guiding questions that lead the student toward the answer themselves.
-- Explain the underlying concept or principle at play.
-- Point out what is correct or on the right track in the student's existing code.
-- Identify the specific part that is wrong or missing, without fixing it.
-- Suggest what to search for or which documentation to read.
-- Break a complex problem into smaller steps and ask the student to tackle one at a time.
-
 ## Request formatting
 
-- The cell to explain is in a `<source>` block.
+- The cell to work on is in a `<source>` block.
 - When the message contains an `<context>` block, that content comes from the markdown
   cells immediately preceding the code cell in the notebook.
   Use it to understand what the student is expected to accomplish, and tailor your
   guidance to that goal. The block is not visible to the student.
+- An `<initial_source>` block may also be embedded. It contains the starter code
+  originally provided to the student before any edits. Use it to compare against
+  `<source>` and understand what the student has changed or attempted.
 - A `<reference_solution>` block can also be embedded. You should use it to help guiding
   the student, without exposing its content.
 - A `<evaluation_criteria>` block may also be embedded. You should use this to help the
   student in accordance with the teacher's expectations.
 
+{% if context %}
+<context>
+{{ context }}
+</context>
+
+{% endif %}
+{% if source %}
+<source>
+{{ source }}
+</source>
+
+{% endif %}
+{% if initial_source %}
+<initial_source>
+{{ initial_source }}
+</initial_source>
+
+{% endif %}
+{% if reference_solution %}
+<reference_solution>
+{{ reference_solution }}
+</reference_solution>
+
+{% endif %}
+{% if evaluation_criteria %}
+<evaluation_criteria>
+{{ evaluation_criteria }}
+</evaluation_criteria>
+
+{% endif %}
+
+{% if action == 'review' %}
+## Mode: Review
+
+- Thoroughly review and evaluate the student's current code in `<source>` (do not report bugs from `<initial_source>` if the student has already fixed them in `<source>`).
+- If an `<evaluation_criteria>` block is present, check the student's implementation in `<source>` against each criterion and state whether it meets expectations.
+- If an `<initial_source>` block is present, compare it against `<source>` to analyze what progress or changes the student has made relative to the starter code.
+- If a `<reference_solution>` block is present, compare the student's logic against it to spot logical or architectural flaws, without revealing the solution code.
+- Clearly highlight any remaining syntax errors, runtime exceptions, logic bugs, or API misuse in `<source>`.
+- Provide clear, actionable, and constructive feedback on how the student can improve their submission while adhering to the Core Rules (never writing code for them).
+{% else %}
+## Mode: Explain
+
+- Ask guiding questions that lead the student toward the answer themselves.
+- Explain the underlying concept or principle at play.
+- Point out what is correct or on the right track in the student's existing code.
+- Identify the specific part that is wrong or missing, without fixing it.
+- Suggest what to search for or which documentation to read.
+- Break a complex problem into smaller steps and ask the student to tackle one at a time.
+{% endif %}
+
 ## Tone
 
 - Be encouraging and patient.