From 1aee7d585ea0aec4a276c6ae6464dc45c91263df Mon Sep 17 00:00:00 2001 From: Frederick Zhang Date: Sat, 22 Jun 2024 19:42:08 -0700 Subject: [PATCH 1/3] feature: point winner for timestamp only - code is a little messy, but this file is going to be deprecated in the future. - add new column for point winner, along with 'g' key for player2 to win and 'd' for player1. --- app/(interactive)/tag-match/page.js | 45 ++++++++++++++++++++++------- 1 file changed, 34 insertions(+), 11 deletions(-) diff --git a/app/(interactive)/tag-match/page.js b/app/(interactive)/tag-match/page.js index 9a5f10c..470be8d 100644 --- a/app/(interactive)/tag-match/page.js +++ b/app/(interactive)/tag-match/page.js @@ -4,7 +4,7 @@ import React, { useState, useEffect, useRef } from 'react'; import VideoPlayer from '../../components/VideoPlayer'; import styles from '../../styles/Tagging.module.css'; -const TagTable = ({ pair, index, handleStartTimeChange, handleEndTimeChange, handleRemoveTime }) => { +const TagTable = ({ pair, index, handleStartTimeChange, handleEndTimeChange, handlePlayerWonChange, handleRemoveTime }) => { return ( {index + 1} @@ -22,6 +22,13 @@ const TagTable = ({ pair, index, handleStartTimeChange, handleEndTimeChange, han onChange={(event) => handleEndTimeChange(index, event.target.value)} /> + + handlePlayerWonChange(index, event.target.value)} + /> + @@ -44,24 +51,24 @@ const KeybindingsTable = () => { Pause/Play - [d] [f] - Start Timestamp / End Timestamp + [d] [g] [f] + Start Timestamp, Player1Won | Start Timestamp, Player2Won | End Timestamp [r] [e] - Forward/Backward 1s + Forward | Backward 1s [w] [q] - Forward/Backward 5s + Forward | Backward 5s [s] [a] - Forward/Backward 10s + Forward | Backward 10s [1] [2] - Speed x1 / x2 + Speed x1 | x2 @@ -99,13 +106,20 @@ export default function TagMatch() { "d": () => { const newTimestamp = Math.round(videoObject.getCurrentTime() * 1000); if (!timeList.some(pair => pair[1] === 0)) { - setTimeList(timeList => [...timeList, [newTimestamp, 0]].sort((pair1, pair2) => pair1[0] - pair2[0])); + setTimeList(timeList => [...timeList, [newTimestamp, 0, "Player 1"]].sort((pair1, pair2) => pair1[0] - pair2[0])); setCurTimeStart(newTimestamp); } }, "f": () => { const newTimestamp = Math.round(videoObject.getCurrentTime() * 1000); - setTimeList(timeList => timeList.map(pair => (pair[1] === 0 && newTimestamp >= pair[0]) ? [pair[0], newTimestamp] : pair)); + setTimeList(timeList => timeList.map(pair => (pair[1] === 0 && newTimestamp >= pair[0]) ? [pair[0], newTimestamp, pair[2]] : pair)); + }, + "g": () => { + const newTimestamp = Math.round(videoObject.getCurrentTime() * 1000); + if (!timeList.some(pair => pair[1] === 0)) { + setTimeList(timeList => [...timeList, [newTimestamp, 0, "Player 2"]].sort((pair1, pair2) => pair1[0] - pair2[0])); + setCurTimeStart(newTimestamp); + } }, "r": () => videoObject.seekTo(videoObject.getCurrentTime() + 1 / FRAMERATE, true), "e": () => videoObject.seekTo(videoObject.getCurrentTime() - 1 / FRAMERATE, true), @@ -123,13 +137,19 @@ export default function TagMatch() { const handleStartTimeChange = (index, value) => { const updatedTimeList = [...timeList]; - updatedTimeList[index] = [parseInt(value), updatedTimeList[index][1]]; + updatedTimeList[index] = [parseInt(value), updatedTimeList[index][1], updatedTimeList[index][2]]; setTimeList(updatedTimeList); }; const handleEndTimeChange = (index, value) => { const updatedTimeList = [...timeList]; - updatedTimeList[index] = [updatedTimeList[index][0], parseInt(value)]; + updatedTimeList[index] = [updatedTimeList[index][0], parseInt(value), updatedTimeList[index][2]]; + setTimeList(updatedTimeList); + }; + + const handlePlayerWonChange = (index, value) => { + const updatedTimeList = [...timeList]; + updatedTimeList[index] = [updatedTimeList[index][0], updatedTimeList[index][1], value]; setTimeList(updatedTimeList); }; @@ -270,6 +290,7 @@ export default function TagMatch() { Index Start Time End Time + Point Winner Remove @@ -286,6 +307,7 @@ export default function TagMatch() { index={index} handleStartTimeChange={handleStartTimeChange} handleEndTimeChange={handleEndTimeChange} + handlePlayerWonChange={handlePlayerWonChange} handleRemoveTime={handleRemoveTime} /> ); @@ -303,6 +325,7 @@ export default function TagMatch() { index={index} handleStartTimeChange={handleStartTimeChange} handleEndTimeChange={handleEndTimeChange} + handlePlayerWonChange={handlePlayerWonChange} handleRemoveTime={handleRemoveTime} /> ))} From 422d359b7c4968613fa4e289f73747d324779aa4 Mon Sep 17 00:00:00 2001 From: Frederick Zhang Date: Sat, 22 Jun 2024 19:46:11 -0700 Subject: [PATCH 2/3] Revert "Merge pull request #174 from awest25/download-csv" This reverts commit 9cba6517fbf29ef46dcecd63b4466b461c37caa7, reversing changes made to 515da3c5f9cfd9726c05306798c500a1446c3460. --- app/(interactive)/match-list/page.js | 2 +- app/(interactive)/tag-match/[slug]/page.js | 15 +-- app/(interactive)/tag-match/page.js | 118 ++++++++++----------- 3 files changed, 58 insertions(+), 77 deletions(-) diff --git a/app/(interactive)/match-list/page.js b/app/(interactive)/match-list/page.js index 2b11785..3deb4f4 100644 --- a/app/(interactive)/match-list/page.js +++ b/app/(interactive)/match-list/page.js @@ -72,7 +72,7 @@ export default function MatchList() {
  • {match.name} - +
    setNewName(e.target.value)}/> diff --git a/app/(interactive)/tag-match/[slug]/page.js b/app/(interactive)/tag-match/[slug]/page.js index f8a6c8d..52a6b67 100644 --- a/app/(interactive)/tag-match/[slug]/page.js +++ b/app/(interactive)/tag-match/[slug]/page.js @@ -132,18 +132,6 @@ export default function TagMatch() { navigator.clipboard.writeText(csvData); }; - const handleDownload = () => { - const csvData = convertToCSV(tableState.rows); - const blob = new Blob([csvData], { type: 'text/csv' }); - const url = URL.createObjectURL(blob); - const a = document.createElement('a'); - a.href = url; - a.download = 'points.csv'; - document.body.appendChild(a); - a.click(); - document.body.removeChild(a); - URL.revokeObjectURL(url); - } useEffect(() => { window.addEventListener('keydown', handleKeyDown); @@ -430,7 +418,6 @@ export default function TagMatch() { - @@ -486,6 +473,8 @@ export default function TagMatch() {
    • + + { /* CSV Table */} diff --git a/app/(interactive)/tag-match/page.js b/app/(interactive)/tag-match/page.js index 470be8d..515844e 100644 --- a/app/(interactive)/tag-match/page.js +++ b/app/(interactive)/tag-match/page.js @@ -219,69 +219,61 @@ export default function TagMatch() {
    -
    -
    -
    - -
    - - -
    -
    -
    - - - - - - - - - - - - - - - - - - -
    Current Time: {timerValue}ms
    Jump to:
    - handleMillisecondsChange(event.target.value)} - style={{ marginRight: '10px' }} - /> - ms
    - { - const minutes = parseFloat(event.target.value); - const seconds = (timerValue % 60000) / 1000; - handleMinutesSecondsChange(minutes, seconds); - }} - style={{ marginRight: '10px' }} - /> - minutes - { - const seconds = parseFloat(event.target.value); - const minutes = Math.floor(timerValue / 60000); - handleMinutesSecondsChange(minutes, seconds); - }} - /> - seconds
    - - - + + + + + + + + + + + + + + + + + + + + + + +
    Current Time: {timerValue}ms
    Jump to:
    + handleMillisecondsChange(event.target.value)} + style={{ marginRight: '10px' }} + /> + ms
    + { + const minutes = parseFloat(event.target.value); + const seconds = (timerValue % 60000) / 1000; + handleMinutesSecondsChange(minutes, seconds); + }} + style={{ marginRight: '10px' }} + /> + minutes + { + const seconds = parseFloat(event.target.value); + const minutes = Math.floor(timerValue / 60000); + handleMinutesSecondsChange(minutes, seconds); + }} + /> + seconds
    +
    From f546ee8dc5c3877a06d4208d9bcd5ab36fe842c9 Mon Sep 17 00:00:00 2001 From: Frederick Zhang Date: Sat, 22 Jun 2024 19:46:54 -0700 Subject: [PATCH 3/3] Revert "Revert "Merge pull request #174 from awest25/download-csv"" This reverts commit 422d359b7c4968613fa4e289f73747d324779aa4. --- app/(interactive)/match-list/page.js | 2 +- app/(interactive)/tag-match/[slug]/page.js | 15 ++- app/(interactive)/tag-match/page.js | 118 +++++++++++---------- 3 files changed, 77 insertions(+), 58 deletions(-) diff --git a/app/(interactive)/match-list/page.js b/app/(interactive)/match-list/page.js index 3deb4f4..2b11785 100644 --- a/app/(interactive)/match-list/page.js +++ b/app/(interactive)/match-list/page.js @@ -72,7 +72,7 @@ export default function MatchList() {
  • {match.name} - +
    setNewName(e.target.value)}/> diff --git a/app/(interactive)/tag-match/[slug]/page.js b/app/(interactive)/tag-match/[slug]/page.js index 52a6b67..f8a6c8d 100644 --- a/app/(interactive)/tag-match/[slug]/page.js +++ b/app/(interactive)/tag-match/[slug]/page.js @@ -132,6 +132,18 @@ export default function TagMatch() { navigator.clipboard.writeText(csvData); }; + const handleDownload = () => { + const csvData = convertToCSV(tableState.rows); + const blob = new Blob([csvData], { type: 'text/csv' }); + const url = URL.createObjectURL(blob); + const a = document.createElement('a'); + a.href = url; + a.download = 'points.csv'; + document.body.appendChild(a); + a.click(); + document.body.removeChild(a); + URL.revokeObjectURL(url); + } useEffect(() => { window.addEventListener('keydown', handleKeyDown); @@ -418,6 +430,7 @@ export default function TagMatch() { + @@ -473,8 +486,6 @@ export default function TagMatch() {
    • - - { /* CSV Table */}
    diff --git a/app/(interactive)/tag-match/page.js b/app/(interactive)/tag-match/page.js index 515844e..470be8d 100644 --- a/app/(interactive)/tag-match/page.js +++ b/app/(interactive)/tag-match/page.js @@ -219,61 +219,69 @@ export default function TagMatch() {
    - - - -
    - - - - - - - - - - - - - - - - - - -
    Current Time: {timerValue}ms
    Jump to:
    - handleMillisecondsChange(event.target.value)} - style={{ marginRight: '10px' }} - /> - ms
    - { - const minutes = parseFloat(event.target.value); - const seconds = (timerValue % 60000) / 1000; - handleMinutesSecondsChange(minutes, seconds); - }} - style={{ marginRight: '10px' }} - /> - minutes - { - const seconds = parseFloat(event.target.value); - const minutes = Math.floor(timerValue / 60000); - handleMinutesSecondsChange(minutes, seconds); - }} - /> - seconds
    - +
    +
    +
    + +
    + + +
    +
    + + + + + + + + + + + + + + + + + + + +
    Current Time: {timerValue}ms
    Jump to:
    + handleMillisecondsChange(event.target.value)} + style={{ marginRight: '10px' }} + /> + ms
    + { + const minutes = parseFloat(event.target.value); + const seconds = (timerValue % 60000) / 1000; + handleMinutesSecondsChange(minutes, seconds); + }} + style={{ marginRight: '10px' }} + /> + minutes + { + const seconds = parseFloat(event.target.value); + const minutes = Math.floor(timerValue / 60000); + handleMinutesSecondsChange(minutes, seconds); + }} + /> + seconds
    + +
    +