src/catedit/templates/catindex.html
changeset 22 0ba28595fd4d
parent 21 b1b002c5ff60
child 35 d65c34cbde3e
--- a/src/catedit/templates/catindex.html	Sat Jan 03 00:15:51 2015 +0100
+++ b/src/catedit/templates/catindex.html	Mon Jan 05 18:03:55 2015 +0100
@@ -1,117 +1,73 @@
+{% extends "catbase.html" %}
 {% if not session["user_logged"] or not session["user_can_edit"] %}
   {% set readonly="readonly" %}
 {% else %}
   {% set readonly=False %}
 {% endif %}
-<!DOCTYPE html>
-<html lang="fr">
-  <head>
-    <meta charset="utf-8">
-      <meta http-equiv="X-UA-Compatible" content="IE=edge">
-      <meta name="viewport" content="width=device-width, initial-scale=1">
-      <title>Page d'accueil</title>
-      <link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet">
-      <link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet">
-      <script src="{{ url_for('static', filename='js/jquery-1.11.1.min.js') }}" language="Javascript" type="text/javascript"></script>
-      <script>
-        $(document).ready(function(){
-          {% for cat in cat_list %}
-          $("#properties_{{cat.cat_id}}").hide();
-          $("#info_button_{{cat.cat_id}}").click(function(){
-            $("#properties_{{cat.cat_id}}").slideToggle();
-          });
-          {% endfor %}
-        });
-      </script>
-  </head>
-  <body>
-    <div class="navbar navbar-inverse" role="navigation">
-        <div class="container">
-          <div class="navbar-header">
-            <a class="navbar-brand" href="{{ url_for('cat_index') }}">
-              <img alt="Brand" src="{{ url_for('static', filename='img/catedit_brand.png') }}" class="navbar-img" width="32" height="32">
-            </a>
-            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
-              <span class="sr-only">Toggle navigation</span>
-              <span class="icon-bar"></span>
-            </button>
-          </div>
-          <div class="collapse navbar-collapse">
-            <ul class="nav navbar-nav">
-              <li class="active"><a>Page d'accueil</a></li>
-            </ul>
-            <div class="navbar-text navbar-right">
-              {% if not session.get("user_logged", None)%}Non authentifié - <a href="{{ url_for('github_login') }}" class="navbar-link">S'authentifier</a>
-              {% else %} Authentifié: {{ session["user_login"] }} - <a href="{{ url_for('logout') }}" class="navbar-link">Quitter</a>{% endif %}
-            </div>
-            {% if session["user_login"] %}
-            <form class="navbar-form navbar-right">
-              <select class="form-control select-repo" name="navrepo" onchange="window.location.href=this.form.navrepo.options[this.form.navrepo.selectedIndex].value">
-                <option value="" selected="selected">Sélectionner ensemble...</option>
-                {% for repo in config["REPOSITORY_LIST"] %}
-                  <option value="{{url_for('cat_recap', repository=repo)}}">{{repo}}</option>
-                {% endfor %}
-              </select>
-            </form>
-            {% endif %}
-          </div>
-        </div>
-    </div>
-    <div class="container">
-      <h2> <b>CatEdit</b>: Editeur de Catégories</h2>
-      <h3> Mode d'emploi </h3>
-      <div class="col-md-8">
-        <p>
-          CatEdit est un outil permettant de créer et d'éditer des catégories.
-          Vous aurez besoin d'un compte Github pour utiliser CatEdit:
-          <a href="https://github.com/">s'inscrire sur Github</a>
-        </p>
-        <p>
-          Une fois authentifié, choisissez un ensemble de catégorie dans la liste se trouvant
-          dans la barre de navigation pour être redirigé vers l'atelier correspondant.
-          Vous pourrez y trouver la liste des catégories existantes pour cet ensemble,
-          présentée dans un tableau qui initialement ne comprend que les catégories de l'état courant.
-        </p>
-        <p>
-          L'état courant de l'ensemble de catégorie est la base à partir de laquelle
-          vous pourrez créer et éditer des catégories. Une catégorie consiste en un label, unique
-          et non-vide, une description, unique et non-vide et un nombre variable de propriétés.
-        </p>
-        <h4><b>La liste de catégories</b></h4>
-        <p>
-          A chaque fois que vous faites des modifications, elles sont stockées
-          de manière temporaire tant que vous restez authentifié. La liste de catégories
-          dans l'Atelier est mise à jour au fil de vos modifications selon un code couleur
-          vous permettant de visualiser vos changements.
-        </p>
-          <ul>
-            <li>
-              Une ligne de tableau <b>blanche</b> représente une catégorie de l'état courant
-              que vous n'avez ni modifié ni supprimé.
-            </li>
-            <li>
-              Une ligne de tableau <b class="text-success">verte</b> représente une catégorie que vous avez créée de zéro
-              et qui n'existait pas précédemment dans l'état courant.
-            </li>
-            <li>
-              Une ligne de tableau <b class="text-warning">orange</b> représente une catégorie qui existait
-              initialement et que vous avez modifié.
-            </li>
-            <li>
-              Une ligne de tableau <b class="text-danger">rouge</b> représente une catégorie de l'état courant que
-              vous avez supprimé.
-            </li>
-          </ul>
-        </p>
-        <p>
-          Pour que vos modifications soient permanentes et qu'elles deviennent le nouvel état courant
-          de l'ensemble de catégories, vous devez soumettre vos modifications en suivant le lien dans l'Atelier.
-          Vous trouverez une page vous présentant l'état initial d'une part et vos changements d'autre part.
-        </p>
-        <p>
-          Vous devez obligatoirement renseigner une explication de vos changements avant soumission.
-        </p>
-      </div>
-    </div>
-  </body>
-</html>
+{% block title %}Page d'accueil{% endblock title %}
+{% block head %}
+  {{ super() }}
+{% endblock head %}
+{% block navbar_items %}
+  <li class="active"><a>Page d'accueil</a></li>
+{% endblock navbar_items %}
+{% block repo_list %}
+  <option value="" selected="selected"> Sélectionnez ensemble... </option>
+  {{ super() }}
+{% endblock repo_list %}
+{% block page_content %}
+  <h2> <b>CatEdit</b>: Editeur de Catégories</h2>
+  <h3> Mode d'emploi </h3>
+  <div class="col-md-8">
+    <p>
+      CatEdit est un outil permettant de créer et d'éditer des catégories.
+      Vous aurez besoin d'un compte Github pour utiliser CatEdit:
+      <a href="https://github.com/">s'inscrire sur Github</a>
+    </p>
+    <p>
+      Une fois authentifié, choisissez un ensemble de catégorie dans la liste se trouvant
+      dans la barre de navigation pour être redirigé vers l'atelier correspondant.
+      Vous pourrez y trouver la liste des catégories existantes pour cet ensemble,
+      présentée dans un tableau qui initialement ne comprend que les catégories de l'état courant.
+    </p>
+    <p>
+      L'état courant de l'ensemble de catégorie est la base à partir de laquelle
+      vous pourrez créer et éditer des catégories. Une catégorie consiste en un label, unique
+      et non-vide, une description, unique et non-vide et un nombre variable de propriétés.
+    </p>
+    <h4><b>La liste de catégories</b></h4>
+    <p>
+      A chaque fois que vous faites des modifications, elles sont stockées
+      de manière temporaire tant que vous restez authentifié. La liste de catégories
+      dans l'Atelier est mise à jour au fil de vos modifications selon un code couleur
+      vous permettant de visualiser vos changements.
+    </p>
+      <ul>
+        <li>
+          Une ligne de tableau <b>blanche</b> représente une catégorie de l'état courant
+          que vous n'avez ni modifié ni supprimé.
+        </li>
+        <li>
+          Une ligne de tableau <b class="text-success">verte</b> représente une catégorie que vous avez créée de zéro
+          et qui n'existait pas précédemment dans l'état courant.
+        </li>
+        <li>
+          Une ligne de tableau <b class="text-warning">orange</b> représente une catégorie qui existait
+          initialement et que vous avez modifié.
+        </li>
+        <li>
+          Une ligne de tableau <b class="text-danger">rouge</b> représente une catégorie de l'état courant que
+          vous avez supprimé.
+        </li>
+      </ul>
+    </p>
+    <p>
+      Pour que vos modifications soient permanentes et qu'elles deviennent le nouvel état courant
+      de l'ensemble de catégories, vous devez soumettre vos modifications en suivant le lien dans l'Atelier.
+      Vous trouverez une page vous présentant l'état initial d'une part et vos changements d'autre part.
+    </p>
+    <p>
+      Vous devez obligatoirement renseigner une explication de vos changements avant soumission.
+    </p>
+  </div>
+{% endblock page_content %}