{# Only output the widget if the contenttype is translatable. So, it must have a 'locale' field. #}
{% if app.config.get('contenttypes/'~ app.request.get('contenttypeslug') ~ "/fields/locale") %}
<div class="panel panel-default panel-news">
    <div class="panel-heading">
        <i class="fa fa-fw fa-language"></i>
        Multilingual content
    </div>

    <div class="panel-body">

        {% set currentkey = locales|keys|first %}
        {% set current = locales|first %}

        {% for key, option in locales %}
            {% set current    = option.get('slug') == app['translate.slug'] ? option : current %}
            {% set currentkey = option.get('slug') == app['translate.slug'] ? key : currentkey %}
        {% endfor %}

        <p>Currently selected:
            <strong>
                {{ flag_icon(currentkey) }} {{ current.get('label') }} ({{ current.get('slug') }})
            </strong>
        <p>

        <div class="dropdown" id="locale-select">
            <button class="btn btn-default dropdown-toggle" data-toggle="dropdown" type="button">
                <span class="selected">Select language</span> &nbsp;
                <span class="caret"></span>
            </button>
            <ul class="dropdown-menu">
                {% for key, option in locales %}
                <li>
                    <a href="{{ url(
                                app.request.get('_route'),
                                app.request.get('_route_params')|merge({_locale: option.get('slug') })
                            )}}">
                        {{ flag_icon(key) }}
                        {% if key == currentkey %}<strong>{% endif %}
                        {{ option.get('label') }}
                        {% if key == currentkey %}<em>(current)</em></strong>{% endif %}
                    </a>
                </li>
            {% endfor %}
            </ul>
        </div>

    </div>
</div>
{% endif %}