FEAT: Markdown support on asset comments

assets/templates/asset_create.html

@@ -1,9 +1,36 @@
 {% extends 'base_assets.html' %}
+{% load static %}
 {% load widget_tweaks %}
 {% block title %}Asset {{ object.asset_id }}{% endblock %}
 
-{% block content %}
+{% block css %}
+    <link rel="stylesheet" href="//cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
+{% endblock %}
 
+{% block preload_js %}
+    <script src="//cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>
+{% endblock %}
+
+{% block js %}
+    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
+    <script src="{% static 'js/interaction.js' %}"></script>
+    <script>
+        function checkIfCableHidden() {
+          if (document.getElementById("id_is_cable").checked) {
+            document.getElementById("cable-table").hidden = false;
+          } else {
+            document.getElementById("cable-table").hidden = true;
+          }
+        }
+        checkIfCableHidden();
+
+        $(document).ready(function () {
+            setupMDE('#id_comments');
+        });
+    </script>
+{% endblock %}
+
+{% block content %}
 <div class="page-header">
   <h1>
       {% if duplicate %}
@@ -44,17 +71,4 @@
     </div>
   </form>
 
-  {% endblock %}
-
-  {% block js%}
-  <script>
-    function checkIfCableHidden() {
-      if (document.getElementById("id_is_cable").checked) {
-        document.getElementById("cable-table").hidden = false;
-      } else {
-        document.getElementById("cable-table").hidden = true;
-      }
-    }
-    checkIfCableHidden();
-  </script>
-  {%endblock%}
+{% endblock %}

assets/templates/asset_update.html

@@ -1,70 +1,84 @@
 {% extends 'base_assets.html' %}
+{% load static %}
 {% load widget_tweaks %}
 {% block title %}Asset {{ object.asset_id }}{% endblock %}
 
+{% block css %}
+    <link rel="stylesheet" href="//cdn.jsdelivr.net/simplemde/latest/simplemde.min.css">
+{% endblock %}
+
+{% block preload_js %}
+    <script src="//cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"></script>
+{% endblock %}
+
+{% block js %}
+    {% if edit %}
+        <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
+        <script src="{% static 'js/interaction.js' %}"></script>
+        <script>
+          function checkIfCableHidden() {
+            if (document.getElementById("id_is_cable").checked) {
+              document.getElementById("cable-table").hidden = false;
+            } else {
+              document.getElementById("cable-table").hidden = true;
+            }
+          }
+          checkIfCableHidden();
+
+          $(document).ready(function () {
+              setupMDE('#id_comments');
+          });
+        </script>
+    {% endif %}
+{% endblock %}
+
 {% block content %}
+    <div class="page-header">
+      <h1>
+          {% if edit and object %}
+              Edit Asset: {{ object.asset_id }}
+          {% else %}
+              Asset: {{ object.asset_id }}
+          {% endif %}
+      </h1>
+    </div>
+    <form method="post" id="asset_update_form" action="{% url 'asset_update' pk=object.asset_id%}">
+      {% include 'form_errors.html' %}
+      {% csrf_token %}
+      <input type="hidden" name="id" value="{{ object.id|default:0 }}" hidden=true>
+      <div class="row">
+        <div class="col-sm-12">
+          {% include 'partials/asset_form.html' %}
+        </div>
+      </div>
+      <div class="row">
+        {% if perms.assets.asset_finance %}
+        <div class="col-md-6">
+          {% include 'partials/purchasedetails_form.html' %}
+        </div>
+        {%endif%}
+        <div class="col-md-6"
+        {% if not object.is_cable %} hidden="true" {% endif %} id="cable-table">
+          {% include 'partials/cable_form.html' %}
+        </div>
+        <div class="col-md-4">
+          {% include 'partials/parent_form.html' %}
+        </div>
+      </div>
+      <div class="row">
+        <div class="col-md-12">
+          {% include 'partials/asset_buttons.html' %}
+      </div>
+    </form>
 
-<div class="page-header">
-  <h1>
-      {% if edit and object %}
-          Edit Asset: {{ object.asset_id }}
-      {% else %}
-          Asset: {{ object.asset_id }}
-      {% endif %}
-  </h1>
-</div>
-<form method="post" id="asset_update_form" action="{% url 'asset_update' pk=object.asset_id%}">
-  {% include 'form_errors.html' %}
-  {% csrf_token %}
-  <input type="hidden" name="id" value="{{ object.id|default:0 }}" hidden=true>
-  <div class="row">
-    <div class="col-sm-12">
-      {% include 'partials/asset_form.html' %}
+    {% if not edit and perms.assets.view_asset %}
+    <div class="col-sm-12 text-right">
+        <div>
+            <a href="{% url 'asset_history' object.asset_id %}" title="View Revision History">
+                Last edited at {{ object.last_edited_at|default:'never' }} by {{ object.last_edited_by.name|default:'nobody' }}
+            </a>
+        </div>
     </div>
-  </div>
-  <div class="row">
-    {% if perms.assets.asset_finance %}
-    <div class="col-md-6">
-      {% include 'partials/purchasedetails_form.html' %}
-    </div>
-    {%endif%}
-    <div class="col-md-6"
-    {% if not object.is_cable %} hidden="true" {% endif %} id="cable-table">
-      {% include 'partials/cable_form.html' %}
-    </div>
-    <div class="col-md-4">
-      {% include 'partials/parent_form.html' %}
-    </div>
-  </div>
-  <div class="row">
-    <div class="col-md-12">
-      {% include 'partials/asset_buttons.html' %}
-  </div>
-</form>
-
-{% if not edit and perms.assets.view_asset %}
-<div class="col-sm-12 text-right">
-    <div>
-        <a href="{% url 'asset_history' object.asset_id %}" title="View Revision History">
-            Last edited at {{ object.last_edited_at|default:'never' }} by {{ object.last_edited_by.name|default:'nobody' }}
-        </a>
-    </div>
-</div>
-{% endif %}
+    {% endif %}
 
 {% endblock %}
-
-{% block js%}
-{% if edit %}
-<script>
-  function checkIfCableHidden() {
-    if (document.getElementById("id_is_cable").checked) {
-      document.getElementById("cable-table").hidden = false;
-    } else {
-      document.getElementById("cable-table").hidden = true;
-    }
-  }
-  checkIfCableHidden();
-</script>
-{% endif %}
-{% endblock %}

assets/templates/partials/asset_form.html

@@ -1,4 +1,5 @@
 {% load widget_tweaks %}
+{% load markdown_tags %}
 <div class="panel panel-default">
   <div class="panel-heading">
     Asset Details
@@ -35,14 +36,14 @@
     <!---TODO: Lower default number of lines in comments box-->
     <div class="form-group">
       <label for="{{ form.comments.id_for_label }}">Comments</label>
-      {% render_field form.comments|add_class:'form-control' %}
+      {% render_field form.comments|add_class:'form-control md-enabled' %}
     </div>
     {% else %}
     <dt>Asset ID</dt>
     <dd>{{ object.asset_id }}</dd>
 
     <dt>Description</dt>
-    <dd style="overflow-wrap: break-word;">{{ object.description }}</dd>
+    <dd class="dont-break-out">{{ object.description }}</dd>
 
     <dt>Category</dt>
     <dd>{{ object.category }}</dd>
@@ -54,7 +55,7 @@
     <dd>{{ object.serial_number|default:'-' }}</dd>
 
     <dt>Comments</dt>
-    <dd style="overflow-wrap: break-word;">{{ object.comments|default:'-'|linebreaksbr }}</dd>
+    <dd class="dont-break-out well">{{ object.comments|default:'-'|markdown }}</dd>
     {% endif %}
   </div>
 </div>