From 72729883c6aad2a6a091eabe066fa3ff8ff5eb8c Mon Sep 17 00:00:00 2001
From: Robin Sonnabend <robin@fsmpi.rwth-aachen.de>
Date: Wed, 8 Mar 2017 02:13:43 +0100
Subject: [PATCH] Show TOP-description

On hovering and (with JS) in an element that opens on click.
/close #43
---
 static/css/style.css                 |  4 ++++
 static/js/script.js                  | 16 ++++++++++++++++
 templates/layout.html                |  1 +
 templates/protocol-tops-include.html | 10 ++++++++--
 4 files changed, 29 insertions(+), 2 deletions(-)
 create mode 100644 static/js/script.js

diff --git a/static/css/style.css b/static/css/style.css
index 5bc6b05..fd41b49 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -44,3 +44,7 @@ input[type="file"] {
 pre.error-description {
     white-space: pre-wrap;
 }
+
+.expansion-text {
+    display: none;
+}
diff --git a/static/js/script.js b/static/js/script.js
new file mode 100644
index 0000000..ff93356
--- /dev/null
+++ b/static/js/script.js
@@ -0,0 +1,16 @@
+
+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;
+    }
+};
diff --git a/templates/layout.html b/templates/layout.html
index da611b1..e3f2a29 100644
--- a/templates/layout.html
+++ b/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>
diff --git a/templates/protocol-tops-include.html b/templates/protocol-tops-include.html
index ca7dc22..ac27c6f 100644
--- a/templates/protocol-tops-include.html
+++ b/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() %}
-- 
GitLab