Skip to content

Commit

Permalink
major refactor of python to js communication
Browse files Browse the repository at this point in the history
  • Loading branch information
YouGuessedMyName committed Jan 4, 2025
1 parent ddbc648 commit 6fc0aae
Show file tree
Hide file tree
Showing 10 changed files with 709 additions and 396 deletions.
298 changes: 41 additions & 257 deletions docs/getting_started/01_study.ipynb
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
},
{
"cell_type": "code",
"execution_count": 11,
"execution_count": 1,
"id": "e924f3a4",
"metadata": {},
"outputs": [],
Expand All @@ -31,7 +31,7 @@
},
{
"cell_type": "code",
"execution_count": 12,
"execution_count": 2,
"id": "1f2120a8",
"metadata": {},
"outputs": [],
Expand All @@ -51,7 +51,7 @@
},
{
"cell_type": "code",
"execution_count": 13,
"execution_count": 3,
"id": "1143b6c0",
"metadata": {},
"outputs": [],
Expand All @@ -72,7 +72,7 @@
},
{
"cell_type": "code",
"execution_count": 14,
"execution_count": 4,
"id": "64bfb789",
"metadata": {},
"outputs": [],
Expand All @@ -93,7 +93,7 @@
},
{
"cell_type": "code",
"execution_count": 15,
"execution_count": 5,
"id": "89d1d749",
"metadata": {},
"outputs": [],
Expand All @@ -114,7 +114,7 @@
},
{
"cell_type": "code",
"execution_count": 16,
"execution_count": 6,
"id": "2f8fb42e",
"metadata": {},
"outputs": [],
Expand Down Expand Up @@ -155,265 +155,49 @@
},
{
"cell_type": "code",
"execution_count": 18,
"execution_count": 14,
"id": "0df1511e-565d-45d0-93a8-adafbfaaaefa",
"metadata": {
"scrolled": true
},
"outputs": [
{
"data": {
"text/html": [
"\n",
" <iframe\n",
" id=\"studyqOjKBOYOrz\"\n",
" width=\"820\"\n",
" height=\"620\"\n",
" frameborder=\"0\"\n",
" srcdoc=\"\n",
"&lt;!DOCTYPE html&gt;\n",
"&lt;html lang=&quot;en&quot;&gt;\n",
" &lt;head&gt;\n",
" &lt;title&gt;Network&lt;/title&gt;\n",
" &lt;script\n",
" type=&quot;text/javascript&quot;\n",
" src=&quot;https://unpkg.com/vis-network/standalone/umd/vis-network.min.js&quot;\n",
" &gt;&lt;/script&gt;\n",
" &lt;style type=&quot;text/css&quot;&gt;\n",
" #mynetwork {\n",
" \n",
" width: 800px;\n",
" height: 600px;\n",
" border: 1px solid lightgray;\n",
" \n",
" }\n",
" &lt;/style&gt;\n",
" &lt;/head&gt;\n",
" &lt;body&gt;\n",
" &lt;div id=&quot;mynetwork&quot;&gt;&lt;/div&gt;\n",
" &lt;script type=&quot;text/javascript&quot;&gt;\n",
" \n",
" var nodes = new vis.DataSet([{ id: 0, label: `init`, group: &quot;states&quot;, x: -15, y: -210 },\n",
"{ id: 1, label: `studied`, group: &quot;states&quot;, x: -83, y: -4 },\n",
"{ id: 2, label: `didn&#x27;t study`, group: &quot;states&quot;, x: 72, y: -22 },\n",
"{ id: 3, label: `pass test`, group: &quot;states&quot;, x: 53, y: 84 },\n",
"{ id: 4, label: `fail test`, group: &quot;states&quot;, x: -57, y: 70 },\n",
"{ id: 5, label: `end`, group: &quot;states&quot;, x: 0, y: 187 },\n",
"{ id: 10000000000, label: `study`, group: &quot;actions&quot;, x: -123, y: -133 },\n",
"{ id: 10000000001, label: `don&#x27;t study`, group: &quot;actions&quot;, x: 99, y: -151 },\n",
"]);\n",
" var edges = new vis.DataSet([{ from: 0, to: 10000000000 },\n",
"{ from: 10000000000, to: 1, label: &quot;1&quot; },\n",
"{ from: 0, to: 10000000001 },\n",
"{ from: 10000000001, to: 2, label: &quot;1&quot; },\n",
"{ from: 1, to: 3, label: &quot;9/10&quot; },\n",
"{ from: 1, to: 4, label: &quot;1/10&quot; },\n",
"{ from: 2, to: 3, label: &quot;2/5&quot; },\n",
"{ from: 2, to: 4, label: &quot;3/5&quot; },\n",
"{ from: 3, to: 5, label: &quot;1&quot; },\n",
"{ from: 4, to: 5, label: &quot;1&quot; },\n",
"]);\n",
" var options = {\n",
" &quot;__fake_macros&quot;: {\n",
" &quot;__group_macro&quot;: {\n",
" &quot;borderWidth&quot;: 1,\n",
" &quot;color&quot;: {\n",
" &quot;background&quot;: &quot;white&quot;,\n",
" &quot;border&quot;: &quot;black&quot;,\n",
" &quot;highlight&quot;: {\n",
" &quot;background&quot;: &quot;white&quot;,\n",
" &quot;border&quot;: &quot;red&quot;\n",
" }\n",
" },\n",
" &quot;shape&quot;: &quot;ellipse&quot;,\n",
" &quot;mass&quot;: 1,\n",
" &quot;font&quot;: {\n",
" &quot;color&quot;: &quot;black&quot;,\n",
" &quot;size&quot;: 14\n",
" }\n",
" }\n",
" },\n",
" &quot;groups&quot;: {\n",
" &quot;states&quot;: {\n",
" &quot;borderWidth&quot;: 1,\n",
" &quot;color&quot;: {\n",
" &quot;background&quot;: &quot;#8ff0a4&quot;,\n",
" &quot;border&quot;: &quot;black&quot;,\n",
" &quot;highlight&quot;: {\n",
" &quot;background&quot;: &quot;white&quot;,\n",
" &quot;border&quot;: &quot;red&quot;\n",
" }\n",
" },\n",
" &quot;shape&quot;: &quot;ellipse&quot;,\n",
" &quot;mass&quot;: 1,\n",
" &quot;font&quot;: {\n",
" &quot;color&quot;: &quot;black&quot;,\n",
" &quot;size&quot;: 14\n",
" }\n",
" },\n",
" &quot;actions&quot;: {\n",
" &quot;borderWidth&quot;: 1,\n",
" &quot;color&quot;: {\n",
" &quot;background&quot;: &quot;#ffc0cb&quot;,\n",
" &quot;border&quot;: &quot;black&quot;,\n",
" &quot;highlight&quot;: {\n",
" &quot;background&quot;: &quot;white&quot;,\n",
" &quot;border&quot;: &quot;red&quot;\n",
" }\n",
" },\n",
" &quot;shape&quot;: &quot;box&quot;,\n",
" &quot;mass&quot;: 1,\n",
" &quot;font&quot;: {\n",
" &quot;color&quot;: &quot;black&quot;,\n",
" &quot;size&quot;: 14\n",
" }\n",
" },\n",
" &quot;scheduled_actions&quot;: {\n",
" &quot;borderWidth&quot;: 1,\n",
" &quot;color&quot;: {\n",
" &quot;background&quot;: &quot;pink&quot;,\n",
" &quot;border&quot;: &quot;black&quot;,\n",
" &quot;highlight&quot;: {\n",
" &quot;background&quot;: &quot;white&quot;,\n",
" &quot;border&quot;: &quot;red&quot;\n",
" }\n",
" },\n",
" &quot;shape&quot;: &quot;box&quot;,\n",
" &quot;mass&quot;: 1,\n",
" &quot;font&quot;: {\n",
" &quot;color&quot;: &quot;black&quot;,\n",
" &quot;size&quot;: 14\n",
" },\n",
" &quot;schedColor&quot;: false\n",
" }\n",
" },\n",
" &quot;reload_button&quot;: false,\n",
" &quot;edges&quot;: {\n",
" &quot;arrows&quot;: &quot;to&quot;,\n",
" &quot;font&quot;: {\n",
" &quot;color&quot;: &quot;black&quot;,\n",
" &quot;size&quot;: 14\n",
" },\n",
" &quot;color&quot;: {\n",
" &quot;color&quot;: &quot;black&quot;\n",
" }\n",
" },\n",
" &quot;numbers&quot;: {\n",
" &quot;fractions&quot;: true,\n",
" &quot;digits&quot;: 5\n",
" },\n",
" &quot;state_properties&quot;: {\n",
" &quot;show_results&quot;: true,\n",
" &quot;result_symbol&quot;: &quot;\\u2606&quot;,\n",
" &quot;show_rewards&quot;: true,\n",
" &quot;reward_symbol&quot;: &quot;\\u20ac&quot;,\n",
" &quot;show_zero_rewards&quot;: true,\n",
" &quot;show_observations&quot;: true,\n",
" &quot;observation_symbol&quot;: &quot;\\u0298&quot;\n",
" },\n",
" &quot;layout&quot;: {\n",
" &quot;randomSeed&quot;: 5\n",
" },\n",
" &quot;misc&quot;: {\n",
" &quot;enable_physics&quot;: true,\n",
" &quot;width&quot;: 800,\n",
" &quot;height&quot;: 600,\n",
" &quot;explore&quot;: false\n",
" },\n",
" &quot;saving&quot;: {\n",
" &quot;relative_path&quot;: true,\n",
" &quot;filename&quot;: &quot;layouts/pinkgreen.json&quot;,\n",
" &quot;save_button&quot;: false,\n",
" &quot;load_button&quot;: false\n",
" },\n",
" &quot;positions&quot;: {\n",
" &quot;0&quot;: {\n",
" &quot;x&quot;: -15,\n",
" &quot;y&quot;: -210\n",
" },\n",
" &quot;1&quot;: {\n",
" &quot;x&quot;: -83,\n",
" &quot;y&quot;: -4\n",
" },\n",
" &quot;2&quot;: {\n",
" &quot;x&quot;: 72,\n",
" &quot;y&quot;: -22\n",
" },\n",
" &quot;3&quot;: {\n",
" &quot;x&quot;: 53,\n",
" &quot;y&quot;: 84\n",
" },\n",
" &quot;4&quot;: {\n",
" &quot;x&quot;: -57,\n",
" &quot;y&quot;: 70\n",
" },\n",
" &quot;5&quot;: {\n",
" &quot;x&quot;: 0,\n",
" &quot;y&quot;: 187\n",
" },\n",
" &quot;10000000000&quot;: {\n",
" &quot;x&quot;: -123,\n",
" &quot;y&quot;: -133\n",
" },\n",
" &quot;10000000001&quot;: {\n",
" &quot;x&quot;: 99,\n",
" &quot;y&quot;: -151\n",
" }\n",
" },\n",
" &quot;width&quot;: 800,\n",
" &quot;height&quot;: 600,\n",
" &quot;physics&quot;: true,\n",
" &quot;results_and_rewards&quot;: {\n",
" &quot;show_results&quot;: true,\n",
" &quot;resultSymbol&quot;: &quot;\\u2606&quot;,\n",
" &quot;show_rewards&quot;: true\n",
" }\n",
"};\n",
" //js\n",
"var container = document.getElementById(&quot;mynetwork&quot;);\n",
"var data = {\n",
" nodes: nodes,\n",
" edges: edges,\n",
"};\n",
"var network = new vis.Network(container, data, options);\n",
"function makeAllNodesInvisible() {\n",
" ids = nodes.getIds();\n",
" for (let i = 0; i &lt; ids.length; i++) {\n",
" var nodeId = ids[i];\n",
" var node = nodes.get(nodeId);\n",
" node[&quot;hidden&quot;] = true;\n",
" nodes.update(node);\n",
" }\n",
"};\n",
"function makeNeighborsVisible(myNode) {\n",
" var ids = network.getConnectedNodes(myNode, &#x27;to&#x27;);\n",
" for (let i = 0; i &lt; ids.length; i++) {\n",
" var nodeId = ids[i];\n",
" var node = nodes.get(nodeId);\n",
" node[&quot;hidden&quot;] = false;\n",
" nodes.update(node);\n",
" }\n",
"};\n",
"function makeNodeVisible(nodeId) {\n",
" var node = nodes.get(nodeId);\n",
" node[&quot;hidden&quot;] = false;\n",
" nodes.update(node);\n",
"};\n",
"network.on( &#x27;click&#x27;, function(properties) {\n",
" var nodeId = network.getNodeAt({x:properties.event.srcEvent.offsetX, y:properties.event.srcEvent.offsetY});\n",
" makeNeighborsVisible(nodeId);\n",
"});\n",
"\n",
" &lt;/script&gt;\n",
" &lt;/body&gt;\n",
"&lt;/html&gt;\n",
"\"\n",
" border:none !important;\n",
" allowfullscreen webkitallowfullscreen mozallowfullscreen\n",
" ></iframe>"
],
"application/vnd.jupyter.widget-view+json": {
"model_id": "bd157ce6c3034fd5a0533f8220e44c9e",
"version_major": 2,
"version_minor": 0
},
"text/plain": [
"Output()"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/vnd.jupyter.widget-view+json": {
"model_id": "f7080afa9cce47deb47ef9c1b145ce71",
"version_major": 2,
"version_minor": 0
},
"text/plain": [
"Output()"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/vnd.jupyter.widget-view+json": {
"model_id": "69b3da5b0e884431b9cb84d758067af4",
"version_major": 2,
"version_minor": 0
},
"text/plain": [
"<IPython.core.display.HTML object>"
"HBox(children=(Output(), Output()))"
]
},
"metadata": {},
Expand Down
Loading

0 comments on commit 6fc0aae

Please sign in to comment.