specter/gmi-web
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

fix inline media src and title

Browse source
This commit is contained in:
Talon Poole 2021-02-24 19:57:59 +00:00
parent 7d1ce07a63
commit 427bcecefd
3 changed files with 31 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
example.gmi
View file

@ -23,8 +23,8 @@ but even simpler
### inline media
=> video.mp4 video
=> image.jpg image
=> audio.mp3 audio
=> image.jpg image
=> audio.mp3 audio
=> video-no-title.mp4
=> image-no-title.mp4
=> audio-no-title.mp4

9
html.js
View file

@ -42,13 +42,16 @@ export function block(
exts.some((ext) => new RegExp(`\.${ext}$`).test(url));
if (options.image && matchesExt(href, options.image)) {
type = "img";
props += ` src="${href}"` + alt ? ` title="${alt}"` : "";
props += ` src="${href}"`
props += title ? ` title="${title}"` : "";
} else if (options.audio && matchesExt(href, options.audio)) {
type = "audio";
props += ` controls src="${href}"` + alt ? ` title="${alt}"` : "";
props += ` controls src="${href}"`
props += title ? ` title="${title}"` : "";
} else if (options.video && matchesExt(href, options.video)) {
type = "video";
props += ` controls src="${href}"` + alt ? ` title="${alt}"` : "";
props += ` controls src="${href}"`
props += title ? ` title="${title}"` : "";
} else {
type = "a";
content = title || href;

46
spec.js
View file

@ -33,8 +33,8 @@ test("--body", () => {
<p></p>
<h3 style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">inline media</h3>
<a href=\\"video.mp4\\" style=\\"display:block;\\">video</a>
<a href=\\"image.jpg\\" style=\\"display:block;\\">image </a>
<a href=\\"audio.mp3\\" style=\\"display:block;\\">audio </a>
<a href=\\"image.jpg\\" style=\\"display:block;\\">image</a>
<a href=\\"audio.mp3\\" style=\\"display:block;\\">audio</a>
<p style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">=&gt; video-no-title.mp4 </p>
<p style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">=&gt; image-no-title.mp4 </p>
<p style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">=&gt; audio-no-title.mp4 </p>"
@ -67,8 +67,8 @@ test("--body", () => {
<p></p>
<h3>inline media</h3>
<a href=\\"video.mp4\\">video</a>
<a href=\\"image.jpg\\">image </a>
<a href=\\"audio.mp3\\">audio </a>
<a href=\\"image.jpg\\">image</a>
<a href=\\"audio.mp3\\">audio</a>
<p>=&gt; video-no-title.mp4 </p>
<p>=&gt; image-no-title.mp4 </p>
<p>=&gt; audio-no-title.mp4 </p>"
@ -122,8 +122,8 @@ test("--html en", () => {
<p></p>
<h3>inline media</h3>
<a href=\\"video.mp4\\">video</a>
<a href=\\"image.jpg\\">image </a>
<a href=\\"audio.mp3\\">audio </a>
<a href=\\"image.jpg\\">image</a>
<a href=\\"audio.mp3\\">audio</a>
<p>=&gt; video-no-title.mp4 </p>
<p>=&gt; image-no-title.mp4 </p>
<p>=&gt; audio-no-title.mp4 </p>
@ -142,15 +142,15 @@ test("--image, --audio, --video", () => {
audio: ["mp3"],
})
).toMatchInlineSnapshot(`
"<h1>gmi-web</h1>
<blockquote>a bridge between HTML and Gemini</blockquote>
<a href=\\"https://codeberg.org/talon/gmi-web\\">https://codeberg.org/talon/gmi-web</a>
<a href=\\"https://www.npmjs.com/package/gmi-web-cli\\">on NPM </a>
"<h1 style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">gmi-web</h1>
<blockquote style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">a bridge between HTML and Gemini</blockquote>
<a href=\\"https://codeberg.org/talon/gmi-web\\" style=\\"display:block;\\">https://codeberg.org/talon/gmi-web</a>
<a href=\\"https://www.npmjs.com/package/gmi-web-cli\\" style=\\"display:block;\\">on NPM </a>
<p></p>
<h2>line-types</h2>
<h2 style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">line-types</h2>
<p></p>
<p>gmi-web makes writing HTML documents as simple as learning the handful of Gemini line-types:</p>
<ul>
<p style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">gmi-web makes writing HTML documents as simple as learning the handful of Gemini line-types:</p>
<ul style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">
<li>paragraphs </li>
<li>preformatted blocks </li>
<li>lists</li>
@ -158,7 +158,7 @@ test("--image, --audio, --video", () => {
<li>headings </li>
</ul>
<p></p>
<pre title=\\"if you are familiar with markdown it's kinda like that but even simpler\\">
<pre title=\\"if you are familiar with markdown it's kinda like that but even simpler\\" style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;overflow-y:auto;\\">
if you are
familiar with markdown
it's kinda like that
@ -167,13 +167,13 @@ test("--image, --audio, --video", () => {
but even simpler
</pre>
<p></p>
<h3>inline media</h3>
<video title=\\"undefined\\"></video>
<img title=\\"undefined\\"></img>
<audio title=\\"undefined\\"></audio>
<p>=&gt; video-no-title.mp4 </p>
<p>=&gt; image-no-title.mp4 </p>
<p>=&gt; audio-no-title.mp4 </p>"
<h3 style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">inline media</h3>
<video controls src=\\"video.mp4\\" title=\\"video\\"></video>
<img src=\\"image.jpg\\" title=\\"image\\"></img>
<audio controls src=\\"audio.mp3\\" title=\\"audio\\"></audio>
<p style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">=&gt; video-no-title.mp4 </p>
<p style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">=&gt; image-no-title.mp4 </p>
<p style=\\"margin-top:0;margin-bottom:0;overflow-wrap:break-word;\\">=&gt; audio-no-title.mp4 </p>"
`);
});
@ -260,11 +260,11 @@ test("tokenize", () => {
},
Object {
"href": "image.jpg",
"title": "image ",
"title": "image",
},
Object {
"href": "audio.mp3",
"title": "audio ",
"title": "audio",
},
Object {
"text": "=> video-no-title.mp4 ",