{% extends "base.html" %}
{% block body %}
<div class="toolbar">
  <input type="text" id="projet-nom" class="titre" value="Nouveau projet" aria-label="Nom du projet">
  <select id="projet-version" aria-label="Version de Centreon ciblee">
    {% for key, meta in versions.items() %}<option value="{{ key }}">{{ meta.label }}</option>{% endfor %}
  </select>
  <span class="sep"></span>
  <button type="button" id="btn-pack">Importer un pack</button>
  <button type="button" id="btn-import">Ouvrir un fichier</button>
  <button type="button" id="btn-export">Telecharger le projet</button>
  <button type="button" id="btn-vider" class="danger">Vider</button>
{% if fonctions.partage %}  <button type="button" id="btn-partager">Partager</button>{% endif %}
{% if fonctions.projets_enregistres %}
  <button type="button" id="btn-serveur-enregistrer" {% if not utilisateur %}hidden{% endif %}>Enregistrer en ligne</button>
  <button type="button" id="btn-serveur-ouvrir" {% if not utilisateur %}hidden{% endif %}>Mes projets</button>
{% endif %}
  <span class="grow" id="etat-sauvegarde"></span>
{% if fonctions.soumissions and utilisateur %}
  <button type="button" id="btn-soumettre">Proposer un pack</button>
{% endif %}
{% if fonctions.comptes %}
  {% if utilisateur %}
    <span class="compte">{{ utilisateur.affichage }}{% if utilisateur.administrateur %} <a href="/moderation">moderation</a>{% endif %}</span>
    <button type="button" id="btn-deconnexion" class="small">Se deconnecter</button>
  {% elif fonctions.comptes and inscription_ouverte %}
    <a class="btn" href="/connexion">Se connecter</a>
  {% elif fonctions.comptes %}
    <button type="button" id="btn-contribuer">Contribuer</button>
  {% endif %}
{% endif %}
  <button type="button" id="btn-generer" class="primary">Generer le CLAPI</button>
</div>

<div class="atelier">
  <nav id="rail" aria-label="Objets du projet"></nav>
  <main id="main"></main>
</div>

<div class="modal" id="modal" hidden>
  <div class="modal-box">
    <header>
      <h2 id="modal-titre">Importer un pack</h2>
      <button type="button" class="small" data-fermer-modal>Fermer</button>
    </header>
    <div id="modal-corps"></div>
  </div>
</div>

<form id="form-zip" method="post" action="/telecharger" hidden>
  <input type="hidden" name="project" id="form-zip-project">
</form>

<template id="tpl-vide">
  <div class="vide">
    <h2>Un projet vide, trois facons de le remplir</h2>
    <p>Partez d'un pack du catalogue ({{ pack_count }} packs, {{ service_count }} sondes) et modifiez-le,
    rouvrez un projet enregistre, ou creez vos objets un par un dans la colonne de gauche.</p>
  </div>
</template>

<script id="donnees-types" type="application/json">{{ command_types|tojson }}</script>
<script id="donnees-contexte" type="application/json">{{ {
  "fonctions": fonctions,
  "connecte": utilisateur is not none,
  "partage": partage|default(none),
  "inscription_ouverte": inscription_ouverte,
  "depot": depot,
}|tojson }}</script>
<script src="{{ url_for('static', filename='editeur.js') }}"></script>
{% endblock %}