Adding timezone to my home page.

tayrp · Sep 20, 2024 · 163f1a3 · 163f1a3
1 parent 475f6ce
commit 163f1a3
Show file tree

Hide file tree

Showing 7 changed files with 49 additions and 13 deletions.
diff --git a/content/pages/index.html b/content/pages/index.html
@@ -8,6 +8,7 @@
         <li><a href="/projects">Projects</a> - Takes you to my Projects page.</li>
         <li><a href="/discord">Discord</a> - Redirects you to my Discord.</li>
         <li><a href="/pages">Pages</a> - Takes you to this page.</li>
+        <li><a href="/readme">README</a> - Takes you to my README page.</li>
         <li><a href="https://tayrp.substack.com/">Blog</a> - Takes you to my Substack.</li>
     </div>
 </div>

diff --git a/layouts/_default/home.html b/layouts/_default/home.html
@@ -1,9 +1,13 @@
 {{ define "main" }}
 <main>
     <div class="about">
-    <div>
-        <p>Hello and Welcome, My name is Tee.</p>
+        <div>
+            <h3 id="date-time">time</h3>
+            <script src="/assets/js/timezone.js"></script>
+            <p>Hello and Welcome, My name is Tee.</p>
+            <p>I like to go by Tee, Rhea, or Kara.</p>
+            <p>I like to go by Tee, Rhea, or Kara.</p>
+        </div>
     </div>
-</div>
 </main>
 {{ end }}
diff --git a/public/assets/js/timezone.js b/public/assets/js/timezone.js
@@ -0,0 +1,13 @@
+function displayDateTime() {
+    const timeZone = 'America/New_York';
+    const options = {
+        hour: 'numeric', minute: 'numeric', second: 'numeric', timeZone: timeZone,
+        timeZoneName: 'short'
+    };
+
+    const currentTime = new Date().toLocaleString('en-US', options);
+    document.getElementById('date-time').innerHTML = `It is ${currentTime} for Tee`;
+}
+
+setInterval(displayDateTime, 1000);
+window.onload = displayDateTime;
diff --git a/public/index.html b/public/index.html
@@ -45,10 +45,14 @@
 
 <main>
     <div class="about">
-    <div>
-        <p>Hello and Welcome, My name is Tee.</p>
+        <div>
+            <h3 id="date-time">time</h3>
+            <script src="/assets/js/timezone.js"></script>
+            <p>Hello and Welcome, My name is Tee.</p>
+            <p>I like to go by Tee, Rhea, or Kara.</p>
+            <p>I like to go by Tee, Rhea, or Kara.</p>
+        </div>
     </div>
-</div>
 </main>
 
         <footer>

diff --git a/public/index.xml b/public/index.xml
@@ -26,7 +26,7 @@
       <link>http://localhost:1313/pages/</link>
       <pubDate>Mon, 01 Jan 0001 00:00:00 +0000</pubDate>
       <guid>http://localhost:1313/pages/</guid>
-      <description>&lt;div&gt;&#xD;&#xA;    &lt;div class=&#34;about&#34;&gt;&#xD;&#xA;    &lt;div&gt;&#xD;&#xA;        &lt;p&gt;A list of all pages on my website.&lt;/p&gt;&#xD;&#xA;        &lt;p&gt;Some are hidden, Like eastereggs.&lt;/p&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/&#34;&gt;Home&lt;/a&gt; - Literally the home page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/about&#34;&gt;About&lt;/a&gt; - Literally the about page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/projects&#34;&gt;Projects&lt;/a&gt; - Literally the projects page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/discord&#34;&gt;Discord&lt;/a&gt; - Literally the discord page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/pages&#34;&gt;Pages&lt;/a&gt; - Literally this page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;https://tayrp.substack.com/&#34;&gt;Blog&lt;/a&gt; - Literally the blog button.&lt;/li&gt;&#xD;&#xA;    &lt;/div&gt;&#xD;&#xA;&lt;/div&gt;&#xD;&#xA;&lt;/div&gt;</description>
+      <description>&lt;div&gt;&#xD;&#xA;    &lt;div class=&#34;about&#34;&gt;&#xD;&#xA;    &lt;div&gt;&#xD;&#xA;        &lt;p&gt;A list of all pages on my website.&lt;/p&gt;&#xD;&#xA;        &lt;p&gt;Some are hidden, Like eastereggs.&lt;/p&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/&#34;&gt;Home&lt;/a&gt; - Takes you to my home page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/about&#34;&gt;About&lt;/a&gt; - Takes you to my About/Bio page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/projects&#34;&gt;Projects&lt;/a&gt; - Takes you to my Projects page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/discord&#34;&gt;Discord&lt;/a&gt; - Redirects you to my Discord.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/pages&#34;&gt;Pages&lt;/a&gt; - Takes you to this page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;http://localhost:1313/readme&#34;&gt;README&lt;/a&gt; - Takes you to my README page.&lt;/li&gt;&#xD;&#xA;        &lt;li&gt;&lt;a href=&#34;https://tayrp.substack.com/&#34;&gt;Blog&lt;/a&gt; - Takes you to my Substack.&lt;/li&gt;&#xD;&#xA;    &lt;/div&gt;&#xD;&#xA;&lt;/div&gt;&#xD;&#xA;&lt;/div&gt;</description>
     </item>
     <item>
       <title></title>

diff --git a/public/pages/index.html b/public/pages/index.html
@@ -49,12 +49,13 @@
     <div>
         <p>A list of all pages on my website.</p>
         <p>Some are hidden, Like eastereggs.</p>
-        <li><a href="/">Home</a> - Literally the home page.</li>
-        <li><a href="/about">About</a> - Literally the about page.</li>
-        <li><a href="/projects">Projects</a> - Literally the projects page.</li>
-        <li><a href="/discord">Discord</a> - Literally the discord page.</li>
-        <li><a href="/pages">Pages</a> - Literally this page.</li>
-        <li><a href="https://tayrp.substack.com/">Blog</a> - Literally the blog button.</li>
+        <li><a href="/">Home</a> - Takes you to my home page.</li>
+        <li><a href="/about">About</a> - Takes you to my About/Bio page.</li>
+        <li><a href="/projects">Projects</a> - Takes you to my Projects page.</li>
+        <li><a href="/discord">Discord</a> - Redirects you to my Discord.</li>
+        <li><a href="/pages">Pages</a> - Takes you to this page.</li>
+        <li><a href="/readme">README</a> - Takes you to my README page.</li>
+        <li><a href="https://tayrp.substack.com/">Blog</a> - Takes you to my Substack.</li>
     </div>
 </div>
 </div>

diff --git a/static/assets/js/timezone.js b/static/assets/js/timezone.js
@@ -0,0 +1,13 @@
+function displayDateTime() {
+    const timeZone = 'America/New_York';
+    const options = {
+        hour: 'numeric', minute: 'numeric', second: 'numeric', timeZone: timeZone,
+        timeZoneName: 'short'
+    };
+
+    const currentTime = new Date().toLocaleString('en-US', options);
+    document.getElementById('date-time').innerHTML = `It is ${currentTime} for Tee`;
+}
+
+setInterval(displayDateTime, 1000);
+window.onload = displayDateTime;