Kieran/snort
5
14
Fork 14
Code Issues 54 Pull Requests 1 Packages Projects Releases 24 Wiki Activity

show videos in media grid
Some checks failed
continuous-integration/drone/push Build is failing
Details

Browse Source
This commit is contained in:
Martti Malmi 2023-12-05 21:18:31 +02:00
parent 7aa6cc8295
commit da93d3bdf6
2 changed files with 17 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
packages/app/src/Element/Feed/TimelineRenderer.tsx
View File

@ -52,15 +52,22 @@ export function TimelineRenderer(props: TimelineRendererProps) {
// TODO Hide images from notes with a content warning, unless otherwise configured
const noteImageRenderer = (e: TaggedNostrEvent) => {
const parsed = transformTextCached(e.id, e.content, e.tags);
const images = parsed.filter(a => a.type === "media" && a.mimeType?.startsWith("image/"));
if (images.length === 0) return null;
const media = parsed.filter(
a => a.type === "media" && (a.mimeType?.startsWith("image/") || a.mimeType?.startsWith("video/")),
);
if (media.length === 0) return null;
const isVideo = media[0].mimeType?.startsWith("video/");
return (
<div
className="aspect-square bg-center bg-cover cursor-pointer hover:opacity-80"
className="aspect-square bg-center bg-cover cursor-pointer hover:opacity-80 relative"
key={e.id}
style={{ backgroundImage: `url(${proxy(images[0].content, 256)})` }}
onClick={() => noteOnClick(e)}></div>
style={{ backgroundImage: `url(${proxy(media[0].content, 256)})` }}
onClick={() => noteOnClick(e)}>
{isVideo && <Icon name="play-square-outline" className="absolute right-2 top-2 text-white opacity-80" />}
</div>
);
};

5
packages/app/src/icons.svg
View File

@ -438,5 +438,10 @@
<symbol id="info-outline" viewBox="0 0 22 22" fill="none">
<path d="M11 15V11M11 7H11.01M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</symbol>
<symbol id="play-square-outline" viewBox="0 0 20 20" fill="none">
<path d="M7.5 6.96533C7.5 6.48805 7.5 6.24941 7.59974 6.11618C7.68666 6.00007 7.81971 5.92744 7.96438 5.9171C8.13038 5.90525 8.33112 6.03429 8.73261 6.29239L13.4532 9.32706C13.8016 9.55102 13.9758 9.663 14.0359 9.80539C14.0885 9.9298 14.0885 10.0702 14.0359 10.1946C13.9758 10.337 13.8016 10.449 13.4532 10.6729L8.73261 13.7076C8.33112 13.9657 8.13038 14.0948 7.96438 14.0829C7.81971 14.0726 7.68666 13.9999 7.59974 13.8838C7.5 13.7506 7.5 13.512 7.5 13.0347V6.96533Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M1 5.8C1 4.11984 1 3.27976 1.32698 2.63803C1.6146 2.07354 2.07354 1.6146 2.63803 1.32698C3.27976 1 4.11984 1 5.8 1H14.2C15.8802 1 16.7202 1 17.362 1.32698C17.9265 1.6146 18.3854 2.07354 18.673 2.63803C19 3.27976 19 4.11984 19 5.8V14.2C19 15.8802 19 16.7202 18.673 17.362C18.3854 17.9265 17.9265 18.3854 17.362 18.673C16.7202 19 15.8802 19 14.2 19H5.8C4.11984 19 3.27976 19 2.63803 18.673C2.07354 18.3854 1.6146 17.9265 1.32698 17.362C1 16.7202 1 15.8802 1 14.2V5.8Z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</symbol>
</defs>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 123 KiB

After

Width:  |  Height:  |  Size: 124 KiB