Section 18 Interactive Coding

                                          <section xml:id="section-interactive-code">

                                            <title>Interactive Coding</title>

                                            <introduction>

                                              <p>
More interactive components, just for testing, no commentary.
                                              </p>

                                            </introduction>

                                            <subsection>

                                              <title>ActiveCode</title>

                                              <p>
ActiveCode, Python program.
                                              </p>

                                              <listing xml:id="program-activecode-python">

                                                <title>An interactive Python program, using

                                                <pubtitle>Runestone</pubtitle>

                                                </title>

                                                <program xml:id="python-hello-world" label="python-hello-world" interactive="activecode" language="python">

                                                  <code>
                        print("Hello, World!")
                                                  </code>

                                                </program>

                                              </listing>

                                              <listing xml:id="program-activecode-python-no-codelens">

                                                <title>An interactive Python program without codelens.</title>

                                                <program xml:id="python-hello-world-no-codelens" label="python-hello-world-no-codelens" interactive="activecode" language="python" codelens="no">

                                                  <code>
                        print("Hello, World!")
                                                  </code>

                                                </program>

                                              </listing>

                                            </subsection>

                                            <subsection>

                                              <title>CodeLens</title>

                                              <p>
                                                A steppable Python program.
                                              </p>

                                              <listing xml:id="program-codelens-python">

                                                <title>A Python program, stepable with CodeLens</title>

                                                <program xml:id="python-hello-world-code-lens" label="python-hello-world-code-lens" interactive="codelens" language="python">

                                                  <code>
                        print('Hello, World!')
                                                  </code>

                                                </program>

                                              </listing>

                                            </subsection>

                                            <subsection>

                                              <title>Activity with An ActiveCode</title>

                                              <p>
                                                Something to do with ActiveCode program.
                                              </p>

                                              <activity xml:id="coding-exercise-partial-two" label="coding-exercise-partial-two">

                                                <title>Activity Coding Exercise</title>

                                                <statement>

                                                  <p>
                                                    Similar to above, but now as a complete Python program inside an <tag>activity</tag>.
                                                    This demonstrates the possibility to use any <q>project-like</q> block (<tag>project</tag>, <tag>activity</tag>, <tag>exploration</tag>, <tag>investigation</tag>), but not in the case when structured with <tag>task</tag>.
                                                  </p>

                                                </statement>

                                                <program label="partial-program-two" interactive="activecode" language="python">

                                                  <code>
                        for i in range(10):
                            print(i)
                                                  </code>

                                                </program>

                                                <answer>

                                                  <p>
                                                    We're still not really sure.
                                                  </p>

                                                </answer>

                                              </activity>

                                            </subsection>

                                            <subsection>

                                              <title>YouTube</title>

                                              <p>
                                                Video, observable on a Runestone server.
                                              </p>

                                              <video xml:id="yt-list-vars" youtube="X1-UNHUajfk" width="60%" margins="5% 35%" preview="yt-list-variables.png"/>

                                            </subsection>

                                          </section>