annuaire.html

---
layout: default
title: Annuaire
nav_menu: directory
---
<div class="hero">
  <h1>Découvrez les coopératives tech</h1>
  <p>
    Travailler avec une coopérative c'est directement être en contact avec les co-propriétaires de l'entreprise. Cela vous garantie une équipe réactive qui s'assurera de la réussite de votre projet.
  </p>
  <form action="{{site.baseurl}}/annuaire" onsubmit="event.preventDefault(); onSearch()">
    <div class="input">
      <input type="text" name="q" placeholder="Rechercher une société, un service, un produit, etc..." id="searchbox">
    </div>
    <button type="submit" class="btn"><i class="bi-search"></i> Rechercher</button>
  </form>
</div>
{% include tags.html %}
<div id="members-search-label">
  <span></span>
  <button onclick="clearSearch()">Effacer</button>
</div>
<div id="members" class="container cards">
  {% for member in site.members %}
  <a href="{{member.url|prepend:site.baseurl}}">
    <div class="image" style="{% if member.accent_color %}background-color: {{member.accent_color}}{% endif %}">
      <div style="background-image: url({% if member.thumbnail %}{{member.thumbnail}}{% else %}{{member.logo}}{% endif %})"></div>
    </div>
    <div class="title">{{member.title}}</div>
    {% if member.description %}
    <p>{{member.description}}</p>
    {% endif %}
  </a>
  {% endfor %}
</div>
<section>
  <div class="container">
    <p>
      Notre base de membre est aussi <a href="{{site.baseurl}}/members.json">disponible en JSON</a>.
    </p>
  </div>
</section>
<script src="{{site.baseurl}}/assets/js/lunr.js"></script>
<script>
  const documents = [
    {% for member in site.members -%}
    {
      "title": normalizeStr({{member.title|strip_newlines|jsonify}}),
      "body": normalizeStr({{member.content|strip_html|jsonify}}),
      "description": normalizeStr({{member.description|strip_html|jsonify}}),
      "keywords": {% if member.keywords %}{{member.keywords|jsonify}}{% else %}[]{% endif %}.map(normalizeStr),
      "keywords_str": normalizeStr({% if member.keywords %}{{member.keywords|jsonify}}{% else %}[]{% endif %}.join(", ")),
      "id": {{member.url|prepend:site.baseurl|jsonify}}
    },
    {%- endfor %}
  ];

  const lunrIndex = lunr(function() {
    this.field('title');
    this.field('body');
    this.field('description');
    this.field('keywords_str');
    for (let doc of Object.values(documents)) {
      this.add(doc);
    }
  });

  document.addEventListener('DOMContentLoaded', () => {
    const searchbox = document.getElementById('searchbox');

    let match = RegExp('[?&]q=([^&]*)').exec(window.location.search);
    if (match) {
      const q = decodeURIComponent(match[1].replace(/\+/g, ' '));
      searchbox.value = q;
      onSearch();
      searchbox.scrollIntoView();
    }

    document.querySelector(".hero form").addEventListener("submit", (e) => {
      e.preventDefault();
      onSearch();
      searchbox.scrollIntoView();
    });

    for (const tag of document.querySelectorAll("#tags a")) {
      tag.addEventListener("click", (e) => {
        e.preventDefault();
        searchbox.value = "#" + tag.innerText;
        onSearch();
      });
    }
  });

  function onSearch(preventLocationChange=false) {
    const q = document.getElementById('searchbox').value.trim();
    const members = document.getElementById('members');
    const label = document.getElementById("members-search-label");

    if (!q) {
      clearSearch();
      return;
    }

    clearSearch(false);
    members.classList.add('searching');

    let docs;
    if (q.substr(0, 1) === "#") {
      const tag = normalizeStr(q.substr(1));
      docs = documents.filter(doc => doc.keywords.includes(tag)).map(doc => ({ref: doc.id}));
    } else {
      docs = lunrIndex.search(normalizeStr(q));
    }

    let count = 0;
    for (let doc of docs) {
      const el = members.querySelector(`a[href="${doc.ref}"]`);
      if (el) {
        el.classList.add('result');
        count++;
      }
    }

    label.querySelector("span").innerText = count > 0 ? `Nos ${count} coopératives pour "${q}"` : `Pas de résultats pour "${q}"`;
    label.style.display = "block";
  }

  function clearSearch(resetLocation=true) {
    const members = document.getElementById('members');
    const label = document.getElementById("members-search-label");

    members.classList.remove('searching');
    label.style.display = "none";

    if (resetLocation) {
      window.location.search = '';
    }

    for (const el of members.querySelectorAll('a.result')) {
      el.classList.remove('result');
    }
  }

  function normalizeStr(str) {
    return str.toLowerCase().normalize("NFD").replace(/[\u0300-\u036f]/g, "")
  }
</script>