Skip to content
Snippets Groups Projects
Verified Commit a4ef0388 authored by MickGe's avatar MickGe :tiger2:
Browse files

add video & audio type

parent 0c53f7f2
No related branches found
No related tags found
No related merge requests found
...@@ -83,7 +83,19 @@ export const getData = async (url, token) => { ...@@ -83,7 +83,19 @@ export const getData = async (url, token) => {
toot.account.display_name = toot.account.display_name.replaceAll(/:\w+:/g, '').trim() || toot.account.username; toot.account.display_name = toot.account.display_name.replaceAll(/:\w+:/g, '').trim() || toot.account.username;
const regexTag = new RegExp('(?<=rel="tag")', 'g'); // Look for tag links const regexTag = new RegExp('(?<=rel="tag")', 'g'); // Look for tag links
toot.content = toot.content.replaceAll(regexTag, ' target="_blank"'); // Open tag links in new tab toot.content = toot.content.replaceAll(regexTag, ' target="_blank"'); // Open tag links in new tab
const attachments = toot.media_attachments.filter(el => el.type == "image").map(el => `<img src="${el.preview_url}" title="${el.description}"/>`); const attachments = toot.media_attachments.filter(el => ["image", "video", "audio"].includes(el.type)).map(el => {
switch (el.type) {
case "image":
return `<img src="${el.preview_url}" title="${el.description}"/>`
case "video":
return `<video controls src="${el.remote_url}" poster="${el.preview_url}" title="${el.description}" preload="none" role="button" tabindex="0" width="${el.meta.small.width}" height="${el.meta.small.height}" volume="1"/>`
case "audio":
return `<audio controls src="${el.remote_url}" poster="${el.preview_remote_url}" title="${el.description}" preload="none" role="button" tabindex="0" width="${el.meta.small.width}" height="${el.meta.small.height}" volume="1"/>`
default:
console.info("Type not prepared…", el.type);
break;
}
});
attachments.length && attachments.unshift('<div class="attachments">') && attachments.push('</div>'); attachments.length && attachments.unshift('<div class="attachments">') && attachments.push('</div>');
newsFeedEl.innerHTML += htmlToot(toot, attachments); newsFeedEl.innerHTML += htmlToot(toot, attachments);
}); });
......
...@@ -135,7 +135,7 @@ button { ...@@ -135,7 +135,7 @@ button {
overflow: scroll; overflow: scroll;
align-items: center; align-items: center;
column-gap: 1em; column-gap: 1em;
img { img, video, audio {
max-width: 380px; max-width: 380px;
max-height: 380px; max-height: 380px;
margin: auto; margin: auto;
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment