feat(information_page): localize last edited time

fsr-de · Nov 21, 2023 · 00f6c87 · 00f6c87
1 parent 3ef0cdd
commit 00f6c87
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 4 deletions.
diff --git a/myhpi/core/templates/core/information_page.html b/myhpi/core/templates/core/information_page.html
@@ -17,9 +17,24 @@ <h1 class="page-title">
         <div class="side-panel-container">
             <aside class="side-panel border-accent">
                 <h1 class="toc-title">{% translate "Last edited" %}</h1>
-                {{ page.last_published_at|date:"d.m.Y, H:i" }}
+                <time id="last-published" datetime="{{ page.last_published_at|date:"c" }}">
+                    <span id="last-published-date">
+                        {{ page.last_published_at|date:"d.m.Y" }}
+                    </span>
+                    {% translate "at" %}
+                    <span id="last-published-time">
+                        {{ page.last_published_at|time:"H:i" }}
+                    </span>
+                </time>
+                {% get_current_language as LANGUAGE_CODE %}
+                {% if LANGUAGE_CODE != "en" %}
+                    {% translate "Uhr" %}
+                {% endif %}
+                <noscript>
+                    UTC
+                </noscript>
                 {% if page.author_visible %}
-                    <i>{% translate "by" %}</i>
+                    {% translate "by" %}
                     {{ page.last_edited_by }}
                 {% endif %}
             </aside>
@@ -43,4 +58,4 @@ <h1 class="toc-title">{% translate "Attachments" %}</h1>
     </div>
 </div>
 {% endwith %}
-{% endblock %}
+{% endblock %}
diff --git a/myhpi/static/js/myHPI.js b/myhpi/static/js/myHPI.js
@@ -54,6 +54,12 @@ const toggleElementVisibilityOnScroll = (minScrollPosition = 0) => {
     previousScrollPosition = currentScrollPosition
 }
 
+const localizeLastPublished = () => {
+    let lastPublished = new Date(document.getElementById("last-published").getAttribute("datetime"))
+    document.getElementById("last-published-date").innerHTML = lastPublished.toLocaleDateString("de-DE", { dateStyle: "medium" })
+    document.getElementById("last-published-time").innerHTML = lastPublished.toLocaleString("de-DE", { timeStyle: "short" })
+}
+
 const enableTooltips = () => {
     const tooltipTriggerList = document.querySelectorAll(
         '[data-bs-toggle="tooltip"]'
@@ -73,6 +79,8 @@ window.onload = () => {
 
     initializeSearch()
 
+    localizeLastPublished()
+
     enableTooltips()
 
 }
@@ -83,4 +91,4 @@ window.onscroll = () => {
 window.onresize = () => {
     adaptNavbarToWindowSize()
     updateNavbarPosition()
-}
+}