Rajaniraiyn / rajeo

A modern, theme aware video player for html videos.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

πŸ€” How?

  1. Add below script tag in your html containing valid video tag
<script src="http://unpkg.com/rajeo@latest" defer></script>

OR  Add the below script tag in your html containing valid video tag

<script type="module">
  import * as rajeo from "https://unpkg.com/rajeo@latest";
  window.onload = rajeo;
</script>

OR  Add the following in your ES6 and call rajeo() separately but the html must have a valid video tag

import * as rajeo from "https://unpkg.com/rajeo@latest";
  1. Thats it, the script itself takes care of others (i.e. It converts the normal video tag to rajeo)

πŸ™„ What?

Before adding script
Before
After adding script
After

πŸ™Œ Features

  • Modern
  • Beautiful
  • Load Progress (Buffer Progress)
  • PiP (Picture-in-Picture) Mode
  • Fullscreen
  • Top title bar with icon
  • Theme aware
  • Cross platform
  • Mobile friendly
  • Responsive
  • Zero dependencies
  • CSS first approach

πŸ“œ Plan

  • Keyboard shortcuts
  • Playback rate
  • Volume
  • Support popular streaming services
  • Gestures
  • Piracy protection
  • React component
  • Custom events
  • Custom video parser
  • Port to web assembly (aka wasm) and web worker

πŸ‘¨β€πŸ’» Local Development

To clone and build packages of this repository you'll need Git and Node.js (which comes with npm) installed on your device. Copy and paste the following in your command line:

git clone https://github.com/Rajaniraiyn/rajeo.git

cd rajeo

npm install

npm run build

Then check the dist folder you will see dist folder with following structure

dist/
β”œβ”€ cjs/
β”‚  β”œβ”€ index.js
β”‚  β”œβ”€ index.js.map
β”‚  β”œβ”€ index.min.js
β”‚  β”œβ”€ index.min.js.map
β”œβ”€ esm/
β”‚  β”œβ”€ index.js
β”‚  β”œβ”€ index.js.map
β”‚  β”œβ”€ index.min.js
β”‚  β”œβ”€ index.min.js.map
β”œβ”€ umd/
β”‚  β”œβ”€ index.js
β”‚  β”œβ”€ index.js.map
β”‚  β”œβ”€ index.min.js
β”‚  β”œβ”€ index.min.js.map
β”œβ”€ style.css
β”œβ”€ style.css.map

🀝 Contributors

contributors

Made with contributors-img.

🎟️ License

MIT


Made with ❀️ by Rajaniraiyn

^ back to top ^

About

A modern, theme aware video player for html videos.

License:MIT License


Languages

Language:JavaScript 53.9%Language:SCSS 45.4%Language:Shell 0.7%