@extends('layouts.master')

@section('content')
    <div class="cover-image"></div>
    <div class="page-description">
        @lang('descriptions.monothema.list')
    </div>
    <div class="page-content monothema">
        <div class="menu-list @if ($active) disabled @endif">
            <div class="menu-item">
                <a href="#" data-toggle="modal" data-target="#wheel-music-popup">
                    <div class="menu-picture monothema-wheel-music"></div>
                </a>
                <h4>Veranstaltungen und Aktionen</h4>
                <a href="#" class="red-button" data-toggle="modal" data-target="#wheel-music-popup">Auswählen</a>
            </div>
            <div class="menu-item">
                <a href="#" data-toggle="modal" data-target="#monothema-voting-popup">
                    <div class="menu-picture monothema-voting"></div>
                </a>
                <h4>Voting</h4>
                <a href="#" class="red-button" data-toggle="modal" data-target="#monothema-voting-popup">Auswählen</a>
            </div>
            <div class="menu-item">
                <a href="{{ route('monothema-quiz.templates') }}">
                    <div class="menu-picture monothema-quiz"></div>
                </a>
                <h4>Quizgame</h4>
                <a href="{{ route('monothema-quiz.templates') }}" class="red-button">Auswählen</a>
            </div>
            <!-- <div class="menu-item">
                <a href="{{ route('monothema-video-guide.index') }}">
                    <div class="menu-picture monothema-video-guide"></div>
                </a>
                <h4>Erklärfilme</h4>
                <a href="{{ route('monothema-video-guide.index') }}" class="red-button">Auswählen</a>
            </div> -->
            <!-- <div class="menu-item">
                <a href="{{ route('monothema-filiale-news.create.step-1') }}">
                    <div class="menu-picture monothema-filiale-news"></div>
                </a>
                <h4>Filiale News</h4>
                <a href="{{ route('monothema-filiale-news.create.step-1') }}" class="red-button">Auswählen</a>
            </div>
            <div class="menu-item">
                <a href="#" data-toggle="modal" data-target="#monothema-campaign-popup">
                    <div class="menu-picture monothema-campaign"></div>
                </a>
                <h4>Campaign</h4>
                <a href="#" class="red-button" data-toggle="modal" data-target="#monothema-campaign-popup">Auswählen</a>
            </div> -->
        </div>
    </div>

    <div id="monothema-voting-popup" class="sub-menu-popup modal fade in" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="voting-choice">
                        Wählen Sie das gewünschte Voting aus.
                    </div>
                    <div class="menu-list">
                        <div class="menu-item detailed-voting-multi-menu">
                            <a href="#">
                                <div class="menu-picture monothema-detailed-voting"></div>
                            </a>
                            <h4 class="info-bubble-holder">
                                Detailliertes Voting
                                <span role="button" tabindex="0" data-placement="bottom" data-trigger="focus" data-toggle="popover" data-content="Verwenden Sie das detaillierte Voting, um eine Abstimmung mit Details zu den einzelnen Abstimmungsoptionen durchzuführen." aria-hidden="true" data-original-title="Info">
                                    <i class="material-icons">info</i>
                                </span>
                            </h4>
                            <a href="{{ route('monothema-detailed-voting.templates') }}" class="red-button">Vorlagen</a>
                            <a href="{{ route('monothema-detailed-voting.create.step-1') }}" class="red-button create">Frei Erstellen</a>
                        </div>
                        <div class="menu-item">
                            <a href="{{ route('monothema-simple-voting.create.step-1') }}">
                                <div class="menu-picture monothema-voting"></div>
                            </a>
                            <h4 class="info-bubble-holder">
                                Einfaches Voting
                                <span role="button" tabindex="0" data-placement="bottom" data-trigger="focus" data-toggle="popover" data-content="Verwenden Sie das einfache Voting, um eine 'A,B,C-Abstimmung' durchzuführen." aria-hidden="true" data-original-title="Info">
                                    <i class="material-icons">info</i>
                                </span>
                            </h4>
                            <a href="{{ route('monothema-simple-voting.create.step-1') }}" class="red-button">Frei Erstellen</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div id="wheel-music-popup" class="sub-menu-popup modal fade in" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-body">
                    <div class="monothema-choice">
                        Wählen Sie das gewünschte Modul aus.
                    </div>
                    <div class="menu-list">
                        <div class="menu-item">
                            <a href="{{ route('monothema-wheel.create.step-1') }}">
                                <div class="menu-picture monothema-wheel"></div>
                            </a>
                            <h4 class="info-bubble-holder">
                                Glücksrad
                                <span role="button" tabindex="0" data-placement="bottom" data-trigger="focus" data-toggle="popover" data-content="Nutzen Sie das Glücksrad für Aktionstage. Sie können das 'Motto' frei vergeben und individuelle Gewinne hinterlegen." aria-hidden="true" data-original-title="Info">
                                    <i class="material-icons">info</i>
                                </span>
                            </h4>
                            <a href="{{ route('monothema-wheel.create.step-1') }}" class="red-button">Auswählen</a>
                        </div>
                        <div class="menu-item">
                            <a href="{{ route('monothema-music.create.step-1') }}">
                                <div class="menu-picture monothema-music"></div>
                            </a>
                            <h4 class="info-bubble-holder">
                                Hintergrundmusik
                                <span role="button" tabindex="0" data-placement="bottom" data-trigger="focus" data-toggle="popover" data-content="Aktivieren Sie dieses Modul zur Begrüßung Ihrer Teilnehmer am Veranstaltungstag. Sie können aus insgesammt 5 Musik-Genres wählen." aria-hidden="true" data-original-title="Info">
                                    <i class="material-icons">info</i>
                                </span>
                            </h4>
                            <a href="{{ route('monothema-music.create.step-1') }}" class="red-button">Auswählen</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @foreach ($entries as $entry)
        @if (strpos(get_class($entry), "Voting") !== false && in_array($entry->approval_request()->status, [1, 2]))
            <div class="entry" style="height: auto; padding: 15px 20px 0; display: inline-block;">
                <div class="details">
                    <div class="title">Ergebnis des aktuellen Votings:</div>
                    <ul>
                        @foreach($entry->options()->get() as $option)
                            <li style="margin-top: 3px;">{{ $option->title }}: {{ $option->count }}</li>
                        @endforeach
                    </ul>
                </div>
            </div>
        @endif
    @endforeach

    <div class="monothema-item">
        @php
            $list     = array();
            $archived = array();

            foreach ($entries as $entry) {
                if (strpos(get_class($entry), "Voting") !== false) {
                    if ($entry->archived === 1) {
                        $archived[] = $entry;
                    } else {
                        $list[] = $entry;
                    }
                } else {
                    $list[] = $entry;
                }
            }
        @endphp
        @if (count($list) > 0)
            <div class="monothema-note">
                Es kann nur ein Aktionsmodul aktiviert sein. Um ein neues zu aktivieren, löschen Sie das aktivierte Modul:
            </div>
            @include('partials.list', $list)
        @endif

        @if (count($archived) > 0)
            <div class="monothema-note">
                Archivierte Ergebnisse:
            </div>
            @foreach ($archived as $entry)
                <div class="entry">
                    <div class="picture" style="background-image: url({{ $entry['image_URL'] }})"></div>
                    <div class="details">
                        <div class="title">{{ $entry->title }}</div>
                        <div class="actions">
                            <div url="{{ route(Helper::computeMonothemaURL($entry::$url).'.delete', [$entry->id]) }}" class="red-button delete-entry">löschen</div>
                        </div>
                        <ul>
                            @foreach($entry->options()->get() as $option)
                                <li style="margin-top: 3px;">{{ $option->title }}: {{ $option->count }}</li>
                            @endforeach
                        </ul>
                    </div>
                </div>
            @endforeach
        @endif
    </div>
@endsection

@section('back_button')
    <a href="{{ route('home') }}" class="grey-button">Zurück</a>
@endsection