Python3_interpreter activecode directive

runestone/activecode/activecode.py

@@ -71,7 +71,7 @@ def setup(app):
     %(hidecode)s %(include)s %(timelimit)s %(coach)s %(codelens)s %(enabledownload)s %(chatcodes)s %(optional)s
     data-audio='%(ctext)s' %(sourcefile)s %(datafile)s %(stdin)s %(tie)s %(dburl)s %(nopair)s
     %(cargs)s %(largs)s %(rargs)s %(iargs)s %(gradebutton)s %(caption)s %(hidehistory)s %(wasmuri)s
-    %(showlastsql)s style="visibility: hidden;">
+    %(showlastsql)s %(python3_interpreter)s style="visibility: hidden;">
 %(initialcode)s
 </textarea>
 </div>
@@ -162,6 +162,7 @@ class ActiveCode(RunestoneIdDirective):
        :nopair: -- disable pair programming features
        :dburl: url to load database for sql mode
        :showlastsql: -- Only show the last sql result in output
+       :python3_interpreter: brython (uses brython as interpreter of python3)
 
         If this is a homework problem instead of an example in the text
         then the assignment text should go here.  The assignment text ends with
@@ -217,6 +218,7 @@ class ActiveCode(RunestoneIdDirective):
             "nopair": directives.flag,
             "dburl": directives.unchanged,
             "showlastsql": directives.flag,
+            "python3_interpreter": directives.unchanged
         }
     )
 
@@ -266,6 +268,11 @@ def run(self):
         self.options["ctext"] = newcomplete
         self.options["no_of_buttons"] = no_of_buttons
 
+        if ("python3_interpreter" in self.options) and (self.options["language"]=="python3") :
+            self.options["python3_interpreter"] = "data-python3_interpreter='%s'" % self.options["python3_interpreter"]
+        else:
+            self.options["python3_interpreter"] = ""
+
         if "caption" not in self.options:
             self.options["caption"] = ""
         else:

runestone/activecode/js/acfactory.js

@@ -2,13 +2,15 @@ import { ActiveCode } from "./activecode.js";
 import JSActiveCode from "./activecode_js.js";
 import HTMLActiveCode from "./activecode_html.js";
 import SQLActiveCode from "./activecode_sql.js";
+import BrythonActiveCode from "./activecode_brython.js";
 import LiveCode from "./livecode.js";
 import {
     TimedActiveCode,
     TimedLiveCode,
     TimedJSActiveCode,
     TimedHTMLActiveCode,
     TimedSQLActiveCode,
+    TimedBrythonActiveCode,
 } from "./timed_activecode";
 import "../../common/js/jquery.highlight.js";
 
@@ -30,7 +32,12 @@ export default class ACFactory {
         if (lang === undefined) {
             lang = $(opts.orig).find("[data-lang]").data("lang");
         }
+        var text_area = $(opts.orig).find("textarea")[0]
+        var python3_interpreter = $(text_area).attr("data-python3_interpreter");
         if (opts.timed == true) {
+            if(python3_interpreter==="brython"){
+                return new TimedBrythonActiveCode(opts);   
+            }
             if (lang === "python") {
                 return new TimedActiveCode(opts);
             } else if (
@@ -50,7 +57,10 @@ export default class ACFactory {
                 return new TimedActiveCode(opts);
             }
         } else {
-            if (lang === "javascript") {
+            if ((lang ==="python3") && (python3_interpreter === "brython")){
+                return new BrythonActiveCode(opts);   
+            }
+            else if (lang === "javascript") {
                 return new JSActiveCode(opts);
             } else if (lang === "htmlmixed") {
                 return new HTMLActiveCode(opts);

runestone/activecode/js/activecode.js

@@ -60,6 +60,7 @@ export class ActiveCode extends RunestoneBase {
         this.question = $(opts.orig).find(`#${this.divid}_question`)[0];
         this.tie = $(orig).data("tie");
         this.dburl = $(orig).data("dburl");
+        this.python3_interpreter = $(orig).data("python3_interpreter");
         this.runButton = null;
         this.enabledownload = $(orig).data("enabledownload");
         this.downloadButton = null;

runestone/activecode/js/activecode_brython.js

@@ -4,12 +4,12 @@ export default class BrythonActiveCode extends ActiveCode {
     constructor(opts) {
         super(opts);
         opts.alignVertical = true;
-        this.code = $("<textarea />").html(this.origElem.innerHTML).text();
+        this.python3_interpreter = $(orig).data("python3_interpreter");
         $(this.runButton).text("Render");
         this.editor.setValue(this.code);
     }
 
-    async runProg() {   
+    async runProg() {
         var prog = await this.buildProg(true);
         let saveCode = "True";
         this.saveCode = await this.manage_scrubber(saveCode);
@@ -21,13 +21,18 @@ export default class BrythonActiveCode extends ActiveCode {
             });
         }
         $(this.outDiv).show({ duration: 700, queue: false });
-        document.body.onload("brython()");
-        prog =
-            "<script type='text/javascript' src='https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js'></script>" +
-            "<script type=text/javascript>window.onerror = function(msg,url,line) {alert(msg+' on line: '+line);};</script>" +
-            "<script type='text/python'>" +
-            prog +
-            "</script>";
+        prog = `
+        <html>
+            <head>
+                <script type='text/javascript' src='https://cdn.jsdelivr.net/npm/brython@3.9.0/brython.min.js'></script>
+            </head>
+            <body onload='brython()'>
+                <script type='text/python'>` + prog + 
+         `
+                </script>
+            </body>
+        </html>
+        `;
         this.output.srcdoc = prog;
     }
 
@@ -55,4 +60,4 @@ export default class BrythonActiveCode extends ActiveCode {
     enableSaveLoad() {
         $(this.runButton).text($.i18n("msg_activecode_render"));
     }
-}
+}

runestone/activecode/js/timed_activecode.js

@@ -8,6 +8,7 @@ import { ActiveCode } from "./activecode";
 import JSActiveCode from "./activecode_js";
 import HTMLActiveCode from "./activecode_html";
 import SQLActiveCode from "./activecode_sql";
+import BrythonActiveCode from "./activecode_brython.js";
 
 var TimedActiveCodeMixin = {
     timedInit: async function (opts) {
@@ -145,3 +146,11 @@ export class TimedSQLActiveCode extends SQLActiveCode {
     }
 }
 Object.assign(TimedSQLActiveCode.prototype, TimedActiveCodeMixin);
+
+export class TimedBrythonActiveCode extends BrythonActiveCode {
+    constructor(opts) {
+        super(opts);
+        this.timedInit(opts);
+    }
+}
+Object.assign(TimedBrythonActiveCode.prototype, TimedActiveCodeMixin);

runestone/activecode/test/_sources/index.rst

@@ -2825,3 +2825,18 @@ Support for SQL in the browser ?  Yes!
         }
 
       } // end of World class
+
+Trying Brython as Python 3 interpreter
+--------------------------------------
+.. activecode:: test_activecode_python3
+   :language: python3
+   :python3_interpreter: brython 
+
+   print("You can see this print on the browser console")
+   from browser import document, alert, html
+
+   def hello(ev):
+       alert("Hello! I'm using Brython :D")
+
+   document <= html.BUTTON("My button", id="button_alert")
+   document["button_alert"].bind("click", hello)