{% extends "_layout.html" %}

{%- block title -%}
    {%- match lang -%}
        {%- when Lang::en -%} Hello!
        {%- when Lang::de -%} Hallo!
        {%- when Lang::fr -%} Bonjour!
    {%- endmatch -%}
{%- endblock -%}

{%- block content -%}
    <h1>
        {%- match lang -%}
            {%- when Lang::en -%} Hello!
            {%- when Lang::de -%} Hallo!
            {%- when Lang::fr -%} Bonjour!
        {%- endmatch -%}
    </h1>
    <form
        method="GET"
        action="{{ req.url_for("greeting_handler", [lang])? }}"
        autocomplete="off"
    >
        <p>
            {%- match lang -%}
                {%- when Lang::en -%}
                    I would like to say <em>hello</em>. {#-~#}
                    Would you please tell me your name?
                {%- when Lang::de -%}
                    Ich möchte dir gerne <em>hallo</em> sagen. {#-~#}
                    Bitte nenne mir doch deinen Namen!
                {%- when Lang::fr -%}
                    Je voudrais vous dire <em>bonjour</em>. {#-~#}
                    Pourriez-vous me donner votre nom ?
            {%- endmatch -%}
        </p>
        <p>
            <label>
                {%- match lang -%}
                    {%- when Lang::en -%} My name is
                    {%- when Lang::de -%} Ich heiße
                    {%- when Lang::fr -%} Je m'appelle
                {%- endmatch -%}:
                <input
                    type="text"
                    value="{{name}}"
                    name="name"
                    required
                    style="width: 10em"
                />
            </label>
        </p>
        <p>
            <label>
                <button type="submit">
                    {%- match lang -%}
                        {%- when Lang::en -%} Greet me, then!
                        {%- when Lang::de -%} Dann begrüße mich!
                        {%- when Lang::fr -%} Saluons-nous !
                    {%- endmatch -%}
                </button>
            </label>
        </p>
    </form>

    <ul id="lang-select">
        {%- if lang != Lang::en -%}
            <li><a href="{{ req.url_for("index_handler", [Lang::en])? }}">This page in English</a></li>
        {%- endif -%}
        {%- if lang != Lang::de -%}
            <li><a href="{{ req.url_for("index_handler", [Lang::de])? }}">Diese Seite auf deutsch.</a></li>
        {%- endif -%}
        {%- if lang != Lang::fr -%}
            <li><a href="{{ req.url_for("index_handler", [Lang::fr])? }}">Cette page est en français.</a></li>
        {%- endif -%}
    </ul>
{%- endblock -%}