From 6a7b02b70020072ae65e60d5d892a747218b6fd4 Mon Sep 17 00:00:00 2001
From: vabene1111 <vabene1234@googlemail.com>
Date: Sat, 2 May 2020 23:46:57 +0200
Subject: [PATCH] add special type of ingredients to allow headers

---
 .../templates/forms/edit_internal_recipe.html | 23 ++++-
 cookbook/templates/recipe_view.html           | 95 +++++++++++--------
 2 files changed, 76 insertions(+), 42 deletions(-)

diff --git a/cookbook/templates/forms/edit_internal_recipe.html b/cookbook/templates/forms/edit_internal_recipe.html
index db5d0ffad..0245b5dc7 100644
--- a/cookbook/templates/forms/edit_internal_recipe.html
+++ b/cookbook/templates/forms/edit_internal_recipe.html
@@ -32,6 +32,8 @@
                 <div class="table-controls" style="text-align: center">
                     <button class="btn btn-success" id="new_empty" type="button" style="min-width: 20vw"><i
                             class="fas fa-plus-circle"></i></button>
+                    <button class="btn btn-warning" id="new_header" type="button" data-toggle="tooltip"
+                    data-placement="top" title="{% trans 'Insert a header between the ingredients.' %}"><i class="fas fa-heading"></i></button>
 
                     <button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover"
                             data-placement="right" data-html="true" data-trigger="focus"
@@ -57,7 +59,7 @@
         {% endif %}
     </form>
 
-    <script>
+    <script type="application/javascript">
 
         $(function () {
             $('[data-toggle="popover"]').popover()
@@ -199,6 +201,20 @@
                 input.select();
             }
 
+            function addHeaderRow(type) {
+                data.push({
+                    ingredient__name: '{% trans 'Header' %}',
+                    amount: "0",
+                    unit__name: "Special:Header",
+                    note: "{% trans 'write header here' %}",
+                    id: Math.floor(Math.random() * 10000000),
+                    delete: false,
+                });
+                input = table.rowManager.rows[((table.rowManager.rows).length) - 1].cells[4].getElement()
+                input.focus();
+                input.select();
+            }
+
             document.onkeyup = function (e) {
                 if (e.shiftKey && e.ctrlKey && (e.which === 83 || e.keyCode === 83)) {
                     $('#id_form').submit()
@@ -208,7 +224,12 @@
             };
 
             document.getElementById("new_empty").addEventListener("click", addIngredientRow);
+            document.getElementById("new_header").addEventListener("click", addHeaderRow);
         });
 
+        $(function () {
+            $('[data-toggle="tooltip"]').tooltip()
+        })
+
     </script>
 {% endblock %}
\ No newline at end of file
diff --git a/cookbook/templates/recipe_view.html b/cookbook/templates/recipe_view.html
index 61df78ed1..cdd79edda 100644
--- a/cookbook/templates/recipe_view.html
+++ b/cookbook/templates/recipe_view.html
@@ -109,7 +109,7 @@
         <span class="badge badge-primary">{% trans 'Last cooked' %} {{ last_cooked|date }}</span>
     {% endif %}
 
-    {% if recipe.waiting_time and recipe.waiting_time != 0 or recipe.working_time and recipe.working_time != 0 or last_cooked%}
+    {% if recipe.waiting_time and recipe.waiting_time != 0 or recipe.working_time and recipe.working_time != 0 or last_cooked %}
         <br/>
         <br/>
     {% endif %}
@@ -137,48 +137,61 @@
                         <br/>
                         <table class="table table-sm">
                             {% for i in ingredients %}
-                                <tr>
-                                    <td style="vertical-align: middle!important;">
-                                        <div class="pretty p-default p-curve">
-                                            <input type="checkbox"/>
-                                            <div class="state p-success">
-                                                <label>
-                                                    {% if i.amount != 0 %}
-                                                        <span id="ing_{{ i.pk }}">{{ i.amount.normalize }}</span>
-                                                        {{ i.unit }}
-                                                    {% else %}
-                                                        <span>&#x2063;</span>
-                                                    {% endif %}
-                                                </label>
-                                            </div>
-                                        </div>
+                                {% if i.unit.name == 'Special:Header' %}
+                                    <tr>
+                                        <td style="padding-top: 8px!important; ">
+                                            <b>{{ i.note }}</b>
+                                        </td>
+                                        <td>
 
-                                    </td>
-                                    <td style="vertical-align: middle!important;">
-                                        {% if i.ingredient.recipe %}
-                                            <a href="{% url 'view_recipe' i.ingredient.recipe.pk %}" target="_blank">
-                                        {% endif %}
-                                        {{ i.ingredient.name }}
-                                        {% if i.ingredient.recipe %}
-                                            </a>
-                                        {% endif %}
-
-                                    </td>
-                                    <td style="vertical-align: middle!important;">
-                                        {% if i.note %}
-                                            <button class="btn btn-light btn-sm d-print-none" type="button"
-                                                    data-container="body"
-                                                    data-toggle="popover"
-                                                    data-placement="right" data-html="true" data-trigger="focus"
-                                                    data-content="{{ i.note }}">
-                                                <i class="fas fa-info"></i>
-                                            </button>
-                                            <div class="d-none d-print-block">
-                                                <i class="far fa-comment-alt"></i> {{ i.note }}
+                                        </td>
+                                        <td></td>
+                                    </tr>
+                                {% else %}
+                                    <tr>
+                                        <td style="vertical-align: middle!important;">
+                                            <div class="pretty p-default p-curve">
+                                                <input type="checkbox"/>
+                                                <div class="state p-success">
+                                                    <label>
+                                                        {% if i.amount != 0 %}
+                                                            <span id="ing_{{ i.pk }}">{{ i.amount.normalize }}</span>
+                                                            {{ i.unit }}
+                                                        {% else %}
+                                                            <span>&#x2063;</span>
+                                                        {% endif %}
+                                                    </label>
+                                                </div>
                                             </div>
-                                        {% endif %}
-                                    </td>
-                                </tr>
+
+                                        </td>
+                                        <td style="vertical-align: middle!important;">
+                                            {% if i.ingredient.recipe %}
+                                                <a href="{% url 'view_recipe' i.ingredient.recipe.pk %}"
+                                                   target="_blank">
+                                            {% endif %}
+                                            {{ i.ingredient.name }}
+                                            {% if i.ingredient.recipe %}
+                                                </a>
+                                            {% endif %}
+
+                                        </td>
+                                        <td style="vertical-align: middle!important;">
+                                            {% if i.note %}
+                                                <button class="btn btn-light btn-sm d-print-none" type="button"
+                                                        data-container="body"
+                                                        data-toggle="popover"
+                                                        data-placement="right" data-html="true" data-trigger="focus"
+                                                        data-content="{{ i.note }}">
+                                                    <i class="fas fa-info"></i>
+                                                </button>
+                                                <div class="d-none d-print-block">
+                                                    <i class="far fa-comment-alt"></i> {{ i.note }}
+                                                </div>
+                                            {% endif %}
+                                        </td>
+                                    </tr>
+                                {% endif %}
                             {% endfor %}
                             <!-- Bottom border -->
                             <tr>