{% if muc %}
    <ul class="list middle">
        <li>
            <span class="primary icon active on_mobile_after"
            id="chatheadercounter" onclick="Chat.get()"
                {% if counter > 0 %}data-counter="{{ counter }}"{% endif %}>
                <i class="material-symbols">arrow_back</i>
            </span>

            <span class="primary icon bubble active {% if not conference.connected %}disabled{% endif %}"
                onclick="RoomsUtils_ajaxGetDrawer('{{ jid|echapJS }}')">
                <img src="{{ conference.picture }}">
                {% if conference.connected %}
                    <span class="counter alt" {% if conference.group or conference.count < 10 %}data-mucreceipts="true"{% endif %}>
                        {% if conference.count > 99 %}99+{% else %}{{ conference.count }}{% endif %}
                    </span>
                {% endif %}
            </span>

            <span class="control icon active" onclick="ChatActions_ajaxShowSearchDialog('{{ jid|echapJS }}', true)">
                <i class="material-symbols">manage_search</i>
            </span>
            <span class="control icon active files_button" onclick="ChatActions_ajaxShowFiles('{{ jid|echapJS }}', true)" title="{{ __('chatactions.files') }}">
                <i class="material-symbols">perm_media</i>
            </span>

            {% if conference.group and conference.connected and conference.muji.count == 0 %}
                <span class="control icon active divided {% if in_call %}disabled{% endif %}" onclick="Visio_ajaxGetMujiLobby('{{ jid|echapJS }}', true, false);">
                    <i class="material-symbols">call</i>
                </span>
                <span class="control icon active {% if in_call %}disabled{% endif %}" onclick="Visio_ajaxGetMujiLobby('{{ jid|echapJS }}', true, true);">
                    <i class="material-symbols">videocam</i>
                </span>
            {% endif %}

            <span
                class="control icon show_context_menu active {% if not conference.connected %}disabled{% endif %}"
                onclick="MovimTpl.showContextMenu()">
                <i class="material-symbols">more_vert</i>
            </span>

            <div>
                {% if conference.muji.count > 0 %}
                    {% if conference.muji.joined %}
                        <button class="button oppose color red"
                                onclick="Visio_ajaxLeaveMuji('{{ jid|echapJS }}'); this.classList.add('disabled')">
                            <i class="material-symbols blink">call_end</i>
                        </button>
                    {% else %}
                        <button class="button oppose color blue {% if in_call %}disabled{% endif %}"
                                onclick="Visio_ajaxJoinMuji('{{ jid|echapJS }}', {% if conference.muji.video %}true{% else %}false{% endif %});">
                            <i class="material-symbols">call</i> {{ conference.muji.count }}
                        </button>
                    {% endif %}
                {% endif %}
                <p title="{{ jid }}" class="line active" onclick="RoomsUtils_ajaxGetDrawer('{{ jid|echapJS }}')">
                    {{ conference.title }}
                    {% if conference.notify == 0 %}
                        <span class="second" title="{{ __('room.notify_never') }}">
                            <i class="material-symbols">notifications_off</i>
                        </span>
                    {% elif conference.notify == 2 %}
                        <span class="second" title="{{ __('room.notify_always') }}">
                            <i class="material-symbols">notifications_active</i>
                        </span>
                    {% endif %}

                    <span class="second">
                        {% if conference.group %}
                            <i class="material-symbols">people_alt</i>
                        {% else %}
                            <i class="material-symbols">wifi_tethering</i>
                        {% endif %}
                    </span>

                    {% if conference.group and conference.subject %}
                        <span class="second" title="{{ conference.subject }}">
                            {{ conference.subject }}
                        </span>
                    {% endif %}
                </p>

                <p class="line active">
                    {% if conference.muji.count > 0 %}
                        {% if conference.muji.joined %}
                            <i class="material-symbols icon green blink">call</i>
                            {{ __('visio.joined_call') }}
                        {% else %}
                            <i class="material-symbols icon blue blink">call</i>
                            {{ __('visio.in_call') }}
                        {% endif %}
                        <span class="second">
                            <i class="material-symbols">schedule</i>
                            {{ conference.muji.since }}
                            -
                            {{ conference.muji.count }}
                            <i class="material-symbols">people</i>
                        </span>
                        •
                    {% endif %}
                    {% if not conference.connected %}
                        {{ __('button.connecting') }}…
                    {% elif conference.group %}
                        {% for value in conference.others %}
                            <span onclick="Chat.quoteMUC('{{ value.nick|echapJS }}', true);" class="icon bubble tiny">
                                <img src="{{ value.picture }}">
                            </span><span onclick="Chat.quoteMUC('{{ value.nick|echapJS }}', true);">{{ value.nick }}</span>
                        {% endfor %}
                    {% elif conference.subject %}
                        <span onclick="RoomsUtils_ajaxGetDrawer('{{ jid|echapJS }}')">{{ conference.subject }}</span>
                    {% endif %}
                </p>
            </div>
        </li>
    </ul>

    <ul class="list context_menu thin active">
        <li class="files_menu" onclick="ChatActions_ajaxShowFiles('{{ jid|echapJS }}', true)">
            <span class="primary icon gray">
                <i class="material-symbols">perm_media</i>
            </span>
            <div>
                <p class="line">{{ __('chatactions.files') }}</p>
            </div>
        </li>
        {% if conference.role == 'moderator' or conference.affiliation == 'owner' %}
            <li class="subheader">
                <div>
                    <p class="line">{{ __('page.administration') }}</p>
                </div>
            </li>
        {% endif %}
        {% if conference.affiliation == 'owner' %}
            <li onclick="RoomsUtils_ajaxGetConfig('{{ jid|echapJS }}')">
                <span class="primary icon gray">
                    <a href="#" onclick="listIconClick(event)">
                        <i class="material-symbols">settings</i>
                    </a>
                </span>
                <div>
                    <p>{{ __('chatrooms.config') }}</p>
                </div>
            </li>
        {% endif %}
        {% if conference.role == 'moderator' %}
            <li onclick="RoomsUtils_ajaxGetSubject('{{ jid|echapJS }}')">
                <span class="primary icon gray">
                    <a href="#" onclick="listIconClick(event)">
                        <i class="material-symbols">short_text</i>
                    </a>
                </span>
                <div>
                    <p>{{ __('chatrooms.subject') }}</p>
                </div>
            </li>
        {% endif %}
        {% if conference.role == 'moderator' or conference.affiliation == 'owner' %}
            <hr />
        {% endif %}

        <li onclick="RoomsUtils_ajaxAdd('{{ jid|echapJS }}');">
            <span class="primary icon gray">
                <i class="material-symbols">edit</i>
            </span>
            <div>
                <p>{{ __('button.edit') }}</p>
            </div>
        </li>

        <li onclick="RoomsUtils_ajaxAskInvite('{{ jid|echapJS }}');">
            <span class="primary icon gray">
                <i class="material-symbols">person_add</i>
            </span>
            <div>
                <p>{{ __('room.invite') }}</p>
            </div>
        </li>

        <li onclick="Chat_ajaxClearHistory('{{ jid|echapJS }}')">
            <span class="primary icon gray">
                <i class="material-symbols">delete_sweep</i>
            </span>
            <div>
                <p class="line">{{ __('chat.clear_history') }}</p>
            </div>
        </li>
        {% if cleared %}
        <li onclick="Chat_ajaxRestoreHistory('{{ jid|echapJS }}')">
            <span class="primary icon gray">
                <i class="material-symbols">history</i>
            </span>
            <div>
                <p class="line">{{ __('chat.restore_history') }}</p>
            </div>
        </li>
        {% endif %}

        <li onclick="Rooms_ajaxExit('{{ jid|echapJS }}');">
            <span class="primary icon gray">
                <i class="material-symbols">logout</i>
            </span>
            <div>
                <p>{{ __('status.disconnect') }}</p>
            </div>
        </li>
    </ul>
{% else %}
    <ul class="list middle">
        <li id="chat_header">
            <span class="primary icon active on_mobile_after" id="chatheadercounter" onclick="Chat.get()"
                {% if counter > 0 %}data-counter="{{ counter }}"{% endif %}>
                <i class="material-symbols">arrow_back</i>
            </span>

            <span class="primary icon bubble active {% if contact.presence %}status {{ contact.presence }}{% endif %}"
                onclick="ChatActions_ajaxGetContact('{{ contact.id|echapJS }}')">
                <img src="{{ contact.picture }}">
            </span>

            <span class="control icon active" onclick="ChatActions_ajaxShowSearchDialog('{{ jid|echapJS }}')">
                <i class="material-symbols">manage_search</i>
            </span>
            <span class="control icon active files_button" onclick="ChatActions_ajaxShowFiles('{{ jid|echapJS }}', false)" title="{{ __('chatactions.files') }}">
                <i class="material-symbols">perm_media</i>
            </span>

            {% if not in_call %}
                {% if call_audio %}
                    <span title="{{ __('button.audio_call') }}" class="control icon active divided"
                        onclick="Visio_ajaxGetLobby('{{ call_audio|echapJS }}', true);">
                        <i class="material-symbols">phone</i>
                    </span>
                {% endif %}
                {% if call_video %}
                    <span title="{{ __('button.video_call') }}" class="control icon active"
                        onclick="Visio_ajaxGetLobby('{{ call_video|echapJS }}', true, true);">
                        <i class="material-symbols">videocam</i>
                    </span>
                {% endif %}
            {% endif %}

            <span class="control icon show_context_menu active"
                onclick="MovimTpl.showContextMenu()">
                <i class="material-symbols">more_vert</i>
            </span>

            <div>
                {% if in_call %}
                    <button class="button oppose color red" onclick="Visio_ajaxRemoteGoodbye()">
                        <i class="material-symbols icon">call_end</i>
                    </button>
                {% endif %}
                <p class="line active" onclick="ChatActions_ajaxGetContact('{{ contact.id|echapJS }}')">
                    {{ contact.truename }}

                    {% if contact.blocked %}
                        <span class="tag color red">{{ __('blocked.title') }}</span>
                    {% endif %}
                    {% if omemo %}
                        <span class="second"><i class="material-symbols">lock</i></span>
                    {% endif %}
                </p>

                <p class="line active" onclick="ChatActions_ajaxGetContact('{{ contact.id|echapJS }}')">
                    {% if in_call %}
                        <i class="material-symbols icon green blink">phone_in_talk</i>
                        {{ __('visio.in_call') }} •
                    {% endif %}
                    {% if contact.seen %}
                        {{ __('last.title') }} {{ contact.seen }}
                    {% elif contact.status %}
                        {{ contact.status }}
                    {% elif contact.presence %}
                        {{ presencetext }}
                    {% else %}
                        {{ contact.id }}
                    {% endif %}
                </p>
            </div>
        </li>
    </ul>
    <ul class="list context_menu active">
        <li class="files_menu" onclick="ChatActions_ajaxShowFiles('{{ contact.id|echapJS }}', false)">
            <span class="primary icon gray">
                <i class="material-symbols">perm_media</i>
            </span>
            <div>
                <p class="line">{{ __('chatactions.files') }}</p>
            </div>
        </li>
        <li onclick="ChatActions_ajaxGetContact('{{ contact.id|echapJS }}')">
            <span class="primary icon gray">
                <i class="material-symbols">person</i>
            </span>
            <div>
                <p class="line">{{ __('chat.profile') }}</p>
            </div>
        </li>
        <li onclick="Chat_ajaxClearHistory('{{ contact.id|echapJS }}')">
            <span class="primary icon gray">
                <i class="material-symbols">delete_sweep</i>
            </span>
            <div>
                <p class="line">{{ __('chat.clear_history') }}</p>
            </div>
        </li>
        {% if cleared %}
        <li onclick="Chat_ajaxRestoreHistory('{{ contact.id|echapJS }}')">
            <span class="primary icon gray">
                <i class="material-symbols">history</i>
            </span>
            <div>
                <p class="line">{{ __('chat.restore_history') }}</p>
            </div>
        </li>
        {% endif %}
        <hr />
        {% if contact.blocked %}
            <li onclick="ChatActions_ajaxUnblock('{{ contact.id|echapJS }}')">
                <span class="primary icon gray">
                    <i class="material-symbols">check_circle</i>
                </span>
                <div>
                    <p class="line">{{ __('blocked.unblock_account') }}</p>
                </div>
            </li>
        {% else %}
            <li onclick="ChatActions_ajaxBlock('{{ contact.id|echapJS }}'); Notifications_ajaxRefuse('{{ contact.id|echapJS }}');">
                <span class="primary icon gray">
                    <i class="material-symbols">block</i>
                </span>
                <div>
                    <p class="line">{{ __('blocked.block_account') }}</p>
                </div>
            </li>
        {% endif %}

        <li onclick="Chats_ajaxClose('{{ jid|echapJS }}', true);">
            <span class="primary icon gray">
                <i class="material-symbols">close</i>
            </span>
            <div>
                <p class="line">{{ __('button.close') }}</p>
            </div>
        </li>
    </ul>
{% endif %}