Bug: video embeds cropped on playback on mobile and extra space below on PC
What happened?
When you view a video on an iOS device (maybe others too) via Discord, the video in the embed is cropped which I believe is caused by the following meta tags. I am not sure if Discord uses the OpenGraph or the Twitter tags so I included both in this issue since they essentially do the same thing.
<meta name="twitter:player:width" content="720">
<meta name="twitter:player:height" content="480">
<meta property="og:video:width" content="720">
<meta property="og:video:height" content="480">
I took a look at the source and found that these values are not pulled from the files and are static values that are used by all video and audio files (I doubt it matters for the audio files). I am not sure how hard it would be to pull the dimensions from the videos themselves but it may be possible to pull the dimensions from the thumbnails instead (though that would cause issues for people who have thumbnails disabled).
Here is an example of the cropped video which is embedded on Discord when embeds are enabled and here is an example of what the embeds with extra space at the bottom look like.
Version
latest (ghcr.io/diced/zipline or ghcr.io/diced/zipline:latest)
What browser(s) are you seeing the problem on?
No response
Zipline Logs
No response
Browser Logs
No response
Additional Info
No response
Discord uses both twitter meta tags and og tags
But if you mean width and height set to 720x480 it won't support all videos since some videos are 1080x1920
I talked about it in detail the fix for it you can just add a t folder then inset the [id].tsx file along with the meta tags value you showed but only it will work as a twitter embed on twitter as on discord it will make it bugged like this https://github.com/diced/zipline/pull/509
But if you mean width and height set to 720x480 it won't support all videos since some videos are 1080x1920
Which is why the resolution would need to be extracted from the file or thumbnail instead of it being one fixed value.
Yes you are right like the images one in the id.tsx file I requested it in the pull request fr fr
this is kinda annoying, i don't want to store extra information about a file if i dont have to... (aka video resolution)
this is kinda annoying, i don't want to store extra information about a file if i dont have to... (aka video resolution)
Yeah, it does seem like a waste to only store the resolution for that one purpose. Maybe if there's a way to detect if a video's orientation is landscape or portrait the video size could be set to 1280x720 (or 1920x1080) and then 720x1280 for portrait. This should fix the cropping on screen-sized videos however I am not sure how it would look on videos that are smaller than the given size.
Yes bro exactly that's what I mean it 100%
Before zipline had a hardcoded width and height, but it was removed because it had the same crop issue, so at some point we're gonna have to compromise or find some other solution 🤔
held a poll on the discord server and an overwhelming majority said to just leave it how it is, so i'm not gonna pursue this anymore.