{*
 * Amsterdam Web Communities System
 * Copyright (c) 2025-2026 Erbosoft Metaverse Design Solutions, All Rights Reserved
 * 
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at https://mozilla.org/MPL/2.0/.
 *}
<div class="p-4">
    <!-- Page Title -->
    <div class="mb-6">
        <div class="flex items-baseline gap-2">
            <h1 class="text-blue-800 text-4xl font-bold">Set Conference Membership:</h1>
            <span class="text-blue-800 text-2xl">{{ confName }}</span>
        </div>
        <hr class="border-2 border-gray-400 w-4/5 mt-2 mb-6">
    </div>

    <!-- Upper Links -->
    <div class="mb-4">
        <a class="text-blue-700 hover:text-blue-900 text-sm flex items-center gap-2 w-fit" href="{{ selfLink }}">
            <span>🔃</span>
            Redisplay Member List
        </a>
        |
        <a class="text-blue-700 hover:text-blue-900 text-sm flex items-center gap-2 w-fit" href="{{ backLink }}">
            <span>←</span>
            Return to Manage Conference Menu
        </a>
    </div>

    <!-- Member Find Form -->
    <div class="max-w-3xl mb-8">
        <form method="POST" action="{{ selfLink }}">
            <input type="hidden" name="mode" value="comm">
            <input type="hidden" name="ofs" value="0">

            <div class="bg-gray-50 p-6 rounded-lg">
                <h2 class="text-xl font-bold text-black mb-4">Find Members of Community "{{ commName }}":</h2>
                <div class="space-y-4">
                    <div class="flex items-center gap-2 text-sm">
                        <span class="text-black">Display all community members whose</span>
                        <select name="field" 
                                class="px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                            <option value="name" {{ if field == "name" }}selected{{ end }}>user name</option>
                            <option value="descr"{{ if field == "descr" }}selected{{ end }}>description</option>
                            <option value="first"{{ if field == "first" }}selected{{ end }}>first name</option>
                            <option value="last"{{ if field == "last" }}selected{{ end }}>last name</option>
                        </select>
                    </div>

                    <!-- Search Criteria -->
                    <div class="flex items-center gap-2 text-sm flex-wrap">
                        <select name="oper" 
                                class="px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                            <option value="st" {{ if oper == "st" }}selected{{ end }}>starts with the string</option>
                            <option value="in" {{ if oper == "in" }}selected{{ end }}>contains the string</option>
                            <option value="re" {{ if oper == "re" }}selected{{ end }}>matches the regular expression</option>
                        </select>
                        <input type="text" name="term" size="32" maxlength="255" value="{{ term }}"
                            placeholder="Enter search term..."
                            class="flex-1 min-w-64 px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                    </div>

                    <div>
                        <button type="submit" name="search"
                                class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-2 rounded font-medium transition-colors">Search</button>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <hr class="border-gray-400 mb-4">
    <div class="max-w-3xl flex justify-between items-center mb-4">
        <h2 class="text-xl font-bold text-black mb-4">
            {{ if mode == "conf" }}
                Conference Members:
            {{ else if mode == "comm" }}
                Search Results:
            {{ end }}
        </h2>
        {{ if total > 0 }}
            <div class="text-sm text-black font-bold">(Displaying {{ offset + 1 }}-{{ offset + len(resultList) }} of {{ total }})</div>
        {{ else }}
            <div class="text-sm text-black font-bold">(None found)</div>
        {{ end }}
        {{ if isset(showPrev) || isset(showNext) }}
            <div class="flex justify-center gap-4 mt-6">
                <form method="POST" action="{{ selfLink }}">
                    <input type="hidden" name="mode" value="{{ mode }}">
                    <input type="hidden" name="field" value="{{ field }}">
                    <input type="hidden" name="oper" value="{{ oper }}">
                    <input type="hidden" name="term" value="{{ term }}">
                    <input type="hidden" name="ofs" value="{{ offset }}">
                    {{ if isset(showPrev) }}
                        <button type="submit" name="prev"
                                class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-2 rounded font-medium transition-colors">
                            ⏪ Prev
                        </button>
                    {{ end }}
                    {{ if isset(showNext) }}
                        <button type="submit" name="next"
                                class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-2 rounded font-medium transition-colors">
                            Next ⏩
                        </button>
                    {{ end }}
                </form>
            </div>
        {{ end }}
    </div>

    <form method="POST" action="{{ selfLink }}">
        <input type="hidden" name="mode" value="{{ mode }}">
        <input type="hidden" name="field" value="{{ field }}">
        <input type="hidden" name="oper" value="{{ oper }}">
        <input type="hidden" name="term" value="{{ term }}">
        <input type="hidden" name="ofs" value="{{ offset }}">
        <input type="hidden" name="validUids" value="{{ validUids }}">
        <div class="max-w-2xl bg-gray-50 p-6 rounded-lg">
            <div class="space-y-4">
                {{ range _, rx := resultList }}
                    <div class="flex items-start gap-3">
                        <span class="text-sm pt-0.5 flex-shrink-0">🟣</span>
                        <div class="flex-1">
                            <div class="mb-2">
                                <a href="/user/{{ rx.User.Username }}" 
                                class="text-blue-700 hover:text-blue-900 font-bold text-base">{{ rx.User.Username }}</a>
                            </div>
                        </div>
                        <input type="hidden" name="old_{{ rx.User.Uid }}" value="{{ rx.Level }}">
                        <select id="new_{{ rx.User.Uid }}" name="new_{{ rx.User.Uid }}"
                                class="flex-1 px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
                            {{ range _, role := roleList.Roles() }}
                                <option value="{{ role.Level() }}" {{ if role.Level() == rx.Level }}selected{{ end }}>{{ role.Name() }}</option>
                            {{ end }}
                        </select>
                    </div>
                {{ end }}
                <div class="flex items-start gap-3">
                    <button type="submit" name="update"
                            class="bg-blue-600 hover:bg-blue-700 text-white px-8 py-2 rounded font-medium transition-colors">Update</button>
                    {{ if isset(updated) }}
                        <span class="text-lg text-green font-bold">✅ Updated!</span>
                    {{ end }}
                </div>
            </div>
        </div>
    </form>

</div>