-
-
Notifications
You must be signed in to change notification settings - Fork 11
/
Copy pathindex.html
101 lines (82 loc) · 3.95 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>browser server test</title>
</head>
<body>
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/webtorrent/0.108.6/webtorrent.min.js"></script> -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/webtorrent/0.114.0/webtorrent.min.js"></script>
<script src="range-parser.js"></script>
<script>
const client = new WebTorrent()
const sintel = 'magnet:?xt=urn:btih:08ada5a7a6183aae1e09d831df6748d566095a10&dn=Sintel&tr=udp%3A%2F%2Fexplodie.org%3A6969&tr=udp%3A%2F%2Ftracker.coppersurfer.tk%3A6969&tr=udp%3A%2F%2Ftracker.empire-js.us%3A1337&tr=udp%3A%2F%2Ftracker.leechers-paradise.org%3A6969&tr=udp%3A%2F%2Ftracker.opentrackr.org%3A1337&tr=wss%3A%2F%2Ftracker.btorrent.xyz&tr=wss%3A%2F%2Ftracker.fastcast.nz&tr=wss%3A%2F%2Ftracker.openwebtorrent.com&ws=https%3A%2F%2Fwebtorrent.io%2Ftorrents%2F'
const tears = 'https://webtorrent.io/torrents/tears-of-steel.torrent' //bunny doesnt play on all browsers, no clue why
const scope = '/webtorrent-server-browser/'
const sw = navigator.serviceWorker.register(`sw.js`, { scope })
client.add(sintel, async function(torrent) {
await sw
const video = document.createElement('video')
video.controls = true
video.src = `${scope}webtorrent/${torrent.infoHash}/${encodeURI(torrent.files[5].path)}`//specified scope in source and encoded uri of filepath to fix some weird filenames
video.style.width = '200px'
document.body.appendChild(video)
})
client.add(tears, async function(torrent) {
await sw
const video = document.createElement('video')
video.controls = true
video.src = `${scope}webtorrent/${torrent.infoHash}/${encodeURI(torrent.files[8].path)}`
video.style.width = '200px'
document.body.appendChild(video)
})
function serveFile (file, req) {
const res = {
status: 200,
headers: {
'Content-Type': file._getMimeType(),
// Support range-requests
'Accept-Ranges': 'bytes'
}
}
// `rangeParser` returns an array of ranges, or an error code (number) if
// there was an error parsing the range.
let range = rangeParser(file.length, req.headers.get('range') || '')
if (Array.isArray(range)) {
res.status = 206 // indicates that range-request was understood
// no support for multi-range request, just use the first range
range = range[0]
res.headers['Content-Range'] = `bytes ${range.start}-${range.end}/${file.length}`
res.headers['Content-Length'] = `${range.end - range.start + 1}`
} else {
range = null
res.headers['Content-Length'] = file.length
}
res.body = req.method === 'HEAD' ? '' : 'stream'
return [res, req.method === 'GET' && file.createReadStream(range)]
}
// kind of a fetch event from service worker but for the main thread.
navigator.serviceWorker.addEventListener('message', evt => {
const request = new Request(evt.data.url, {
headers: evt.data.headers,
method: evt.data.method
})
const [ port ] = evt.ports
const respondWith = msg => port.postMessage(msg)
const pathname = request.url.split(evt.data.scope + 'webtorrent/')[1]
let [ infoHash, ...filePath ] = pathname.split('/')
filePath = decodeURI(filePath.join('/'))
if (!infoHash || !filePath) return
const torrent = client.get(infoHash)
const file = torrent.files.find(file => file.path === filePath)
const [response, stream] = serveFile(file, request)
const asyncIterator = stream && stream[Symbol.asyncIterator]()
respondWith(response)
async function pull () {
respondWith((await asyncIterator.next()).value)
}
port.onmessage = pull
})
</script>
</body>
</html>