commit 4f27647c5bad5fadadd4cc2cdf019e6b06c9a461
parent eec07c3b1bb52a1c113d970ba17d55702962ecb3
Author: William Casarin <jb55@jb55.com>
Date: Fri, 4 Nov 2022 12:53:20 -0700
web: support inline images and links
Diffstat:
3 files changed, 24 insertions(+), 4 deletions(-)
diff --git a/webv2/damus.css b/webv2/damus.css
@@ -20,6 +20,10 @@
cursor: pointer;
}
+.inline-img {
+ width: 100%;
+}
+
.line-top {
width: 2px;
height: 5px;
diff --git a/webv2/damus.js b/webv2/damus.js
@@ -950,6 +950,22 @@ function render_action_bar(ev) {
`
}
+const IMG_REGEX = /(png|jpeg)$/i
+function is_img_url(path) {
+ return IMG_REGEX.test(path)
+}
+
+const URL_REGEX = /(https?:\/\/[^\s\):]+)/g;
+function linkify(text) {
+ return text.replace(URL_REGEX, function(url) {
+ const parsed = new URL(url)
+ if (is_img_url(parsed.pathname))
+ return `<img class="inline-img" src="${url}">`;
+ else
+ return `<a target="_blank" rel="noopener noreferrer" href="${url}">${url}</a>`;
+ })
+}
+
function convert_quote_blocks(content)
{
const split = content.split("\n")
@@ -960,13 +976,13 @@ function convert_quote_blocks(content)
str += "<span class='quote'>"
blockin = true
}
- str += sanitize(line.slice(1))
+ str += linkify(sanitize(line.slice(1)))
} else {
if (blockin) {
blockin = false
str += "</span>"
}
- str += sanitize(line)
+ str += linkify(sanitize(line))
}
return str + "<br/>"
}, "")
diff --git a/webv2/index.html b/webv2/index.html
@@ -6,7 +6,7 @@
<title>Damus</title>
- <link rel="stylesheet" href="damus.css?v=12">
+ <link rel="stylesheet" href="damus.css?v=13">
</head>
<body>
<section class="header">
@@ -41,7 +41,7 @@
<script src="noble-secp256k1.js?v=1"></script>
<script src="bech32.js?v=1"></script>
<script src="nostr.js?v=6"></script>
- <script src="damus.js?v=44"></script>
+ <script src="damus.js?v=45"></script>
<script>
// I have to delay loading to wait for nos2x
const relay = setTimeout(damus_web_init, 100)
