summaryrefslogtreecommitdiff
path: root/desk/web/blog/post.hoon
diff options
context:
space:
mode:
Diffstat (limited to 'desk/web/blog/post.hoon')
-rw-r--r--desk/web/blog/post.hoon344
1 files changed, 344 insertions, 0 deletions
diff --git a/desk/web/blog/post.hoon b/desk/web/blog/post.hoon
new file mode 100644
index 0000000..0366fc9
--- /dev/null
+++ b/desk/web/blog/post.hoon
@@ -0,0 +1,344 @@
+/- tp=trill-post
+/+ plib=trill-utils, sr=sortug, kaji, lib=boke, const=constants
+/= post-text /web/components/post-text
+/= post-header /web/blog/post-header
+|_ [[t=thread:tp =post:tp children=full-graph:tp] =bowl:gall is-mobile=?]
+++ css ^~ %- trip
+'''
+#post-text{
+ -webkit-locale: "en";
+ text-size-adjust: 100%;
+ color: rgb(0, 0, 0);
+ line-height: 1.618;
+ text-shadow: rgb(0, 0, 0) 0px 0px 0px;
+ border-bottom-color: rgb(223, 223, 223);
+ border-bottom-style: dotted;
+ border-bottom-width: 1px;
+ box-sizing: border-box;
+ display: block;
+ margin-bottom: 24px;
+ margin-left: 0px;
+ margin-right: 0px;
+ margin-top: 0px;
+ padding-bottom: 40px;
+ padding-left: 32px;
+ padding-right: 32px;
+ padding-top: 4px;
+}
+@media (max-width: 800px){
+ #post-text{
+ padding: 0;
+ line-height: 1.2;
+ }
+}
+#comments{
+ -webkit-locale: "en";
+ text-size-adjust: 100%;
+ color: rgb(0, 0, 0);
+ line-height: 1.618;
+ text-align: left;
+ text-shadow: rgb(0, 0, 0) 0px 0px 0px;
+ box-sizing: border-box;
+ display: block;
+ margin-bottom: 32px;
+ padding-bottom: 0px;
+ padding-left: 16px;
+ padding-right: 16px;
+ padding-top: 0px;
+}
+#comments h3{
+ -webkit-locale: "en";
+ text-size-adjust: 100%;
+ color: rgb(0, 0, 0);
+ text-align: left;
+ text-shadow: rgb(0, 0, 0) 0px 0px 0px;
+ font-size: 18.72px;
+ font-weight: 400;
+ box-sizing: border-box;
+ display: block;
+ line-height: 1.2;
+ margin-block-end: 9.36px;
+ margin-block-start: 9.36px;
+ margin-bottom: 9.36px;
+ margin-inline-end: 0px;
+ margin-inline-start: 0px;
+ margin-left: 0px;
+ margin-right: 0px;
+ margin-top: 9.36px;
+}
+.comment-list{
+ -webkit-locale: "en";
+ text-size-adjust: 100%;
+ color: rgb(0, 0, 0);
+ line-height: 1.618;
+ text-align: left;
+ text-shadow: rgb(0, 0, 0) 0px 0px 0px;
+ box-sizing: border-box;
+ display: block;
+ list-style-image: none;
+ list-style-position: outside;
+ list-style-type: none;
+ margin-block-end: 24px;
+ margin-block-start: 0px;
+ margin-bottom: 24px;
+ margin-inline-end: 0px;
+ margin-inline-start: 0px;
+ margin-left: 0px;
+ margin-right: 0px;
+ margin-top: 0px;
+ padding-inline-start: 0px;
+ padding-left: 0px;
+}
+.comment-list li{
+ position: relative;
+ -webkit-locale: "en";
+ text-size-adjust: 100%;
+ color: rgb(0, 0, 0);
+ line-height: 1.618;
+ text-shadow: rgb(0, 0, 0) 0px 0px 0px;
+ list-style-image: none;
+ list-style-position: outside;
+ list-style-type: none;
+ border-left-color: rgb(223, 223, 223);
+ border-left-style: solid;
+ border-left-width: 1px;
+ box-sizing: border-box;
+ display: list-item;
+ padding-bottom: 16px;
+ padding-left: 10px;
+ padding-right: 0px;
+ padding-top: 16px;
+ text-align: left;
+}
+.comment-author{
+ font-weight: 700;
+ color: var(--text);
+ font-style: normal;
+ font-size: 1rem;
+ margin-right: 1rem;
+}
+.comment-content{
+ font-size: 90%;
+}
+#reply-title{
+ display: inline;
+}
+.reply-prompt{
+ color: var(--hong);
+ font-size: 0.9rem;
+}
+.nested{
+ padding-left: 1rem;
+}
+#reply-box{
+ & textarea{
+ width: 100%;
+ }
+ .author-data{
+ display: flex;
+ justify-content: space-between;
+
+ & .name{
+ margin-left: 1rem;
+ }
+ }
+}
+/* desktop */
+@media (min-width: 800px){
+ #reply-box{
+ width: 40%;
+ }
+}
+/* mobile */
+@media (max-width: 800px){
+ #reply-box{
+ width: 100%;
+ }
+}
+.collapse-button, .uncollapse-button{
+ width: 15px;
+ position: absolute;
+ left: -10px;
+ top: 21px;
+}
+'''
+++ script ^~ %- trip
+'''
+function scanTweets(){
+ const nodes = document.querySelectorAll(".parsed-twatter");
+ for (let n of nodes){
+ const status = n.getAttribute("status");
+ twttr.widgets.createTweet(status, n.parentElement, {
+ conversation: true
+ })
+ }
+}
+window.addEventListener('load', () => {
+ scanTweets();
+})
+'''
+++ post-content
+^- manx
+;div#post-text
+ ;style:"{css}"
+ ;* (content:post-text contents.post)
+==
+++ comments
+=/ =pid:tp [author.post id.post]
+=/ board-path (trip (spat (board-path:lib t)))
+=/ l (lent replies.t)
+=/ length ?: .=(0 l) "No" "{<l>}"
+=/ js "$store.replying_to.show('main')"
+^- manx
+;div#comments
+ ;a/"{board-path}":"Switch to Board View"
+ ;h3:"{length} comments"
+ ;div#big-reply
+ ;span.fl
+ =kaji "scry"
+ =path "/blog/f/reply/{(enc:kaji [pid pid])}"
+ =swap "add"
+ =cont "#big-reply"
+ ; Leave a reply
+ ==
+ ==
+ ;+ comment-list
+==
+++ comment-list ^- manx
+=/ cs (tap:form:tp children)
+;div#comments-wrapper
+ ;ul#comments-top.comment-list
+ =id "children{(scow %ud id.post)}"
+ ;* (turn (flop cs) comment)
+ ==
+==
+
+++ comment
+=| nested=@ud
+|= [=pid:tp [p=post:tp c=full-graph:tp]]
+^- manx
+=/ author (get-name:lib -.pid)
+=/ full-time (datetime-to-tape:string:sr id.pid "/")
+=/ time ?. is-mobile full-time
+ (post-date-ago:lib id.pid now.bowl %tam)
+
+=/ id=tape (enc:kaji pid)
+=/ js=tape "$store.replying_to.show('{id}')"
+=/ post-meta (enc:kaji [[author.post id.post] pid])
+=/ permalink ""
+;li
+ =id "comment-{id}"
+ ;img.collapse-button
+ =src "https://s3.spandrell.ch/assets/board/ui/collapse.svg"
+ =kaji "toggle"
+ =targ ".comment-proper/.uncollapse-button/.collapse-button"
+ ;
+ ==
+ ;img.uncollapse-button
+ =src "https://s3.spandrell.ch/assets/board/ui/uncollapse.svg"
+ =kaji "toggle"
+ =targ ".comment-proper/.uncollapse-button/.collapse-button"
+ =hidden ""
+ ;
+ ==
+ ;div.comment
+ ;div.comment-meta
+ ;div.row
+ ;a.comment-author/"/u/{author}":"{author}"
+ ; |
+ ;a.comment-time
+ =title "{time}"
+ =href permalink
+ ; {time}
+ ==
+ ;* ?. (is-admin:lib src.bowl) ~
+ ;= ;span:"|"
+ ;a
+ =kaji "poke"
+ =action "del-comment"
+ =name "pid"
+ =payload id
+ ; Nuke
+ ==
+ ==
+ ==
+ ==
+ ;div.comment-proper
+ ;div.comment-content
+ ;* (content:post-text contents.p)
+ ==
+ ;span.fl.reply-prompt
+ =id id
+ =kaji "scry"
+ =path "/blog/f/reply/{post-meta}"
+ =swap "swap"
+ =targ ".reply-box"
+ ; reply
+ ==
+ ;div.reply-box;
+ ;+ (grandchildren [p c] +(nested))
+ ==
+ ==
+==
+++ shit
+=| nested=@ud
+|= a=@ud %lol
+
+++ grandchildren
+|= [p=full-node:tp nested=@ud] ^- manx
+=/ cs (tap:form:tp children.p)
+=/ c (houyi:plib children.p)
+=/ count (scow:parsing:sr %ud c)
+
+?: ?& (gth (lent cs) 0) (gth nested 5) is-mobile ==
+ =/ pids [[author.post id.post] [author.p.p id.p.p]]
+ =/ path "/blog/f/subthread/{(enc:kaji pids)}"
+ ;a
+ =kaji "scry"
+ =path path
+ =swap "swap"
+ =targ "#comments-wrapper"
+ ; Show {count} more comments
+ ==
+=/ id=tape (enc:kaji [author.p.p id.p.p])
+=/ newcomms comment :: need to tisfas it to be able to manipulate the optional variable
+ :: I don't get it
+;ul.comment-list.nested
+ =id "children-{id}"
+ ;* (turn (flop cs) newcomms(nested nested))
+==
+++ comment-subthread
+|= fn=full-node:tp
+=/ cs (tap:form:tp children.fn)
+=/ ocs (tap:form:tp children)
+=/ c (houyi:plib children.fn)
+=/ oc (houyi:plib children)
+=/ count (scow:parsing:sr %ud c)
+=/ total (scow:parsing:sr %ud oc)
+=/ =pid:tp [author.post id.post]
+;div#subthread
+ ;div
+ ;p:"Showing {count} comments of {total}"
+ ;a
+ =kaji "scry"
+ =path "/blog/f/comments/{(enc:kaji pid)}"
+ =swap "swap"
+ =targ "#comments-wrapper"
+ ; Go back to top
+ ==
+ ==
+ ;div#comments-top.comment-list
+ =id "children{(scow %ud id.post)}"
+ ;* (turn (flop cs) comment)
+ ==
+==
+
+
+++ html ^- manx
+ ;div.blog
+ ;+ (post-header t src.bowl)
+ ;+ post-content
+ ;+ comments
+ ;script:"{script}"
+ ==
+--
generated by cgit v1.2.3 (git 2.25.1) at 2025-08-15 13:32:23 +0000