Show TOP-description

On hovering and (with JS) in an element that opens on click.
/close #43

static/css/style.css

@@ -44,3 +44,7 @@ input[type="file"] {
 pre.error-description {
     white-space: pre-wrap;
 }
+
+.expansion-text {
+    display: none;
+}

static/js/script.js

+
+function toggle_expansion() {
+    var description_element = document.getElementById(this.id + "-description");
+    var current_state = document.defaultView.getComputedStyle(description_element, "").getPropertyValue("display");
+    var new_state = current_state == "none" ? "block" : "none";
+    description_element.style.display = new_state;
+};
+
+window.onload=function() {
+    var buttons = document.getElementsByClassName("expansion-button");
+    for (var i = 0; i < buttons.length; i++) {
+        var button = buttons[i];
+        console.log(button);
+        button.onclick = toggle_expansion;
+    }
+};

templates/layout.html

@@ -9,6 +9,7 @@
     <link rel="stylesheet" href="{{url_for("static", filename="css/style.css")}}" />
     {% block additional_js %}
     {% endblock %}
+    <script src="{{url_for("static", filename="js/script.js")}}" async></script>
     <title>{% block title %}Unbenannte Seite{% endblock %} - Protokollsystem</title>
     {% endblock %}
 </head>

templates/protocol-tops-include.html

@@ -7,9 +7,9 @@
         {% endfor %}
     {% endif %}
     {% for top in protocol.tops %}
-        <li>
+        <li{% if has_private_view_right %} class="expansion-button" id="top-{{top.id}}" title="{{top.description}}"{% endif %}>
             {{top.name}}
-            {% if not protocol.is_done() and has_public_type_view_right %}
+            {% if not protocol.is_done() and has_modify_right %}
                 ({{top.number}})
             {% endif %}
             {% if not protocol.is_done() and has_modify_right %}
@@ -18,6 +18,12 @@
                 <a href="{{url_for('move_top', top_id=top.id, diff=-1)}}">Hoch</a>
                 <a href="{{url_for('delete_top', top_id=top.id)}}" onclick="return confirm('Bist du dir sicher, dass du den TOP {{top.name}} löschen möchtest?');">Löschen</a>
             {% endif %}
+            {% if has_private_view_right and top.description|length > 0 %}
+                <span class="glyphicon glyphicon-info-sign"></span>
+                <pre id="top-{{top.id}}-description" class="expansion-text">
+                    {{-top.description-}}
+                </pre>
+            {% endif %}
         </li>
     {% endfor %}
     {% if not protocol.has_nonplanned_tops() %}