{% macro renderPager(forum, search, pager) %}
    {{
        pagerfanta(
            pager,
            'twitter_bootstrap_translated',
            {
                'proximity' : 1,
                'routeName': 'claro_forum_search',
                'routeParams': {'forum': forum.getId(), 'search': search, 'page': page is defined ? page : 1}
            }
        )
    }}
{% endmacro %}

{% from _self import renderPager %}

{% set layout = "ClarolineCoreBundle:Workspace:layout.html.twig" %}

{% if isDesktop() %}
    {% set layout = "ClarolineCoreBundle:Desktop:layout.html.twig" %}
{% endif %}

{% extends layout %}

{% block title %}{{ 'search' | trans({}, 'platform') ~ ' (' ~ _resource.getResourceNode().getName() ~ ')' ~ ' - ' ~ parent() | striptags | raw  }}{% endblock %}

{% block resourceBreadcrumb %}
    <li><a href="{{ path('claro_forum_categories', { 'forum': _resource.getId() }) }}">{{ _resource.getResourceNode().getName() }}</a></li>
    <li class="active">{{ 'search'|trans({}, 'platform')}}</li>
{% endblock %}

{% block section_content %}
<div class="panel-heading">
    <h3 class="panel-title">{{ 'search' | trans({}, 'platform') ~ ' (' ~ _resource.getResourceNode().getName() ~ ')'  }}</h3>
</div>
<div class="panel-body">
    <div class="row">
        <div class="col-md-6">
            {{ renderPager(_resource, search, pager, page) }}
        </div>
        <div class="col-md-6">
            <br>
            <div class="input-group">
                <input class="form-control" type="text" id="search-items-txt" placeholder="{{ 'search'|trans({}, 'platform') }}" value="{{ search }}">
                <span class="input-group-btn">
                    <button class="filter btn btn-default" type="button" id="search-button">
                        <i class="fa fa-search"></i>
                    </button>
                </span>
            </div>
        </div>
    </div>

    <div class="table-responsive">
        <table id="message-table" class="table table-striped table-bordered table-condensed">
            <thead>
                <tr>
                    <th>{{ 'author'|trans({}, 'forum') }}</th>
                    <th></th>
                </tr>
            </thead>
            <tbody id='table-message-body'>
                {% for message in pager.currentPageResults %}
                    {% set creator = message.getCreator() %}
                    <tr class="row-message">
                        <td width="125px">
                            <div>
                                {% if creator.getPicture() != "" %}
                                     <img src="{{ asset('uploads/pictures/') ~ message.getCreator().getPicture() }}" class="col-md-12">
                                {% else %}
                                    <h1><i class="fa fa-user col-md-12"></i><h1>
                                {% endif %}
                            </div>
                            <div>
                                {% if creator.isEnabled() %}
                                    <a href="{{path('claro_profile_view', {'userId': creator.getId()})}}">
                                {% endif %}
                                        
                                {{ message.getAuthor() }}
                                        
                                {% if creator.isEnabled() %}
                                    </a>
                                {% endif %}
                            </div>
                            <div>
                                {{ message.getCreationDate()|intl_date_format() }}
                            </div>
                            <p>{{ message.getAuthor() }}</p>
                        </td>
                        <td>
                            <div>
                                <p class="message-content"> {{ message.getContent()|raw }} </p>
                                <p class="text-muted">{{ message.getCreationDate()| timeAgo }} </p>
                            </div>
                        </td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
    {{ renderPager(_resource, search, pager, page) }}
</div>

{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script src='{{ asset('bundles/clarolinecore/js/table.js') }}' type="text/javascript"></script>
    <script>
        parameters = {};
        parameters.route = {};
        parameters.route.action = {};
        parameters.route.search = {"route": "claro_forum_search", "parameters": {'forum': {{ _resource.getId() }} }};
        Claroline.Table.initialize(parameters);

        function highLight(element, text) {
            element.innerHTML = element.innerHTML.replace(new RegExp("(" +text+ ")", "ig"), '<span style="background-color: #FFFF00">$1</span>');
        }

        $('.message-content').each(function(){
            highLight($(this).get(0), "{{ search }}");
        });
    </script>
{% endblock %}