Python#

The {exec} python directive allows executing Python code directly in the browser.

Module setup#

Module setup code can be defined as a named {exec} python block, to be referenced in the :after: option of other blocks.

1def factorial(n):
2  res = 1
3  for i in range(2, n + 1):
4    res *= i
5  return res

Program output#

Terminal#

The terminal output generated by an {exec} python block via sys.stdout and sys.stderr (and therefore, via print()) is displayed in an output block. Output to sys.stderr is colored.

for i in range(10):
  print(f"factorial({i}) = {factorial(i)}")

import sys
sys.stderr.write("Program terminated.\n")

The terminal output block can be cleared with the form-feed control character (\x0c).

import asyncio

for i in range(10, 0, -1):
  print(f"\x0c{i}...")
  await asyncio.sleep(1)
print("\x0cHappy new year!")

The width of the terminal output block is limited by the page content width.

print("Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do "
      "eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad "
      "minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip "
      "ex ea commodo consequat. Duis aute irure dolor in reprehenderit in "
      "voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur "
      "sint occaecat cupidatat non proident, sunt in culpa qui officia "
      "deserunt mollit anim id est laborum.")

The height of the terminal output block can be limited with :output-style:.

for i in range(100):
  print(i)

Graphics#

See the tdoc.svg module.

from tdoc import svg

def paint_heart(c):
  c.path('M -40,-20 A 20,20 0,0,1 0,-20 A 20,20 0,0,1 40,-20 '
         'Q 40,10 0,40 Q -40,10 -40,-20 z',
         stroke='red', fill='transparent')
  c.path('M -40,30 -30,30 -30,40 '
         'M -30,30 0,0 M 34,-34 45,-45'
         'M 35,-45 45,-45 45,-35',
         stroke=svg.Stroke('black', width=2), fill='transparent')

img = svg.Image(400, 100, stroke='darkorange', fill='#c0c0ff',
                style='width: 100%; height: 100%')
img.stylesheet = """
.bold {
  stroke: blue;
  stroke-width: 2;
  fill: #c0ffc0;
}
"""
img.circle(20, 30, 10)
img.ellipse(20, 70, 10, 20, klass='bold')
img.line(0, 0, 400, 100)
g = img.group(transform=svg.translate(200, 10))
g.polygon((0, 0), (30, 0), (40, 20), klass='bold')
g.polyline((0, 0), (30, 0), (40, 20), fill='transparent',
           transform=svg.translate(x=50, y=10))
img.rect(0, 0, 400, 100, fill='transparent')
img.text(50, 90, "Some text", stroke='transparent', fill='green')
paint_heart(img.group(transform=svg.translate(360, 30).rotate(20).scale(0.5)))
render(img)

Animations can be implemented by rendering images repeatedly in a loop, with a short sleep between images. Don't forget to sleep, otherwise the program becomes unstoppable and the page must be reloaded.

import asyncio
import random

img = svg.Image(400, 100, style='width: 100%; height: 100%')
sym = img.symbol()
paint_heart(sym)
hearts = [(img.use(href=sym),
           random.uniform(0, 100), random.uniform(0, 100),
           random.uniform(-180, 180))
          for _ in range(20)]

def saw(value, amplitude):
  return abs((value + amplitude) % (2 * amplitude) - amplitude)

def pose(t, vx, vy, va):
  return saw(t * vx, img.width), saw(t * vy, img.height), (t * va) % 360.0

loop = asyncio.get_running_loop()
start = loop.time()
while True:
  t = loop.time() - start
  for heart, vx, vy, va in hearts:
    heart.x, heart.y, a = pose(t, vx, vy, va)
    heart.transform = svg.rotate(a, heart.x, heart.y)
  img.width, img.height = await render(img)
  await asyncio.sleep(1 / 60)

Program input#

User input can be requested by awaiting functions available in the global environment. Unfortunately, sys.stdin (and anything that depends on it) cannot be used, due to its blocking nature.

Line of text#

See input_line().

name = await input_line("What is your name?")
print(f"Hello, {name}!")

Multi-line text#

See input_text().

print("Please enter some text.")
text = await input_text()
print(f"\x0cThe text was:\n-------------\n{text}")

Buttons#

See input_buttons().

colors = ["Red", "Green", "Blue"]
index = await input_buttons("Pick a color:", colors)
print(f"You picked: {colors[index]}")

Pause#

See pause().

n = 5
fact = 1
for i in range(2, n + 1):
  fact *= i
  await pause(f"i={i}, fact={fact}")
print(f"The factorial of {n} is {fact}")

Exceptions#

Exceptions that propagate out of the {exec} python block are displayed as a traceback on sys.stderr.

def outer():
  try:
    inner()
  except Exception as e:
    raise Exception("inner() failed") from e

def inner():
  raise Exception("Something is broken")

outer()

Concurrency#

All {exec} python blocks on a page are executed in a shared, single-threaded interpreter. Therefore, only one block can run at any given time. Nevertheless, concurrent execution is possible through async coroutines. The asyncio module provides a lot of functionality related to async concurrency.

import asyncio
import time

while True:
  print(f"\x0c{time.strftime('%Y-%m-%d %H:%M:%S')}")
  await asyncio.sleep(1)
import asyncio

i = 0
while True:
  print(f"\x0ci={i}")
  i += 1
  await asyncio.sleep(0.2)