@extends('layouts/app')

@section('title')
    Novo Evento
@endsection

@section('stylesheets')
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.css" integrity="sha256-b5ZKCi55IX+24Jqn638cP/q3Nb2nlx+MH/vMMqrId6k=" crossorigin="anonymous" />
    <style>
        .cke{
            border-radius: .25rem;
        }
    </style>
@endsection

@section('content')
    <section class="padding">
        <div class="container">
            <h1>Novo Evento</h1>
            {!! Form::open(['action' => 'EventsController@store', 'method' => 'POST']) !!}
                <div class="form-group">
                    {{Form::label('title', 'Título')}}
                    {{Form::text('title', '', ['class' => 'form-control', 'placeholder' => 'Título'])}}
                </div>
                <div class="form-group">
                    {{Form::label('body', 'Texto')}}
                    {{Form::textarea('body', '', ['id' => 'article-ckeditor', 'class' => 'form-control', 'placeholder' => 'Texto'])}}
                    <div class="form-group">
                        <label>Data e Hora</label>
                        <input type="text" class="form-control datetimepicker" name="event_time"> 
                    </div>
                
                {{Form::submit('Submeter', ['class' => 'button btn-primary'])}}
            {!! Form::close() !!}
        </div>
    </section>
@endsection

@section('scripts')
    <script src="{{asset('js/ckeditor/ckeditor.js')}}"></script>
    <script>CKEDITOR.replace('article-ckeditor');</script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.26.0/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js" integrity="sha256-5YmaxAwMjIpMrVlK84Y/+NjCpKnFYa8bWWBbUHSBGfU=" crossorigin="anonymous"></script>
    <script type="text/javascript">

        $(function () {

            $('.datetimepicker').datetimepicker({
                inline: true,
                sideBySide: true,
                locale: 'pt',
                format: 'DD-MM-YY HH:mm'
            });

        });

    </script>

@endsection