{% extends "game.html" %}
{% load i18n %}
{% load trans_to %}

{% block addcss %}

<style type="text/css">

html {
    overflow: scroll;
    height: 100%;
    margin-bottom: 1px;
}

body {
margin:10px 10px 0px 10px;
padding:0px;
}
{# background-image: url(../../media/images/bakgrunn12.jpg); #}

#leftcontent {
position: fixed;
left: 10px;
top: 95px;
width: 180px;
}
#centercontent {
background:white;
margin-left: 179px;
margin-right:9px;
padding: 20px;
border: 1px solid #150517;

font-family: Times;
margin-left: 181px;
margin-right:11px;
margin-bottom: 1px;
}
body #centercontent {
margin-left: 181px;
margin-right:11px;
}
#rightcontent {
position: fixed;
right:10px;
top:95px;
width:120px;
}

#banner {
height:80px;
height:80px;
}
html>body #banner {
height:80px;
}


{% if not forms %}

#centercontent {
background:white;
margin-left: 179px;
margin-right:9px;
padding: 20px;
border: 1px solid #150517;
font-family: Times;
margin-left: 181px;
margin-right:11px;
margin-bottom: 1px;
}
body #centercontent {
margin-left: 181px;
margin-right:11px;
}
{% endif %}
</style>

{% endblock %}

{% block extrajs %}
<script type="text/javascript">
function submitSahka(dia) {
   document.gameform.dialogue.value=dia;
   document.gameform.submit();
   return True;
}
</script>

<script src="{{ MEDIA_URL }}/js/prototype.js" type="text/javascript"></script>
<script src="{{ MEDIA_URL }}/js/lll1_oahpa.js" type="text/javascript"></script>
<!--[if lt IE 7]>
<script defer type="text/javascript" src="{{ MEDIA_URL }}/js/pngfix.js"></script>
<![endif]-->
{% endblock %}

{% block imgprefix %}sahka{% endblock %}
{% block questionsetclass %}sahka{% endblock %}
{% block gametitlename %}<a href="/{{ URL_PREFIX }}/sahka">SAHKA</a>{% endblock %}
{% block navbar %}
{% if not forms %}
<ul class="sidelist">
	<li class="selected"><t class="interface">{% trans_to "Select a dialogue" "sme" %}<span class="invisible">{% trans "Select a dialogue" %}</span></t></li>
</ul>

{% endif %}

<!-- Image included from the dialogue -->
{% if image %}
<p>&nbsp;</p>
<center>
<img border="1" width="140" border="0" src="{{ MEDIA_URL }}/images/{{ image }}"/><br/>
</center>
{% endif %}

{% if wordlist %}
<center>
<br/>
<table cellpadding="8px" bgcolor="white" border="1" class="wordlist"><tr><td>{{ wordlist }}</td></tr></table>
</center>
{% endif %}
{% endblock %}

{% block veiledning %}
{% ifequal LANGUAGE_CODE "sme" %}
http://{{hst}}/sme/useoahpa/sahka.html
{% endifequal %}
{% ifequal LANGUAGE_CODE "fi" %}
http://{{hst}}/sme/useoahpa/sahka.fin.html
{% endifequal %}
{% ifequal LANGUAGE_CODE "en" %}
http://{{hst}}/sme/useoahpa/sahka.eng.html
{% endifequal %}
{% ifequal LANGUAGE_CODE "no" %}
http://{{hst}}/sme/useoahpa/sahka.nob.html
{% endifequal %}
{% ifequal LANGUAGE_CODE "sv" %}
http://{{hst}}/sme/useoahpa/sahka.nob.html
{% endifequal %}
{% endblock %}


{% block name %}Sahka{% endblock %}
{% block pagename %}/{{ URL_PREFIX }}/sahka/{% endblock %}


{% block settings %}

{% if forms %}
<div class="grammarlinks">
        {% include 'grammar_links_menu.html' %}
</div>
<tr><td>
<!--<p>{% trans "NB! NB! The Sahka game is not working properly, due to technical problems! NB! NB!</p> -->
<div class="interface" style="width:500px;"> {% trans_to "Answer to the questions with full sentences. Remember big initial letter in names." "sme" %} <span class="invisible">{% trans "Answer to the questions with full sentences. Remember big initial letter in names." %}</span></br></br></div>
<hr/>
</td></tr>
{% endif %}

{% if not forms %}

<table width="700">
<!-- emergency tag starts -->
<tr>
<!--{% trans "NB! NB! The Sahka game is not working properly, due to technical problems! NB! NB!" %} -->
<!--{% trans "NB! NB! The Sahka game is temporarily out of order, due to technical maintenance! NB! NB!" %} -->
</tr>
<!-- emergency tag ends -->
<tr>
<td>
<table width="100%" align="center" cellpadding="10px">
<tr><td align="center" valign="middle">
<input type="hidden" name="dialogue" id="id_dialogue" />
<input type="hidden" name="settings" id="settings" />
<a href="javascript:submitSahka('hello');">
<img border="0px" height="250" src="{{ MEDIA_URL }}/images/man_small.jpg"/></br>
<t class="interface">{% trans_to "Buorre beaivi" "sme" %}<span class="invisible">{% trans "Buorre beaivi" %}</span></t>
</a>
</td>
<td align="center valign="middle"">
<a href="javascript:submitSahka('car');">
<img border="0px" height="120"  src="{{ MEDIA_URL }}/images/biila.jpg"/></br>
<t class="interface">{% trans_to "Biila" "sme" %}<span class="invisible">{% trans "Biila" %}</span></t>
</a>
</td>
<!----<td>
<a href="javascript:submitSahka('firstmeeting_girl');">
<img border="0px" width="100"  src="{{ MEDIA_URL }}/images/girl_small.jpg"/></br>
{% trans "Meeting with Lisa" %}</a>
</td><td>
<a href="javascript:submitSahka('firstmeeting_boy');">
<img border="0px" width="100"  src="{{ MEDIA_URL }}/images/boy_small.jpg"/>
</br>{% trans "Meeting with Lemet" %}</a>
</td>
</tr>
<tr> --->
<td align="center" valign="middle">
<a href="javascript:submitSahka('coffee');">
<img border="0px" height="120" width="120" src="{{ MEDIA_URL }}/images/dialogue_coffee.png"/><br/>
<t class="interface">{% trans_to "Gáffeboddu" "sme" %}<span class="invisible">{% trans "Gáffeboddu" %}</span></t>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="javascript:submitSahka('visit');">
<img border="0px" width="180" height="250" src="{{ MEDIA_URL }}/images/visit001.jpg"/></br>
<t class="interface">{% trans_to "Visit" "sme" %}<span class="invisible">{% trans "Visit" %}</span></t>
</a>
</td>

<td align="center">
<a href="javascript:submitSahka('grocery');">
<img border="0px" width="200" height="200" src="{{ MEDIA_URL }}/images/grocery.jpg"/></br>
<t class="interface">{% trans_to "Grocery" "sme" %}<span class="invisible">{% trans "Grocery" %}</span></t>
</a>
</td>
<td align="center">
<a href="javascript:submitSahka('shopadj');">
<img border="0px" height="200" src="{{ MEDIA_URL }}/images/2scarves_small.jpg"/><br/>
<t class="interface">{% trans_to "Shop" "sme" %}<span class="invisible">{% trans "Shop" %}</span></t>
</a>
</td>
</tr>
</table>

{% endif %}
{% endblock settings %}

{% block hidden %}
<input type="hidden" name="topicnumber" value="{{ topicnumber }}" />
<input type="hidden" name="num_fields" value="{{ num_fields }}" />
<input type="hidden" name="image" value="{{ image }}" />
<input type="hidden" name="wordlist" value="{{ wordlist }}" />
<input type="hidden" name="gametype" value="sahka" />
<input type="hidden" name="dialogue" value="{{ dialogue }}" />
<input type="hidden" name="attempts" value="{{ attempts }}" />
{% endblock %}

{% for form in forms %}
{% block question %}
{% if form.utterance %}
    {{ form.utterance }}
{% endif %}
  {% if show_correct %}
		{% ifequal form.error "error" %}
            <span style="margin-top:10px; margin-bottom:10px; display:table; border-style:solid; border-width:2px; border-color:#00FF99; border-radius:7px; padding:5px;">{{ form.correct_answers }}</span>
            {{ form.answer }}

        {% endifequal %}
  {% endif %}
 {% endblock %}


{% block submit %}
{% if forms %}

<span align="right">
  {% if not all_correct %}
    <t class="interface"><input type="submit" id="test" name="test" value="{% trans_to "Answer" "sme" %}"/><span class="invisible">{% trans "Answer" %}</span></t>
  {% if not show_correct %}
  {% if attempts > 1 %}
	   <t class="interface"><input type="submit" name="show_correct" value="{% trans_to "Show an example of the correct answer" "sme" %}" /><span class="invisible">{% trans "Show an example of the correct answer" %}</span></t>
  {% endif %}
  {% endif %}
  {% endif %}
  </span>
 {% endif %}


{% if messages %}
</br>
</br>
<table border='1' cellpadding='10' bgcolor='#F9F9F9'>
<tr><td>
{% for m in messages %}{{ m|safe }}<br/>{% endfor %}
</td></tr>
</table>
{% endif %}

{% endblock submit %}
{% endfor %}