Skip to content

Commit bc5ab40

Browse files
author
Philip Guo
committed
added skeleton of OPT embedding demo
1 parent 03261e6 commit bc5ab40

7 files changed

Lines changed: 4345 additions & 45 deletions

File tree

v3/embedding-demo.html

Lines changed: 23 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,39 +2,52 @@
22
<html xmlns="http://www.w3.org/1999/xhtml">
33

44
<head>
5-
<title>Online Python Tutor embedding test</title>
5+
<title>Online Python Tutor embedding demo</title>
66

7-
<!-- requirements for pytutor.js -->
7+
<!-- dependencies for pytutor.js -->
88
<script type="text/javascript" src="js/d3.v2.min.js"></script>
99
<script type="text/javascript" src="js/jquery-1.6.min.js"></script>
1010
<script type="text/javascript" src="js/jquery.ba-bbq.min.js"></script> <!-- for handling back button and URL hashes -->
1111
<script type="text/javascript" src="js/jquery.jsPlumb-1.3.10-all-min.js "></script> <!-- for rendering SVG connectors -->
1212
<script type="text/javascript" src="js/jquery-ui-1.8.21.custom.min.js"></script> <!-- for sliders and other UI elements -->
1313
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.21.custom.css" rel="stylesheet" />
1414

15+
16+
<!-- Python Tutor frontend code and styles -->
1517
<script type="text/javascript" src="js/pytutor.js"></script>
1618
<link rel="stylesheet" href="css/pytutor.css"/>
1719

1820

19-
<script type="text/javascript" src="embedding-examples.js"></script>
21+
<!-- Include this file AFTER all of its dependencies.
22+
23+
This JavaScript file contains the demo code - READ IT!!!
2024
25+
-->
26+
<script type="text/javascript" src="embedding-demo.js"></script>
2127

2228
</head>
2329

2430
<body>
2531

26-
<p>Stuff:</p>
32+
<!--
33+
34+
This demo shows three visualizations, each embedded within a div ...
35+
36+
-->
2737

28-
<div id="stuffDiv"></div>
38+
<p>Recursive list sum (from <a href="http://pythontutor.com">pythontutor.com</a> home page):</p>
2939

30-
<p>Aliasing 5:</p>
40+
<div id="listSumDiv"></div>
3141

32-
<div id="aliasing5Div"></div>
3342

34-
<p>Towers of Hanoi:</p>
43+
<p>Towers of Hanoi:</p>
3544

36-
<div id="hanoiDiv"></div>
45+
<div id="hanoiDiv"></div>
46+
47+
48+
<p>Happy Birthday:</p>
49+
50+
<div id="happyDiv"></div>
3751

3852
</body>
3953
</html>
40-

v3/embedding-demo.js

Lines changed: 45 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

v3/embedding-examples.js

Lines changed: 0 additions & 33 deletions
This file was deleted.

v3/generate_json_trace.py

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
# Generates a JSON trace that is compatible with the js/pytutor.js frontend
22

3+
import optparse
4+
35
CUMULATIVE_MODE = False
46

57
COMPACT = False
@@ -26,6 +28,20 @@ def json_finalizer(input_code, output_trace):
2628
print(json_output)
2729

2830

29-
for f in sys.argv[1:]:
30-
pg_logger.exec_script_str(open(f).read(), CUMULATIVE_MODE, json_finalizer)
31+
def js_var_finalizer(input_code, output_trace):
32+
global JS_VARNAME
33+
ret = dict(code=input_code, trace=output_trace)
34+
json_output = json.dumps(ret, indent=None)
35+
print("var %s = %s;" % (JS_VARNAME, json_output))
36+
3137

38+
parser = optparse.OptionParser()
39+
parser.add_option("--create_jsvar", dest="js_varname",
40+
help="Create a JavaScript variable out of the trace")
41+
(options, args) = parser.parse_args()
42+
43+
if options.js_varname:
44+
JS_VARNAME = options.js_varname
45+
pg_logger.exec_script_str(open(args[0]).read(), CUMULATIVE_MODE, js_var_finalizer)
46+
else:
47+
pg_logger.exec_script_str(open(args[0]).read(), CUMULATIVE_MODE, json_finalizer)

0 commit comments

Comments
 (0)