optional title props

This commit is contained in:
Talon Poole 2021-02-02 22:34:26 +00:00
parent 31602f672c
commit 3dd877ff73
3 changed files with 16 additions and 5 deletions

View file

@ -23,7 +23,7 @@
<p><br></p>
<blockquote>here&#39;s what a blockquote is like</blockquote>
<p><br></p>
<pre title="pre tags can have alt text">
<pre title="pre tags can have title text">
preformatted text
means that it already has formatting
which means it should show
@ -40,5 +40,10 @@ preformatted text
<img src="https://www.learningcontainer.com/wp-content/uploads/2020/07/Large-Sample-Image-download-for-Testing.jpg" title="JPG image that can render inline!"/>
<audio controls src="https://www.learningcontainer.com/wp-content/uploads/2020/02/Kalimba.mp3" title="MP3 audio that can render inline!"></audio>
<video controls src="https://www.learningcontainer.com/wp-content/uploads/2020/05/sample-mp4-file.mp4" title="MP4 Video that can render inline!"/></video>
<p><br></p>
<h3>w/ no &quot;titles&quot;</h3>
<img src="https://www.learningcontainer.com/wp-content/uploads/2020/07/Large-Sample-Image-download-for-Testing.jpg"/>
<audio controls src="https://www.learningcontainer.com/wp-content/uploads/2020/02/Kalimba.mp3"></audio>
<video controls src="https://www.learningcontainer.com/wp-content/uploads/2020/05/sample-mp4-file.mp4"/></video>
</body>
</html>

View file

@ -9,7 +9,7 @@ checkout this empty line:
> here's what a blockquote is like
```pre tags can have alt text
```pre tags can have title text
preformatted text
means that it already has formatting
which means it should show
@ -26,3 +26,8 @@ preformatted text
=> https://www.learningcontainer.com/wp-content/uploads/2020/07/Large-Sample-Image-download-for-Testing.jpg JPG image that can render inline!
=> https://www.learningcontainer.com/wp-content/uploads/2020/02/Kalimba.mp3 MP3 audio that can render inline!
=> https://www.learningcontainer.com/wp-content/uploads/2020/05/sample-mp4-file.mp4 MP4 Video that can render inline!
### w/ no "titles"
=> https://www.learningcontainer.com/wp-content/uploads/2020/07/Large-Sample-Image-download-for-Testing.jpg
=> https://www.learningcontainer.com/wp-content/uploads/2020/02/Kalimba.mp3
=> https://www.learningcontainer.com/wp-content/uploads/2020/05/sample-mp4-file.mp4

View file

@ -88,12 +88,13 @@ function line(
) {
if (text) return `<p>${escape(text)}</p>`;
if (href) {
const titleProp = title ? ` title="${title}"` : ""
if (images && IMG_EXT.test(href))
return `<img src="${href}" title="${title}"/>`;
return `<img src="${href}"${titleProp}/>`;
if (audio && AUDIO_EXT.test(href))
return `<audio controls src="${href}" title="${title}"></audio>`;
return `<audio controls src="${href}"${titleProp}></audio>`;
if (video && VIDEO_EXT.test(href))
return `<video controls src="${href}" title="${title}"/></video>`;
return `<video controls src="${href}"${titleProp}/></video>`;
return `<a href="${href}">${title ? escape(title) : href}</a>`;
}