From 7cd981d3eb3b6eb57a17aedbf7c785028a800dbe Mon Sep 17 00:00:00 2001 From: rinsuki <428rinsuki+git@gmail.com> Date: Mon, 19 Feb 2024 10:12:26 +0900 Subject: [PATCH] feat: support non-int vpos --- README.en.md | 2 +- README.md | 2 +- docs/localize.js | 6 ++---- docs/sample/sample.js | 8 +++----- docs/sample/test.html | 2 +- src/main.ts | 17 +++++++++++------ 6 files changed, 19 insertions(+), 18 deletions(-) diff --git a/README.en.md b/README.en.md index cd244e7d..af03a4dd 100755 --- a/README.en.md +++ b/README.en.md @@ -33,7 +33,7 @@ const res = await req.json(); const niconiComments = new NiconiComments(canvas, res); //If video.ontimeupdate is used, the comments will be choppy due to the small number of calls. setInterval( - () => niconiComments.drawCanvas(Math.floor(video.currentTime * 100)), + () => niconiComments.drawCanvas(video.currentTime * 100), 10 ); ``` diff --git a/README.md b/README.md index 46dfc1e4..53ae4490 100755 --- a/README.md +++ b/README.md @@ -35,7 +35,7 @@ const res = await req.json(); const niconiComments = new NiconiComments(canvas, res); //video.ontimeupdateを使用すると、呼び出し回数の関係でコメントカクつく setInterval( - () => niconiComments.drawCanvas(Math.floor(video.currentTime * 100)), + () => niconiComments.drawCanvas(video.currentTime * 100), 10 ); ``` diff --git a/docs/localize.js b/docs/localize.js index f7055145..9b67a41c 100755 --- a/docs/localize.js +++ b/docs/localize.js @@ -275,10 +275,8 @@ const localize = { `

addEventListenerで追加されたイベントハンドラを削除します

`, ], m_drawCanvas: [ - `

Draws a comment on the canvas based on vpos(currentTime*100 of the video)

-

vpos must be an integer (int)

`, - `

vpos(動画のcurrentTime*100)を元にキャンバスにコメントを描画します

-

vposは整数(int)である必要があります

`, + `

Draws a comment on the canvas based on vpos(currentTime*100 of the video)

`, + `

vpos(動画のcurrentTime*100)を元にキャンバスにコメントを描画します

`, ], m_clear: [`

Erase Canvas

`, `

キャンバスを消去します

`], c_flash: [ diff --git a/docs/sample/sample.js b/docs/sample/sample.js index 4e474f26..6de549dd 100755 --- a/docs/sample/sample.js +++ b/docs/sample/sample.js @@ -334,13 +334,11 @@ const updateTime = (currentTime, paused) => { const updateCanvas = () => { if (!nico) return; if (!videoMicroSec) { - nico.drawCanvas(Math.floor(currentTime * 100)); + nico.drawCanvas(currentTime * 100); } else { nico.drawCanvas( - Math.floor( - (performance.now() - videoMicroSec.microsec) / 10 + - videoMicroSec.currentTime * 100 - ) + (performance.now() - videoMicroSec.microsec) / 10 + + videoMicroSec.currentTime * 100 ); } }; diff --git a/docs/sample/test.html b/docs/sample/test.html index 339d0dbf..4d297e7b 100755 --- a/docs/sample/test.html +++ b/docs/sample/test.html @@ -20,7 +20,7 @@ const nico = new NiconiComments(canvasElement, res, { format: "formatted", }); - nico.drawCanvas(Math.floor(time * 100)); + nico.drawCanvas(time * 100); const elem = document.createElement("div"); elem.id = "loaded"; document.body.appendChild(elem); diff --git a/src/main.ts b/src/main.ts index 198fe0e2..e109a2b2 100755 --- a/src/main.ts +++ b/src/main.ts @@ -53,6 +53,9 @@ class NiconiComments { public showFPS: boolean; public showCommentCount: boolean; private lastVpos: number; + private get lastVposInt() { + return Math.floor(this.lastVpos); + } private processedCommentIndex: number; private comments: IComment[]; private readonly renderer: IRenderer; @@ -281,21 +284,23 @@ class NiconiComments { forceRendering = false, cursor?: Position, ): boolean { + const vposInt = Math.floor(vpos); const drawCanvasStart = performance.now(); if (this.lastVpos === vpos && !forceRendering) return false; - triggerHandler(vpos, this.lastVpos); - const timelineRange = this.timeline[vpos]; + triggerHandler(vposInt, this.lastVposInt); + const timelineRange = this.timeline[vposInt]; if ( !forceRendering && plugins.length === 0 && timelineRange?.filter((item) => item.loc === "naka").length === 0 && - this.timeline[this.lastVpos]?.filter((item) => item.loc === "naka") + this.timeline[this.lastVposInt]?.filter((item) => item.loc === "naka") ?.length === 0 ) { const current = timelineRange.filter((item) => item.loc !== "naka"), last = - this.timeline[this.lastVpos]?.filter((item) => item.loc !== "naka") ?? - []; + this.timeline[this.lastVposInt]?.filter( + (item) => item.loc !== "naka", + ) ?? []; if (arrayEqual(current, last)) return false; } this.renderer.clearRect(0, 0, config.canvasWidth, config.canvasHeight); @@ -309,7 +314,7 @@ class NiconiComments { console.error(`Failed to draw comments`, e); } } - this._drawCollision(vpos); + this._drawCollision(vposInt); this._drawComments(timelineRange, vpos, cursor); this._drawFPS(drawCanvasStart); this._drawCommentCount(timelineRange?.length);