This is a parody of leetcode.com for designers. It's being developed live on Twitch.tv/zedashaw to demonstrate how to make a parody of a website.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
pixelperfectionist/admin/bando/demos/Video.svelte.md

968 B

The Video component can handle both static video downloads and streaming using HLS. On platforms that support HLS video it will use the native <video> tag, but if the platform doesn't support it then it will fall back to HLS.js. Internally it uses the client/fsm.js code to keep everything straight while it juggles all the byzantine errors you have with videos.

Most of the options exported by Video.svelte make sense but the aspect_ratio setting is probably one you'll want to adjust if your videos aren't 16:9. This setting uses the CSS in static/global.css that uses --aspect-ratio to make sure the container holding the video stays at the correct aspect ratio. Without this setting the video's container will do weird things at different screen sizes.

This demo also shows how the countdown timer works with starts_on which is useful for live streaming situations where shows start at specific times.