{include:header.tpl}
{if:friend.id}<div id="friendurl">URL for the friend: <a href="{:host}{:prefix}/{:friend.id}">{:host}{:prefix}/{:friend.id}</a></div>{endif}
<div id="info">{:me.name}, score: <span id="score">{:score}</span>, turn: <span id="turn">{:turn}</span></div>
<div id="word">
<h1>{:word}</h1>
<small>({:wordSource})</small>
</div>
{if:win}
<div id="win">Answers are equal. You win!</div>
{endif}
{if:lose}
<div id="lose">Answers are different. You lose...</div>
{endif}
{if:waiting}
<div class="waiting">waiting for the friend</div>
{else}{if:selected}
<form id="ready" method="POST" action="{:prefix}/{:me.id}/ready">
<input type="text" name="word" autocomplete="off" placeholder="here you may suggest your word for the next turn" size=40 value="" />
<input type="submit" name="submit" value="next turn" />
</form>
{endif}{endif}
<div id="debug">my selection: {:me.selection}, friend's selection: {:friend.selection}</div>
<div id="cards">{loop:cards::card}
<form class="card{if:card.my} myCard{endif}{if:card.friends} friendsCard{endif}" method="POST" action="{:prefix}/{:me.id}/select/{:card.index}">
<img src="{:cardsPrefix}/{:card.name}" />
{if:me.selected}{else}<br /><input type="submit" value="select" />{endif}
</form>
{endloop}</div>
<hr />
<div id="logo"><a href="{:prefix}">back to start page</a></div>
{include:footer.tpl}