{% extends "admin/base.html" %}

{% block page_header %}
<nav aria-label="breadcrumb">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="{{  url('dashboard') }}">{{_("Dashboard",2)}}</a></li>
    <li class="breadcrumb-item"><a href="{{  url('dashboard-chatroom-channels') }}?room={{room_id}}">{{_("Chat Room Channels",2)}}</a></li>
    {% if channel %}
        <li class="breadcrumb-item active" aria-current="page">{{channel.name}}</li>
    {% else %}
        <li class="breadcrumb-item active" aria-current="page">{{_("Add Channel",2)}}</li>
    {% endif %}
  </ol>
</nav>
{% endblock %}

{% block content %}

<!-- Content Row -->
<div class="row ">
    <div class="col-md-8">
        <div class="card card-room-info">
            <div class="card-header">
                <div class="card-title">
                    {% if channel.id %}
                        {{_("Update Channel",2)}}
                    {% else %}
                        {{_("Add New Channel",2)}}
                    {% endif %}
                </div>
            </div>
            <div class="card-body">
                <form id="admin-channel-form" enctype="multipart/form-data">
                    {{ csrf_token()|raw }}
                    <input type="hidden" name="edit_group" id="edit_group" value="{{channel.id}}">
                    <input type="hidden" name="room_id" id="room_id" value="{{room_id}}">
                    <div class="mb-3 row">
                        <label class="col-sm-4 col-form-label" for="name">{{_("Name",2)}}</label>
                        <div class="col-sm-8">
                            <input type="text" class="form-control" id="name" name="name" placeholder="Channel Name" value="{{channel.name}}">
                        </div>
                    </div>
                    <div class="mb-3 row">
                        <label class="col-sm-4 col-form-label" for="group_category">{{_("Channel Category",2)}}</label>
                        <div class="col-sm-8">
                            <select name="group_category" id="group_category" class="form-select">
                                {% for channel_category in channel_categories %}
                                    <option value="{{channel_category.id}}" {% if channel_category.id == channel.group_category %}selected{% endif %}
                                    >{{channel_category.name}}</option>
                                {% endfor %}
                            </select>
                        </div>
                    </div>
                    <div class="mb-3 row">
                        <label class="col-sm-4 col-form-label" for="group_type">{{_("Channel Type",2)}}</label>
                        <div class="col-sm-8">
                            <select name="group_type" id="group_type" class="form-select">
                                <option value="1" {% if channel.group_type == "1" %}selected{% endif %} >{{_("Text")}}</option>
                                <option value="2" {% if channel.group_type == "2" %}selected{% endif %} >{{_("Announcement")}}</option>
                                <option value="3" {% if channel.group_type == "3" %}selected{% endif %} >{{_("Voice")}}</option>
                            </select>
                        </div>
                    </div>
                    <div class="mb-3 row">
                        <label class="col-sm-4 col-form-label" for="group_order">{{_("Order",2)}}</label>
                        <div class="col-sm-8">
                            <input type="number" class="form-control" id="group_order" name="group_order" value="{{ channel.group_order|default(0) }}">
                        </div>
                    </div>

                    <div class="row">
                        <label class="col-sm-4 col-form-label" for="private_channel">
                            {{_("Is Private Channel?",2)}}
                        </label>
                        <div class="col-sm-8">
                            <label class="switch">
                                <input type="checkbox" name="is_private" id="private_channel"
                                    {% if channel %}
                                        {% if channel.is_private %}
                                            checked
                                        {% endif %}
                                    {% endif %}>
                              <span class="slider round"></span>
                            </label>
                        </div>
                    </div>

                    <div class="mb-3 channel-users {% if channel.id and channel.is_private %}{% else %}d-none{% endif %}">
                        <div class="row">
                            <div class="col-12">
                                <select class="form-select" placeholder="Search username, first name or last name" id="group-users" name="channel_users[]" multiple >
                                    {% for user in group_users %}
                                        <option value="{{user.user_id}}" selected>{{user.first_name}} {{user.last_name}}</option>
                                    {% endfor %}
                                </select>
                            </div>
                        </div>
                    </div>

                    <button type="button" class="btn btn-primary admin-update-channel">{{_("Submit",2)}}</button>
                </form>
            </div>
        </div>
    </div>
</div>

{% endblock %}