@extends('layout')

@section('content')
    <link href="{{ asset('css/jquery.seat-charts.css') }}" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.6-rc.0/css/select2.min.css" rel="stylesheet" />
    <link href="{{ asset('css/custom.css') }}" rel="stylesheet" type="text/css">

    <div class="row">
        <div class="col-sm-12">
            <div class="ui ordered steps">
                <div class="active step">
                    <div class="content">
                        <div class="title">Sitzplatz wählen</div>
                        <div class="description">Sitzplatz und Rabatt wählen</div>
                    </div>
                </div>
                @if(!Auth::check())
                    <div class="step">
                        <div class="content">
                            <div class="title">Dateneingabe</div>
                            <div class="description">Login oder Registrierung</div>
                        </div>
                    </div>
                @endif
                <div class="step">
                    <div class="content">
                        <div class="title">Reservierungsbestätigung</div>
                        <div class="description">Ansehen und Reservierung aufgeben!</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <br />
    {!! Form::open(['url' => 'book']) !!}
<div class="row">
	<div class="col-sm-12 col-lg-8">
        <h1>{{$event->title}} <span style="white-space: nowrap;">({{strftime('%d. %m. %Y', strtotime($seat->date))}})</span></h1>
	</div>
</div>
    {!! Form::hidden('event_id', $event->id) !!}
    {!! Form::hidden('seat_id', $seat->id) !!}
        Noch {{$availableSeats}} Plätze verfügbar!


        {!! Form::label('amountSeatsToBook', 'Anzahl der zu buchenden Plätze:') !!}
        {!! Form::number('amountSeatsToBook', 0, ['min' => '0','max' => $availableSeats]) !!}



    <div id="concessions"></div>

	@if (Auth::check() && Auth::user()->isAdmin())
		<h2>Kunde</h2>
		<div class="row">
		    <div class="col-sm-6">
		        <select class="js-example-basic-single" name="user" style="width: 100%;">
		            <option value=""></option>
		            @foreach($users_identifier->get() as $user)
		                <option value="{{$user->id}}">{{$user->identifier}}</option>
		            @endforeach
		        </select>
		        {{--<div class="ui fluid search selection dropdown">--}}
		            {{--<input name="user" type="hidden">--}}
		            {{--<i class="dropdown icon"></i>--}}
		            {{--<div class="default text">Kunde</div>--}}
		            {{--<div class="menu">--}}
		                {{--<div class="item"></div>--}}
		                {{--@foreach($users_identifier->get() as $user)--}}
		                    {{--<div class="item" data-value="{{$user->id}}">{{$user->identifier}}</div>--}}
		                {{--@endforeach--}}
		            {{--</div>--}}
		            {{--{{Form::select('user', $users_identifier->pluck('identifier', 'id'))}}--}}
		        {{--</div>--}}
		    </div>
            <div class="col-sm-6">
                <h2>Name des neu einzufügenden Benutzer</h2>
                Vorname: {{Form::text('newFirstname')}}<br />
                Nachname: {{Form::text('newLastname')}}<br />
                Straße + Hausnummer: {{Form::text('newStreet')}}<br />
                PLZ + Ort: {{Form::text('newLocation')}}<br />
            </div>
		</div>
    	@endif

    {!! Form::submit('Reservieren (Sie können die Reservierung noch einmal überprüfen)', ['class' => 'btn btn-primary form-control', 'style' => 'margin-top: 10px;']) !!}

    {!! Form::close() !!}

@endsection

@section('scripts')
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <script src="{{ URL::asset('js/jquery.seat-charts.min.js') }}"></script>
    <script src="{{ URL::asset('res/admin/events.js') }}"></script>
    <script src="{{ URL::asset('js/autoNumeric.js') }}"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.js"></script>
    <script>
        var concessionTemplate = '<?php echo Form::select('concession[]', $concessions->pluck('name', 'id'))?>';
        document.getElementById("amountSeatsToBook").addEventListener('input', function(evt){
            var conc = document.getElementById("concessions");
            conc.innerHTML = "";
            for (i = 0; i < this.value; i++) {
                conc.innerHTML = conc.innerHTML + (i+1)+". Ticket: "+concessionTemplate + "<br />";
            }
        });

	$(document).ready(function () {
            $('.js-example-basic-single').select2({
                minimumInputLength: 3
            });
	});
    </script>
@endsection