{% extends 'base.html.twig' %}

{% block meta_og_title %}
{% apply spaceless %}
    {% if app.request.locale == 'fr' %}
        {% if ( rechercheMot == '' ) or ( rechercheMot == '-' ) %}
        Resultats de la recherche {{ rechercheFranchiseLibelle }} pour le genre {{ rechercheGenreLibelle }} sur {{ rechercheSystemeLibelle }} sur Le Musee des Jeux Video
        {% else %}
        Resultats de la recherche de {{ rechercheMot }} {{ rechercheFranchiseLibelle }} pour le genre {{ rechercheGenreLibelle }} sur {{ rechercheSystemeLibelle }} sur Le Musee des Jeux Video
        {% endif %}
    {% else %}
        {% if ( rechercheMot == '' ) or ( rechercheMot == '-' ) %}
        Search results {{ rechercheFranchiseLibelle }} for {{ rechercheGenreLibelle }} genre on {{ rechercheSystemeLibelle }} on The Video Games Museum
        {% else %}
        Search results for {{ rechercheMot }} {{ rechercheFranchiseLibelle }}, {{ rechercheGenreLibelle }} genre on {{ rechercheSystemeLibelle }} on The Video Games Museum
        {% endif %}
    {% endif %}
{% endapply %}
{% endblock %}
{% block meta_og_type %}website{% endblock %}
{% block meta_og_image %}{% if app.request.locale == 'fr' %}{{ base_url_fr_sans_langue }}images/logo-mjv-1.png{% else %}{{ base_url_en_sans_langue }}images/logo-vgm-1.png{% endif %}{% endblock %}

{% block meta_title %}
{% apply spaceless %}
    {% if app.request.locale == 'fr' %}
        {% if ( rechercheMot == '' ) or ( rechercheMot == '-' ) %}
        Resultats de la recherche {{ rechercheFranchiseLibelle }} pour le genre {{ rechercheGenreLibelle }} sur {{ rechercheSystemeLibelle }} sur Le Musee des Jeux Video
        {% else %}
        Resultats de la recherche de {{ rechercheMot }} {{ rechercheFranchiseLibelle }} pour le genre {{ rechercheGenreLibelle }} sur {{ rechercheSystemeLibelle }} sur Le Musee des Jeux Video
        {% endif %}
    {% else %}
        {% if ( rechercheMot == '' ) or ( rechercheMot == '-' ) %}
        Search results {{ rechercheFranchiseLibelle }} for {{ rechercheGenreLibelle }} genre on {{ rechercheSystemeLibelle }} on The Video Games Museum
        {% else %}
        Search results for {{ rechercheMot }} {{ rechercheFranchiseLibelle }}, {{ rechercheGenreLibelle }} genre on {{ rechercheSystemeLibelle }} on The Video Games Museum
        {% endif %}
    {% endif %}
{% endapply %}
{% endblock %}

{% block meta_description %}{% endblock %}

{% block chemin %}<div><a href="{{ path('homepage') }}">{% trans %}Accueil{% endtrans %}</a> > {% trans %}Recherche{% endtrans %} : {% if ( rechercheMot != '' ) and ( rechercheMot != '-' ) %}{{ rechercheMot }}<span id="recherche_sys_genre"> | {% endif %}{{ rechercheSystemeLibelle }} | {{ rechercheGenreLibelle }}{% if ( rechercheFranchise != '' ) %} | Franchise {{ rechercheFranchise }}{% endif %}</span></div>{% endblock %}

{% block sous_chemin %}
<div class="container">
    <div class="row">
        <div class="col-md-12 nbresultats_pagination1">
            <h2 class="h2_normal">{% trans %}Rechercher des jeux{% endtrans %}</h2>
        </div>
    </div>
    <div class="row">
<script>
<!--
function verifier_form_recherche_page()
{
    var recherche_systeme = $('#recherche_systeme').val();
    if( recherche_systeme == '' )
        recherche_systeme = 'all';

    var recherche_genre = $('#recherche_genre').val();
    if( recherche_genre == '' )
        recherche_genre = 'all';

    if( ( ( $('#recherche_mot').val() == '' ) || ( $('#recherche_mot').val().length < 3 ) ) && ( $('#recherche_systeme').val() == 'all' ) && ( $('#recherche_genre').val() == 'all' ) && ( $('#franchise').val() == '' ) )
        return false;

	var url_recherche = '{{ path('homepage') }}/search/';
    if( ( $('#recherche_mot').val() == '' ) || ( $('#recherche_mot').val().length < 3 ) )
        url_recherche+= '-/'
    else
        url_recherche+= $('#recherche_mot').val() + '/';

    url_recherche+= $('#recherche_systeme').val() + '/' + $('#recherche_genre').val();
    url_recherche+= '?';

    if( $('input[name="systeme_affichage"]:checked').val() != '{{ rechercheSysteme }}' )
    	url_recherche+= 'systeme_affichage=' + $('input[name="systeme_affichage"]:checked').val();

    if( $('#franchise').val() != '' )
    	url_recherche+= '&franchise=' + $('#franchise').val();

    window.location.href = url_recherche;
        
    return false;
}
-->
</script>

<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

        <div class="col-md-12 nbresultats_pagination1">
            <form onsubmit="return verifier_form_recherche_page();">
                <dl class="dl-horizontal">
                    <dt>{% trans %}Nom du jeu{% endtrans %} :</dt>
                    <dd>{% if rechercheMot == '-' %}<input type="text" id="recherche_mot" name="recherche_mot" value="" onfocus="this.value='';" style="width:250px; height:38px;">{% else %}<input type="text" id="recherche_mot" name="recherche_mot" value="{{ rechercheMot }}" onfocus="this.value='';" style="width:250px; height:30px;">{% endif %}</dd>
                    <dt>{% trans %}Syst&egrave;me{% endtrans %} :</dt>
                    <dd>
                        <select id="recherche_systeme" name="recherche_systeme" onfocus="$('#recherche_systeme').val('all');">
                            <option value="all">{% trans %}Tous les syst&egrave;mes{% endtrans %}</option>
                             <option value=""> </option>
                             <option class="cel" value="Arcade">ARCADE</option>
                             <option value="">---------------</option>
                             {% for systeme in listeSystemes %}
                                 {% if systeme.categorie == 'Arcade' %}
                                 <option value="{{ systeme.id }}">{{ systeme.nom }}</option>
                                 {% endif %}
                             {% endfor %}
                             <option value=""> </option>
                             <option class="cel" value="Consoles">CONSOLES</option>
                             <option value="">---------------</option>
                             {% for systeme in listeSystemes %}
                                 {% if systeme.categorie == 'Consoles' %}
                                 <option value="{{ systeme.id }}">{{ systeme.nom }}</option>
                                 {% endif %}
                             {% endfor %}
                             <option value=""> </option>
                             <option class="cel" value="Ordinateurs">{% trans %}ORDINATEURS{% endtrans %}</option>
                             <option value="">---------------</option>
                             {% for systeme in listeSystemes %}
                                 {% if systeme.categorie == 'Ordinateurs' %}
                                 <option value="{{ systeme.id }}">{{ systeme.nom }}</option>
                                 {% endif %}
                             {% endfor %}
                             <option value=""> </option>
                             <option class="cel" value="Autres">{% trans %}AUTRES{% endtrans %}</option>
                             <option value="">---------------</option>
                             {% for systeme in listeSystemes %}
                                 {% if systeme.categorie == 'Autres' %}
                                     {% if app.request.locale == 'fr' %}
                                     <option value="{{ systeme.id }}">{{ systeme.nom }}</option>
                                     {% else %}
                                     <option value="{{ systeme.id }}">{{ systeme.nomEn }}</option>
                                     {% endif %}
                                 {% endif %}
                             {% endfor %}
                        </select>
{% if rechercheSysteme != '' %}
<script>
$('#recherche_systeme').val( '{{ rechercheSysteme }}' );
</script>
{% endif %}
                    </dd>
                    <dt>{% trans %}Genre{% endtrans %} :</dt>
                    <dd>
                        <select id="recherche_genre" name="recherche_genre" onfocus="$('#recherche_genre').val('all');">
                            <option value="all">{% trans %}Tous les genres{% endtrans %}</option>
                            <option value="">---------------</option>
                            {% for genre in listeGenres %}
                                {% if app.request.locale == 'fr' %}
                                <option value="{{ genre.id }}">{{ genre.genre }}</option>
                                {% else %}
                                <option value="{{ genre.id }}">{{ genre.genreEn }}</option>
                                {% endif %}
                            {% endfor %}
                        </select>
{% if rechercheGenre != '' %}
<script>
$('#recherche_genre').val( '{{ rechercheGenre }}' );
</script>
{% endif %}
                    </dd>
                    <dt>{% trans %}Franchise{% endtrans %} :</dt>
                    <dd>
                        <select id="franchise" name="franchise">
                            {% for franchise in listeFranchises %}
								{% if franchise.franchise != '' %}<option value="{{ franchise.franchise }}">{{ franchise.franchise }}</option>{% else %}<option value="">{% trans %}Toutes les franchises{% endtrans %}</option>{% endif %}
                            {% endfor %}
                        </select>
{% if rechercheFranchise != '' %}
<script>
$('#franchise').val( '{{ rechercheFranchise }}' );
</script>
{% endif %}
                    </dd>
                    <dt>{% trans %}Affichage{% endtrans %} :</dt>
                    <dd><input type="radio" id="affichage_screenshots" name="systeme_affichage" value="screenshots">&nbsp;<label for="affichage_screenshots" style="margin-top:6px; font-weight:normal;">{% trans %}screenshots{% endtrans %}</label> &nbsp; <input type="radio" checked id="affichage_liste" name="systeme_affichage" value="liste">&nbsp;<label for="affichage_liste" style="margin-top:6px; font-weight:normal;">{% trans %}liste{% endtrans %}</label>
{% if systemeAffichage == 'screenshots' %}
<script>
$('#affichage_screenshots').prop("checked", true);
</script>
{% endif %}
                    </dd>
                    <dt></dt>
                    <dd><input type="submit" class="btn btn-lg btn-primary" value="{% trans %}Rechercher{% endtrans %}"></dd>
                </dl>
            </form>
        </div>
    </div>
</div>
<script>
$(document).ready(function() {
    $('#recherche_systeme').select2({ width: '250px' });
    $('#recherche_genre').select2({ width: '250px' });
    $('#franchise').select2({ width: '250px' });
});
</script>
{% endblock %}

{% block pagination1 %}
<div class="text-center text-bold container container_search">
    {% if nombrePages > 1 %}
    <div class="row">
        <div class="col-md-12 nbresultats_pagination1">
            {% if app.request.locale == 'fr' %}
            {{ debutPagination }} &agrave; {{ finPagination }} sur {{ totalDesJeux }} jeux
            {% else %}
            {{ debutPagination }} - {{ finPagination }} of {{ totalDesJeux }} games
            {% endif %}
        </div>
    </div>
    {% endif %}
    <div class="row">
        <div class="col-md-12">
            <div class="newtab-grid">
            <ul class="sync-pagination pagination">
            {% for page in listingNumerotationPagination %}
                {% if ( page.numeroAffiche != 'laquo' ) and ( page.numeroAffiche != 'raquo' ) %}<li class="{{ page.classe }}"><a href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': page.numero, 'tri': tri}) }}?franchise={{ rechercheFranchise }}">{{ page.numeroAffiche }}</a></li>{% endif %}
                {% if page.numeroAffiche == 'laquo' %}<li class="{{ page.classe }}"><a href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': page.numero, 'tri': tri}) }}?franchise={{ rechercheFranchise }}">&laquo;</a></li>{% endif %}
                {% if page.numeroAffiche == 'raquo' %}<li class="{{ page.classe }}"><a href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': page.numero, 'tri': tri}) }}?franchise={{ rechercheFranchise }}">&raquo;</a></li>{% endif %}
            {% endfor %}
            </ul>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block body %}

{% if systemeAffichage == 'screenshots' %}
    <div class="row">
        <div class="col-md-12">
            {% if totalDesJeux == '0' %}
                {% trans %}Aucun jeu trouv&eacute !{% endtrans %}
            {% else %}
                <div class="newtab-grid">
                {% for jeu in listeDesJeux %}
                    {% for screen in jeu.listeDesScreenshots %}
                        {% if ( ( screen.type_screen == 3 ) and ( screen.lien_screen != '' ) ) %}
                        {% if jeu.clone == 0 %}
                        <div onclick="document.location='{{ path('game', {'titreUrl': jeu.titreUrl, 'idSysteme': jeu.systeme.id, 'onglet': jeu.systeme.onglet, 'idJeu': jeu.idreel}) }}';" onmouseover="$('#span_screen_jeu_{{ jeu.idreel }}').show()" onmouseout="$('#span_screen_jeu_{{ jeu.idreel }}').hide()">
                            <a href="{{ path('game', {'titreUrl': jeu.titreUrl, 'idSysteme': jeu.systeme.id, 'onglet': jeu.systeme.onglet, 'idJeu': jeu.idreel}) }}" title="{{ screen.alt_screen }}"><img itemprop="image" src="{{ asset( screen.lien_screen ) }}" alt="{{ screen.alt_screen }}" title="{{ screen.alt_screen }}" width="{{ screen.screenWidth }}" height="{{ screen.screenHeight }}" border="0" class="jeu_screenshot"></a>
                            <span id="span_screen_jeu_{{ jeu.idreel }}" class="titre_dessus_screen" style="display:none;">{{ jeu.titrePropreTronque }}</span>
                        </div>
                        {% else %}
                        <div onclick="document.location='{{ path('game', {'titreUrl': jeu.titreUrl, 'idSysteme': jeu.systeme.id, 'onglet': jeu.systeme.onglet, 'idJeu': jeu.clone}) }}';" onmouseover="$('#span_screen_jeu_{{ jeu.idreel }}').show()" onmouseout="$('#span_screen_jeu_{{ jeu.idreel }}').hide()">
                            <a href="{{ path('game', {'titreUrl': jeu.titreUrl, 'idSysteme': jeu.systeme.id, 'onglet': jeu.systeme.onglet, 'idJeu': jeu.clone}) }}" title="{{ screen.alt_screen }}"><img itemprop="image" src="{{ asset( screen.lien_screen ) }}" alt="{{ screen.alt_screen }}" title="{{ screen.alt_screen }}" width="{{ screen.screenWidth }}" height="{{ screen.screenHeight }}" border="0" class="jeu_screenshot"></a>
                            <span id="span_screen_jeu_{{ jeu.idreel }}" class="titre_dessus_screen" style="display:none;">{{ jeu.titrePropreTronque }}</span>
                        </div>
                        {% endif %}
                        {% endif %}
                    {% endfor %}
                {% endfor %}
                </div>
            {% endif %}
        </div>
    </div>
{% else %}
<div class="row">
    <div class="col-md-12">
        {% if totalDesJeux == '0' %}
            {% trans %}Aucun jeu trouv&eacute !{% endtrans %}
        {% else %}
        <table id="simple-example-table" cellspacing="0">
            <tbody>
                <tr class="thead" align="left">
                    <th width="61%"><a class="{% if tri != 'default' %}tri_tab_recherche{% endif %}" href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': 0, 'tri': 'default'}) }}?franchise={{ rechercheFranchise }}">{% trans %}Titre{% endtrans %}</a></th>
					<th width="15%"><a class="{% if tri != 'sys' %}tri_tab_recherche{% endif %}" href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': 0, 'tri': 'sys'}) }}?franchise={{ rechercheFranchise }}">{% trans %}Syst&egrave;me{% endtrans %}</a></th>
                    <th width="12%"><a class="{% if tri != 'year' %}tri_tab_recherche{% endif %}" href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': 0, 'tri': 'year'}) }}?franchise={{ rechercheFranchise }}">{% trans %}Ann&eacute;e{% endtrans %}</a></th>
                    <th width="12%">{% trans %}Genre{% endtrans %}</th>
                </tr>
                {% for jeu in listeDesJeux %}
                <tr>
                    {% if jeu.clone == 0 %}
                    <td><a href="{{ path('game', {'titreUrl': jeu.titreUrl, 'idSysteme': jeu.systeme.id, 'onglet': jeu.systeme.onglet, 'idJeu': jeu.idreel}) }}">{{ jeu.titrePropre }}</a></td>
                    {% else %}
                    <td><a href="{{ path('game', {'titreUrl': jeu.titreUrl, 'idSysteme': jeu.systeme.id, 'onglet': jeu.systeme.onglet, 'idJeu': jeu.clone}) }}">{{ jeu.titrePropre }}</a></td>
                    {% endif %}
                    <td><a class="" href="{{ path('systeme3', {'systemePourUrl': jeu.systemePourUrl, 'idSysteme': jeu.systeme.id, 'onglet': jeu.systeme.onglet, 'lettre': 'all', 'page': 0}) }}">{{ jeu.systemePropre }}</a></td>
                    <td>{% if ( jeu.annee != 0 ) %}{{ jeu.annee }}{% endif %}{% if ( jeu.annee == 0 ) %}????{% endif %}</td>
                    {% if app.request.locale == 'fr' %}
                    <td>{{ jeu.genre }}</td>
                    {% else %}
                    <td>{{ jeu.genre.genreEn }}</td>
                    {% endif %}
                </tr>
                {% endfor %}
            </tbody>
        </table>
<script src="{{ asset('js/stacktable.js') }}" type="text/javascript"></script>
<script type="text/javascript">
<!--
$('#simple-example-table').stacktable({myClass:'your-custom-class'});
-->
</script>
        {% endif %}
    </div>
</div>
{% endif %}
{% endblock %}

{% block pagination2 %}
<div class="text-center text-bold container">
    <div class="row">
        <div class="col-md-12">
            <div class="newtab-grid">
            <ul class="sync-pagination pagination pagination_bas">
            {% for page in listingNumerotationPagination %}
                {% if ( page.numeroAffiche != 'laquo' ) and ( page.numeroAffiche != 'raquo' ) %}<li class="{{ page.classe }}"><a href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': page.numero, 'tri': tri}) }}?franchise={{ rechercheFranchise }}">{{ page.numeroAffiche }}</a></li>{% endif %}
                {% if page.numeroAffiche == 'laquo' %}<li class="{{ page.classe }}"><a href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': page.numero, 'tri': tri}) }}?franchise={{ rechercheFranchise }}">&laquo;</a></li>{% endif %}
                {% if page.numeroAffiche == 'raquo' %}<li class="{{ page.classe }}"><a href="{{ path('recherche', {'mot': rechercheMot, 'systeme': rechercheSysteme, 'genre': rechercheGenre, 'page': page.numero, 'tri': tri}) }}?franchise={{ rechercheFranchise }}">&raquo;</a></li>{% endif %}
            {% endfor %}
            </ul>
            </div>
        </div>
    </div>
</div>
{% endblock %}