{% extends "Web/Global.php.twig" %}
{% macro getFileanme(filename, articleId, rubriqueId) %}
    {% if filename is ondisk %}
        {{ filename }}
    {% elseif ("Graphisme/mediasSpip/arton"~articleId~".png") is ondisk %}
        Graphisme/mediasSpip/arton{{ articleId }}.png
    {% elseif ("Graphisme/mediasSpip/rubon"~articleId~".png") is ondisk %}
        Graphisme/mediasSpip/rubon{{ articleId }}.png
    {% else %}
        Graphisme/mediasSpip/rubon{{ rubriqueId }}.jpg
    {% endif %}
{% endmacro %}
{% block body %}

    <script src="js/Templates/Rubrique/slider_liste_article.js"></script>

    <style>
        .contentAjaxArticle {
            margin-left: 15px;
            padding-left: 15px;
            padding-top: 10px;
        }
    </style>


    <div id="content">
        <div class="container" style="padding-bottom: 32px;">

            {#dddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd#}
            <div class="row">

                <div class="col-md-6">
                    <h2> {{ rubrique.getTitle() |raw }}</h2>



                    {% for Art in  rubrique.getLastArticles(10, 'non') %}

                        <div>


                            <h3><span><a href="{{ item.urlRewrite }}">{{ item.title }}</a></span></h3>


                            {% if Art.getUrlRewrite() is empty %}
                                {% set link = 'Article?'~Art.articleId %}
                            {% else %}
                                {% set link = Art.getUrlRewrite %}
                            {% endif %}

                            <span class="ajaxArticle" data-id="{{ Art.articleId }}"
                                  style="cursor: pointer;{% if loop.index == '1' %}font-weight:500{% endif %}">{{ Art.title }}</span><br/>

                                  <i style="font-size: 0.8em">Publié le {{ Art.getDatePublication() | date('d/m/Y') }}</i>
                                  <br/>

                                  
                            {#<span id="contentArticle{{ Art.articleId }}"#}
                            {#style="display: {% if loop.index != '1' %}none{% endif %}"#}
                            {#class="contentAjaxArticle">{{ Art.about|raw }}</span>#}
                            {##}

                            <span id="contentArticle{{ Art.articleId }}" style=" {% if loop.index != '1' %}display:none{% else%}display:inline-block{% endif %}" class="contentAjaxArticle">
                                {#<img src="{{ Art.image }}" style="float:left;max-width: 25%;padding-right:8px;padding-bottom:8px;">#}

                                {% set filename2 = _self.getFileanme(("Graphisme/mediasSpip/arton"~ Art.articleId ~".jpg"), Art.articleId, rubrique.rubriqueId)|trim %}

                                <img src="{{ filename2 }}" style="float:left;max-width: 25%;padding-right:8px;padding-bottom:8px;">
                                {{ Art.about|raw }}
</span>



                        </div>
                        <hr/>
                    {% endfor %}



                </div>
                <div class="col-md-6">
                    <h2>Agenda</h2>
                    <br/>
                    <div style="width:100%; max-width:600px; display:inline-block;">
                        <div class="monthly" id="mycalendar"></div>
                    </div>


                </div>

            </div>
        </div>


        {#<div id="slideshow">#}
            {#<div id="slidesContainer">#}



                {#{{ rubrique.toArray() | var_dump }}#}




            {#</div>#}
        {#</div>#}



    </div>

    <script type="text/javascript" src="js/monthly.js"></script>
    <link rel="stylesheet" href="css/monthly.css">

    <script type="text/javascript">
        $(window).load( function() {

            $('#mycalendar').monthly({
                mode: 'event',
                xmlUrl: 'events/events.xml'
            });


            switch(window.location.protocol) {
                case 'http:':
                case 'https:':
                    // running on a server, should be good.
                    break;
                case 'file:':
                    alert('Just a heads-up, events will not work when run locally.');
            }

        });
    </script>


{% endblock %}