From e1349d418ce4bd5957f8fe657c2ce80d2b502b81 Mon Sep 17 00:00:00 2001
From: Alberto Bertogli <albertito@blitiri.com.ar>
Date: Sun, 27 Aug 2017 19:35:08 +0100
Subject: [PATCH 14/17] views: In the summary, make the sections toggable

As an experiment, make the sections of the summary to be toggable. This
can help readability, although it's unclear if it's worth the additional
complexity and could be removed later.
---
 static/git-arr.css     |  6 ++++++
 static/git-arr.js      | 10 ++++++++++
 views/commit-list.html |  2 +-
 views/summary.html     | 30 +++++++++++++++---------------
 views/tree-list.html   |  2 +-
 5 files changed, 33 insertions(+), 17 deletions(-)

diff --git a/static/git-arr.css b/static/git-arr.css
index b0f2de5..57bf13c 100644
--- a/static/git-arr.css
+++ b/static/git-arr.css
@@ -124,6 +124,12 @@ span.age-band2 {
     color: seagreen;
 }
 
+/* Toggable titles */
+div.toggable-title {
+    font-weight: bold;
+    margin-bottom: 0.3em;
+}
+
 /* Commit message and diff. */
 pre.commit-message {
     font-size: large;
diff --git a/static/git-arr.js b/static/git-arr.js
index d1e3b81..d39ca72 100644
--- a/static/git-arr.js
+++ b/static/git-arr.js
@@ -61,3 +61,13 @@ function replace_timestamps() {
         }
     }
 }
+
+function toggle(id) {
+    var e = document.getElementById(id);
+
+    if (e.style.display == "") {
+        e.style.display = "none"
+    } else if (e.style.display == "none") {
+        e.style.display = ""
+    }
+}
diff --git a/views/commit-list.html b/views/commit-list.html
index 3af9838..94f1dd0 100644
--- a/views/commit-list.html
+++ b/views/commit-list.html
@@ -16,7 +16,7 @@
 %     end
 % end
 
-<table class="nice commits">
+<table class="nice commits" id="commits">
 
 % refs = repo.refs()
 % if not defined("commits"):
diff --git a/views/summary.html b/views/summary.html
index 652ee6e..d3388e6 100644
--- a/views/summary.html
+++ b/views/summary.html
@@ -5,6 +5,7 @@
 <link rel="stylesheet" type="text/css" href="../../static/git-arr.css"/>
 <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
 <meta name=viewport content="width=device-width, initial-scale=1">
+<script async src="../../static/git-arr.js"></script>
 </head>
 
 <body class="summary">
@@ -35,23 +36,25 @@
 % end
 
 % if "master" in repo.branch_names():
-<b><a href="b/master/t/">[master]</a> /</b><br/>
-%     kwargs = dict(repo = repo, tree=repo.tree("master"),
-%                   treeroot="b/master/t", dirname=smstr.from_url(""))
-%     include tree-list **kwargs
-<hr/>
+<div class="toggable-title" onclick="toggle('commits')">
+  <a href="b/master/">commits (master)</a>
+</div>
 %     kwargs = dict(repo = repo, start_ref = "refs/heads/master",
 %                   limit = repo.info.commits_in_summary,
 %                   shorten = shorten, repo_root = ".", offset = 0)
 %     include commit-list **kwargs
 <hr/>
+<div class="toggable-title" onclick="toggle('ls')">
+  <a href="b/master/t/">tree (master)</a>
+</div>
+%     kwargs = dict(repo = repo, tree=repo.tree("master"),
+%                   treeroot="b/master/t", dirname=smstr.from_url(""))
+%     include tree-list **kwargs
+<hr/>
 % end
 
-<table class="nice">
-    <tr>
-        <th>branches</th>
-    </tr>
-
+<div class="toggable-title" onclick="toggle('branches')">branches</div>
+<table class="nice toggable" id="branches">
     % for b in repo.branch_names():
     <tr>
         <td class="main"><a href="b/{{b}}/">{{b}}</a></td>
@@ -67,11 +70,8 @@
 
 % tags = list(repo.tags())
 % if tags:
-<table class="nice">
-    <tr>
-        <th>tags</th>
-    </tr>
-
+<div class="toggable-title" onclick="toggle('tags')">tags</div>
+<table class="nice toggable" id="tags">
     % for name, obj_id in tags:
     <tr>
         <td><a href="c/{{obj_id}}/">{{name}}</a></td>
diff --git a/views/tree-list.html b/views/tree-list.html
index 5eea1aa..70f032a 100644
--- a/views/tree-list.html
+++ b/views/tree-list.html
@@ -1,4 +1,4 @@
-<table class="nice ls">
+<table class="nice toggable ls" id="ls">
 % key_func = lambda (t, n, s): (t != 'tree', n.raw)
 % for type, name, size in sorted(tree.ls(dirname.raw), key = key_func):
     <tr class="{{type}}">
-- 
2.17.1

