{# empty Twig template #}
{% extends "base.html.twig" %}

{% block body %}
    {#<div class="sidebar-search">
        <div class="input-group custom-search-form">
            <input type="text" id="search" class="form-control" placeholder="Suche...">
        </div>
        <!-- /input-group -->
    </div>#}
   {# <ul class="nav" id="side-menu">
        <li>
            <a href="#"> Entities<span class="fa arrow"></span></a>
            <ul class="nav nav-second-level" id="entitiesNav">
            </ul>
        </li>
    </ul>#}

    <form method="POST">
        <input type="text" name="title" id="search"/>
        <input type="submit" name="submit" value="search"/>
    </form>


    <table>
        <tr>
            <td>Title</td>
            <td>Description</td>
        </tr>
        {% for post in posts %}
            <tr>
                <td>{{ post.title }}</td>
                <td>{{ post.description }}</td>
            </tr>
        {% endfor %}
    </table>

{% endblock %}

{% block javascripts %}
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 

    {#<script type="text/javascript">
        jQuery(document).ready(function () {
            var searchRequest = null;
            $("#search").keyup(function () {
                var minlength = 3;
                var that = this;
                var value = $(this).val();
                var entitySelector = $("#entitiesNav").html('');
                if (value.length >= minlength) {
                    if (searchRequest != null)
                        searchRequest.abort();
                    searchRequest = $.ajax({
                        type: "GET",
                        url: "{{ path('ajax_search') }}",
                        data: {
                            'q': value
                        },
                        dataType: "text",
                        success: function (msg) {
                            //we need to check if the value is the same
                            if (value == $(that).val()) {
                                var result = JSON.parse(msg);
                                $.each(result, function (key, arr) {
                                    $.each(arr, function (id, value) {
                                        if (key == 'entities') {
                                            if (id != 'error') {
                                                entitySelector.append('<li><a href="/daten/' + id + '">' + value + '</a></li>');
                                            } else {
                                                entitySelector.append('<li class="errorLi">' + value + '</li>');
                                            }
                                        }
                                    });
                                });
                            }
                        }
                    });
                }
            });
        });
    </script>#}

    {#<script>
        var liveSearch = $(this).val();
        if (liveSearch != '') {
            $.ajax({
                url: "{{ path('ajax_search') }}",
                method: "POST",
                data: {search: liveSearch},
                dataType: 'text',
                success: function (data) {
                    $('#entitiesNav').html(data);
                }
            });
        } else {
            $('#entitiesNav').html('');
        }
    </script>#}
{% endblock %}