cs10 · chrishtr · Apr 16, 2021 · Apr 20, 2021 · Aug 15, 2021 · Aug 15, 2021
diff --git a/.gitignore b/.gitignore
@@ -5,4 +5,5 @@
 *Thumbs.db*
 .project
 .tm_properties
-.gitmodules
+.gitmodules
+www/*
diff --git a/Makefile b/Makefile
@@ -0,0 +1,15 @@
+.PHONY: site copy
+
+PANDOC=pandoc --from markdown --to html --fail-if-warnings course.md --metadata title="title" --metadata-file=config.json 
+SOURCES=index.html course/ cur/ glossary/ topic/
+EXTRAS=img llab.js llab/css/ llab/fonts/ llab/html llab/img/ llab/lib llab/script llab/loader.js
+
+# Copies the existing content into the www/ folder subdirectories.
+copy:
+	cp -r --parents ${SOURCES} ${EXTRAS} www/bjc-r/
+
+# Processes each HTML file as a template. If any template markers are present
+# in the file, they will be replaced with data from config.json. Otherwise they
+# will be unchanged.
+site: copy
+	find ${SOURCES} -name "*.html" | xargs -I {} -n 1 ${PANDOC} --template {} -o www/bjc-r/{}
diff --git a/config.json b/config.json
@@ -0,0 +1,8 @@
+{
+	"css": [
+		"/bjc-r/llab/lib/bootstrap/dist/css/bootstrap.min.css",
+		"/bjc-r/llab/lib/bootstrap/dist/css/bootstrap-theme.min.css",
+		"/bjc-r/llab/css/default.css"
+	],
+	"js": ["/bjc-r/llab/loader.js"]
+}
diff --git a/course.md b/course.md
diff --git a/course/cs10_sp21.html b/course/cs10_sp21.html
@@ -2,9 +2,14 @@
 <html>
   <head>
       <title>CS10 Labs | Spring 2021 | UC Berkeley </title>
+      $for(css)$ 
+        <link rel="stylesheet" href="$css$"/>
+      $endfor$
+      $for(js)$ 
+        <script src="$js$"/>
+      $endfor$
 
       <!-- keep these libraries for any bjc course you write, add others as necessary -->
-      <script src="/bjc-r/llab/loader.js" type="text/javascript"></script>
   </head>
 
     <body>

diff --git a/cur/programming/libraries/Moviepy/MoviePy-intro.html b/cur/programming/libraries/Moviepy/MoviePy-intro.html
@@ -27,10 +27,10 @@ <h3>Downloading MoviePy</h3>
       </p>
       <p><pre><code>
 (For Mac - in the code below you can also replace 'python3' with 'python' if you have an older version)
-Alonzos-Laptop:~ alonzo$ python3 -m pip install moviepy
+Alonzos-Laptop:~ alonzo$$ python3 -m pip install moviepy
 
 (For Windows)
-Alonzos-Laptop:~ alonzo$ py -m pip install moviepy
+Alonzos-Laptop:~ alonzo$$ py -m pip install moviepy
     </code></pre></p>
     <p>
       That is all that is necessary to get the MoviePy Library onto your device! Next you will need to download

diff --git a/cur/programming/python/csed_python/open_python.html b/cur/programming/python/csed_python/open_python.html
@@ -48,7 +48,7 @@ <h3>Running Python</h3>
             If the text cursor is on a line beginning with <code>>>></code>, the command line window has an active python interpreter open. <b>That means we can't do commands like <code>cd</code>, or <code>ls</code>, because the program is expecting Python code.</b> To leave the python interpreter, type the exit command <code>exit()</code> and press <code>enter</code>.
         <p><pre><code>
 >>> exit()
-Alonzos-MacBook:~ alonzo$
+Alonzos-MacBook:~ alonzo$$
         </code></pre></p>
         <p>
             Any functions or variables created in the python interpreter are erased when the <code>exit()</code> command is run.

diff --git a/cur/programming/python/finding_a_bar.html b/cur/programming/python/finding_a_bar.html
@@ -18,7 +18,7 @@
             Now it's time to seriously write some code. Start by right clicking on this <a href="/bjc-r/prog/python/virus.py">link</a> and select save as. Make sure to save this file to the PythonLab1 directory that we made earlier. Head back to the shell and enter the <code>ls</code> command to make sure that the file made it into our PythonLab1 directory.
         </p>
         <p><pre><code>
-Alonzos-MacBook:PythonLab1 alonzo$ ls
+Alonzos-MacBook:PythonLab1 alonzo$$ ls
 virus.py
         </code></pre></p>
         <p>
@@ -31,13 +31,13 @@
             Head back to the shell and you can try running this file by entering <code>python3 virus.py</code> as shown below:
         </p>
         <p><pre><code>
-Alonzos-MacBook:PythonLab1 alonzo$ python3 virus.py
+Alonzos-MacBook:PythonLab1 alonzo$$ python3 virus.py
         </code></pre></p>
         <p>
             Next try running the first exercise by entering <code>python3 virus.py first_even_nums 5</code> (if it's working this should print the first 5 even numbers, starting with the number 2):
         </p>
         <p><pre><code>
-Alonzos-MacBook:PythonLab1 alonzo$ python3 virus.py first_even_nums 5
+Alonzos-MacBook:PythonLab1 alonzo$$ python3 virus.py first_even_nums 5
 2
 4
 6
@@ -47,7 +47,7 @@
             Uh oh...it looks like we've only printed the first 4 even numbers. Head back to Sublime and edit the function called <code>first_even_nums</code> so that we get the correct behavior:
         </p>
                 <p><pre><code>
-Alonzos-MacBook:PythonLab1 alonzo$ python3 virus.py first_even_nums 5
+Alonzos-MacBook:PythonLab1 alonzo$$ python3 virus.py first_even_nums 5
 2
 4
 6

diff --git a/cur/programming/python/hug_text_processing/python_basic_files.html b/cur/programming/python/hug_text_processing/python_basic_files.html
@@ -30,7 +30,7 @@
         Run this file and you should see something mysterious that looks something like:
       </p>
 
-    <pre><code>$ python word_analyzer.py
+    <pre><code>$$ python word_analyzer.py
 <_io.TextIOWrapper name='horse_ebooks.txt' mode='r' encoding='UTF-8'></code></pre>
 
  <p class="alert quoteBlue">
@@ -47,7 +47,7 @@
     Try running word_analyzer.py, and you should get a print out of the contents of the file "horse_ebooks.txt".
     </p>
 
-    <pre><code>$ python word_analyzer.py
+    <pre><code>$$ python word_analyzer.py
 Fruits and Vegetables and Vegetables on a Budget and Vegetables at a Store and Vegetables to Clean Fruit and Vegetables</code></pre>
 
     <p>If we look to the Python code, <code>f.read()</code> is the important part. <code>read</code> is a function that is built into every file object (just like <code>.append</code> is built into any list and <code>.join</code> is built into any string). Here, we're telling the file object to give us the information in the file for which it is responsible (horse_ebooks.txt). Note that this was not possible in Snap<em>!</em>, given the restrictions that our web browser places on the Snap<em>!</em> interpreter.

diff --git a/cur/programming/python/hug_text_processing/python_language_games.html b/cur/programming/python/hug_text_processing/python_language_games.html
@@ -41,7 +41,7 @@ <h3>Pig Latin</h3>
 		 <p>
 		 	Try running word_analyzer.py, and you should get: 
 		 </p>
-		 <pre><code>$ python word_analyzer.py
+		 <pre><code>$$ python word_analyzer.py
 Ellohay</code></pre>
 	<h3> -izzle Speak </h3>
 	<p>
@@ -117,7 +117,7 @@ <h3> Higher Order Manipulation </h3>
 	 <pre><code>text = read_file("text_processing/gettysburg.txt")
 print(apply_language_game(text, izzle))
 	 </code></pre> 
-     <pre><code>$ python word_analyzer.py
+     <pre><code>$$ python word_analyzer.py
 Foizzle scorizzle izzle sevizzle yeizzle agizzle oizzle fathizzle broizzle ...</code></pre>
 
 </html>
diff --git a/cur/programming/python/hug_text_processing/python_text_processing_intro.html b/cur/programming/python/hug_text_processing/python_text_processing_intro.html
@@ -35,11 +35,11 @@
           <li>Download the data for this lab from <a href="/bjc-r/prog/python/text_processing.zip">this link</a>. 
           </li>
           <li>Unzip this file into the datalab folder. You can unzip this file through the command line by using the  <code>unzip</code> command.
-            <pre><code>$ unzip text_processing.zip
-$ ls
+            <pre><code>$$ unzip text_processing.zip
+$$ ls
 text_processing.zip  text_processing
-$ cd text_processing
-$ ls
+$$ cd text_processing
+$$ ls
 beatles.txt     nietzsche.txt
 democratic_debate_2015.txt  presedential_debate_2016.txt
 ee_cummings.txt     republican_debate_2015.txt

diff --git a/cur/programming/python/hug_text_processing/python_top_words.html b/cur/programming/python/hug_text_processing/python_top_words.html
@@ -52,7 +52,7 @@
 
     <pre>
       <code>
-$ python word_analyzer.py
+$$ python word_analyzer.py
 ['on', 'Budget', 'to', 'Fruit', 'Clean', 'Fruits', 'Store', 'at', 'a', 'and', 'Vegetables']
 </code>
     </pre>

diff --git a/cur/programming/python/introduction-to-the-terminal.html b/cur/programming/python/introduction-to-the-terminal.html
@@ -23,7 +23,7 @@ <h2>Opening a Terminal</h2>
           If you're on one of the lab computers or on your own Mac, search for the application Terminal and open it. If you're using Windows, search for cmd.exe instead. After you open the program, you should have a window that has <em>something</em> like this in it:
         </p>
         <p><pre><code>
-Alonzos-MacBook:~ alonzo$
+Alonzos-MacBook:~ alonzo$$
       </code></pre></p>
         <p>
           The little bit of text that's already in the window is called the <b>prompt</b>. It gives you a bit of information about the computer that you're on. When you type commands, they appear to the right of the prompt.
@@ -36,7 +36,7 @@ <h3><code>ls</code>: listing contents of a directory</h3>
           To see what's in the current directory, we can use the command <code>ls</code> (use <code>dir</code> instead if on Windows). The <code>ls</code> command lists the contents of our current directory. To use a command, type it in the terminal, then press 'enter'. Try it out. You should see something like this:
         </p>
         <p><pre><code>
-Alonzos-MacBook:~ alonzo$ ls
+Alonzos-MacBook:~ alonzo$$ ls
 Applications		Downloads	Pictures
 Library			Public		Music
 Desktop			Movies		Documents
@@ -46,8 +46,8 @@ <h3><code>cd</code>: navigating to another directory</h3>
           We can see that the home directory has some other directories in it, such as <code>Documents</code> and <code>Desktop</code>. If we want to go into one of those directories, we can use the command <code>cd</code>, followed by that directory's name. Try it out by using the command <code>cd Documents</code>.
         </p>
         <p><pre><code>
-Alonzos-MacBook:~ alonzo$ cd Documents
-Alonzos-MacBook:Documents alonzo$
+Alonzos-MacBook:~ alonzo$$ cd Documents
+Alonzos-MacBook:Documents alonzo$$
         </code></pre></p>
         <p>
           Now you're in the <code>Documents</code> directory. We can use <code>ls</code> again to see the contents of <code>Documents</code>.
@@ -56,23 +56,23 @@ <h3><code>cd</code>: navigating to another directory</h3>
           How can we get back to the home directory from here? <code>cd ..</code> moves us upward one directory, which puts us back in home. The "dot dot" always means "parent directory". This means we can use <code>cd ..</code> to go to upward one directory. Try it out!
         </p>
         <p><pre><code>
-Alonzos-MacBook:Documents alonzo$ cd ..
-Alonzos-MacBook:~ alonzo$
+Alonzos-MacBook:Documents alonzo$$ cd ..
+Alonzos-MacBook:~ alonzo$$
         </code></pre></p>
         <h3><code>mkdir</code>: making a new directory</h3>
         <p>
           Okay, now that we've tried that, let's go back to <code>Documents</code>. (If you're in <code>home</code>, use the command <code>cd Documents</code>). You're probably used to making new folders on your computer by using a menu action like "File > New Folder", or a keyboard shortcut like "shift-cmd-N". To make a new directory (folder) using the terminal, we can use the command <code>mkdir</code> followed by the name we want for the new directory. Try the command <code>mkdir PythonLab1</code>.
         </p>
         <p><pre><code>
-Alonzos-MacBook:~ alonzo$ cd Documents
-Alonzos-MacBook:Documents alonzo$ mkdir PythonLab1
+Alonzos-MacBook:~ alonzo$$ cd Documents
+Alonzos-MacBook:Documents alonzo$$ mkdir PythonLab1
 				</code></pre></p>
         <p>
           Nice! now use <code>ls</code> to confirm that your directory has been created! We can use <code>cd PythonLab1</code> to go into our new directory.
         </p>
         <p><pre><code>
-Alonzos-MacBook:Documents alonzo$ cd PythonLab1
-Alonzos-MacBook:PythonLab1 alonzo$
+Alonzos-MacBook:Documents alonzo$$ cd PythonLab1
+Alonzos-MacBook:PythonLab1 alonzo$$
 				</code></pre></p>
 
         <p class="alert alert-info quoteBlue">

diff --git a/cur/programming/python/open_python.html b/cur/programming/python/open_python.html
@@ -30,7 +30,7 @@ <h3>Running Python</h3>
             The first step is to open the Python <b>interpreter</b>. On the command line in your terminal, use the command <code>python3</code>. If you see something like "command not found", then use the command <code>python</code> instead. You should see something similar to the following:
         </p>
         <p><pre><code>
-Alonzos-MacBook:~ alonzo$ python3
+Alonzos-MacBook:~ alonzo$$ python3
 Python 3.4.0 (v3.4.0:04f714765c13, Month DD YYYY, HH:MM:SS)
 [GCC X.X.X] on darwin
 Type "help", "copyright", "credits" or "license" for more information.
@@ -50,7 +50,7 @@ <h3>Running Python</h3>
             If the text cursor is on a line beginning with <code>>>></code>, the command line window has an active python interpreter open. <b>That means we can't do commands like <code>cd</code>, or <code>ls</code>, because the program is expecting Python code.</b> To leave the python interpreter, type the exit command <code>exit()</code> and press <code>enter</code>.
         <p><pre><code>
 >>> exit()
-Alonzos-MacBook:~ alonzo$
+Alonzos-MacBook:~ alonzo$$
         </code></pre></p>
         <p>
             Any functions or variables created in the python interpreter are erased when the <code>exit()</code> command is run.
@@ -68,4 +68,4 @@ <h3>Running Python</h3>
         </p>
 
     </body>
-</html>
+</html>
diff --git a/cur/programming/python/parsons/exponent.html b/cur/programming/python/parsons/exponent.html
@@ -64,7 +64,7 @@ <h2>Exercise 2: Exponents</h2>
             }
         } 
 
-        $(document).ready(function(){
+        $$(document).ready(function(){
             var parson = new ParsonsWidget({
                 'sortableId': 'sortable',
                 'trashId': 'sortableTrash',
@@ -73,15 +73,15 @@ <h2>Exercise 2: Exponents</h2>
             });
             parson.init(initial);
             parson.shuffleLines();
-            $("#newInstanceLink").click(function(event){
+            $$("#newInstanceLink").click(function(event){
                 event.preventDefault();
                 parson.shuffleLines();
             });
-            $("#feedbackLink").click(function(event){
+            $$("#feedbackLink").click(function(event){
                 event.preventDefault();
                 parson.getFeedback("exponent");
             });
-            $("#exportLink").click(function(event){
+            $$("#exportLink").click(function(event){
                 event.preventDefault();
                 parson.export("exponent.py");
             });

diff --git a/cur/programming/python/parsons/hello_world.html b/cur/programming/python/parsons/hello_world.html
@@ -48,7 +48,7 @@ <h2>Exercise 0: Hello World</h2>
             }
         } 
 
-        $(document).ready(function(){
+        $$(document).ready(function(){
             var parson = new ParsonsWidget({
                 'sortableId': 'sortable',
                 'trashId': 'sortableTrash',
@@ -57,15 +57,15 @@ <h2>Exercise 0: Hello World</h2>
             });
             parson.init(initial);
             parson.shuffleLines();
-            $("#newInstanceLink").click(function(event){
+            $$("#newInstanceLink").click(function(event){
                 event.preventDefault();
                 parson.shuffleLines();
             });
-            $("#feedbackLink").click(function(event){
+            $$("#feedbackLink").click(function(event){
                 event.preventDefault();
                 parson.getFeedback("hello_world");
             });
-            $("#exportLink").click(function(event){
+            $$("#exportLink").click(function(event){
                 event.preventDefault();
                 parson.export("hello_world.py");
             });

diff --git a/cur/programming/python/parsons/palindrome.html b/cur/programming/python/parsons/palindrome.html
@@ -57,7 +57,7 @@ <h2>Exercise 3: Palindrome</h2>
             }
         } 
 
-        $(document).ready(function(){
+        $$(document).ready(function(){
             var parson = new ParsonsWidget({
                 'sortableId': 'sortable',
                 'trashId': 'sortableTrash',
@@ -66,15 +66,15 @@ <h2>Exercise 3: Palindrome</h2>
             });
             parson.init(initial);
             parson.shuffleLines();
-            $("#newInstanceLink").click(function(event){
+            $$("#newInstanceLink").click(function(event){
                 event.preventDefault();
                 parson.shuffleLines();
             });
-            $("#feedbackLink").click(function(event){
+            $$("#feedbackLink").click(function(event){
                 event.preventDefault();
                 parson.getFeedback("palindrome");
             });
-            $("#exportLink").click(function(event){
+            $$("#exportLink").click(function(event){
                 event.preventDefault();
                 parson.export("palindrome.py");
             });

diff --git a/cur/programming/python/parsons/sum_all_numbers.html b/cur/programming/python/parsons/sum_all_numbers.html
@@ -64,7 +64,7 @@ <h2>Exercise 1: Sum All Numbers</h2>
             }
         } 
 
-        $(document).ready(function(){
+        $$(document).ready(function(){
             var parson = new ParsonsWidget({
                 'sortableId': 'sortable',
                 'trashId': 'sortableTrash',
@@ -73,15 +73,15 @@ <h2>Exercise 1: Sum All Numbers</h2>
             });
             parson.init(initial);
             parson.shuffleLines();
-            $("#newInstanceLink").click(function(event){
+            $$("#newInstanceLink").click(function(event){
                 event.preventDefault();
                 parson.shuffleLines();
             });
-            $("#feedbackLink").click(function(event){
+            $$("#feedbackLink").click(function(event){
                 event.preventDefault();
                 parson.getFeedback("sum_all_numbers");
             });
-            $("#exportLink").click(function(event){
+            $$("#exportLink").click(function(event){
                 event.preventDefault();
                 parson.export("sum_all_numbers.py");
             });

diff --git a/cur/programming/python/run_a_python_script.html b/cur/programming/python/run_a_python_script.html
@@ -40,7 +40,7 @@ <h3>Running a Python File</h3>
            Now, let's run the file with Python. Head back to your terminal, and use the commands you learned earlier to navigate to the <code>PythonLab1</code> directory we made earlier. Once you are there, use the <code>ls</code> command to verify that <code>lab1.py</code> is there!
         </p>
         <p><pre><code>
-Alonzos-MacBook:PythonLab1 alonzo$ ls
+Alonzos-MacBook:PythonLab1 alonzo$$ ls
 lab1.py
         </code></pre></p>
         <p>
@@ -53,7 +53,7 @@ <h3>Interactive Mode</h3>
         <p>
           Did you notice that after the command <code>python3 lab1.py</code>, the prompt was back to something like:
         </p>
-        <p><code>Alonzos-MacBook:PythonLab1 alonzo$</code>?</p>
+        <p><code>Alonzos-MacBook:PythonLab1 alonzo$$</code>?</p>
         <p>
           This means that even though we opened Python to run our program, Python exited when it was done. Sometimes, we'd like to stay in Python after we run a file!
         </p>
-Original file line number
+Diff line change
@@ Expand Up / @@ -52,7 +52,7 @@ @@
         <pre>
           <code>
-    $ python word_analyzer.py
+    $$ python word_analyzer.py
     ['on', 'Budget', 'to', 'Fruit', 'Clean', 'Fruits', 'Store', 'at', 'a', 'and', 'Vegetables']
     </code>
         </pre>
@@ Expand Down @@