Prva verzija prve vaje

main
Jurij Podgoršek 2024-12-26 19:28:16 +01:00
parent 5c87ba2d67
commit 1cf45a4629
11 changed files with 339 additions and 84 deletions

View File

@ -0,0 +1 @@
(get "/soba/listek")

View File

@ -11,4 +11,15 @@
(add-to-load-path (string-append (current-toplevel) "/lib"))
;; Put whatever you want to be called before server running here
(get "/" (lambda (rc) (redirect-to rc "/index.html")))
(define (ustvari-sobo rc stevilo-igralcev)
(post "/soba/ustvari" #:conn #t
(lambda (rc)
(let ((mtable (map-table-from-DB (:conn rc))))
(mtable 'insert
'soba
#:columns '(stevilo_igralcev)
#:values '(4))))))

View File

@ -0,0 +1,13 @@
;; Controller soba definition of igra-stavkov
;; Please add your license header here.
;; This file is generated automatically by GNU Artanis.
(define-artanis-controller soba) ; DO NOT REMOVE THIS LINE!!!
(soba-define listek
(lambda (rc)
"<h1>This is soba#listek</h1><p>Find me in app/views/soba/listek.html.tpl</p>"
;; TODO: add controller method `listek'
;; uncomment this line if you want to render view from template
;; (view-render "listek" (the-environment))
))

View File

@ -0,0 +1,9 @@
(import (artanis mvc model))
;; Model soba definition of igra-stavkov
;; Please add your license header here.
;; This file is generated automatically by GNU Artanis.
(create-artanis-model
soba ;ime modela
(id auto (#:primary-key))
(stevilo_igralcev tinyint (#:not-null)))

View File

@ -0,0 +1,5 @@
(import (artanis mvc model))
(create-artanis-model
soba ;ime modela
(id auto (#:primary-key))
(stevilo_igralcev tinyint (#:not-null)))

View File

@ -0,0 +1,42 @@
<!-- soba#listek view template of igra-stavkov
Please add your license header here.
This file is generated automatically by GNU Artanis. -->
<html>
<head>
<title><%= (current-appname) %>
</title>
<script>
/*
@licstart The following is the entire license notice for the
JavaScript code in this page.
Copyright (C) 2014 Loic J. Duros
The JavaScript code in this page is free software: you can
redistribute it and/or modify it under the terms of the GNU
General Public License (GNU GPL) as published by the Free Software
Foundation, either version 3 of the License, or (at your option)
any later version. The code is distributed WITHOUT ANY WARRANTY;
without even the implied warranty of MERCHANTABILITY or FITNESS
FOR A PARTICULAR PURPOSE. See the GNU GPL for more details.
As additional permission under GNU GPL version 3 section 7, you
may distribute non-source (e.g., minimized or compacted) forms of
that code without the copy of the GNU GPL normally required by
section 4, provided you include this license notice and a URL
through which recipients can access the Corresponding Source.
@licend The above is the entire license notice
for the JavaScript code in this page.
*/
</script>
</head>
<body>
<h1>soba#listek</h1>
<p>Rendered from app/views/soba/listek.html.tpl.</p>
</body>
</html>

View File

@ -0,0 +1,11 @@
;; Migration soba_20241212214844 definition of igra-stavkov
;; Please add your license header here.
;; This file is generated automatically by GNU Artanis.
(create-artanis-migration soba_20241212214844) ; DO NOT REMOVE THIS LINE!!!
(migrate-create
(display "Add your create DB code\n"))
(migrate-up
(display "Add your up code\n"))
(migrate-down
(display "Add your down code\n"))

View File

@ -20,14 +20,14 @@
<p>
Vsak igralec potrebuje računalnik z brskalnikom in internetno povezavo. Dobavna veriga obsega rudnike redkih kovin, silicij, proizvodnjo čipov, komunikacijsko mrežo, etcetera.
</p>
<p>
Na naši aplikaciji je igra zelo podobna. Izberete število igralcev in ustvarite
novo sobo za igranje. Povezavo do sobo pošljete soigralcem in po vrsti
odgovarjate na vprašanja, dokler ne izpolnite vseh. Vsakemu igralcu se na koncu
izpiše en sestavljen stavek.
<form>
<form method="POST" action="/soba/ustvari">
<label for="num-of-players">Izberi število igralcev</label>
<input type="number" min="1" name="num-of-players" id="num-of-players"></input>
<input type="submit" value="igraj">

View File

@ -1,3 +1,3 @@
;; Do not touch anything!!!
;; All things here should be automatically handled properly!!!
()
(("/soba/listek" "#<procedure 7f67a890e5c0 at app/controllers/soba.scm:7:2 (rc)>"))

View File

@ -3,7 +3,7 @@
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<!-- 2024-12-12 čet 21:14 -->
<!-- 2024-12-14 sob 06:33 -->
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>&lrm;</title>
@ -200,31 +200,39 @@
<h2>Table of Contents</h2>
<div id="text-table-of-contents" role="doc-toc">
<ul>
<li><a href="#orgea1bc79">1. Plan za vajo</a></li>
<li><a href="#orgf3f8684">2. predlogi</a></li>
<li><a href="#org1415cea">3. tekstualna igra stavkov p</a>
<li><a href="#org3047d1b">1. Plan za vajo</a></li>
<li><a href="#orgc256234">2. predlogi</a></li>
<li><a href="#org8f4e818">3. tekstualna igra stavkov p</a>
<ul>
<li><a href="#org9ef178b">3.1. meta</a></li>
<li><a href="#org8b67be4">3.2. homepage</a></li>
<li><a href="#org75d0d17">3.3. seja igre</a></li>
<li><a href="#org260847d">3.4. program</a>
<li><a href="#orgf2e3d1f">3.1. meta</a></li>
<li><a href="#org9a5fa8f">3.2. homepage</a></li>
<li><a href="#org8e4a823">3.3. seja igre</a></li>
<li><a href="#org090645a">3.4. program</a>
<ul>
<li><a href="#orga36bb03">3.4.1. boilerplate</a></li>
<li><a href="#orga5cbc1c">3.4.2. navodila za igro</a></li>
<li><a href="#orgf180008">3.4.1. boilerplate</a></li>
<li><a href="#org91c5b7e">3.4.2. navodila za igro</a></li>
</ul>
</li>
<li><a href="#orgd29ba3f">3.5. Nova soba</a>
<ul>
<li><a href="#org5a1319f">3.5.1. (podatkovni) model sobe</a></li>
<li><a href="#orgc249def">3.5.2. krmilnik (controller) sobe</a></li>
<li><a href="#org39fdd0b">3.5.3. Forma za vprasanje</a></li>
<li><a href="#org610c156">3.5.4. Podatkovni model</a></li>
<li><a href="#org94b4a79">3.5.5. sablona za listek</a></li>
</ul>
</li>
<li><a href="#org57c0424">3.5. Nova soba</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div id="outline-container-orgea1bc79" class="outline-2">
<h2 id="orgea1bc79"><span class="section-number-2">1.</span> Plan za vajo</h2>
<div id="outline-container-org3047d1b" class="outline-2">
<h2 id="org3047d1b"><span class="section-number-2">1.</span> Plan za vajo</h2>
</div>
<div id="outline-container-orgf3f8684" class="outline-2">
<h2 id="orgf3f8684"><span class="section-number-2">2.</span> predlogi</h2>
<div id="outline-container-orgc256234" class="outline-2">
<h2 id="orgc256234"><span class="section-number-2">2.</span> predlogi</h2>
<div class="outline-text-2" id="text-2">
<ul class="org-ul">
<li>tekstualna igra stavkov
@ -251,20 +259,20 @@
</p>
</div>
</div>
<div id="outline-container-org1415cea" class="outline-2">
<h2 id="org1415cea"><span class="section-number-2">3.</span> tekstualna igra stavkov p</h2>
<div id="outline-container-org8f4e818" class="outline-2">
<h2 id="org8f4e818"><span class="section-number-2">3.</span> tekstualna igra stavkov p</h2>
<div class="outline-text-2" id="text-3">
</div>
<div id="outline-container-org9ef178b" class="outline-3">
<h3 id="org9ef178b"><span class="section-number-3">3.1.</span> meta</h3>
<div id="outline-container-orgf2e3d1f" class="outline-3">
<h3 id="orgf2e3d1f"><span class="section-number-3">3.1.</span> meta</h3>
<div class="outline-text-3" id="text-3-1">
<p>
Sem pišemo plan za program igranja igre. Poskušamo kratko in jedrnato opisati prvi prototip, ki naj čimprej deluje in je zavoljo enostavnosti karseda podoben igranju v živo. Ob pisanju se poraja veliko idej, za katere je bolje, da se potencialno uvedejo kasneje, sicer se cilj delujočega prototipa sproti prehitro oddaljuje.
</p>
</div>
</div>
<div id="outline-container-org8b67be4" class="outline-3">
<h3 id="org8b67be4"><span class="section-number-3">3.2.</span> homepage</h3>
<div id="outline-container-org9a5fa8f" class="outline-3">
<h3 id="org9a5fa8f"><span class="section-number-3">3.2.</span> homepage</h3>
<div class="outline-text-3" id="text-3-2">
<p>
Na home page imamo kratka navodila in formo nova igra s poljem stevilo igralcev.
@ -276,8 +284,8 @@ Na tem koraku se generira seja glede na število igralcev.
</p>
</div>
</div>
<div id="outline-container-org75d0d17" class="outline-3">
<h3 id="org75d0d17"><span class="section-number-3">3.3.</span> seja igre</h3>
<div id="outline-container-org8e4a823" class="outline-3">
<h3 id="org8e4a823"><span class="section-number-3">3.3.</span> seja igre</h3>
<div class="outline-text-3" id="text-3-3">
<p>
Meta Podatki
@ -301,8 +309,8 @@ Ko so vsi oddali odgovore, se ti izpiše stavek, ki ga lahko prebereš ostalim i
</p>
</div>
</div>
<div id="outline-container-org260847d" class="outline-3">
<h3 id="org260847d"><span class="section-number-3">3.4.</span> program</h3>
<div id="outline-container-org090645a" class="outline-3">
<h3 id="org090645a"><span class="section-number-3">3.4.</span> program</h3>
<div class="outline-text-3" id="text-3-4">
<p>
Izbrali smo artanis web framework: <a href="https://artanis.dev/">https://artanis.dev/</a>
@ -313,8 +321,8 @@ Namestitev:
<li>Debian: <code>apt install guix; guix install artanis</code></li>
</ul>
</div>
<div id="outline-container-orga36bb03" class="outline-4">
<h4 id="orga36bb03"><span class="section-number-4">3.4.1.</span> boilerplate</h4>
<div id="outline-container-orgf180008" class="outline-4">
<h4 id="orgf180008"><span class="section-number-4">3.4.1.</span> boilerplate</h4>
<div class="outline-text-4" id="text-3-4-1">
<p>
Artanis ima orodje za terminal, imenovano <code>art</code>. Z orodje mdr. pripravimo skelet novega projekta: <code>art create igra-stavkov</code>.
@ -333,7 +341,7 @@ Strežnik se nam odpre na naslovu <a href="http://127.0.0.1:3000">http://127.0.0
</p>
<div id="orgd80eba0" class="figure">
<div id="org78f09e6" class="figure">
<p><img src="./igra-stavkov-1.png" alt="igra-stavkov-1.png" />
</p>
</div>
@ -344,8 +352,8 @@ Drugi potem stran vidijo na naslovu <code>http://&lt;ip_naslov&gt;:3000</code>,
</p>
</div>
</div>
<div id="outline-container-orga5cbc1c" class="outline-4">
<h4 id="orga5cbc1c"><span class="section-number-4">3.4.2.</span> navodila za igro</h4>
<div id="outline-container-org91c5b7e" class="outline-4">
<h4 id="org91c5b7e"><span class="section-number-4">3.4.2.</span> navodila za igro</h4>
<div class="outline-text-4" id="text-3-4-2">
<p>
Igro lahko igrata dva ali več igralcev. Igralci skupaj sestavljajo stavke, tako da vnaprej odgovarjajo na vprašanja:
@ -360,7 +368,7 @@ Igro lahko igrata dva ali več igralcev. Igralci skupaj sestavljajo stavke, tako
</ul>
</div>
<ol class="org-ol">
<li><a id="org2d9239a"></a>v živo<br />
<li><a id="org1c8bee7"></a>v živo<br />
<div class="outline-text-5" id="text-3-4-2-1">
<p>
Vsak igralec potrebuje listek in pisalo. Igralci skupaj odgovarjajo na
@ -371,7 +379,7 @@ igralcu in preberejo cel stavek.
</p>
</div>
</li>
<li><a id="org4867869"></a>na naši aplikaciji<br />
<li><a id="org6f8954c"></a>na naši aplikaciji<br />
<div class="outline-text-5" id="text-3-4-2-2">
<p>
Na naši aplikaciji je igra zelo podobna. Izberete število igralcev in ustvarite
@ -385,42 +393,36 @@ Ustvarimo nov fajl na lokaciji <code>pub/index.html</code>:
</p>
<div class="org-src-container">
<pre class="src src-html"> &lt;<span style="color: #fabd2f;">html</span>&gt;
&lt;<span style="color: #fabd2f;">head</span>&gt;
&lt;<span style="color: #fabd2f;">meta</span> <span style="color: #83a598;">charset</span>=<span style="color: #b8bb26;">"UTF-8"</span>&gt;
&lt;<span style="color: #fabd2f;">meta</span> <span style="color: #83a598;">name</span>=<span style="color: #b8bb26;">"viewport"</span> <span style="color: #83a598;">content</span>=<span style="color: #b8bb26;">"width=device-width, initial-scale=1.0"</span>&gt;
&lt;<span style="color: #fabd2f;">title</span>&gt;<span style="font-weight: bold; text-decoration: underline;">igra stavkov</span>&lt;/<span style="color: #fabd2f;">title</span>&gt;
&lt;/<span style="color: #fabd2f;">head</span>&gt;
&lt;<span style="color: #fabd2f;">body</span>&gt;
&lt;<span style="color: #fabd2f;">h1</span>&gt;<span style="font-weight: bold; text-decoration: underline;">igra stavkov</span>&lt;/<span style="color: #fabd2f;">h1</span>&gt;
<pre class="src src-html"> &lt;<span style="color: #fabd2f;">html</span>&gt;
&lt;<span style="color: #fabd2f;">head</span>&gt;
&lt;<span style="color: #fabd2f;">meta</span> <span style="color: #83a598;">charset</span>=<span style="color: #b8bb26;">"UTF-8"</span>&gt;
&lt;<span style="color: #fabd2f;">meta</span> <span style="color: #83a598;">name</span>=<span style="color: #b8bb26;">"viewport"</span> <span style="color: #83a598;">content</span>=<span style="color: #b8bb26;">"width=device-width, initial-scale=1.0"</span>&gt;
&lt;<span style="color: #fabd2f;">title</span>&gt;<span style="font-weight: bold; text-decoration: underline;">igra stavkov</span>&lt;/<span style="color: #fabd2f;">title</span>&gt;
&lt;/<span style="color: #fabd2f;">head</span>&gt;
&lt;<span style="color: #fabd2f;">body</span>&gt;
&lt;<span style="color: #fabd2f;">h1</span>&gt;<span style="font-weight: bold; text-decoration: underline;">igra stavkov</span>&lt;/<span style="color: #fabd2f;">h1</span>&gt;
&lt;<span style="color: #fabd2f;">h2</span>&gt;<span style="font-weight: bold; font-style: italic; text-decoration: underline;">v &#382;ivo</span>&lt;/<span style="color: #fabd2f;">h2</span>&gt;
&lt;<span style="color: #fabd2f;">p</span>&gt;
Vsak igralec potrebuje listek in pisalo. Igralci skupaj odgovarjajo na
vpra&#353;anja, po vsakem odgovoru pa listek prepognejo in podajo naprej. Svoj
naslednji odgovor nato napi&#353;ejo pod prepognjen del in spet podajo listek naprej.
Ko odogovorijo na vsa vpra&#353;anja, &#353;e enkrat podajo listek naprej naslednjemu
igralcu in preberejo cel stavek.
&lt;/<span style="color: #fabd2f;">p</span>&gt;
&lt;<span style="color: #fabd2f;">h2</span>&gt;<span style="font-weight: bold; font-style: italic; text-decoration: underline;">v &#382;ivo</span>&lt;/<span style="color: #fabd2f;">h2</span>&gt;
&lt;<span style="color: #fabd2f;">p</span>&gt;
Vsak igralec potrebuje listek in pisalo. Igralci skupaj odgovarjajo na vpra&#353;anja, po vsakem odgovoru pa listek prepognejo in podajo naprej. Svoj naslednji odgovor nato napi&#353;ejo pod prepognjen del in spet podajo listek naprej. Ko odogovorijo na vsa vpra&#353;anja, &#353;e enkrat podajo listek naprej naslednjemu igralcu in preberejo cel stavek.
&lt;/<span style="color: #fabd2f;">p</span>&gt;
&lt;<span style="color: #fabd2f;">h2</span>&gt;<span style="font-weight: bold; font-style: italic; text-decoration: underline;">prek spleta (na&#353;a varianta)</span>&lt;/<span style="color: #fabd2f;">h2</span>&gt;
&lt;<span style="color: #fabd2f;">p</span>&gt;
Vsak igralec potrebuje ra&#269;unalnik z brskalnikom in internetno povezavo. Dobavna veriga obsega rudnike redkih kovin, silicij, proizvodnjo &#269;ipov, komunikacijsko mre&#382;o, etcetera.
&lt;/<span style="color: #fabd2f;">p</span>&gt;
&lt;<span style="color: #fabd2f;">h2</span>&gt;<span style="font-weight: bold; font-style: italic; text-decoration: underline;">prek spleta (na&#353;a varianta)</span>&lt;/<span style="color: #fabd2f;">h2</span>&gt;
&lt;<span style="color: #fabd2f;">p</span>&gt;
Vsak igralec potrebuje ra&#269;unalnik z brskalnikom in internetno povezavo. Dobavna veriga obsega rudnike redkih kovin, silicij, proizvodnjo &#269;ipov, komunikacijsko mre&#382;o, etcetera.
&lt;/<span style="color: #fabd2f;">p</span>&gt;
&lt;<span style="color: #fabd2f;">p</span>&gt;
Na na&#353;i aplikaciji je igra zelo podobna. Izberete &#353;tevilo igralcev in ustvarite
novo sobo za igranje. Povezavo do sobo po&#353;ljete soigralcem in po vrsti
odgovarjate na vpra&#353;anja, dokler ne izpolnite vseh. Vsakemu igralcu se na koncu
izpi&#353;e en sestavljen stavek.
&lt;<span style="color: #fabd2f;">p</span>&gt;
Na na&#353;i aplikaciji je igra zelo podobna. Izberete &#353;tevilo igralcev in ustvarite novo sobo za igranje. Povezavo do sobo po&#353;ljete soigralcem in po vrsti odgovarjate na vpra&#353;anja, dokler ne izpolnite vseh. Vsakemu igralcu se na koncu izpi&#353;e en sestavljen stavek.
&lt;/<span style="color: #fabd2f;">p</span>&gt;
&lt;<span style="color: #fabd2f;">form</span>&gt;
&lt;<span style="color: #fabd2f;">label</span> <span style="color: #83a598;">for</span>=<span style="color: #b8bb26;">"num-of-players"</span>&gt;Izberi &#353;tevilo igralcev&lt;/<span style="color: #fabd2f;">label</span>&gt;
&lt;<span style="color: #fabd2f;">input</span> <span style="color: #83a598;">type</span>=<span style="color: #b8bb26;">"number"</span> <span style="color: #83a598;">min</span>=<span style="color: #b8bb26;">"1"</span> <span style="color: #83a598;">name</span>=<span style="color: #b8bb26;">"num-of-players"</span> <span style="color: #83a598;">id</span>=<span style="color: #b8bb26;">"num-of-players"</span>&gt;&lt;/<span style="color: #fabd2f;">input</span>&gt;
&lt;<span style="color: #fabd2f;">input</span> <span style="color: #83a598;">type</span>=<span style="color: #b8bb26;">"submit"</span> <span style="color: #83a598;">value</span>=<span style="color: #b8bb26;">"igraj"</span>&gt;
&lt;/<span style="color: #fabd2f;">form</span>&gt;
&lt;/<span style="color: #fabd2f;">body</span>&gt;
&lt;/<span style="color: #fabd2f;">html</span>&gt;
&lt;<span style="color: #fabd2f;">form</span> <span style="color: #83a598;">method</span>=<span style="color: #b8bb26;">"POST"</span> <span style="color: #83a598;">action</span>=<span style="color: #b8bb26;">"/soba/ustvari"</span>&gt;
&lt;<span style="color: #fabd2f;">label</span> <span style="color: #83a598;">for</span>=<span style="color: #b8bb26;">"num-of-players"</span>&gt;Izberi &#353;tevilo igralcev&lt;/<span style="color: #fabd2f;">label</span>&gt;
&lt;<span style="color: #fabd2f;">input</span> <span style="color: #83a598;">type</span>=<span style="color: #b8bb26;">"number"</span> <span style="color: #83a598;">min</span>=<span style="color: #b8bb26;">"1"</span> <span style="color: #83a598;">name</span>=<span style="color: #b8bb26;">"num-of-players"</span> <span style="color: #83a598;">id</span>=<span style="color: #b8bb26;">"num-of-players"</span>&gt;&lt;/<span style="color: #fabd2f;">input</span>&gt;
&lt;<span style="color: #fabd2f;">input</span> <span style="color: #83a598;">type</span>=<span style="color: #b8bb26;">"submit"</span> <span style="color: #83a598;">value</span>=<span style="color: #b8bb26;">"igraj"</span>&gt;
&lt;/<span style="color: #fabd2f;">form</span>&gt;
&lt;/<span style="color: #fabd2f;">body</span>&gt;
&lt;/<span style="color: #fabd2f;">html</span>&gt;
</pre>
</div>
@ -441,7 +443,7 @@ Domača stran se nam zdaj naloži!
</p>
<div id="org99d57f7" class="figure">
<div id="orga999122" class="figure">
<p><img src="igra-stavkov-2.png" alt="igra-stavkov-2.png" />
</p>
</div>
@ -450,9 +452,13 @@ Domača stran se nam zdaj naloži!
</ol>
</div>
</div>
<div id="outline-container-org57c0424" class="outline-3">
<h3 id="org57c0424"><span class="section-number-3">3.5.</span> Nova soba</h3>
<div id="outline-container-orgd29ba3f" class="outline-3">
<h3 id="orgd29ba3f"><span class="section-number-3">3.5.</span> Nova soba</h3>
<div class="outline-text-3" id="text-3-5">
</div>
<div id="outline-container-org5a1319f" class="outline-4">
<h4 id="org5a1319f"><span class="section-number-4">3.5.1.</span> (podatkovni) model sobe</h4>
<div class="outline-text-4" id="text-3-5-1">
<p>
Zavoljo enostavnosti v <code>conf/artanis.conf</code> omogočimo podporo za sqlite3 bazo (ki je v fajlu in tako nismo odvisno od dodatne programske opreme za shranjevanje stanja):
</p>
@ -472,8 +478,109 @@ Soba ima dve lastnosti; unikaten ID in število igralcev.
</p>
<p>
Ustvarimo model zanjo;
Ustvarimo model zanjo: <code>art draw model soba</code>
</p>
<p>
Tako se generira skelet podatkovnega modela za sobo v <code>app/models/soba.scm</code>, ki ga dopolnimo s potrebnimi podatki:
</p>
<div class="org-src-container">
<pre class="src src-scheme"><span style="color: #458588;">(</span><span style="color: #fb4933;">import</span> <span style="color: #b16286;">(</span>artanis mvc model<span style="color: #b16286;">)</span><span style="color: #458588;">)</span>
<span style="color: #458588;">(</span>create-artanis-model
soba <span style="color: #7c6f64;">;</span><span style="color: #7c6f64;">ime modela</span>
<span style="color: #b16286;">(</span>id auto <span style="color: #8ec07c;">(</span><span style="color: #fe8019;">#:primary-key</span><span style="color: #8ec07c;">)</span><span style="color: #b16286;">)</span>
<span style="color: #b16286;">(</span>stevilo_igralcev tinyint <span style="color: #8ec07c;">(</span><span style="color: #fe8019;">#:not-null</span><span style="color: #8ec07c;">)</span><span style="color: #b16286;">)</span><span style="color: #458588;">)</span>
</pre>
</div>
</div>
</div>
<div id="outline-container-orgc249def" class="outline-4">
<h4 id="orgc249def"><span class="section-number-4">3.5.2.</span> krmilnik (controller) sobe</h4>
<div class="outline-text-4" id="text-3-5-2">
<p>
Naloga krmilnika je, da ustvari novo sobo in igralko pelje na pravilni link za igranje, shranjuje odgovore in na koncu prikaže stavek.
</p>
<p>
Ustvarimo ga z ukazom: <code>art draw controller soba listek</code>
</p>
<p>
To nam ustvari dva nova fajla, <code>app/controllers/soba.scm</code>, s katerim bomo omogočili obisk ustvarjene sobe ter <code>app/view/soba/listek.html.tpl</code>, šablono za formular vnosa odgovorov (listek).
</p>
<p>
Najprej pa moramo sobo narediti. V <code>ENTRY</code> dodamo pod prej ustvarjeno preusmeritev na index.html POST handler:
</p>
</div>
</div>
<div id="outline-container-org39fdd0b" class="outline-4">
<h4 id="org39fdd0b"><span class="section-number-4">3.5.3.</span> Forma za vprasanje</h4>
<div class="outline-text-4" id="text-3-5-3">
<p>
Forma za posamezno vprasanje
</p>
<div class="org-src-container">
<pre class="src src-html">&lt;<span style="color: #fabd2f;">form</span>&gt;
&lt;<span style="color: #fabd2f;">label</span> <span style="color: #83a598;">for</span>=<span style="color: #b8bb26;">"vprasanje"</span>&gt;{vprasanje}&lt;/<span style="color: #fabd2f;">label</span>&gt;
&lt;<span style="color: #fabd2f;">input</span> <span style="color: #83a598;">id</span>=<span style="color: #b8bb26;">"vprasanje"</span> <span style="color: #83a598;">name</span>=<span style="color: #b8bb26;">"vprasanje"</span> <span style="color: #83a598;">type</span>=<span style="color: #b8bb26;">"textarea"</span>&gt;&lt;/<span style="color: #fabd2f;">input</span>&gt;
&lt;<span style="color: #fabd2f;">input</span> <span style="color: #83a598;">type</span>=<span style="color: #b8bb26;">"submit"</span> <span style="color: #83a598;">value</span>=<span style="color: #b8bb26;">"odgovori"</span>&gt;
&lt;/<span style="color: #fabd2f;">form</span>&gt;
</pre>
</div>
<p>
Forma se submita glede na session cookie, ki ga ima igralec, k dolocenemu igralcu.
</p>
<p>
Submitanje vrne tip podatka listek. Ce listek nima vseh odgovorov, vrnemo formo
z vprasanjem. Ce ima vse odgovore, prikazemo stavek.
</p>
</div>
</div>
<div id="outline-container-org610c156" class="outline-4">
<h4 id="org610c156"><span class="section-number-4">3.5.4.</span> Podatkovni model</h4>
<div class="outline-text-4" id="text-3-5-4">
<p>
listek:
</p>
<ul class="org-ul">
<li>id od sobe (tip: string)</li>
<li>kaj (tip odogovor - uuid)</li>
<li>kdaj (tip odogovor)</li>
<li>kje</li>
<li>zakaj</li>
<li>kako</li>
<li>kaj</li>
</ul>
<p>
odgovor:
</p>
<ul class="org-ul">
<li>vrednost (text)</li>
<li>session igralca</li>
<li>uuid</li>
</ul>
</div>
</div>
<div id="outline-container-org94b4a79" class="outline-4">
<h4 id="org94b4a79"><span class="section-number-4">3.5.5.</span> sablona za listek</h4>
<div class="outline-text-4" id="text-3-5-5">
<p>
Ce je listek ze izpolnjen - prikazi cel listek, to je sestavljen stavek.
</p>
<p>
Ce listek ni izponjen, prikazi samo zadnje neizpoljneno vprasanje.
</p>
<p>
Submitanje forme ti vrne naslednji listek (ce ga je igralec pred tabo izpolnil).
</p>
</div>
</div>
</div>
</div>

View File

@ -101,25 +101,19 @@ Ustvarimo nov fajl na lokaciji ~pub/index.html~:
<h2>v živo</h2>
<p>
Vsak igralec potrebuje listek in pisalo. Igralci skupaj odgovarjajo na
vprašanja, po vsakem odgovoru pa listek prepognejo in podajo naprej. Svoj
naslednji odgovor nato napišejo pod prepognjen del in spet podajo listek naprej.
Ko odogovorijo na vsa vprašanja, še enkrat podajo listek naprej naslednjemu
igralcu in preberejo cel stavek.
Vsak igralec potrebuje listek in pisalo. Igralci skupaj odgovarjajo na vprašanja, po vsakem odgovoru pa listek prepognejo in podajo naprej. Svoj naslednji odgovor nato napišejo pod prepognjen del in spet podajo listek naprej. Ko odogovorijo na vsa vprašanja, še enkrat podajo listek naprej naslednjemu igralcu in preberejo cel stavek.
</p>
<h2>prek spleta (naša varianta)</h2>
<p>
Vsak igralec potrebuje računalnik z brskalnikom in internetno povezavo. Dobavna veriga obsega rudnike redkih kovin, silicij, proizvodnjo čipov, komunikacijsko mrežo, etcetera.
</p>
<p>
Na naši aplikaciji je igra zelo podobna. Izberete število igralcev in ustvarite
novo sobo za igranje. Povezavo do sobo pošljete soigralcem in po vrsti
odgovarjate na vprašanja, dokler ne izpolnite vseh. Vsakemu igralcu se na koncu
izpiše en sestavljen stavek.
<form>
<p>
Na naši aplikaciji je igra zelo podobna. Izberete število igralcev in ustvarite novo sobo za igranje. Povezavo do sobo pošljete soigralcem in po vrsti odgovarjate na vprašanja, dokler ne izpolnite vseh. Vsakemu igralcu se na koncu izpiše en sestavljen stavek.
</p>
<form method="POST" action="/soba/ustvari">
<label for="num-of-players">Izberi število igralcev</label>
<input type="number" min="1" name="num-of-players" id="num-of-players"></input>
<input type="submit" value="igraj">
@ -141,6 +135,7 @@ Domača stran se nam zdaj naloži!
** Nova soba
*** (podatkovni) model sobe
Zavoljo enostavnosti v ~conf/artanis.conf~ omogočimo podporo za sqlite3 bazo (ki je v fajlu in tako nismo odvisno od dodatne programske opreme za shranjevanje stanja):
#+begin_src conf
@ -152,4 +147,65 @@ In ponovno poženemo strežnik: ~art work -g~
Soba ima dve lastnosti; unikaten ID in število igralcev.
Ustvarimo model zanjo;
Ustvarimo model zanjo: ~art draw model soba~
Tako se generira skelet podatkovnega modela za sobo v ~app/models/soba.scm~, ki ga dopolnimo s potrebnimi podatki:
#+begin_src scheme :tangle ./igra-stavkov/app/models/soba.scm
(import (artanis mvc model))
(create-artanis-model
soba ;ime modela
(id auto (#:primary-key))
(stevilo_igralcev tinyint (#:not-null)))
#+end_src
*** krmilnik (controller) sobe
Naloga krmilnika je, da ustvari novo sobo in igralko pelje na pravilni link za igranje, shranjuje odgovore in na koncu prikaže stavek.
Ustvarimo ga z ukazom: ~art draw controller soba listek~
To nam ustvari dva nova fajla, ~app/controllers/soba.scm~, s katerim bomo omogočili obisk ustvarjene sobe ter ~app/view/soba/listek.html.tpl~, šablono za formular vnosa odgovorov (listek).
Najprej pa moramo sobo narediti. V ~ENTRY~ dodamo pod prej ustvarjeno preusmeritev na index.html POST handler:
*** Forma za vprasanje
Forma za posamezno vprasanje
#+begin_src html
<form>
<label for="vprasanje">{vprasanje}</label>
<input id="vprasanje" name="vprasanje" type="textarea"></input>
<input type="submit" value="odgovori">
</form>
#+end_src
Forma se submita glede na session cookie, ki ga ima igralec, k dolocenemu igralcu.
Submitanje vrne tip podatka listek. Ce listek nima vseh odgovorov, vrnemo formo
z vprasanjem. Ce ima vse odgovore, prikazemo stavek.
*** Podatkovni model
listek:
- id od sobe (tip: string)
- kaj (tip odogovor - uuid)
- kdaj (tip odogovor)
- kje
- zakaj
- kako
- kaj
odgovor:
- vrednost (text)
- session igralca
- uuid
*** sablona za listek
Ce je listek ze izpolnjen - prikazi cel listek, to je sestavljen stavek.
Ce listek ni izponjen, prikazi samo zadnje neizpoljneno vprasanje.
Submitanje forme ti vrne naslednji listek (ce ga je igralec pred tabo izpolnil).