{% extends "public_base.html" %}
{% import "marketplace/_macros.html" as mk %}

{% block title %}{{ _("Product lines") }}{% endblock %}

{% block hero %}
<section class="store-hero store-hero--slim">
    <div class="container">
        <h1 class="store-hero__title">{{ _("Product lines") }}</h1>
        <p class="store-hero__subtitle">{{ _("Each line is a Software Product Line, a variability model over marketplace features. Pick one and configure your own product.") }}</p>
    </div>
</section>
{% endblock %}

{% block content %}
<div class="container">
    {% if spls %}
    <div class="store-spl-list">
        {% for spl in spls %}
        <article class="store-spl-row"{% if spl.anchor %} id="{{ spl.anchor }}"{% endif %}>
            <header class="store-spl-row__head">
                <div class="store-spl-row__title">
                    {{ mk.icon("layers", 22) }}
                    <div>
                        <h2 class="store-spl-row__name">{% if spl.detail_url %}<a href="{{ spl.detail_url }}">{{ spl.name }}</a>{% else %}{{ spl.name }}{% endif %}</h2>
                        {% if spl.description %}<p class="store-spl-row__desc">{{ spl.description }}</p>{% endif %}
                    </div>
                </div>
                {% if spl.configure_url %}
                <a class="btn btn-primary store-spl-row__cta" href="{{ spl.configure_url }}">
                    {{ mk.icon("sliders") }}{{ _("Configure this line") }}
                </a>
                {% endif %}
            </header>

            {% if spl.mandatory %}
            <details class="store-fold">
                <summary class="store-fold__summary">
                    {{ mk.icon("check-circle") }}
                    <span class="store-fold__label store-fold__label--mandatory">{{ _("Always included") }}</span>
                    <span class="store-fold__count">{{ spl.mandatory | length }}</span>
                    {{ mk.icon("chevron-down") }}
                </summary>
                <div class="store-fold__body store-chipset">
                    {% for entry in spl.mandatory %}{{ mk.feature_chip(entry.short, external=entry.external) }}{% endfor %}
                </div>
            </details>
            {% endif %}

            {% for group_name, group in spl.groups.items() %}
            <details class="store-fold">
                <summary class="store-fold__summary">
                    {{ mk.icon("git-branch") }}
                    <span class="store-fold__label store-fold__label--alt">{{ group_name }}</span>
                    <span class="store-fold__hint">{% if group.kind == "alternative" %}{% if group.required %}{{ _("choose exactly one") }}{% else %}{{ _("choose one at most") }}{% endif %}{% elif group.kind == "or" %}{% if group.required %}{{ _("choose at least one") }}{% else %}{{ _("choose any") }}{% endif %}{% else %}{{ group.kind }}{% endif %}</span>
                    <span class="store-fold__count">{{ group.options | length }}</span>
                    {{ mk.icon("chevron-down") }}
                </summary>
                <div class="store-fold__body store-chipset">
                    {% for entry in group.options %}{{ mk.feature_chip(entry.short, external=entry.external) }}{% endfor %}
                </div>
            </details>
            {% endfor %}

            {% if spl.optional %}
            <details class="store-fold">
                <summary class="store-fold__summary">
                    {{ mk.icon("plus") }}
                    <span class="store-fold__label">{{ _("Optional") }}</span>
                    <span class="store-fold__count">{{ spl.optional | length }}</span>
                    {{ mk.icon("chevron-down") }}
                </summary>
                <div class="store-fold__body store-chipset">
                    {% for entry in spl.optional %}{{ mk.feature_chip(entry.short, external=entry.external) }}{% endfor %}
                </div>
            </details>
            {% endif %}

            {# The model's cross tree constraints, "a => b", read as "a needs b". #}
            {% if spl.rules %}
            <details class="store-fold">
                <summary class="store-fold__summary">
                    {{ mk.icon("link") }}
                    <span class="store-fold__label">{{ _("Rules") }}</span>
                    <span class="store-fold__hint">{{ _("what each feature needs in this line") }}</span>
                    <span class="store-fold__count">{{ spl.rules | length }}</span>
                    {{ mk.icon("chevron-down") }}
                </summary>
                <ul class="store-fold__body store-rules">
                    {% for rule in spl.rules %}
                    <li class="store-rule"><code class="store-code">{{ rule.feature }}</code> <span class="store-rule__verb">{{ _("needs") }}</span> <code class="store-code">{{ rule.needs }}</code></li>
                    {% endfor %}
                </ul>
            </details>
            {% endif %}
        </article>
        {% endfor %}
    </div>
    {% else %}
    <div class="store-empty">
        {{ mk.icon("layers", 34) }}
        <p>{{ _("No product lines in the index yet.") }}</p>
    </div>
    {% endif %}
</div>
{% endblock %}