<!DOCTYPE html>
<html lang="fr">
  <head dir="ltr">
    {{>head.html}}
    <link rel="stylesheet" href="/css/portfolio.css" />
    <link rel="stylesheet" href="/css/languages.css" />
  </head>
  <body>
    <header>{{>navbar.html}}</header>
    <main>
      {{#data}}
      <h1>Portfolio</h1>
      <p>
        Je programme depuis 2018 et j'ai appris une multitude de langages
        depuis. Étant passionné de logiciels libres depuis ma licence
        d'informatique à Paris 8, je publie tout sur des forges publiques.
      </p>

      {{#location_apps}}
      <!-- Error message -->
      <p>{{location_apps}} {{err_msg}}</p>
      {{/location_apps}} {{^location_apps}}

      <h2>Projets</h2>
      <ul>
        {{#apps}} {{#metadata}} {{#info}}
        <li onclick="window.open('{{link}}', '_blank', 'noreferrer');">
          <div>
            <h3>{{title}}</h3>
            <span>{{&content}}</span> {{#language}}
            <p data-lang="{{language}}"></p>
            {{/language}}
          </div>
        </li>
        {{/info}} {{/metadata}} {{/apps}}
      </ul>

      {{#archived_apps_exists}}
      <h2>Archives</h2>
      <ul>
        {{#archived_apps}} {{#metadata}} {{#info}}
        <li onclick="window.open('{{link}}', '_blank', 'noreferrer');">
          <div>
            <h3>{{title}}</h3>
            <span>{{&content}}</span> {{#language}}
            <p data-lang="{{language}}"></p>
            {{/language}}
          </div>
        </li>
        {{/info}} {{/metadata}} {{/archived_apps}}
      </ul>
      {{/archived_apps_exists}} {{/location_apps}} {{/data}}
    </main>

    <script>
      /* Fix links in list */
      window.addEventListener("load", () =>
        document.querySelectorAll("li a").forEach(function (link) {
          link.setAttribute("target", "_blank");
          link.setAttribute("rel", "noreferrer");
          link.addEventListener("click", function (event) {
            event.stopPropagation();
          });
        })
      );
    </script>
  </body>
</html>