{% extends '@nucleus/partials/particle.html.twig' %}

{% set attr_extra = '' %}
{% if particle.extra %}
    {% for attributes in particle.extra %}
        {% for key, value in attributes %}
            {% set attr_extra = attr_extra ~ ' ' ~ key|e ~ '="' ~ value|e('html_attr') ~ '"' %}
        {% endfor %}
    {% endfor %}
{% endif %}

{% block particle %}
    {% set article_settings = particle.article %}
    {% set filter = article_settings.filter %}
    {% set sort = article_settings.sort %}
    {% set limit = article_settings.limit %}
    {% set display = article_settings.display %}

    {# Category Finder #}
    {% set category_options = filter.categories ? {id: [filter.categories|split(','), 0]} : {} %}
    {% set categories = joomla.finder('category', category_options).published(1).language().limit(0).find() %}

    {# Content Finder #}
    {% set article_finder = joomla.finder('content').category(categories).published(1).language() %}

    {% set featured = filter.featured|default('include') %}
    {% if featured == 'exclude' %}
        {% do article_finder.featured(false) %}
    {% elseif featured == 'only' %}
        {% do article_finder.featured(true) %}
    {% endif %}

    {% set articles = article_finder.order(sort.orderby, sort.ordering).limit(limit.total).start(limit.start).find() %}

    {# All Articles #}
    <div class="g-content-array g-joomla-articles{% if particle.css.class %} {{ particle.css.class }}{% endif %}" {% if particle.extra %}{{ attr_extra|raw }}{% endif %}>

        {% for column in articles|batch(limit.columns) %}
            <div class="g-grid">
                {% for article in column %}

                    <div class="g-block">
                        <div class="g-content">
                            <div class="g-array-item">
                                {% if display.image.enabled and article.images.image_intro or article.images.image_fulltext %}
                                    {% if article.images.image_intro and display.image.enabled == 'intro' or display.image.enabled == 'show' %}
                                        <div class="g-array-item-image">
                                            <a href="{{ article.route }}">
                                                <img src="{{ url(article.images.image_intro) }}" {{ article.images.image_intro|imagesize|raw }} />
                                            </a>
                                        </div>
                                    {% elseif article.images.image_fulltext and display.image.enabled == 'full' %}
                                        <div class="g-array-item-image">
                                            <a href="{{ article.route }}">
                                                <img src="{{ url(article.images.image_fulltext) }}" {{ article.images.image_fulltext|imagesize|raw }} />
                                            </a>
                                        </div>
                                    {% endif %}
                                {% endif %}

                                {% if display.title.enabled %}
                                    <div class="g-array-item-title">
                                        <h3 class="g-item-title">
                                            <a href="{{ article.route }}">
                                                {{ display.title.limit ? article.title|truncate_text(display.title.limit) : article.title }}
                                            </a>
                                        </h3>
                                    </div>
                                {% endif %}

                                {% if display.date.enabled or display.author.enabled or display.category.enabled or display.hits.enabled %}
                                    <div class="g-array-item-details">
                                        {% if display.date.enabled %}
                                            <span class="g-array-item-date">
                                                {% if display.date.enabled == 'published' %}
                                                    <i class="fa fa-clock-o"></i>{{ article.publish_up|date(display.date.format) }}
                                                {% elseif display.date.enabled == 'modified' %}
                                                    <i class="fa fa-clock-o"></i>{{ article.modified|date(display.date.format) }}
                                                {% else %}
                                                    <i class="fa fa-clock-o"></i>{{ article.created|date(display.date.format) }}
                                                {% endif %}
                                            </span>
                                        {% endif %}

                                        {% if display.author.enabled %}
                                            <span class="g-array-item-author">
                                                <i class="fa fa-user"></i>{{ article.author.name }}
                                            </span>
                                        {% endif %}

                                        {% if display.category.enabled %}
                                            {% set category_link = display.category.enabled == 'link' %}
                                            <span class="g-array-item-category">
                                                {% for category in article.categories %}
                                                    {% if category_link %}
                                                        <a href="{{ category.route }}">
                                                            <i class="fa fa-folder-open"></i>{{ category.title }}
                                                        </a>
                                                    {% else %}
                                                        <i class="fa fa-folder-open"></i>{{ category.title }}
                                                    {% endif %}
                                                {% endfor %}
                                            </span>
                                        {% endif %}

                                        {% if display.hits.enabled %}
                                            <span class="g-array-item-hits">
                                                <i class="fa fa-eye"></i>{{ article.hits }}
                                            </span>
                                        {% endif %}
                                    </div>
                                {% endif %}

                                {% if display.text.type %}
                                    {% set article_text = display.text.type == 'intro' ? article.introtext : article.text %}
                                    <div class="g-array-item-text">
                                        {% if display.text.formatting == 'text' %}
                                            {{ article_text|truncate_text(display.text.limit)|raw }}
                                        {% else %}
                                            {{ article_text|truncate_html(display.text.limit)|raw }}
                                        {% endif %}
                                    </div>
                                {% endif %}

                                {% if display.read_more.enabled %}
                                    <div class="g-array-item-read-more">
                                        <a href="{{ article.route }}">
                                            <button class="button{% if display.read_more.css %} {{ display.read_more.css }}{% endif %}">{{ display.read_more.label|default('Read More...') }}</button>

                                        </a>
                                    </div>
                                {% endif %}
                            </div>
                        </div>
                    </div>

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

{% endblock %}