123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110 |
- <!DOCTYPE html>
- <html>
- <head>
- <style>
- body {
- max-width: 45em; margin: auto; padding: 0 1em 5em; background-color: #333333; color: #dddddd;
- }
- a, a:visited {
- color: lightgreen; text-decoration: none;
- }
- #result {
- margin: 2em 5em 2em 5em; font-weight: bold;
- }
- #logotype {
- text-align:center; font-size:300%;
- }
- form {
- display: flex; align-items: center;
- }
- #answer {
- flex-basis: 100%; margin: 0 1em 0 1em; font-size: 110%;
- }
- </style>
- <script>
- // First part of a question/answer
- let firstPart = [
- {"english":["I am (a/an)", "We are"],
- "toki":"mi"},
- {"english":["You are (a/an)"],
- "toki":"sina"},
- {"english":["He is (a/an)", "She is (a/an)", "They are", "It is (a/an)"],
- "toki":"ona li"},
- {"english":["A apple is (a/an)","A pear is (a/an)","Fruits are", "A tomato is (a/an)","Pineapples are","Mushrooms are","A mushroom is (a/an)","Cucumbers are","An onion is (a/an)","A banana is (a/an)"],
- "toki":"kili li"},
- {"english":["Dogs are","Animals are","A giraffe is (a/an)","A polar bear is (a/an)","Tigers are","An ape is (a/an)","A donkey is (a/an)","A horse is (a/an)","Badgers are","A rat is (a/an)"],
- "toki":"soweli li"}
- ];
- // Second part of a question/answer
- let secondPart = [
- {"english":["good", "simple"],
- "toki":"pona"},
- {"english":["bad","evil","unnecessary","complex"],
- "toki":"ike"},
- {"english":["big","great","important"],
- "toki":"suli"},
- {"english":["small","few","young"],
- "toki":"lili"},
- {"english":["lemon(s)","carrot(s)","potato(es)","banana(s)","grape(s)","melon(s)","pumpkin(s)"],
- "toki":"kili"},
- {"english":["animal(s)","dog(s)","elephant(s)","mammal(s)","kangaroo(s)","tiger(s)","cat(s)","cow(s)"],
- "toki":"soweli"}
- ];
- let correctAnswer = ""
- function getRandom(items) {
- return items[Math.floor(Math.random()*items.length)]
- }
- function askQuestion() {
- document.getElementById("answer").value = ""
- let firstP = getRandom(firstPart)
- let secondP = getRandom(secondPart)
- let sentence = getRandom(firstP.english) + " " + getRandom(secondP.english)
- correctAnswer = firstP.toki + " " + secondP.toki
- document.getElementById("sentence").innerHTML = sentence
- }
- function submitAnswer() {
- if (document.getElementById("answer").value == correctAnswer) {
- document.getElementById("result").innerHTML = "Correct!"
- } else {
- document.getElementById("result").innerHTML = "Wrong :( The correct answer is \"" + correctAnswer + "\""
- }
- askQuestion()
- }
- </script>
- <meta charset='utf-8'>
- <meta name='viewport' content='width=device-width,initial-scale=1'>
- <link rel='icon' href='data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📜</text></svg>'>
- <link rel='me' href='mailto:bjorn.warmedal@gmail.com' />
- <title>Toki Pona Lesson 1 - Björn Wärmedal</title>
- </head>
- <body onload='askQuestion()'>
- <p id='logotype'><a href='index.html'>📜</a></p>
- <h1>Lesson 1</h1>
- <p><a href='https://devurandom.xyz/tokipona/1.html'>These exercises are based on the first lesson at devurandom.xyz</a></p>
- <p>Translate "<span id='sentence'></span>"</p>
- <form onsubmit='submitAnswer()' autocomplete='off' action='javascript:void(0)'><label for='answer'>Translation:</label><input id='answer' type='text'></input><input type='submit' value='Answer'></input>
- </form>
- <p id='result'></p>
- <p>-- CC0 Björn Wärmedal, consider the code to be MIT licensed.</p>
- </body>
- </html>
|