$def with (permalink, entry, mentions)
$var title = "?"
$ p = entry["published"][0]
$if re.match("(19|20)\d\d", tx.request.uri.path):
$var breadcrumbs = (p.format("MM"), p.format("MMMM"), p.format("DD"), p.format("D"))
$var body_classes = ["h-entry"] # widescreen
$# <link rel=alternate type=application/diamond-types href=${permalink}.dt
$# title="versioned history of this document"/>
<a class=u-url href=$permalink></a>
<a class=u-author href=/></a>
$if "mastodon" in entry.get("syndication", []):
<a class=u-bridgy-fed href=https://fed.brid.gy></a>
$ type = discover_post_type(entry)
$def render_content(entry):
$if "content" in entry:
$ content = entry["content"][0]
<div id=previewContent>
$if isinstance(content, dict) and "html" in content:
<div class=e-content>$:post_mkdn(content["html"])</div>
$else:
<div class=p-content>$:post_mkdn(content)</div>
</div>
$if type == "note":
$:render_content(entry)
$elif type == "article":
$var title = entry["name"][0]
$:render_content(entry)
$elif type == "weight":
<h2 class=p-summary>$entry["summary"][0]</h2>
$ weight = entry["weight"][0]
<p class="p-weight h-measure"><span class=p-num>$weight["num"]</span>
<span class=p-unit>$weight["unit"]</span></p>
$elif type == "audio/clip":
$# $var title = entry["name"][0]
$# <h2 class=p-name>$entry["name"][0]</h2>
<audio class="u-audio" src="$entry['audio'][0]" controls="controls">
$entry["name"][0]
</audio>
$ quotation_of = entry["quotation-of"][0]
<p>Clipped from <strong><a class=u-quotation-of
href=$quotation_of>$quotation_of</strong></a></p>
$# XXX <div class=u-content>$:post_mkdn(entry["content"][0])</div>
$elif type == "bookmark":
$ bookmark = entry["bookmark-of"][0]
$var title: Bookmarked $bookmark
<p><big>Bookmarked <a class=u-bookmark-of
href=$bookmark>$bookmark</a></big></p>
$elif type == "like":
$ like = entry["like-of"][0]
$var title: Liked $like
<p class=p-name><big class="h-cite u-like-of">Liked
<a class="p-name u-url" href=$like>$like</a></big></p>
$elif type == "rsvp":
$ in_reply_to = entry["in-reply-to"][0]
$ rsvp = entry["rsvp"][0]
$var title: RSVP $rsvp to $in_reply_to
$var show_title = False
$ colors = {
$ "yes": "859900",
$ "maybe": "b58900",
$ "no": "cb4b16",
$ }
<p>RSVP <strong class=p-rsvp style="color:#$colors[rsvp];">$rsvp</strong> to
<a class=u-in-reply-to href=$in_reply_to>$in_reply_to</a></p>
$:render_content(entry)
$else:
<p>$type</p>
$if tx.user.is_owner:
<form method=post action=/auth/share>
$for member_url in entry.get("audience", []):
<p>$member_url <button>Share</button></p>
</form>
<form method=get action=/editor/draft>
<input type=hidden name=permalink value=$permalink>
<button>Edit</button>
</form>
$# <div id=editor></div>
$# <div id=editorStatus></div>
$# $# $if tx.user.is_owner:
$# $# $for metric, value in Readability(entry["content"][0]).metrics.items():
$# $# <h4>$metric</h4>
$# $# <pre>$value</pre>
$#
$# $# XXX $ a = entry["author"]
$# $# XXX <p class="p-author h-card"><a class="u-url p-name" href=$a["uid"]>$a["name"]</a></p>
$def aside():
<div style=font-size:.7em>
$if "published" in entry:
<p>Published <time class=dt-published
datetime="$entry['published'][0].isoformat()"
title="$entry['published'][0].isoformat()">\
$entry["published"][0].diff_for_humans()</time></p>
$if "updated" in entry:
<p>Updated <time class=dt-updated
datetime="$entry['updated'][0].isoformat()"
title="$entry['updated'][0].isoformat()">\
$entry["updated"][0].diff_for_humans()</time></p>
<p class=p-visibility
style=color:#2aa198;font-weight:bold;letter-spacing:.1em;text-transform:uppercase>\
$entry["visibility"][0]</span></p>
$ permalink = f"{tx.origin}{entry['url'][0]}"
<p style=font-weight:bold><a class="u-uid u-url" href=$permalink
onclick="navigator.clipboard.writeText('$permalink'); return false">\
$permalink 📋</a></p>
</div>
$# $if tx.user.session:
$# <a href=$tx.user.session["uid"][0]/actions?reply=$entry["url"][0]>reply</a>
$# $else:
$# <a href=web+action://reply?url=$entry["url"][0]>reply</a>
$var aside = aside()
<footer>
$for mention in mentions:
<div>
$ data = mention["data"]
$data
$# $if data:
$# $ a = data["author"]
$# $ comment_type = data["comment_type"][0]
$# $if comment_type == "like":
$# $emoji.emojize(":red_heart:")
<small>
$# $if data:
$# <a href=$a["url"]>$a["name"]</a>
<a href=$mention["source"]><time class=dt-published
datetime="$mention['mentioned'].isoformat()">\
$mention["mentioned"].diff_for_humans()</time></a>
</small>
</div>
</footer>
$# <style>
$# #editor, #editorStatus {
$# display: none; }
$# /* div.e-content {
$# font-size: 2em; } */
$# </style>
$# $elif type == "identification":
$# $ identification = entry["identification-of"][0]
$# $var title: Identified $identification["name"]
$# <p><big>Identified <a class=u-identification-of
$# href=$identification["url"]>$identification["name"]</a></big></p>
$# $elif type == "follow":
$# $ follow = entry["follow-of"][0]
$# $var title: Followed $follow["name"]
$# <p><big>Followed <a class=u-follow-of
$# href=$follow["url"]>$follow["name"]</a></big></p>
$# TODO $if tx.user.is_owner:
$# TODO <script src=/static/understory.js crossorigin=anonymous></script>
$# TODO <script>
$# TODO const { MicropubClient } = understory
$# TODO const pub = new MicropubClient('/pub')
$# TODO document.addEventListener('DOMContentLoaded', () => {
$# TODO pub.getConfig().then(data => console.log(data))
$# TODO pub.getCategories().then(data => {
$# TODO data.categories.forEach(cat => {
$# TODO addCategory(cat)
$# TODO })
$# TODO })
$# TODO })
$# TODO </script>
<script type=module>
import { load, getBrowser, diamondMonaco, MicropubClient } from '/static/web.js'
const previewMarkdown = content => {
// XXX name = document.querySelector('#name input[type=text]').value
// XXX previewName.innerHTML = `<h1>$${name}</h1>`
if (content == '') {
previewContent.innerHTML = ''
return
}
let body = new FormData()
body.append('content', content)
fetch(
'/editor/preview/markdown',
{
method: 'POST',
body: body
}
).then(response => {
if (response.status === 200) {
return response.json().then(data => {
previewContent.innerHTML = data['content']
})
}
})
}
var frequency = 1.5; // seconds
var count = 0;
var clean = true;
const tick = () => {
setTimeout(() => {
if (count++ > frequency * 10 && !clean)
updatePreview();
tick();
}, 100);
}
tick();
const updatePreview = () => {
clean = false;
if (count > frequency * 10) {
previewMarkdown(monaco.getValue());
clean = true;
count = 0;
}
}
const monaco = diamondMonaco(
'$permalink', editor, editorStatus, connection, version,
{},
'$(tx.user.session["uid"][0] if tx.user.session else tx.user.ip)'
)
monaco.onDidChangeModelContent(updatePreview)
</script>
