Merge pull request 'tampio_base' (#2) from tampio_base into main

Reviewed-on: http://localhost:44481/katariina-jarvenmaki/Tampiorama/pulls/2
2026-03-29 19:09:23 +00:00
parent 721e1eb8f0 18ce3878e5
commit 050080cf3c
6 changed files with 213 additions and 3 deletions
@@ -12,20 +12,37 @@ The easiest way to try Tampio, no manual `libvoikko` setup required:
 docker compose run --rm tampio
 ```

-This drops you into a shell with `tampio` available. Run any example:
+This drops you into a shell with `tampio` available. Compile an example to HTML:

 ```sh
-tampio examples/basics/hello.tampio
+tampio -i -p examples/basics/hello.itp > examples/basics/hello.html
 ```

+Then serve it locally and open it in your browser:
+
+```sh
+python3 -m http.server 9994 --directory examples/basics
+```
+
+| URL | What it does |
+|-----|-------------|
+| `http://localhost:9994/hello.html` | Alerts "Hei maailma!" on load |
+| `http://localhost:9994/factorial.html` | Prompts for n, displays n! |
+| `http://localhost:9994/fibonacci.html` | Prompts for n, displays fib(n) |
+
 ## What is Tampio?

 Tampio programs read like Finnish sentences. Methods are defined using grammatical cases, so the language's syntax is shaped by natural-language morphology rather than punctuation.

 ```tampio
-[Tampio example will go here]
+Pienen luvun kertoma on
+	riippuen siitä, onko se pienempi tai yhtä suuri kuin yksi,
+	joko yksi
+	tai pieni luku kerrottuna pienen luvun edeltäjän kertomalla.
 ```

+`pienen luvun kertoma` — "the factorial of a small number". The parameter `pieni luku` (small number) appears in genitive case before the method name, and the recursive call `pienen luvun edeltäjän kertomalla` reads as "by the factorial of the predecessor of the small number".
+
 See [`docs/cheatsheet.md`](docs/cheatsheet.md) for a map of Finnish grammatical cases to their roles in Tampio code, and [`docs/vs-javascript.md`](docs/vs-javascript.md) for side-by-side comparisons with JavaScript.

 ## Examples
@@ -0,0 +1,30 @@
+# Kertoma — Factorial in Tampio
+#
+# Methods are defined as: "[param in genitive] [method name] on [expression]"
+# The parameter "pieni luku" (small number) appears in genitive: "pienen luvun"
+#
+# "riippuen siitä, onko ... joko ... tai ..." = ternary expression
+#   "pienempi tai yhtä suuri kuin yksi" = "less than or equal to one"
+# "kerrottuna ... kertomalla" = "multiplied by [factorial]"
+#   Multiplication uses adessive case: "kertomalla" = "by the factorial"
+
+Pienen luvun kertoma on
+	riippuen siitä, onko se pienempi tai yhtä suuri kuin yksi,
+	joko yksi
+	tai pieni luku kerrottuna pienen luvun edeltäjän kertomalla.
+
+# "edeltäjä" = "predecessor" — defines n-1 as a helper method
+
+Luvun edeltäjä on se vähennettynä yhdellä.
+
+# "Olkoon X uusi muuttuja, jonka arvo on Y" = declare variable X with value Y
+
+Olkoon pieni muuttuja uusi muuttuja, jonka arvo on nolla.
+
+# Page-load event: prompt for a number, display its factorial
+# "luetaan luku" = "a number is read" (browser prompt)
+# "näyttää ... kertoman" = "shows the factorial of..." (genitive: kertoman)
+
+Kun nykyinen sivu avautuu,
+	pieneen muuttujaan luetaan luku
+	ja nykyinen sivu näyttää pienen muuttujan arvon kertoman.
@@ -0,0 +1,30 @@
+# Fibonacci-kani — Fibonacci Numbers in Tampio
+#
+# The method is named "kani" (rabbit) — a nod to Fibonacci's original rabbit problem,
+# which is how he introduced the sequence in 1202.
+#
+# Base case: for n ≤ 1, fib(n) = n   (covers fib(0)=0 and fib(1)=1 in one branch)
+# Recursive: fib(n) = fib(n-1) + fib(n-2)
+#
+# fib(n-2) is computed by chaining: "edeltäjän edeltäjä" = predecessor of predecessor
+# This avoids needing a two-word helper method name.
+#
+# "lisättynä ... kaniin" = "added to [kani value]" (illative case)
+
+Pienen luvun kani on
+	riippuen siitä, onko se pienempi tai yhtä suuri kuin yksi,
+	joko pieni luku
+	tai pienen luvun edeltäjän kani lisättynä pienen luvun edeltäjän edeltäjän kaniin.
+
+# "edeltäjä" = predecessor (n-1) — already in the standard library,
+# redefined here for clarity.
+
+Luvun edeltäjä on se vähennettynä yhdellä.
+
+Olkoon pieni muuttuja uusi muuttuja, jonka arvo on nolla.
+
+# "näyttää ... kanin" = "shows the rabbit/fibonacci of..." (genitive: kanin)
+
+Kun nykyinen sivu avautuu,
+	pieneen muuttujaan luetaan luku
+	ja nykyinen sivu näyttää pienen muuttujan arvon kanin.
@@ -0,0 +1,10 @@
+# Hei maailma! — Hello World in Tampio
+#
+# "Kun nykyinen sivu avautuu" = "When the current page opens"
+# This is Tampio's page-load event hook — the entry point of every program.
+#
+# "teksti" wraps a string literal.
+# "näytetään käyttäjälle" = "is shown to the user" (triggers a browser alert)
+
+Kun nykyinen sivu avautuu,
+	teksti "Hei maailma!" näytetään käyttäjälle.
@@ -0,0 +1,40 @@
+# Tampiorama
+#
+# An index of annotated Tampio examples.
+# This page is itself a Tampio program — the source on the left
+# is what generates the links and descriptions on the right.
+#
+# "nykyinen sivu näyttää tekstin X" = document.write(X)
+
+# Hei maailma — Hello World
+#
+# The simplest Tampio program.
+# Entry point: Kun nykyinen sivu avautuu = When the current page opens
+# "näytetään käyttäjälle" triggers a browser alert.
+
+# Kertoma — Factorial
+#
+# Recursive factorial using the ternary:
+#   riippuen siitä ... joko ... tai
+#   = depending on whether ... either ... or
+# Multiplication uses adessive case: kerrottuna kertomalla
+
+# Fibonacci-kani — Fibonacci
+#
+# Recursive Fibonacci named "kani" (rabbit),
+# after Fibonacci's original rabbit problem from 1202.
+# Addition uses illative case: lisättynä kaniin
+# n-2 computed by chaining: edeltäjän edeltäjä
+
+Kun nykyinen sivu avautuu,
+	nykyinen sivu näyttää tekstin "<h1>Tampiorama</h1>",
+	nykyinen sivu näyttää tekstin "<p>Annotated examples for <a href='https://github.com/fergusq/tampio'>Tampio</a>, a natural-language OOP language using Finnish grammar that compiles to JavaScript.</p>",
+	nykyinen sivu näyttää tekstin "<h3><a href='hello.html'>Hei maailma →</a></h3>",
+	nykyinen sivu näyttää tekstin "<p>Hello world. Page-load entry point, browser alert.</p>",
+	nykyinen sivu näyttää tekstin "<p><em>Open the page — it will alert 'Hei maailma!' immediately.</em></p>",
+	nykyinen sivu näyttää tekstin "<h3><a href='factorial.html'>Kertoma →</a></h3>",
+	nykyinen sivu näyttää tekstin "<p>Recursive factorial. Ternary branching, adessive multiplication.</p>",
+	nykyinen sivu näyttää tekstin "<p><em>Open the page — enter a number when prompted, e.g. 5, and see 120.</em></p>",
+	nykyinen sivu näyttää tekstin "<h3><a href='fibonacci.html'>Fibonacci-kani →</a></h3>",
+	nykyinen sivu näyttää tekstin "<p>Recursive Fibonacci. Illative addition, predecessor chaining.</p>"
+ja	nykyinen sivu näyttää tekstin "<p><em>Open the page — enter a number when prompted, e.g. 10, and see 55.</em></p>".
@@ -0,0 +1,83 @@
+/*
+ * Tampio Syntax Highlighting — Typography & Styling
+ *
+ * This stylesheet defines the visual presentation of Tampio source code.
+ */
+
+/* ===== TYPE STYLES ===== */
+span.type {
+	font-variant: small-caps;
+	font-size: large;
+}
+
+/* ===== KEYWORDS ===== */
+span.keyword {
+	font-weight: bold;
+}
+
+/* ===== VARIABLES & FIELDS ===== */
+span.field {
+	text-decoration: underline dotted;
+}
+
+span.variable {
+	font-variant: small-caps;
+	font-size: large;
+}
+
+span.variable-or-field {
+	text-decoration: underline dotted;
+	font-variant: small-caps;
+	font-size: large;
+}
+
+/* ===== FUNCTIONS ===== */
+span.function {
+	font-style: italic;
+}
+
+/* ===== OPERATORS ===== */
+span.operator {
+	text-decoration: underline dotted;
+	font-weight: bold;
+}
+
+span.conditional-operator {
+	text-decoration: underline dotted;
+	color: #622;
+}
+
+/* ===== LITERALS ===== */
+span.literal {
+	color: #622;
+}
+
+/* ===== COMMENTS ===== */
+span.comment-inline, span.block-comment-inline {
+	color: #226;
+	font-size: small;
+}
+
+span.comment-global {
+	color: black;
+	font-size: 1.5em;
+	border-bottom: 1px solid black;
+}
+
+span.block-comment-global {
+	color: #226;
+}
+
+/* ===== LIST STYLES ===== */
+ul:not(.syntax-root) {
+	list-style: disc;
+}
+
+ul.syntax-root > li {
+	margin-top: 10px;
+	margin-bottom: 10px;
+}
+
+ul.syntax-root {
+	list-style: none;
+}