@php
    /** @var LaraBB\Group\Models\Group $group */
    /** @var LaraBB\User\Models\User $user */
    /** @var LaraBB\Category\Models\Category $category */
@endphp
@extends('admin::Layouts.master')
@section('pagecss')
<link rel="stylesheet" type="text/css" href="{{ asset('css/bootstrap-select.min.css') }}">
@stop
@section('content')
<div class="container-fluid pt-4">
    @include('partials.messages')
    <form action="{{ route('admin.forums.' . (isset($forum) ? 'update' : 'store')) }}" method="post">
        @csrf
        <input type="hidden" name="uuid" value="{{ $forum->uuid ?? '' }}">
        <div class="row">
            <div class="col-12 col-md-6">
                <div class="row mb-3">
                    <div class="col-12 col-md-6">
                        <label for="title" class="required">Kategorie:</label>
                        <select id="category" name="category" class="selectpicker form-control @error('category')is-invalid @enderror" data-live-search="true" title="Auswählen...">
                        @foreach($categories as $category)
                            <option data-tokens="{{ Str::slug($category->title) }}"
                                    value="{{ $category->uuid }}"
                                    {{ isset($forum) && $forum->category->uuid == $category->uuid ? ' selected' : ($category->uuid == old('category') ? ' selected' : '') }}>
                                {{ $category->title }}
                            </option>
                        @endforeach
                        </select>
                    </div>
                    <div class="col-12 col-md-6">
                        <label for="title" class="required">Forum:</label>
                        <input type="text"
                               class="form-control @error('title')is-invalid @enderror"
                               name="title"
                               id="title"
                               value="{{ old('title', $forum->title ?? '') }}">
                    </div>
                </div>
                <div class="col-12 mb-3">
                    <label for="slug" class="required">URL:</label>
                    <div class="input-group">
                        <div class="input-group-text">{{ env('APP_FURL') }}/forum/</div>
                        <input class="form-control @error('slug')is-invalid @enderror" name="slug" id="slug" value="{{ $forum->slug ?? '' }}" readonly>
                        <button type="button" class="btn btn-outline-secondary js-edit-slug">
                            <span class="fas fa-fw fa-edit"></span>
                        </button>
                    </div>
                </div>
                <div class="col-12 mb-3">
                    <label for="description">Beschreibung:</label>
                    <textarea id="description" name="description" class="form-control" rows="4">{{ $forum->description ?? '' }}</textarea>
                </div>
                <div class="col-12">
                    <label for="users">Zugang nur für:</label>
                    <select id="users" name="users[]" class="selectpicker form-control @error('users')is-invalid @enderror" data-live-search="true" title="Auswählen..." multiple>
                    @foreach($users as $user)
                        <option data-tokens="{{ Str::slug($user->username) }}"
                                value="{{ $user->uuid }}"
                                {{ in_array($user->uuid, old('users', isset($forum) ? $forum->users->pluck('uuid')->toArray() : [])) ? ' selected' : '' }}>
                            {{ $user->username }}
                        </option>
                    @endforeach
                    </select>
                </div>
            </div>
            <div class="col-12 col-md-6">
                <div class="col-12">
                    <div class="media border rounded p-3 mb-3 text-primary">
                        <span class="fas fa-fw fa-3x align-self-center fa-info-circle"></span>
                        <div class="media-body ml-2">
                            Diese Ansicht dient zur Zuweisung von <strong>globalen</strong> Rechten je nach Benutzergruppe.<br>
                            Alle Nutzer können standardmäßig <strong>ihre eigenen</strong> Themen & Beiträge bearbeiten oder löschen.
                        </div>
                    </div>
                    <div class="row align-items-end no-gutters mb-4">
                        <div class="col-3">
                            <span class="font-weight-bold">Gruppe</span>
                        </div>
                        <div class="col-1 text-center">
                            <span class="font-weight-bold">Forum</span>
                            <div class="row no-gutters mt-2">
                                <div class="col-12">
                                    <span class="far fa-fw fa-eye" data-bs-toggle="tooltip" title="Forum sehen?"></span>
                                </div>
                            </div>
                        </div>
                        <div class="col-4 text-center">
                            <span class="font-weight-bold">Themen</span>
                            <div class="row no-gutters mt-2">
                                <div class="col-3"><span class="far fa-fw fa-eye" data-bs-toggle="tooltip" title="Themen sehen?"></span></div>
                                <div class="col-3"><span class="far fa-fw fa-plus-square" data-bs-toggle="tooltip" title="Themen erstellen?"></span></div>
                                <div class="col-3"><span class="fas fa-fw fa-edit" data-bs-toggle="tooltip" title="Themen bearbeiten?"></span></div>
                                <div class="col-3"><span class="far fa-fw fa-trash-alt" data-bs-toggle="tooltip" title="Themen löschen?"></span></div>
                            </div>
                        </div>
                        <div class="col-4 text-center">
                            <span class="font-weight-bold">Beiträge</span>
                            <div class="row no-gutters mt-2">
                                <div class="col-3"><span class="far fa-fw fa-eye" data-bs-toggle="tooltip" title="Beiträge sehen?"></span></div>
                                <div class="col-3"><span class="far fa-fw fa-plus-square" data-bs-toggle="tooltip" title="Beiträge erstellen?"></span></div>
                                <div class="col-3"><span class="fas fa-fw fa-edit" data-bs-toggle="tooltip" title="Beiträge bearbeiten?"></span></div>
                                <div class="col-3"><span class="far fa-fw fa-trash-alt" data-bs-toggle="tooltip" title="Beiträge löschen?"></span></div>
                            </div>
                        </div>
                    </div>
                    @foreach($groups as $group)
                    @php $groupPermissions = isset($forum) ? $forum->permissions->where('group_uuid', $group->uuid)->first() : null @endphp
                    <div class="row no-gutters align-items-center">
                        <div class="col-3 border-right py-1">{{ $group->group }}</div>
                        <div class="col-1 text-center border-right py-1">
                            <div class="form-check form-switch">
                                <input type="checkbox"
                                       class="form-check-input"
                                       id="_{{ $group->uuid }}_show_forum"
                                       name="permissions[{{ $group->uuid }}][show_forum]"
                                       value="1"
                                       {{ old('permissions.' . $group->uuid . '.show_forum', isset($groupPermissions->show_forum) && $groupPermissions->show_forum) ? ' checked' : '' }}>
                                <label class="form-check-label ml-2" for="_{{ $group->uuid }}_show_forum"></label>
                            </div>
                        </div>
                        <div class="col-4 border-right py-1">
                            <div class="row no-gutters">
                                <div class="col-3 text-center">
                                    <div class="form-check form-switch">
                                        <input type="checkbox"
                                               class="form-check-input"
                                               id="_{{ $group->uuid }}_show_threads"
                                               name="permissions[{{ $group->uuid }}][show_threads]"
                                               value="1"
                                               {{ old('permissions.' . $group->uuid . '.show_threads', isset($groupPermissions->show_threads) && $groupPermissions->show_threads) ? ' checked' : '' }}>
                                        <label class="form-check-label ml-2" for="_{{ $group->uuid }}_show_threads"></label>
                                    </div>
                                </div>
                                <div class="col-3 text-center">
                                    <div class="form-check form-switch">
                                        <input type="checkbox"
                                               class="form-check-input"
                                               id="_{{ $group->uuid }}_create_threads"
                                               name="permissions[{{ $group->uuid }}][create_threads]"
                                               value="1"
                                               {{ old('permissions.' . $group->uuid . '.create_threads', isset($groupPermissions->create_threads) && $groupPermissions->create_threads) ? ' checked' : '' }}>
                                        <label class="form-check-label ml-2" for="_{{ $group->uuid }}_create_threads"></label>
                                    </div>
                                </div>
                                <div class="col-3 text-center">
                                    <div class="form-check form-switch">
                                        <input type="checkbox"
                                               class="form-check-input"
                                               id="_{{ $group->uuid }}_edit_threads"
                                               name="permissions[{{ $group->uuid }}][edit_threads]"
                                               value="1"
                                               {{ old('permissions.' . $group->uuid . '.edit_threads', isset($groupPermissions->edit_threads) && $groupPermissions->edit_threads) ? ' checked' : '' }}>
                                        <label class="form-check-label ml-2" for="_{{ $group->uuid }}_edit_threads"></label>
                                    </div>
                                </div>
                                <div class="col-3 text-center">
                                    <div class="form-check form-switch">
                                        <input type="checkbox"
                                               class="form-check-input"
                                               id="_{{ $group->uuid }}_delete_threads"
                                               name="permissions[{{ $group->uuid }}][delete_threads]"
                                               value="1"
                                               {{ old('permissions.' . $group->uuid . '.delete_threads', isset($groupPermissions->delete_threads) && $groupPermissions->delete_threads) ? ' checked' : '' }}>
                                        <label class="form-check-label ml-2" for="_{{ $group->uuid }}_delete_threads"></label>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-4 py-1">
                            <div class="row no-gutters">
                                <div class="col-3 text-center">
                                    <div class="form-check form-switch">
                                        <input type="checkbox"
                                               class="form-check-input"
                                               id="_{{ $group->uuid }}_show_posts"
                                               name="permissions[{{ $group->uuid }}][show_posts]"
                                               value="1"
                                               {{ old('permissions.' . $group->uuid . '.show_posts', isset($groupPermissions->show_posts) && $groupPermissions->show_posts) ? ' checked' : '' }}>
                                        <label class="form-check-label ml-2" for="_{{ $group->uuid }}_show_posts"></label>
                                    </div>
                                </div>
                                <div class="col-3 text-center">
                                    <div class="form-check form-switch">
                                        <input type="checkbox"
                                               class="form-check-input"
                                               id="_{{ $group->uuid }}_create_posts"
                                               name="permissions[{{ $group->uuid }}][create_posts]"
                                               value="1"
                                               {{ old('permissions.' . $group->uuid . '.create_posts', isset($groupPermissions->create_posts) && $groupPermissions->create_posts) ? ' checked' : '' }}>
                                        <label class="form-check-label ml-2" for="_{{ $group->uuid }}_create_posts"></label>
                                    </div>
                                </div>
                                <div class="col-3 text-center">
                                    <div class="form-check form-switch">
                                        <input type="checkbox"
                                               class="form-check-input"
                                               id="_{{ $group->uuid }}_edit_posts"
                                               name="permissions[{{ $group->uuid }}][edit_posts]"
                                               value="1"
                                               {{ old('permissions.' . $group->uuid . '.edit_posts', isset($groupPermissions->edit_posts) && $groupPermissions->edit_posts) ? ' checked' : '' }}>
                                        <label class="form-check-label ml-2" for="_{{ $group->uuid }}_edit_posts"></label>
                                    </div>
                                </div>
                                <div class="col-3 text-center">
                                    <div class="form-check form-switch">
                                        <input type="checkbox"
                                               class="form-check-input"
                                               id="_{{ $group->uuid }}_delete_posts"
                                               name="permissions[{{ $group->uuid }}][delete_posts]"
                                               value="1"
                                               {{ old('permissions.' . $group->uuid . '.delete_posts', isset($groupPermissions->delete_posts) && $groupPermissions->delete_posts) ? ' checked' : '' }}>
                                        <label class="form-check-label ml-2" for="_{{ $group->uuid }}_delete_posts"></label>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    @if(!$loop->last) <hr class="my-0"> @endif
                    @endforeach
                </div>
            </div>
        </div>
        <div class="row mt-3">
            <div class="col-12 col-md-2 col-xl-1">
                @include('partials.button', ['context' => 'primary', 'type' => 'submit', 'icon' => 'save', 'label' => 'Speichern'])
            </div>
        </div>
    </form>
</div>
@stop
@section('pagejs')
<script src="{{ asset('js/bootstrap-select.min.js') }}"></script>
<script>
    $('#title').on('keyup', function() {
       let $this = $(this);
       if($(this).val().length > 0) {
           delay(function() {
               $.get('{{ route('slug') }}/' + $this.val(), function($return) {
                   $('#slug').val($return.slug);
               });
           }, 200);
       } else {
           $('#slug').val('');
       }
    });

    $('.js-edit-slug').on('click', function() {
        let $readonly = $(this).parents('.input-group').find('.form-control').prop('readonly');
        $(this).parents('.input-group').find('.form-control').prop('readonly', !$readonly);
        $(this).find('.fas').toggleClass('fa-edit fa-check');
    });
</script>
@stop