From 5a70e382b8ed0d2315a274fcc9afe30824eff998 Mon Sep 17 00:00:00 2001
From: radex <radexpl@gmail.com>
Date: Mon, 11 May 2020 20:09:02 +0200
Subject: [PATCH] UX improvements

---
 storage/templates/item.html     | 44 ++++++++++++++++++---------------
 storage/views.py                |  6 ++++-
 templates/base.html             |  8 +++---
 templates/widgets/itemlist.html | 22 ++++++++++++-----
 4 files changed, 49 insertions(+), 31 deletions(-)

diff --git a/storage/templates/item.html b/storage/templates/item.html
index 2468bc5..b5f5a88 100644
--- a/storage/templates/item.html
+++ b/storage/templates/item.html
@@ -16,31 +16,14 @@
     </h2>
     <div class="row">
         <div class="col-md-4">
-            {% if labels %}
-            <h3>Labels</h3>
-            <iframe name="printframe" style="display: none"></iframe>
-            {% for label in labels %}
-                <div class="label-item">
-                    <form action="/api/1/labels/{{ label.id }}/print/?quantity=2" method="POST" target="printframe" onsubmit="return confirm('Want to print 2 labels?')" style="display:inline-block">
-                        {% csrf_token %}
-                        <button class="btn btn-default btn-sm btn-primary"><i class="glyphicon glyphicon-print"></i>&nbsp;&nbsp;PRINT&nbsp;x&nbsp;2</button>
-                    </form>
-                    <form action="/api/1/labels/{{ label.id }}/print" method="POST" target="printframe" onsubmit="return confirm('Want to print this labels?')" style="display:inline-block">
-                        {% csrf_token %}
-                        <button class="btn btn-default btn-sm"><i class="glyphicon glyphicon-print"></i></button>
-                        <code>{{ label.id }}</code>
-                    </form>
-                </div>
-            {% endfor %}
-            {% endif %}
-
-            <h3>Details</h3>
             <table class="table table-hover table-striped">
                 {% if item.owner %}
                 <tr><td>owner</td><td>{{ item.owner }}</td></tr>
                 {% endif %}
 
+                {% if item.state != "present" %}
                 <tr><td>state</td><td>{{ item.state }}</td></tr>
+                {% endif %}
                 {% if item.taken_by %}
                 <tr><td>taken by</td><td>{{ item.taken_by }}</td></tr>
                 {% endif %}
@@ -53,9 +36,30 @@
                 <tr><td>taken until</td><td>{{ item.taken_until }}</td></tr>
                 {% endif %}
 
-                <tr><td>pk</td><td><small>{{ item.pk }}</small></td></tr>
+                <!-- no one cares, except for dev? -->
+                <!-- <tr><td>pk</td><td><small>{{ item.pk }}</small></td></tr> -->
             </table>
 
+            {% if labels and not has_one_label %}
+            <h3>Labels</h3>
+            {% endif %}
+            <iframe name="printframe" style="display: none"></iframe>
+            {% for label in labels %}
+                <div class="label-item">
+                    <form action="/api/1/labels/{{ label.id }}/print/?quantity=2" method="POST" target="printframe" onsubmit="return confirm('Want to print 2 labels?')" style="display:inline-block">
+                        {% csrf_token %}
+                        <button class="btn btn-default btn-lg btn-primary"><i class="glyphicon glyphicon-print"></i>&nbsp;&nbsp;PRINT&nbsp;x&nbsp;2</button>
+                    </form>
+                    <form action="/api/1/labels/{{ label.id }}/print" method="POST" target="printframe" onsubmit="return confirm('Want to print this labels?')" style="display:inline-block">
+                        {% csrf_token %}
+                        <button class="btn btn-default btn-lg"><i class="glyphicon glyphicon-print"></i></button>
+                        {% if not has_one_label %}
+                        <code>{{ label.id }}</code>
+                        {% endif %}
+                    </form>
+                </div>
+            {% endfor %}
+
             {% if item.props.items %}
             <h3>Properties</h3>
             <table class="table table-hover table-striped">
diff --git a/storage/views.py b/storage/views.py
index 674e2b2..ccc3172 100644
--- a/storage/views.py
+++ b/storage/views.py
@@ -80,12 +80,16 @@ def item_display(request, pk):
             })
     item = get_object_or_404(Item, pk=pk)
 
+    labels = item.labels.all()
+    has_one_label = len(labels) == 1
+
     return render(request, 'item.html', {
         'item': item,
         'categories': item.categories.all(),
         'props': sorted(item.props.items()),
         'images': item.images.all(),
-        'labels': item.labels.all(),
+        'labels': labels,
+        'has_one_label': has_one_label,
         'history': LogEntry.objects.filter(object_id=item.pk),
         'ancestors': item.get_ancestors(),
         'children': item.get_children().prefetch_related('categories'),
diff --git a/templates/base.html b/templates/base.html
index 6e5eef6..d322ab2 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -20,14 +20,14 @@
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
       </button>
-      <a class="navbar-brand" href="/">spejstore</a>
+      <a class="navbar-brand" href="/">Hackerspace Storage System</a>
     </div>
 
     <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
       <ul class="nav navbar-nav">
-        <li><a href="/item/">Items</a></li>
-        <li><a href="/admin/">Add</a></li>
-        <li><a href="https://wiki.hackerspace.pl/members:services:inventory">How to use Spejstore</a></li>
+        <li><a href="/item/">Things</a></li>
+        <li><a href="/admin/">Add thing</a></li>
+        <li><a href="https://wiki.hackerspace.pl/members:services:inventory">How to use</a></li>
       </ul>
       <form class="navbar-form navbar-right" role="search" action="/search">
           <div class="form-group">
diff --git a/templates/widgets/itemlist.html b/templates/widgets/itemlist.html
index c398ed6..ff38a8d 100644
--- a/templates/widgets/itemlist.html
+++ b/templates/widgets/itemlist.html
@@ -1,4 +1,14 @@
 <table class="table table-striped table-hover">
+
+    {% if item %}
+    <tr><td colspan=2 class="placeholder">
+        <a href="/admin/storage/item/add?parent={{ item.uuid }}">
+            <span class="glyphicon glyphicon-plus"></span>
+            Add child
+        </a>
+    </td></tr>
+    {% endif %}
+
     {% for item in list %}
     <tr>
         <td style="padding: 0px 8px; width: 2rem;">
@@ -29,10 +39,10 @@
 
     {% if item %}
     <tr><td colspan=2 class="placeholder">
-            <a href="/admin/storage/item/add?parent={{ item.uuid }}">
-                <span class="glyphicon glyphicon-plus"></span>
-                Add child
-            </a>
-        </td></tr>
-        {% endif %}
+        <a href="/admin/storage/item/add?parent={{ item.uuid }}">
+            <span class="glyphicon glyphicon-plus"></span>
+            Add child
+        </a>
+    </td></tr>
+    {% endif %}
 </table>