diff options
| author | Indrajith K L | 2024-06-22 03:40:56 +0530 |
|---|---|---|
| committer | Indrajith K L | 2024-06-22 03:40:56 +0530 |
| commit | 646fdccac5f0ec506b80ed532baa4012965b682e (patch) | |
| tree | ced54009d8d5f20b61d7a873a6bb54907e8b7e5d /src | |
| parent | a5b35ffb182e4b2aa250059b0e44c13373999d76 (diff) | |
| download | indrajith-dev-crystal-646fdccac5f0ec506b80ed532baa4012965b682e.tar.gz indrajith-dev-crystal-646fdccac5f0ec506b80ed532baa4012965b682e.tar.bz2 indrajith-dev-crystal-646fdccac5f0ec506b80ed532baa4012965b682e.zip | |
Date Utils, Cosmetic and Implementation Changes
* Adds Utils method for formatting date
* Adds Published at to the posts page
* Adds new logo, removes font dependency
* Renames Posts link to Blog
Diffstat (limited to 'src')
| -rw-r--r-- | src/indrajith-dev-crystal.cr | 13 | ||||
| -rw-r--r-- | src/utils/utils.cr | 47 | ||||
| -rw-r--r-- | src/views/blog.ecr | 0 | ||||
| -rw-r--r-- | src/views/layout.ecr | 36 |
4 files changed, 84 insertions, 12 deletions
diff --git a/src/indrajith-dev-crystal.cr b/src/indrajith-dev-crystal.cr index f5ddabd..f49f134 100644 --- a/src/indrajith-dev-crystal.cr +++ b/src/indrajith-dev-crystal.cr @@ -2,6 +2,8 @@ require "kemal" require "crest" require "json" require "dotenv" +require "./utils/utils" +require "time" Dotenv.load @@ -13,6 +15,7 @@ module Indrajith::Dev::Crystal macro page_renderer(filename, title) page_title = {{title}} + published_at="" render "src/views/#{{{filename}}}.ecr", "src/views/layout.ecr" end @@ -41,6 +44,11 @@ module Indrajith::Dev::Crystal page_renderer "contact", "Contact" end + get "/blog" do |context| + context.response.content_type = "text/html" + page_renderer "blog", "Blog" + end + get "/posts" do |context| begin site = Crest::Resource.new("#{STRAPI_URL}") @@ -80,7 +88,7 @@ module Indrajith::Dev::Crystal get "/post/:slug" do |context| begin slug = context.params.url["slug"] - site = Crest::Resource.new("http://localhost:1337") + site = Crest::Resource.new("#{STRAPI_URL}") response = site.get("/api/posts", params: { @@ -94,6 +102,9 @@ module Indrajith::Dev::Crystal post_item = data[0] post_attribute = post_item["attributes"] content = post_attribute["post_content"] + published_raw_time = post_attribute["publishedAt"].as_s + published_time = Time.parse(published_raw_time, "%Y-%m-%dT%H:%M:%S.%3NZ", Time::Location.local) + published_at = format_date(published_time) page_title = post_attribute["post_title"] render "src/views/layout.ecr" rescue ex diff --git a/src/utils/utils.cr b/src/utils/utils.cr new file mode 100644 index 0000000..7b214ce --- /dev/null +++ b/src/utils/utils.cr @@ -0,0 +1,47 @@ + +def format_date(time : Time) + month = get_month(time.month) + "#{month} #{time.day}, #{time.year}" +end + +def format_date_with_time(time : Time) + month = get_month(time.month) + "#{month} #{time.day}, #{time.year} #{time.hour}:#{time.minute} #{am_or_pm(time.hour)}" +end + +def get_month(month) + case month + when 1 + "January" + when 2 + "February" + when 3 + "March" + when 4 + "April" + when 5 + "May" + when 6 + "June" + when 7 + "July" + when 8 + "August" + when 9 + "September" + when 10 + "October" + when 11 + "November" + when 12 + "December" + end +end + +def am_or_pm(hour) + if hour > 12 + "PM" + else + "AM" + end +end
\ No newline at end of file diff --git a/src/views/blog.ecr b/src/views/blog.ecr new file mode 100644 index 0000000..e69de29 --- /dev/null +++ b/src/views/blog.ecr diff --git a/src/views/layout.ecr b/src/views/layout.ecr index abb2dae..763f1cb 100644 --- a/src/views/layout.ecr +++ b/src/views/layout.ecr @@ -7,28 +7,37 @@ <link rel="stylesheet" href="/css/styles.css"> <script src="https://unpkg.com/htmx.org@2.0.0"></script> <link rel="icon" href="/favicon.ico"> + <link rel="preconnect" href="https://fonts.googleapis.com"> + <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> + <link href="https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap" rel="stylesheet"> </head> <body> <header class="header"> <div class="logo-container"> - <a class="logo" href="/">{indrajith.dev}</a> + <a class="logo" href="/"><img src="/images/logo.png" alt="logo"/></a> </div> <h4 class="slogan">(Software is Art)</h4> <nav> <ul> <li><a href="/" id="home" class="hvr-underline-reveal links">home</a></li> - <li><a href="/posts" class="hvr-underline-reveal links" id="posts">posts</a></li> - <li><a href="/timeline" class="hvr-underline-reveal links" id="cv">timeline</a></li> + <li><a href="/blog" class="hvr-underline-reveal links" id="blog">blog</a></li> + <li><a href="/timeline" class="hvr-underline-reveal links" id="timeline">timeline</a></li> <li><a href="/about" class="hvr-underline-reveal links" id="about">about</a></li> - <li><a href="https://git.indrajith.dev" class="hvr-underline-reveal links" id="cv">git</a></li> - <li><a href="/contact" id="cv" class="links hvr-underline-reveal">contact</a></li> - <li><a href="/feed.xml" id="cv" class="links hvr-underline-reveal">feed</a></li> + <li><a href="https://git.indrajith.dev" class="hvr-underline-reveal links" id="git">git</a></li> + <li><a href="/contact" id="contact" class="links hvr-underline-reveal">contact</a></li> + <!-- <li><a href="/feed.xml" id="cv" class="links hvr-underline-reveal">feed</a></li> --> </ul> </nav> <hr> </header> - <main id="content" hx-ext="response-targets"> + <main id="content" hx-ext="response-targets"> + <%- if published_at -%> + <div> + <%= published_at %> + </div> + <%- else -%> + <%- end -%> <%= content %> </main> @@ -44,11 +53,16 @@ <script> (function(){ const currentLocation = location.pathname; - const navs = ["about","posts","cv"]; - const currentNav = navs.find(nav=>currentLocation.includes(nav)); - if (currentNav) { - document.getElementById(currentNav).parentElement.classList.add("text-lightish-50"); + if (currentLocation=="/") { + document.getElementById("home").parentElement.classList.add("text-lightish-50"); + } else { + const navs = ["about","blog","timeline", "contact"]; + const currentNav = navs.find(nav=>currentLocation.includes(nav)); + if (currentNav) { + document.getElementById(currentNav).parentElement.classList.add("text-lightish-50"); + } } + })(); </script> </body> |