Creepso/miru
1
0
Fork 0
mirror of https://github.com/ThaUnknown/miru.git synced 2026-08-20 12:06:00 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

SMOOOOOOTH resize of subtitle canvas

Browse source
This commit is contained in:
ThaUnknown 2021-03-13 01:54:32 +01:00
parent 5365dfd223
commit 98f0341099
3 changed files with 40 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
app/css/misc.css
View file

@ -105,6 +105,7 @@ input:invalid {
width: 8rem;
background: linear-gradient(270deg, rgba(37, 40, 44, 1) 0%, rgba(37, 40, 44, 0) 100%);
/*this gradient looks like ass, need to find smth better*/
pointer-events: none;
}
#home.noauth #homeContinue,

2
app/index.html
View file

@ -731,7 +731,7 @@
</div>
<div class="custom-switch mb-20" data-toggle="tooltip" data-placement="top" data-title="Only Downloads Pieces Directly Required For Playback Instead Of The Entire File. Recommended Only For Low-End Devices">
<input type="checkbox" id="torrent6">
<label for="torrent6">Streamed Playback</label>
<label for="torrent6">Streamed Download</label>
</div>
</div>
<div class="p-5">

69
app/js/subtitles-octopus.js
View file

@ -557,7 +557,7 @@ var SubtitlesOctopus = function (options) {
window[data.method]();
break;
}
case 'ready':{
case 'ready': {
break;
}
case 'canvas': {
@ -773,10 +773,6 @@ var SubtitlesOctopus = function (options) {
self.canvas.style.left != left
) {
if (self.renderMode == "offscreenCanvas" && self.initDone) {
self.canvasParent.remove()
self.createCanvas()
}
if (videoSize != null) {
self.canvasParent.style.position = 'relative';
self.canvas.style.display = 'block';
@ -787,39 +783,50 @@ var SubtitlesOctopus = function (options) {
}
if (!(self.canvas.width == width && self.canvas.height == height)) {
// only re-paint if dimensions actually changed
self.canvas.width = width;
self.canvas.height = height;
if (videoSize != null) {
self.canvas.style.width = videoSize.width + 'px';
self.canvas.style.height = videoSize.height + 'px';
function rePaint() {
if (self.renderMode == "offscreenCanvas" && self.initDone) {
self.canvasParent.remove()
self.createCanvas()
}
self.canvas.width = width;
self.canvas.height = height;
if (videoSize != null) {
self.canvasParent.style.position = 'relative';
self.canvas.style.display = 'block';
self.canvas.style.position = 'absolute';
self.canvas.style.top = top + 'px';
self.canvas.style.left = left + 'px';
self.canvas.style.pointerEvents = 'none';
}
if (self.renderMode == "offscreenCanvas" && self.initDone) {
self.pushOffscreenCanvas()
}
self.worker.postMessage({
target: 'canvas',
width: self.canvas.width,
height: self.canvas.height
});
self.resetRenderAheadCache(true);
}
if (self.renderMode == "offscreenCanvas" && self.initDone) {
self.pushOffscreenCanvas()
//dont spam re-paints like crazy when re-sizing with animations, but still update instantly without them
if (self.resizeTimeoutBuffer) {
clearTimeout(self.resizeTimeoutBuffer)
self.resizeTimeoutBuffer = setTimeout(() => {
self.resizeTimeoutBuffer = undefined
rePaint()
}, 50)
} else {
rePaint()
self.resizeTimeoutBuffer = setTimeout(() => {
self.resizeTimeoutBuffer = undefined
}, 50)
}
self.worker.postMessage({
target: 'canvas',
width: self.canvas.width,
height: self.canvas.height
});
self.resetRenderAheadCache(true);
}
}
};
self.resizeWithTimeout = function () {
//dont spam re-paints like crazy when re-sizing with animations, but still update instantly without them
if (self.resizeTimeoutBuffer) {
clearTimeout(self.resizeTimeoutBuffer)
self.resizeTimeoutBuffer = setTimeout(() => {
self.resizeTimeoutBuffer = undefined
self.resize();
}, 50)
} else {
self.resizeTimeoutBuffer = setTimeout(() => {
self.resizeTimeoutBuffer = undefined
self.resize();
}, 50)
}
self.resize();
};
self.runBenchmark = function () {