1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-24 15:17:41 +01:00
smov/src/components/player
mrjvs 0a3155d399 meta data shown correctly
Co-authored-by: Jip Frijlink <JipFr@users.noreply.github.com>
2023-10-08 18:16:30 +02:00
..
atoms meta data shown correctly 2023-10-08 18:16:30 +02:00
base meta data shown correctly 2023-10-08 18:16:30 +02:00
display loading spinner, auto play start button + bug fix of multiple videos playing over each other 2023-10-05 22:12:25 +02:00
hooks meta data shown correctly 2023-10-08 18:16:30 +02:00
internals meta data shown correctly 2023-10-08 18:16:30 +02:00
utils progress bar, skips and more 2023-10-01 21:08:26 +02:00
index.tsx move video to old and setup new video structure 2023-07-23 15:00:08 +02:00
Player.tsx volume controls 2023-10-08 17:48:48 +02:00
README.md fundementals for video player rewrite 2023-09-30 20:57:00 +02:00

Video player component

Video player is quite a complex component, so here is a rundown of all the parts

Composable parts

These parts can be used to build any shape of a video player.

  • /atoms- any ui element that controls the player. (Seekbar, Pause button, quality selection, etc)
  • /base - base components that are used to build a player. Like the main container

internal parts

These parts are internally used, they aren't exported. Do not use them outside of player internals.

/display

The display interface, abstraction on how to actually play the content (e.g Video element, chrome casting, etc)

  • It must be completely seperate from any react code
  • It must not interact with state, pass async data back with events

/internals

Internal components that are always rendered on every player.

  • Only components that are always present on the player instance, they must never unmount

/utils

miscellaneous logic, put anything that is unique to the video player internals.

/hooks

Hooks only used for video player.

  • only exception is usePlayer, as its used outside of the player to control the player

~/src/stores/player

State for the video player.

  • Only parts related to the video player may utilize the state