joshua/HLS-over-IPFS-video-player
1
0
Fork 0
mirror of https://github.com/seigler/HLS-over-IPFS-video-player synced 2025-07-27 01:36:14 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: js page sizing for mobile, fix live code

Browse source
This commit is contained in:
Joshua Seigler 2021-11-25 18:39:51 -05:00
parent 494b309693
commit 3977514c70
4 changed files with 14 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

10
README.md
View file

@ -1,4 +1,4 @@
Based heavily on the [browser video streaming](https://github.com/ipfs-examples/js-ipfs-examples/tree/master/examples/browser-video-streaming) example from JS-IPFS. [Live link](http://ipfs.io/ipfs/QmVPB6NWWecNp54Tpimp1WzzBFU5fYGBjXgodH2U3jNZHG/)
## How to use ## How to use
@ -30,9 +30,9 @@ The output from the `ipfs` command is the hash to use with this page.
Two example URLs: Two example URLs:
http://ipfs.io/ipfs/QmQkJRPbmqcYeQcyN6mFmSYGoLWT7731GggCrTKo9tHBqF/?hash=QmdpAidwAsBGptFB3b6A9Pyi5coEbgjHrL3K2Qrsutmj9K&title=Big%20Buck%20Bunny http://ipfs.io/ipfs/QmVPB6NWWecNp54Tpimp1WzzBFU5fYGBjXgodH2U3jNZHG/?hash=QmdpAidwAsBGptFB3b6A9Pyi5coEbgjHrL3K2Qrsutmj9K&title=Big%20Buck%20Bunny
https://ipfs.io/ipfs/QmQkJRPbmqcYeQcyN6mFmSYGoLWT7731GggCrTKo9tHBqF/?hash=QmYzdc44xBkVgp8aWJW57KprjDs5j2hmN8g7eDqm5pvY8L&title=Royal+Path+001+-+What+is+the+Royal+Path%3F https://ipfs.io/ipfs/QmVPB6NWWecNp54Tpimp1WzzBFU5fYGBjXgodH2U3jNZHG/?hash=QmYzdc44xBkVgp8aWJW57KprjDs5j2hmN8g7eDqm5pvY8L&title=Royal+Path+001+-+What+is+the+Royal+Path%3F
## How to build from source ## How to build from source
@ -42,3 +42,7 @@ https://ipfs.io/ipfs/QmQkJRPbmqcYeQcyN6mFmSYGoLWT7731GggCrTKo9tHBqF/?hash=QmYzdc
- serve: run & navigate to a live-build server on localhost port 8888 - serve: run & navigate to a live-build server on localhost port 8888
- build: build & output to output folder dist (overwrites, doesn't delete) - build: build & output to output folder dist (overwrites, doesn't delete)
- clean: remove caches and dist folder - clean: remove caches and dist folder
---
Based heavily on the [browser video streaming](https://github.com/ipfs-examples/js-ipfs-examples/tree/master/examples/browser-video-streaming) example from JS-IPFS.

1
index.html
View file

@ -14,7 +14,6 @@
margin: 0; margin: 0;
} }
body { body {
height: 100vh;
font-family: sans-serif; font-family: sans-serif;
color: white; color: white;
background-color: black; background-color: black;

2
package.json
View file

@ -8,7 +8,7 @@
"scripts": { "scripts": {
"clean": "rimraf ./dist ./.cache ./.parcel-cache", "clean": "rimraf ./dist ./.cache ./.parcel-cache",
"build": "parcel build index.html --no-scope-hoist --public-url ./", "build": "parcel build index.html --no-scope-hoist --public-url ./",
"serve": "parcel serve index.html --open -p 8888 --public-url ./", "serve": "parcel serve index.html --open -p 8888",
"start": "npm run serve", "start": "npm run serve",
"test": "npm run build && playwright test tests --browser=firefox --retries=3" "test": "npm run build && playwright test tests --browser=firefox --retries=3"
}, },

6
src/index.js
View file

@ -19,7 +19,13 @@ function showStatus(message, hide = false) {
status.innerText = message status.innerText = message
} }
function setBodyHeight() {
document.body.style.height = window.innerHeight + "px"
}
document.addEventListener('DOMContentLoaded', async () => { document.addEventListener('DOMContentLoaded', async () => {
setBodyHeight()
window.addEventListener('resize', setBodyHeight)
const hash = getUrlParameter("hash") const hash = getUrlParameter("hash")
const source = getUrlParameter("source") || 'master.m3u8' const source = getUrlParameter("source") || 'master.m3u8'
const title = getUrlParameter("title") const title = getUrlParameter("title")