From bb021ab88cb5b62c82a70eab8fc0034d8dcad51d Mon Sep 17 00:00:00 2001
From: yequari <yequari@32bit.cafe>
Date: Wed, 24 Apr 2024 23:22:05 -0700
Subject: [PATCH] revamp sidebar

---
 config.yaml                                 |  4 +++
 layouts/partials/avatar.html                | 13 ++++++++
 layouts/partials/sidebar.html               | 30 +++++++++--------
 layouts/partials/statuscafe.html            | 36 ++++++++++++++++++++
 themes/dreamcast/layouts/partials/head.html |  4 +--
 themes/dreamcast/static/css/main.css        | 37 +++++++++++++++++++--
 6 files changed, 106 insertions(+), 18 deletions(-)
 create mode 100644 layouts/partials/avatar.html
 create mode 100644 layouts/partials/statuscafe.html

diff --git a/config.yaml b/config.yaml
index 34010e1..77c8fc0 100644
--- a/config.yaml
+++ b/config.yaml
@@ -57,3 +57,7 @@ menu:
         icon: aero-chat.svg
       url: xmpp:yequari@cardgameson.motorcycles
       weight: 40
+caches:
+  getresource:
+    dir: :cacheDir/:project
+    maxAge: 0
diff --git a/layouts/partials/avatar.html b/layouts/partials/avatar.html
new file mode 100644
index 0000000..bfc2183
--- /dev/null
+++ b/layouts/partials/avatar.html
@@ -0,0 +1,13 @@
+  {{ range first 1 (where .Site.RegularPages.ByDate.Reverse "Section" "blog") }}
+      {{ $d1 := time.ParseDuration "-168h" }}
+      {{ $t1 := time.Now.Add $d1 }}
+      {{ $t2 := time.AsTime .PublishDate }}
+      {{ if $t2.After $t1 }}
+          <div id="avatar-frame" class="online">
+      {{ else }}
+          <div id="avatar-frame" class="busy">
+      {{ end }}
+  {{ end }}
+        <span class="gloss"></span>
+        <img class="u-photo" width="100px" src="/images/avatar.jpg">
+          </div>
diff --git a/layouts/partials/sidebar.html b/layouts/partials/sidebar.html
index 3bc089e..0bcbedf 100644
--- a/layouts/partials/sidebar.html
+++ b/layouts/partials/sidebar.html
@@ -1,15 +1,19 @@
 <section>
-    <div id="avatar-frame" class="online">
-        <span class="gloss"></span>
-        <img class="u-photo" width="100px" src="/images/avatar.jpg">
-    </div>
+    <!-- <div id="avatar-frame" class="online"> -->
+    <!--     <span class="gloss"></span> -->
+    <!--     <img class="u-photo" width="100px" src="/images/avatar.jpg"> -->
+    <!-- </div> -->
+    {{ partial "avatar.html" . }}
+    <p class="about-me">
+        I'm yequari. I like programming, tabletop games, and the Transformers.
+    </p>
 </section>
 <section>
-    <h1>current status</h1>
-    <div id="statuscafe"><div id="statuscafe-username"></div><div id="statuscafe-content"></div></div><script src="https://status.cafe/current-status.js?name=yequari" defer></script>
+    <!-- <div id="statuscafe"><div id="statuscafe-username"></div><div id="statuscafe-content"></div></div><script src="https://status.cafe/current-status.js?name=yequari" defer></script> -->
+    {{ partial "statuscafe.html" .}}
 </section>
 <section>
-    <h1>Social</h1>
+    <!-- <h1>Social</h1> -->
     <ul class="social">
         {{ range site.Menus.social }}
         <li class="social">
@@ -26,9 +30,9 @@
         {{ end }}
     </ul>
 </section>
-<section>
-    <h1><span class="lowercase">yequari</span> says...</h1>
-    <div id="quote">
-        <p id="subtitle">.</p>
-    </div>
-</section>
+<!-- <section> -->
+<!--     <h1>Quote of the Day</h1> -->
+<!--     <div id="quote"> -->
+<!--         <p id="subtitle">.</p> -->
+<!--     </div> -->
+<!-- </section> -->
diff --git a/layouts/partials/statuscafe.html b/layouts/partials/statuscafe.html
new file mode 100644
index 0000000..cc8763c
--- /dev/null
+++ b/layouts/partials/statuscafe.html
@@ -0,0 +1,36 @@
+{{ $data := dict }}
+{{ $url := "https://status.cafe/users/yequari/status.json" }}
+{{ with resources.GetRemote $url }}
+  {{ with .Err }}
+    {{ errorf "%s" . }}
+  {{ else }}
+    <div id="statuscafe">
+    {{ $data = .Content | transform.Unmarshal }}
+    {{ $length := len $data.content }}
+    {{ if eq $length 0 }}
+        No status
+    {{ else }}
+    {{ $timestrs := strings.Split $data.timeAgo " " }}
+    {{ $timeamt := index $timestrs 0 }}
+    {{ $timeunit := index $timestrs 1 }}
+    {{ $timeunit = strings.Substr $timeunit 0 1 }}
+    {{ $url = "https://status.cafe/users/yequari/badge.png" }}
+    {{ with resources.GetRemote  $url}}
+    <div id="statuscafe-username">
+        <a href="https://status.cafe/users/yequari"><img src="{{ .RelPermalink }}" alt="Status Cafe Profile"/></a> 
+    </div>
+    {{ end }}
+    <div id="statuscafe-timeago">
+    🕗{{ $timeamt }}{{ $timeunit }}
+    </div>
+    <div id="statuscafe-content">
+        <p>
+            {{ $data.content }} 
+        </p>
+    </div>
+    </div>
+    {{ end }}
+  {{ end }}
+{{ else }}
+  {{ errorf "Unable to get remote resource %q" $url }}
+{{ end }}
diff --git a/themes/dreamcast/layouts/partials/head.html b/themes/dreamcast/layouts/partials/head.html
index dcb51ea..00e613b 100644
--- a/themes/dreamcast/layouts/partials/head.html
+++ b/themes/dreamcast/layouts/partials/head.html
@@ -7,8 +7,8 @@
     <title>{{ .Page.Title }}</title>
     <link rel="stylesheet" href="/css/main.css">
     <link rel="icon" type="image/png" href="/favicon.png">
-    <script src="/js/avatar.js" defer></script>
-    <script src="/js/quotes.js" defer></script>
+    <!-- <script src="/js/avatar.js" defer></script> -->
+    <!-- <script src="/js/quotes.js" defer></script> -->
     <link rel="webmention" href="https://webmention.io/yequari.com/webmention" />
     <link rel="pingback" href="https://webmention.io/yequari.com/xmlrpc" />
     <script src="/js/webmention.js" async></script>
diff --git a/themes/dreamcast/static/css/main.css b/themes/dreamcast/static/css/main.css
index f741e3b..4f5566f 100644
--- a/themes/dreamcast/static/css/main.css
+++ b/themes/dreamcast/static/css/main.css
@@ -157,7 +157,7 @@ ul.social {
 }
 
 li.social {
-    padding: 0;
+    padding: 5px 0;
 }
 
 img.social {
@@ -271,7 +271,7 @@ nav li a:hover, nav li a:active {
 .sidebar {
     flex: 0 1 20%;
     border-right: 1px solid black;
-    padding: 0 15px;
+    padding: 0 25px;
 }
 
 .sidebar h1 {
@@ -279,10 +279,14 @@ nav li a:hover, nav li a:active {
     padding-bottom: 5px;
 }
 
+.sidebar p.about-me {
+    text-align: center;
+}
+
 .sidebar #avatar-frame {
     width: fit-content;
     height: 100px;
-    margin: 0 auto;
+    margin: 0 auto 25px auto;
     padding: 8px 8px;
     border: 1px solid #cccccf;
     border-radius: 16px/24px;
@@ -295,6 +299,33 @@ nav li a:hover, nav li a:active {
     border-radius: 5px;
 }
 
+#statuscafe {
+    display: flex;
+    flex-flow: row wrap;
+    justify-content: space-between;
+    /* border: 1px solid #CCCCCC; */
+}
+
+#statuscafe p {
+    line-height: 1.5;
+    margin: 5px 0;
+    color: var(--secondary-text);
+    font-style: italic;
+}
+
+#statuscafe #statuscafe-timeago {
+    flex: 1 1 50%;
+    text-align: right;
+}
+
+#statuscafe #statuscafe-username {
+    flex: 1 1 50%;
+}
+
+#statuscafe #statuscafe-content {
+    flex: 1 1 100%;
+}
+
 .online {
   background: linear-gradient(#D6FFDB00 0%, #D6FFDB 30%, #66FF00 100%);
   box-shadow: 0 5px 10px #66FF00;