From c259ead9a0d93f00960e48caae5b0e11ab0457dc Mon Sep 17 00:00:00 2001 From: sthag Date: Tue, 28 Oct 2025 19:51:59 +0100 Subject: [PATCH] feat: Replace new with start screen - Convert to liquid - Add old ongoing function for now - Add macros as partials - Rename data source to better reflect usage - Update app.js to fulfill jshint --- source/code/app.js | 27 +++++++---- source/data/{new.json => start.json} | 4 +- source/screens/demo/examples/ui/new.njk | 45 ------------------- source/screens/demo/examples/ui/start.liquid | 44 ++++++++++++++++++ .../hippie/partials/header-status.liquid | 21 +++++++++ .../hippie/partials/status-coord.liquid | 1 + .../hippie/partials/status-date.liquid | 6 +++ .../hippie/partials/status-time.liquid | 1 + 8 files changed, 94 insertions(+), 55 deletions(-) rename source/data/{new.json => start.json} (56%) delete mode 100755 source/screens/demo/examples/ui/new.njk create mode 100644 source/screens/demo/examples/ui/start.liquid create mode 100644 source/templates/hippie/partials/header-status.liquid create mode 100644 source/templates/hippie/partials/status-coord.liquid create mode 100644 source/templates/hippie/partials/status-date.liquid create mode 100644 source/templates/hippie/partials/status-time.liquid diff --git a/source/code/app.js b/source/code/app.js index 8632638..8a21b5f 100644 --- a/source/code/app.js +++ b/source/code/app.js @@ -1,25 +1,33 @@ //NEW function Clock(id) { - this.id = id; + 'use strict'; - var that = this; - setInterval(function () { that.updateClock(); }, 1000); + this.id = id; + const that = this; + + setInterval(function () { + that.updateClock(); + }, 1000); this.updateClock(); } Clock.prototype.updateClock = function () { - var date = new Date(); - var clock = document.getElementById(this.id); + 'use strict'; + + const date = new Date(); + const clock = document.getElementById(this.id); //console.log(this); - clock.innerHTML = this.formatDigits(date.getHours()) + ":" + this.formatDigits(date.getMinutes()) + ":" + this.formatDigits(date.getSeconds()); + clock.innerHTML = this.formatDigits(date.getHours()) + ':' + this.formatDigits(date.getMinutes()) + ":" + this.formatDigits(date.getSeconds()); }; Clock.prototype.formatDigits = function (val) { - if (val < 10) val = "0" + val; + 'use strict'; + + if (val < 10) val = '0' + val; return val; -} +}; //OLD @@ -121,6 +129,7 @@ function barwidth(size, G, W) { return newW; } + //String Element erweitern String.prototype.transform = function () { return parseFloat(this.replace(',', '.')); @@ -129,6 +138,7 @@ String.prototype.transform = function () { Array.prototype.arrayAdd = function () { return eval(this.join("+")); } + //Speicherplatz in Prozent berechnen function percentage(total, gigs, round) { var totalSpace = total; @@ -138,6 +148,7 @@ function percentage(total, gigs, round) { return p; } + //Speicherplatz in GB berechnen function gigabytes(percent, total, round) { var occupiedPercent = percent; diff --git a/source/data/new.json b/source/data/start.json similarity index 56% rename from source/data/new.json rename to source/data/start.json index 9d4a0a8..cc0da22 100644 --- a/source/data/new.json +++ b/source/data/start.json @@ -5,10 +5,10 @@ }, { "text": "Basics", - "href": "./demo/basics.html" + "href": "/demo/basics.html" }, { "text": "Drag", - "href": "./demo/examples/ui/drag.html" + "href": "/demo/examples/ui/drag.html" } ] \ No newline at end of file diff --git a/source/screens/demo/examples/ui/new.njk b/source/screens/demo/examples/ui/new.njk deleted file mode 100755 index df1f62a..0000000 --- a/source/screens/demo/examples/ui/new.njk +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: New -tags: - - ui ---- -{% set pageId = page.fileSlug %} -{% set bodyClass = "body_new" %} - -{% extends "hippie/_app_frame.njk" %} -{% import "hippie/macros/_header.njk" as header %} - -{% block body %} - {{ header.status(hippie, new) }} -
- -
-
-
1
-
2
-
3
-
4
-
-{% endblock %} - -{%- block script %} - {{ super() }} - -{% endblock %} \ No newline at end of file diff --git a/source/screens/demo/examples/ui/start.liquid b/source/screens/demo/examples/ui/start.liquid new file mode 100644 index 0000000..8e13c85 --- /dev/null +++ b/source/screens/demo/examples/ui/start.liquid @@ -0,0 +1,44 @@ +--- +title: Start +tags: +- ui +--- +{% assign bodyClass = "body_new" -%} +{% layout "hippie/app.liquid" %} + +{% block body %} +{% render 'hippie/partials/header-status', hippie: hippie, links: start %} +
+ +
+
+
1
+
2
+
3
+
4
+
+{% endblock %} + +{%- block script %} +{{ block.super -}} + +{% endblock %} \ No newline at end of file diff --git a/source/templates/hippie/partials/header-status.liquid b/source/templates/hippie/partials/header-status.liquid new file mode 100644 index 0000000..725e305 --- /dev/null +++ b/source/templates/hippie/partials/header-status.liquid @@ -0,0 +1,21 @@ +
+

+ {{ hippie.brand | upcase }} +

+ +
+

{% render 'hippie/partials/status-coord', id: "log" %} + / + {% render 'hippie/partials/status-date', id: "date" %} + / + {% render 'hippie/partials/status-time', id: "time" %}

+
+
diff --git a/source/templates/hippie/partials/status-coord.liquid b/source/templates/hippie/partials/status-coord.liquid new file mode 100644 index 0000000..29e592f --- /dev/null +++ b/source/templates/hippie/partials/status-coord.liquid @@ -0,0 +1 @@ +{{ text | default: 'X: #, Y: ##' }} diff --git a/source/templates/hippie/partials/status-date.liquid b/source/templates/hippie/partials/status-date.liquid new file mode 100644 index 0000000..296a866 --- /dev/null +++ b/source/templates/hippie/partials/status-date.liquid @@ -0,0 +1,6 @@ + + Wochentag, + ##. + Monat + #### + diff --git a/source/templates/hippie/partials/status-time.liquid b/source/templates/hippie/partials/status-time.liquid new file mode 100644 index 0000000..f981e80 --- /dev/null +++ b/source/templates/hippie/partials/status-time.liquid @@ -0,0 +1 @@ +{{ text | default: '00:00:00' }}{{ postfix | default: ' Uhr' }}