diff --git a/Home.md b/Home.md index 0884d65..a1ff4d9 100644 --- a/Home.md +++ b/Home.md @@ -3,14 +3,18 @@ let videoId; let lastVideoId; let comments = []; +const noon = new Audio ('//nizika.tv/assets/noon.wav'); + +function time2second (time) +{ +return (([m, s]) => m * 60 + (+s)) (time.split (':')); +} + setInterval (() => { const sendBtn = document.getElementById ('niconico-comment-send'); const comBox = document.getElementById ('niconico-comment-input'); -if (sendBtn == null) - return; - -sendBtn.addEventListener ('click', () => +const sendComment = () => { const lang = document.querySelector ('html').lang; @@ -28,9 +32,22 @@ document.querySelector ('textarea').dispatchEvent (new InputEvent('input', { })); setTimeout (() => { document.querySelector ('button.peertube-button.orange-button.ng-star-inserted').click (); +comments.push ({time: time2second (time), lang, style, content: comBox.value}); comBox.value = ''; +noon.play (); }, 100); -}); +}; +if (sendBtn == null || comBox == null) + return; + + comBox.addEventListener ('keydown', + function (e) + { + if (e.key === 'Enter') + sendComment (); + }); + +sendBtn.addEventListener ('click', sendComment); }, 1000); setInterval (async () => @@ -43,13 +60,37 @@ lastVideoId = videoId; if (videoId) { -console.log (comments = (await fetch(`/api/v1/videos/${videoId}/comment-threads?count=100&sort=-createdAt`) - .then(response => response.ok && response.json ())).data.map (e => e.text).filter (e => (0 <= +e[0]) && (+e[0] <= 9) && ((e.match (/\//g) || []).length >= 3)).map (e => (([time, lang, style, ...contentParts]) => ({time: (([m, s]) => m * 60 + (+s)) (time.split (':')), lang, style, content: contentParts.join ('/')})) (e.split ('/'))).sort ((a, b) => a.time < b.time ? -1 : 1) ); +comments = (await fetch(`/api/v1/videos/${videoId}/comment-threads?count=100&sort=-createdAt`) + .then(response => response.ok && response.json ())).data.map (e => e.text).filter (e => (0 <= +e[0]) && (+e[0] <= 9) && ((e.match (/\//g) || []).length >= 3)).map (e => (([time, lang, style, ...contentParts]) => ({time: time2second (time), lang, style, content: contentParts.join ('/')})) (e.split ('/'))).sort ((a, b) => a.time < b.time ? -1 : 1) ; } } +const canvas = document.querySelector ('#comment-canvas'); +if (canvas) +{ +canvas.width = 1280; +canvas.height = 720; +} +const ctx = canvas?.getContext ('2d'); +if (ctx) +{ +ctx.font = '48px Arial'; // フォントサイズとフォントタイプを設定 + ctx.textBaseline = 'top' +ctx.clearRect(0, 0, canvas.width, canvas.height); +ctx.lineWidth = 4; +const curTime = document.querySelector ('video').currentTime +comments.forEach ((e, i) => +{ +[['black', 'strokeText'], ['white', 'fillText']].forEach (([cl, f]) => +{ +ctx.fillStyle = cl; +ctx[f] (e.content, canvas.width + (e.time - curTime - 1) * (canvas.width + e.content.length * 48) / 4, 6 + 60 * (i % 12)); +}); +}); +} + let cmtStyle; if ((cmtStyle = document.querySelector ('.comment-threads')?.parentElement?.style) != null) cmtStyle.display = 'none'; -}, 100); +}, 30); ``` \ No newline at end of file