mirror of
https://github.com/ThaUnknown/miru.git
synced 2026-04-19 15:22:04 +00:00
some attempts at memory leak fixes, minor fixes and optimization, temp disabled cache
This commit is contained in:
ThaUnknown
parent
22d645db50
commit
906301a61e
5 changed files with 75 additions and 83 deletions
|
|
@ -32,8 +32,7 @@
|
|||
}
|
||||
|
||||
.immersed {
|
||||
cursor: none;
|
||||
border: none !important;
|
||||
cursor: none
|
||||
}
|
||||
|
||||
.immersed .controls,
|
||||
|
|
@ -59,13 +58,6 @@
|
|||
position: absolute;
|
||||
z-index: 10
|
||||
}
|
||||
#player {
|
||||
border-width: 0;
|
||||
border-top-width: 1px;
|
||||
border-image-slice: 1;
|
||||
border-style: solid;
|
||||
border-image-source: linear-gradient(90deg, #e5204c var(--download), rgba(0, 0, 0, .8) var(--download))
|
||||
}
|
||||
|
||||
#player:target .player {
|
||||
display: flex !important
|
||||
|
|
@ -98,13 +90,18 @@ video::cue {
|
|||
.stats {
|
||||
background: linear-gradient(to bottom, rgba(0, 0, 0, .8), rgba(0, 0, 0, .4) 25%, rgba(0, 0, 0, .2) 50%, rgba(0, 0, 0, .1) 75%, transparent);
|
||||
transition: .5s opacity ease;
|
||||
border-width: 0;
|
||||
border-top-width: 1px;
|
||||
border-image-slice: 1;
|
||||
border-style: solid;
|
||||
border-image-source: linear-gradient(90deg, #e5204c var(--download), rgba(0, 0, 0, .8) var(--download))
|
||||
}
|
||||
|
||||
.player {
|
||||
position: absolute;
|
||||
user-select: none;
|
||||
opacity: 1;
|
||||
font-family: Roboto,Arial,Helvetica,sans-serif
|
||||
font-family: Roboto, Arial, Helvetica, sans-serif
|
||||
}
|
||||
|
||||
.controls>*:hover {
|
||||
|
|
@ -135,13 +132,17 @@ video::cue {
|
|||
font-weight: 600
|
||||
}
|
||||
|
||||
#progress {
|
||||
#progress,
|
||||
.prog {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#video {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.volume {
|
||||
display: flex;
|
||||
width: auto
|
||||
|
|
@ -170,14 +171,14 @@ video::cue {
|
|||
outline: none;
|
||||
}
|
||||
|
||||
.controls input#volume[type=range]::-webkit-slider-runnable-track {
|
||||
input#volume[type=range]::-webkit-slider-runnable-track {
|
||||
width: 50%;
|
||||
height: 3px;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(90deg, #e5204c var(--volume-level), rgba(255, 255, 255, .2) var(--volume-level))
|
||||
}
|
||||
|
||||
.controls input#progress[type=range]::-webkit-slider-runnable-track {
|
||||
input#progress[type=range]::-webkit-slider-runnable-track {
|
||||
width: 50%;
|
||||
height: 3px;
|
||||
cursor: pointer;
|
||||
|
|
@ -185,13 +186,13 @@ video::cue {
|
|||
}
|
||||
|
||||
|
||||
.controls input#progress[type=range]::after,
|
||||
.controls input#progress[type=range]::before {
|
||||
input#progress[type=range] ~ img,
|
||||
input#progress[type=range]::before {
|
||||
pointer-events: none;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
transform: translate(-50%, -100%);
|
||||
font-family: Roboto,Arial,Helvetica,sans-serif;
|
||||
font-family: Roboto, Arial, Helvetica, sans-serif;
|
||||
color: #ececec;
|
||||
white-space: nowrap;
|
||||
align-self: center;
|
||||
|
|
@ -201,42 +202,42 @@ video::cue {
|
|||
transition: .2s opacity ease;
|
||||
}
|
||||
|
||||
.controls input#progress[type=range]::after {
|
||||
width: 150px;
|
||||
background: var(--background);
|
||||
input#progress[type=range] ~ img {
|
||||
content: "";
|
||||
height: var(--height);
|
||||
top: -2rem;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
|
||||
.ctrl[disabled],
|
||||
#player:fullscreen #bpip,
|
||||
#player:fullscreen #btheatre{
|
||||
#player:fullscreen #btheatre {
|
||||
display: none;
|
||||
}
|
||||
#dl:not([download]) > span{
|
||||
|
||||
#dl:not([download])>span {
|
||||
cursor: not-allowed;
|
||||
color: rgba(255,255,255,.4);
|
||||
color: rgba(255, 255, 255, .4);
|
||||
}
|
||||
|
||||
.controls input#progress[type=range]::before {
|
||||
input#progress[type=range]::before {
|
||||
top: .5rem;
|
||||
content: attr(data-ts);
|
||||
}
|
||||
|
||||
.controls input#progress[type=range]:active::after,
|
||||
.controls input#progress[type=range]:active::before {
|
||||
input#progress[type=range]:active ~ img,
|
||||
input#progress[type=range]:active::before {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.controls input[type=range]:hover::-webkit-slider-thumb {
|
||||
input[type=range]:hover::-webkit-slider-thumb {
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
margin-top: -4px
|
||||
}
|
||||
|
||||
.controls input[type=range]::-webkit-slider-thumb {
|
||||
input[type=range]::-webkit-slider-thumb {
|
||||
height: 0;
|
||||
width: 0;
|
||||
border-radius: 50%;
|
||||
|
|
|
|||
|
|
@ -181,7 +181,10 @@
|
|||
<input type="range" value="100" id="volume">
|
||||
</div>
|
||||
<span class="ts" id="elapsed">00:00</span>
|
||||
<input type="range" min="0" max="1000" value="0" id="progress">
|
||||
<div class="prog">
|
||||
<input type="range" min="0" max="1000" value="0" id="progress">
|
||||
<img id="thumb">
|
||||
</div>
|
||||
<span class="ts" id="remaining">00:00</span>
|
||||
<div class="subtitles dropdown dropup with-arrow">
|
||||
<span class="material-icons ctrl" title="Subtitles [C]" id="bcap" data-toggle="dropdown"
|
||||
|
|
|
|||
|
|
@ -1,22 +1,4 @@
|
|||
const controls = document.getElementsByClassName('ctrl')
|
||||
// btnfull = document.querySelector('#bfull'),
|
||||
// btnpp = document.querySelector('#bpp')
|
||||
// player = document.querySelector('#player'),
|
||||
// volume = document.querySelector('#vol'),
|
||||
// progress = document.querySelector('#prog'),
|
||||
// peers = document.querySelector('#peers'),
|
||||
// downSpeed = document.querySelector('#down'),
|
||||
// upSpeed = document.querySelector('#up'),
|
||||
// playPause = document.querySelector('#ptoggle'),
|
||||
// btnpp = document.querySelector('#bpp'),
|
||||
// btnm = document.querySelector("#bmute"),
|
||||
// btnpip = document.querySelector('#bpip'),
|
||||
// elapsed = document.querySelector("#elapsed"),
|
||||
// remaining = document.querySelector("#remaining"),
|
||||
// buffering = document.querySelector("#buffering"),
|
||||
// nowPlayingDisplay = document.querySelector("#nowPlayingDisplay")
|
||||
// dl = document.querySelector("#dl")
|
||||
|
||||
|
||||
// event listeners
|
||||
volume.addEventListener("input", function () {
|
||||
|
|
@ -52,6 +34,7 @@ function resetVideo() {
|
|||
}
|
||||
video.src = ""
|
||||
video.id = "video"
|
||||
video.volume = settings.player1 / 100
|
||||
video.style.setProperty("--sub-font", settings.subtitle1);
|
||||
video.addEventListener("playing", resetBuffer);
|
||||
video.addEventListener("loadeddata", initThumbnail);
|
||||
|
|
@ -75,6 +58,8 @@ function updateDisplay() {
|
|||
function dragBar() {
|
||||
video.pause()
|
||||
updateBar(progress.value / 10)
|
||||
let bg = thumbnails.length == 0 ? "" : thumbnails[Math.floor(currentTime / 5) || 0]
|
||||
thumb.src = bg || ""
|
||||
}
|
||||
|
||||
function dragBarEnd() {
|
||||
|
|
@ -92,11 +77,10 @@ function updateBar(progressPercent) {
|
|||
if (document.location.href.endsWith("#player")) {
|
||||
currentTime = video.duration * progressPercent / 100
|
||||
progress.style.setProperty("--progress", progressPercent + "%");
|
||||
thumb.style.setProperty("--progress", progressPercent + "%");
|
||||
elapsed.innerHTML = toTS(currentTime);
|
||||
remaining.innerHTML = toTS(video.duration - currentTime);
|
||||
progress.value = progressPercent * 10
|
||||
let bg = thumbnails.length == 0 ? "" : thumbnails[Math.floor(currentTime / 5) || 0]
|
||||
progress.style.setProperty("--background", "url(" + (bg || "") + ")")
|
||||
progress.setAttribute("data-ts", toTS(currentTime))
|
||||
}
|
||||
}
|
||||
|
|
@ -115,7 +99,7 @@ function initThumbnail() {
|
|||
h = parseInt(w / ratio)
|
||||
canvas.width = w;
|
||||
canvas.height = h;
|
||||
progress.style.setProperty("--height", h + "px");
|
||||
thumb.style.setProperty("--height", h + "px");
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,9 +1,14 @@
|
|||
const client = new WebTorrent(),
|
||||
announceList = [
|
||||
var client = new WebTorrent()
|
||||
window.onbeforeunload = ()=>{
|
||||
client.torrents[0].store.destroy()
|
||||
client.torrents[0].destroy()
|
||||
client.destroy()
|
||||
}
|
||||
const announceList = [
|
||||
['wss://tracker.openwebtorrent.com'],
|
||||
['wss://tracker.btorrent.xyz'],
|
||||
['wss://tracker.webtorrent.io'],
|
||||
['wss://tracker.fastcast.nz'],
|
||||
// ['wss://tracker.webtorrent.io'],
|
||||
// ['wss://tracker.fastcast.nz'],
|
||||
['wss://video.blender.org:443/tracker/socket'],
|
||||
['wss://tube.privacytools.io:443/tracker/socket'],
|
||||
['wss://tracker.sloppyta.co:443/announce'],
|
||||
|
|
@ -45,10 +50,12 @@ WEBTORRENT_ANNOUNCE = announceList
|
|||
return url.indexOf('wss://') === 0 || url.indexOf('ws://') === 0
|
||||
})
|
||||
let nowPlaying,
|
||||
maxTorrents = 1
|
||||
maxTorrents = 1,
|
||||
selectedTorrent
|
||||
async function addTorrent(magnet) {
|
||||
if (client.torrents.length >= maxTorrents) {
|
||||
client.remove(client.torrents[0].infoHash)
|
||||
client.torrents[0].store.destroy()
|
||||
client.torrents[0].destroy()
|
||||
}
|
||||
halfmoon.hideModal("tsearch")
|
||||
document.location.href = "#player"
|
||||
|
|
@ -56,19 +63,6 @@ async function addTorrent(magnet) {
|
|||
selected ? selPlaying(selected) : ""
|
||||
await sw
|
||||
client.add(magnet, async function (torrent) {
|
||||
function onProgress() {
|
||||
if (document.location.href.endsWith("#player")) {
|
||||
player.style.setProperty("--download", torrent.progress * 100 + "%");
|
||||
peers.textContent = torrent.numPeers
|
||||
downSpeed.textContent = prettyBytes(torrent.downloadSpeed) + '/s'
|
||||
upSpeed.textContent = prettyBytes(torrent.uploadSpeed) + '/s'
|
||||
}
|
||||
}
|
||||
setInterval(onProgress, 100)
|
||||
// torrent.on('download', onProgress)
|
||||
// torrent.on('upload', onProgress)
|
||||
// torrent.on('warning', console.log) // too spammy for now
|
||||
// torrent.on('error', console.log)
|
||||
torrent.on('noPeers', function () {
|
||||
halfmoon.initStickyAlert({
|
||||
content: `Couldn't find peers for <span class="text-break">${torrent.infoHash}</span>! Try a torrent with more seeders.`,
|
||||
|
|
@ -83,6 +77,7 @@ async function addTorrent(magnet) {
|
|||
videoFile = file
|
||||
}
|
||||
})
|
||||
selectedTorrent = torrent
|
||||
torrent.on('done', function () {
|
||||
halfmoon.initStickyAlert({
|
||||
content: `<span class="text-break">${torrent.infoHash}</span> has finished downloading. Now seeding.`,
|
||||
|
|
@ -98,6 +93,15 @@ async function addTorrent(magnet) {
|
|||
})
|
||||
|
||||
}
|
||||
function onProgress() {
|
||||
if (document.location.href.endsWith("#player") && selectedTorrent) {
|
||||
player.style.setProperty("--download", selectedTorrent.progress * 100 + "%");
|
||||
peers.textContent = selectedTorrent.numPeers
|
||||
downSpeed.textContent = prettyBytes(selectedTorrent.downloadSpeed) + '/s'
|
||||
upSpeed.textContent = prettyBytes(selectedTorrent.uploadSpeed) + '/s'
|
||||
}
|
||||
}
|
||||
setInterval(onProgress, 100)
|
||||
|
||||
|
||||
function serveFile(file, req) {
|
||||
|
|
|
|||
30
app/sw.js
30
app/sw.js
|
|
@ -17,25 +17,25 @@ const FILES_TO_CACHE = [
|
|||
];
|
||||
|
||||
self.addEventListener('install', (evt) => {
|
||||
evt.waitUntil(
|
||||
caches.open(CACHE_NAME).then((cache) => {
|
||||
return cache.addAll(FILES_TO_CACHE);
|
||||
})
|
||||
);
|
||||
// evt.waitUntil(
|
||||
// caches.open(CACHE_NAME).then((cache) => {
|
||||
// return cache.addAll(FILES_TO_CACHE);
|
||||
// })
|
||||
// );
|
||||
self.skipWaiting();
|
||||
});
|
||||
|
||||
self.addEventListener('activate', (evt) => {
|
||||
evt.waitUntil(
|
||||
caches.keys().then((keyList) => {
|
||||
return Promise.all(keyList.map((key) => {
|
||||
if (key !== CACHE_NAME) {
|
||||
return caches.delete(key);
|
||||
}
|
||||
}));
|
||||
})
|
||||
);
|
||||
self.clients.claim();
|
||||
// evt.waitUntil(
|
||||
// caches.keys().then((keyList) => {
|
||||
// return Promise.all(keyList.map((key) => {
|
||||
// if (key !== CACHE_NAME) {
|
||||
// return caches.delete(key);
|
||||
// }
|
||||
// }));
|
||||
// })
|
||||
// );
|
||||
return self.clients.claim();
|
||||
});
|
||||
|
||||
self.addEventListener('fetch', evt => {
|
||||
|
|
|
|||
Loading…
Reference in a new issue