Skip to content

Commit

Permalink
Support for setup code in Parsons Problems
Browse files Browse the repository at this point in the history
  • Loading branch information
@dolsysmith
dolsysmith committed Aug 28, 2023
1 parent 77c4a7c commit 764b6e2
Show file tree
Hide file tree
Showing 11 changed files with 94 additions and 49 deletions.
4 changes: 3 additions & 1 deletion course_utils/parsons_builder.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,9 @@ def load_yaml(yaml_files):
yield None
else:
# Strips leading/trailing whitespace from the code block and split on line breaks
parsons_dict['python_code'] = parsons_dict['python_code'].strip().split('\n')
for key in ('python_code', 'python_setup'):
if key in parsons_dict:
parsons_dict[key] = parsons_dict[key].strip().split('\n')
# Randomize code order
shuffle(parsons_dict['python_code'])
yield file, parsons_dict
Expand Down
1 change: 0 additions & 1 deletion course_utils/postprocessing.py
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import json
import re
from copy import deepcopy
import click
from pathlib import Path
import logging
Expand Down
2 changes: 2 additions & 0 deletions requirements.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ greenlet==2.0.2
guzzle-sphinx-theme==0.7.11
imagesize==1.4.1
importlib-metadata==6.7.0
Jinja2==3.1.2
jupyter-book==0.15.1
jupyter-cache==0.6.1
jupyter-contrib-core==0.4.2
Expand All @@ -27,6 +28,7 @@ nbclient==0.7.4
pybtex==0.24.0
pybtex-docutils==1.0.2
pydata-sphinx-theme==0.13.3
PyYAML==6.0
snowballstemmer==2.2.0
Sphinx==5.0.2
sphinx-book-theme==1.0.1
Expand Down
16 changes: 15 additions & 1 deletion textbook/_templates/parsons-layout.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,21 @@ <h2 class="problem-statement">
<li>Click the <strong>Reset</strong> button to clear the code space on the right and start over.</li>
</header>
<main>
<section id="python-input"">
<section id="python-setup">
{% if parsons.python_setup %}
<h2>Problem Setup</h2>
<div class="parsons-setup">
<p>Assume that the following code has run already in this session.</p>
<!-- <pre> blocks need to be left aligned in order to respect white space -->
<pre><code id="setup-code">
{% for line in parsons.python_setup %}
{{ line }}
{% endfor %}
</code></pre>
</div>
{% endif %}
</section>
<section id="python-input">
<h2>Compose your code here</h2>
<div class="parsons-container">
<div class="parsons-column-ps">
Expand Down
11 changes: 8 additions & 3 deletions textbook/parsons-assets/parsons-problems/css/parsons.css
View file
Original file line number Diff line number Diff line change
@@ -1,10 +1,15 @@
.problem-statement {
font-size: 22;
font-size: 22px;
}

.instructions, .parsons-setup {
font-size: 18px;
}

.parsons-setup > pre {
margin-left: 20px;
margin-top: -30px; /* Gets rid of excess white space at top of code block */

.instructions {
font-size: 18;
}
.parsons-container {
display: grid;
Expand Down
13 changes: 8 additions & 5 deletions textbook/parsons-assets/parsons-problems/html/homework-1-1.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,10 @@ <h2 class="problem-statement">
<li>Click the <strong>Reset</strong> button to clear the code space on the right and start over.</li>
</header>
<main>
<section id="python-input"">
<section id="python-setup">

</section>
<section id="python-input">
<h2>Compose your code here</h2>
<div class="parsons-container">
<div class="parsons-column-ps">
Expand All @@ -33,25 +36,25 @@ <h2>Compose your code here</h2>

<div class="parsons-ps">
<div class="parsons-block" id="pb-2" draggable="true">
price_num = price[1:]
book_prices = ['$55.99', '$119.95', '$13.95']
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-3" draggable="true">
for price in book_prices:
price_num = float(price_num) * 1.1
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-4" draggable="true">
book_prices = ['$55.99', '$119.95', '$13.95']
price_num = price[1:]
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-5" draggable="true">
price_num = float(price_num) * 1.1
for price in book_prices:
</div>
</div>

Expand Down
42 changes: 21 additions & 21 deletions textbook/parsons-assets/parsons-problems/html/homework-1-2.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,44 +20,53 @@ <h2 class="problem-statement">
<li>Click the <strong>Reset</strong> button to clear the code space on the right and start over.</li>
</header>
<main>
<section id="python-input"">
<section id="python-setup">

<h2>Problem Setup</h2>
<div class="parsons-setup">
<p>Assume that the following code has run already in this session.</p>
<pre><code id="setup-code">

courses = ['CHEM 1001 10', 'CHEM 1001 11', 'BISC 1111 10', 'BISC 2207 10', 'PSC 1001 10',

'PSC 1001 11', 'PSC 1001 12', 'ANTH 3808 10', 'AMST 2071 80']

</code></pre>
</div>

</section>
<section id="python-input">
<h2>Compose your code here</h2>
<div class="parsons-container">
<div class="parsons-column-ps">

<div class="parsons-ps">
<div class="parsons-block" id="pb-1" draggable="true">
course_info = course.split()
print(depts)
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-2" draggable="true">
depts.append(course_info[0])
course_info = course.split()
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-3" draggable="true">
depts = []
depts.append(course_info[0])
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-4" draggable="true">
for course in courses:
depts = []
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-5" draggable="true">
courses = ['CHEM 1001 10', 'BISC 1111 10', 'BISC 2207 10']
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-6" draggable="true">
print(depts)
for course in courses:
</div>
</div>

Expand Down Expand Up @@ -110,15 +119,6 @@ <h2>Compose your code here</h2>

</div>

<div class="parsons-row-ss" id="ss-row-6">


<div class="parsons-ss" id="ss-6-1"></div>

<div class="parsons-ss" id="ss-6-2"></div>

</div>

</div>
</div>
<div class="parsons-controller">
Expand Down
25 changes: 14 additions & 11 deletions textbook/parsons-assets/parsons-problems/html/homework-2-GR.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,68 +20,71 @@ <h2 class="problem-statement">
<li>Click the <strong>Reset</strong> button to clear the code space on the right and start over.</li>
</header>
<main>
<section id="python-input"">
<section id="python-setup">

</section>
<section id="python-input">
<h2>Compose your code here</h2>
<div class="parsons-container">
<div class="parsons-column-ps">

<div class="parsons-ps">
<div class="parsons-block" id="pb-1" draggable="true">
courses_db.append(course_dict)
course_dict['section'] = course_info[2]
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-2" draggable="true">
course_info = course.split()
courses_db.append(course_dict)
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-3" draggable="true">
course_dict['dept'] = course_info[0]
courses = ['CHEM 1001 10', 'CHEM 1002, 10', 'CHEM 1002 11', 'BISC 1100 10']
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-4" draggable="true">
print(courses_db)
courses_db = []
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-5" draggable="true">
course_dict['course'] = course_info[1]
for course in courses:
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-6" draggable="true">
course_dict = {}
course_dict['dept'] = course_info[0]
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-7" draggable="true">
for course in courses:
course_dict['course'] = course_info[1]
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-8" draggable="true">
courses_db = []
print(courses_db)
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-9" draggable="true">
course_dict['section'] = course_info[2]
course_dict = {}
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-10" draggable="true">
courses = ['CHEM 1001 10', 'CHEM 1002, 10', 'CHEM 1002 11', 'BISC 1100 10']
course_info = course.split()
</div>
</div>

Expand Down
9 changes: 6 additions & 3 deletions textbook/parsons-assets/parsons-problems/html/lessons-2-1-1.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,10 @@ <h2 class="problem-statement">
<li>Click the <strong>Reset</strong> button to clear the code space on the right and start over.</li>
</header>
<main>
<section id="python-input"">
<section id="python-setup">

</section>
<section id="python-input">
<h2>Compose your code here</h2>
<div class="parsons-container">
<div class="parsons-column-ps">
Expand All @@ -39,13 +42,13 @@ <h2>Compose your code here</h2>

<div class="parsons-ps">
<div class="parsons-block" id="pb-3" draggable="true">
print(team)
for person in team:
</div>
</div>

<div class="parsons-ps">
<div class="parsons-block" id="pb-4" draggable="true">
for person in team:
print(team)
</div>
</div>

Expand Down
16 changes: 14 additions & 2 deletions textbook/parsons-assets/parsons-problems/js/parsons.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -153,6 +153,16 @@ async function runPyodide(codeLines, pyodidePromise) {
}
}

async function runPyodideSetup(pyodidePromise) {
// Runs any setup code that should be executed in global scope, before the solution is executed
let setupCode = document.querySelector("#setup-code");

if (setupCode){
let pyodide = await pyodidePromise;
await pyodide.runPython(setupCode.textContent);
}
}

function handlePyException(excProxy) {
// Handles a dict returned from the Python reformat_exception function
function extractLineNo(tbArray) {
Expand Down Expand Up @@ -268,15 +278,17 @@ window.addEventListener("DOMContentLoaded", async () => {
// button to trigger code execution
const button = document.querySelector(".parsons-submit");

button.addEventListener("click", (event) => {
button.addEventListener("click", async (event) => {
// clear output area before running new code
clearOutput();
let codeToRun = parseParsonsCode();
runPyodide(codeToRun, pyodidePromise);
await runPyodide(codeToRun, pyodidePromise);
});

document.querySelector(".parsons-reset").addEventListener("click", resetProblem);

await runPyodideSetup(pyodidePromise);

});

function getPreviousSiblings(elem, filter) {
Expand Down
4 changes: 3 additions & 1 deletion textbook/parsons-yaml/homework-1-2.yml
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
python_setup: |
courses = ['CHEM 1001 10', 'CHEM 1001 11', 'BISC 1111 10', 'BISC 2207 10', 'PSC 1001 10',
'PSC 1001 11', 'PSC 1001 12', 'ANTH 3808 10', 'AMST 2071 80']
python_code: |
courses = ['CHEM 1001 10', 'BISC 1111 10', 'BISC 2207 10']
depts = []
for course in courses:
course_info = course.split()
Expand Down

0 comments on commit 764b6e2

Please sign in to comment.