{{ csrf_field() }}
<div class="box box-primary">
    <div class="box-header with-border">
        <h3 class="box-title"></h3>
    </div>

    <div class="box-body">
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="title">Titolo:</label> <span id="chars">{{isset($page) ? 90 - strlen($page->title) : 90}} caratteri rimanenti</span>
                        <input type="text" name="title" class="form-control title" maxlength="90" value="{{ old('title', isset($page) ? $page->title : '') }}">
                        </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                    <label for="text_short">Testo breve:</label>
                    <input type="text" name="text_short" class="form-control"  value="{{ old('text_short', isset($page) ? $page->text_short : '') }}">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="web">Sito web:</label>
                    <input type="text" name="web" class="form-control" value="{{ old('web', isset($page) ? $page->web : '') }}">
                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                    <label for="email">Indirizzo email:</label>
                    <input type="text" name="email" class="form-control" value="{{ old('email', isset($page) ? $page->email : '') }}">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="facebook">Facebook:</label>
                    <input type="text" name="facebook" class="form-control" value="{{ old('facebook', isset($page) ? $page->facebook : '') }}">
                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                    <label for="instagram">Instagram:</label>
                    <input type="text" name="instagram" class="form-control" value="{{ old('instagram', isset($page) ? $page->instagram : '') }}">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="twitter">Twitter:</label>
                    <input type="text" name="twitter" class="form-control" value="{{ old('twitter', isset($page) ? $page->twitter : '') }}">
                </div>
            </div>
            <div class="col-md-6">
                <div class="form-group">
                    <label for="youtube">Youtube:</label>
                    <input type="text" name="youtube" class="form-control" value="{{ old('youtube', isset($page) ? $page->youtube : '') }}">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="slug">Slug:</label>
                    <input type="text" name="slug" class="form-control slug" value="{{ old('slug', isset($page) ? $page->slug : '') }}">
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="image">Immagine:</label><br>
                    <div class="custom-file-upload"><input type="file" name="image" class="form-control"></div>
                    @if (isset($page) && $page->image != '')
                        <br><img src="/files/pages/{{$page->image}}" style="max-width:250px" />
                    @endif
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label for="online">Online:</label><br>
                    <input type="checkbox" name="online" value="on" {{ old('online', isset($page) ? ($page->online ? 'checked' : '') : '') }}>
                </div>
            </div>
        </div>
    </div>

    <div class="box-footer">
        <button type="submit" class="btn btn-success" name="save">{{ $submit_text }}</button>
        <a href="{{ route('pages.index') }}" class="btn btn-info">Annulla</a>
    </div>
</div>

@section('extra_js')

    <script src="/backend/plugins/input-mask/jquery.inputmask.js"></script>
    <script src="/backend/plugins/input-mask/jquery.inputmask.date.extensions.js"></script>
    <script src="/backend/plugins/input-mask/jquery.inputmask.extensions.js"></script>

    <script>

        $(function () {

            $('.js-editor').summernote(
                {
                    lang: 'it-IT'
                }

            );
            //$('.js-editor').wysihtml5()

            $(".title").keyup(function(){
                var Text = $(this).val();
                Text = Text.toLowerCase();
                Text = Text.replace(/[^a-zA-Z0-9]+/g,'-');
                $(".slug").val(Text);
            });

            $('.title').on("keyup change", function () {

                const max = 90;
                const len = $(this).val().length;

                if (len >= max)
                {
                $('#chars').text("0 caratteri rimanenti");
                }
                else
                {

                  const char = max - len;
                  $('#chars').text(char + '  caratteri rimanenti');
                }
              });

        });

    </script>
@stop