Migrate from Piccolo to HSX

This commit is contained in:
Akira Tempaku 2024-06-01 22:21:15 +09:00
parent ef57e83a8c
commit 19e467fe97
10 changed files with 163 additions and 157 deletions

2
qlfile
View file

@ -1,7 +1,7 @@
ql wild-package-inferred-system ql wild-package-inferred-system
ql fiveam ql fiveam
ql cl-jingle ql cl-jingle
git piccolo https://github.com/skyizwhite/piccolo.git git hsx https://github.com/skyizwhite/hsx.git
git ningle-fbr https://github.com/skyizwhite/ningle-fbr.git git ningle-fbr https://github.com/skyizwhite/ningle-fbr.git
ql cl-ppcre ql cl-ppcre
ql log4cl ql log4cl

View file

@ -14,14 +14,14 @@
(:class qlot/source/ql:source-ql (:class qlot/source/ql:source-ql
:initargs (:%version :latest) :initargs (:%version :latest)
:version "ql-2023-10-21")) :version "ql-2023-10-21"))
("piccolo" . ("hsx" .
(:class qlot/source/git:source-git (:class qlot/source/git:source-git
:initargs (:remote-url "https://github.com/skyizwhite/piccolo.git") :initargs (:remote-url "https://github.com/skyizwhite/hsx.git")
:version "git-543e14b7743fb4fbc2ca515ab2009cb54a39646d")) :version "git-6d894ed9a1daece01c3067e1886b911d81c35437"))
("ningle-fbr" . ("ningle-fbr" .
(:class qlot/source/git:source-git (:class qlot/source/git:source-git
:initargs (:remote-url "https://github.com/skyizwhite/ningle-fbr.git") :initargs (:remote-url "https://github.com/skyizwhite/ningle-fbr.git")
:version "git-79496d59002546e800fcf0ac59e176ada74a3fb0")) :version "git-31d9e48b13c478eb65e4d57d8890270e1cb8b36e"))
("cl-ppcre" . ("cl-ppcre" .
(:class qlot/source/ql:source-ql (:class qlot/source/ql:source-ql
:initargs (:%version :latest) :initargs (:%version :latest)

View file

@ -1,6 +1,6 @@
(defpackage #:hp/components/document (defpackage #:hp/components/document
(:use #:cl (:use #:cl
#:piccolo) #:hsx)
(:import-from #:hp/view/asset (:import-from #:hp/view/asset
#:defasset) #:defasset)
(:export #:document)) (:export #:document))
@ -20,23 +20,24 @@
(defasset *global-css* :root "global.css") (defasset *global-css* :root "global.css")
(defasset *dist-css* :root "dist.css") (defasset *dist-css* :root "dist.css")
(define-element document (title description) (defcomp document (&key title description children)
(html :lang "ja" (hsx
(head (html :lang "ja"
(meta :charset "UTF-8") (head
(script :src *htmx*) (meta :charset "UTF-8")
(mapcar (lambda (path) (script :src path)) (script :src *htmx*)
*htmx-exts*) (mapcar (lambda (path) (script :src path))
(mapcar (lambda (path) (script :src path :defer t)) *htmx-exts*)
*alpine-exts*) (mapcar (lambda (path) (script :src path :defer t))
(script :src *alpine-store* :defer t) *alpine-exts*)
(script :src *alpine* :defer t) (script :src *alpine-store* :defer t)
(style (script :src *alpine* :defer t)
"@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');") (style
(link :rel "stylesheet" :type "text/css" :href *global-css*) "@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap');")
(link :rel "stylesheet" :type "text/css" :href *dist-css*) (link :rel "stylesheet" :type "text/css" :href *global-css*)
(title (format nil "~@[~a - ~]skyizwhite.dev" title)) (link :rel "stylesheet" :type "text/css" :href *dist-css*)
(meta (title (format nil "~@[~a - ~]skyizwhite.dev" title))
:name "description" (meta
:content (or description "pakuの個人サイト"))) :name "description"
children)) :content (or description "pakuの個人サイト")))
children)))

View file

@ -2,7 +2,7 @@
(:use #:cl) (:use #:cl)
(:mix #:parenscript (:mix #:parenscript
#:paren6 #:paren6
#:piccolo) #:hsx)
(:import-from #:hp/config/asset (:import-from #:hp/config/asset
#:*hx-ext*) #:*hx-ext*)
(:import-from #:hp/view/asset (:import-from #:hp/view/asset
@ -15,34 +15,37 @@
(:href "/about" :label "About") (:href "/about" :label "About")
(:href "/work" :label "Work"))) (:href "/work" :label "Work")))
(define-element header-nav-item (href label) (defcomp header-nav-item (&key href label)
(li (hsx
:class "px-4 rounded-full" (li
:|:class| (ps* `(and (is-current-path ,href) :class "px-4 rounded-full"
"font-bold bg-indigo-200 pointer-events-none shadow-sm")) :|:class| (ps* `(and (is-current-path ,href)
(a :href href "font-bold bg-indigo-200 pointer-events-none shadow-sm"))
label))) (a :href href
label))))
(define-element layout-header () (defcomp layout-header ()
(header :class "px-10 py-6 flex justify-between" (hsx
(h1 :class "font-bold text-xl" (header :class "px-10 py-6 flex justify-between"
"skyizwhite.dev") (h1 :class "font-bold text-xl"
(nav "skyizwhite.dev")
:x-data (ps (create6 (nav
(current-path (@ window location pathname)) :x-data (ps (create6
(defun is-current-path (path) (current-path (@ window location pathname))
(eql (@ this current-path) path)))) (defun is-current-path (path)
:hx-boost "true" (eql (@ this current-path) path))))
(ul :class "h-full flex items-center gap-6 text-lg" :hx-boost "true"
(mapcar (lambda (item) (header-nav-item item)) (ul :class "h-full flex items-center gap-6 text-lg"
*header-nav-items*))))) (mapcar (lambda (item) (header-nav-item item))
*header-nav-items*))))))
(define-element layout () (defcomp layout (&key children)
(body (hsx
:hx-ext *hx-ext* (body
:class "h-[100svh] flex flex-col bg-neutral-200" :hx-ext *hx-ext*
(layout-header) :class "h-[100svh] flex flex-col bg-neutral-200"
(main :class "flex-1" (layout-header)
children) (main :class "flex-1"
; footer children)
(footer))) ; footer
(footer))))

View file

@ -1,17 +1,18 @@
(defpackage #:hp/routes/about (defpackage #:hp/routes/about
(:use #:cl (:use #:cl
#:piccolo) #:hsx)
(:import-from #:hp/view/* (:import-from #:hp/view/*
#:render) #:response)
(:export #:handle-get)) (:export #:handle-get))
(in-package #:hp/routes/about) (in-package #:hp/routes/about)
(define-element page () (defcomp page ()
(div :class "h-full place-content-center" (hsx
(h1 (div :class "h-full place-content-center"
:class "text-4xl text-center" (h1
"Coming soon..."))) :class "text-4xl text-center"
"Coming soon..."))))
(defun handle-get (params) (defun handle-get (params)
(declare (ignore params)) (declare (ignore params))
(render (page))) (response (page)))

View file

@ -2,63 +2,64 @@
(:use #:cl) (:use #:cl)
(:mix #:parenscript (:mix #:parenscript
#:paren6 #:paren6
#:piccolo) #:hsx)
(:import-from #:hp/view/* (:import-from #:hp/view/*
#:defasset #:defasset
#:render) #:response)
(:export #:handle-get)) (:export #:handle-get))
(in-package #:hp/routes/index) (in-package #:hp/routes/index)
(defasset *me-img* :img "me.jpg") (defasset *me-img* :img "me.jpg")
(define-element page () (defcomp page ()
(div :class "h-full place-content-center" (hsx
(div :class "flex justify-center gap-x-20" (div :class "h-full place-content-center"
(div :class "flex justify-end" (div :class "flex justify-center gap-x-20"
(img (div :class "flex justify-end"
:src *me-img* (img
:alt "avatar of paku" :src *me-img*
:class "w-full max-w-xs rounded-xl shadow-sm")) :alt "avatar of paku"
(div :class "flex flex-col justify-center gap-10" :class "w-full max-w-xs rounded-xl shadow-sm"))
(h1 :class "text-4xl font-bold" (div :class "flex flex-col justify-center gap-10"
"paku") (h1 :class "text-4xl font-bold"
(p :class "text-xl" "paku")
"Web developer") (p :class "text-xl"
(ul "Web developer")
(li (ul
(span "GitHub:") (li
(a (span "GitHub:")
:target "_blank" (a
:href "https://github.com/skyizwhite" :target "_blank"
:class "text-indigo-500" :href "https://github.com/skyizwhite"
"@skyizwhite")) :class "text-indigo-500"
(li "@skyizwhite"))
(span "Email: ") (li
(a (span "Email: ")
:x-data (ps (create6 (a
(email (chain (list6 "paku" "skyizwhite.dev") :x-data (ps (create6
(join "@"))))) (email (chain (list6 "paku" "skyizwhite.dev")
:x-text (ps email) (join "@")))))
:|:href| (ps (chain (list6 "mailto:" email) (join ""))) :x-text (ps email)
:|:class| "'text-indigo-500'" :|:href| (ps (chain (list6 "mailto:" email) (join "")))
"(Please enable Javascript to show.)")) :|:class| "'text-indigo-500'"
(li "(Please enable Javascript to show.)"))
(span "Fediverse(main): ") (li
(a (span "Fediverse(main): ")
:rel "me" (a
:target "_blank" :rel "me"
:href "https://post.skyizwhite.dev/@paku" :target "_blank"
:class "text-indigo-500" :href "https://post.skyizwhite.dev/@paku"
"@paku@post.skyizwhite.dev")) :class "text-indigo-500"
(li "@paku@post.skyizwhite.dev"))
(span "Fediverse(sub): ") (li
(a (span "Fediverse(sub): ")
:rel "me" (a
:target "_blank" :rel "me"
:href "https://himagine.club/@skyizwhite" :target "_blank"
:class "text-indigo-500" :href "https://himagine.club/@skyizwhite"
"@skyizwhite@himagine.club"))))))) :class "text-indigo-500"
"@skyizwhite@himagine.club"))))))))
(defun handle-get (params) (defun handle-get (params)
(declare (ignore params)) (declare (ignore params))
(render (page))) (response (page)))

View file

@ -1,7 +1,8 @@
(defpackage #:hp/routes/not-found (defpackage #:hp/routes/not-found
(:use #:cl (:use #:cl
#:piccolo) #:hsx)
(:local-nicknames (#:view #:hp/view/*)) (:import-from #:hp/view/responser
#:response)
(:export #:handle-not-found)) (:export #:handle-not-found))
(in-package #:hp/routes/not-found) (in-package #:hp/routes/not-found)
@ -9,13 +10,14 @@
'(:title "404 Not Found" '(:title "404 Not Found"
:description "お探しのページは見つかりませんでした。")) :description "お探しのページは見つかりませんでした。"))
(define-element page () (defcomp page ()
(div :class "h-full place-content-center" (hsx
(h1 (div :class "h-full place-content-center"
:class "text-rose-400 text-4xl text-center" (h1
"404 Not Found"))) :class "text-rose-400 text-4xl text-center"
"404 Not Found"))))
(defun handle-not-found () (defun handle-not-found ()
(view:render (page) (response (page)
:status :not-found :status :not-found
:metadata *metadata*)) :metadata *metadata*))

View file

@ -1,17 +1,18 @@
(defpackage #:hp/routes/work (defpackage #:hp/routes/work
(:use #:cl (:use #:cl
#:piccolo) #:hsx)
(:import-from #:hp/view/* (:import-from #:hp/view/*
#:render) #:response)
(:export #:handle-get)) (:export #:handle-get))
(in-package #:hp/routes/work) (in-package #:hp/routes/work)
(define-element page () (defcomp page ()
(div :class "h-full place-content-center" (hsx
(h1 (div :class "h-full place-content-center"
:class "text-4xl text-center" (h1
"Coming soon..."))) :class "text-4xl text-center"
"Coming soon..."))))
(defun handle-get (params) (defun handle-get (params)
(declare (ignore params)) (declare (ignore params))
(render (page))) (response (page)))

View file

@ -1,25 +0,0 @@
(defpackage #:hp/view/renderer
(:use #:cl)
(:local-nicknames (#:jg #:jingle))
(:local-nicknames (#:pi #:piccolo))
(:local-nicknames (#:cfg #:hp/config/env))
(:local-nicknames (#:cmp #:hp/components/*))
(:export #:render
#:partial-render))
(in-package #:hp/view/renderer)
(defun renderer ()
(if (cfg:dev-mode-p)
#'pi:element-string
#'pi:elem-str))
(defun render (page &key status metadata)
(jg:with-html-response
(if status (jg:set-response-status status))
(funcall (renderer) (cmp:document :metadata metadata
(cmp:layout page)))))
(defun partial-render (component &key status)
(jg:with-html-response
(if status (jg:set-response-status status))
(funcall (renderer) component)))

22
src/view/responser.lisp Normal file
View file

@ -0,0 +1,22 @@
(defpackage #:hp/view/responser
(:use #:cl)
(:import-from #:hsx
#:render)
(:local-nicknames (#:jg #:jingle))
(:local-nicknames (#:cfg #:hp/config/env))
(:local-nicknames (#:cmp #:hp/components/*))
(:export #:response
#:partial-response))
(in-package #:hp/view/responser)
(defun response (page &key status metadata)
(jg:with-html-response
(if status (jg:set-response-status status))
(render (cmp:document :metadata metadata
(cmp:layout page))
:minify t)))
(defun partial-response (component &key status)
(jg:with-html-response
(if status (jg:set-response-status status))
(render component :minify t)))