Merge pull request #783 from WangEdward/dev

Fix: Watch Highlights missing last comment item
HolodexNet · Dec 29, 2024 · b821585 · b821585
2 parents f13de2b + a816b3c
commit b821585
Showing 1 changed file with 43 additions and 52 deletions.
diff --git a/src/components/watch/WatchHighlights.vue b/src/components/watch/WatchHighlights.vue
@@ -113,7 +113,6 @@ export default {
     computed: {
         buckets() {
             const TIME_THRESHOLD = 40;
-            const MIN_BUCKET_SIZE = 1;
             const MIN_TIMESTAMP_OCCURENCE = 1;
             const VIDEO_START_TIMESTAMP = +new Date(
                 this.video.start_actual || this.video.available_at,
@@ -134,81 +133,73 @@ export default {
             parsed.sort((a, b) => a.time - b.time);
 
             const buckets = [];
-            let currentBucket = 0;
             let subBucket: ParsedComment[] = [];
 
             parsed.forEach((comment, index) => {
-                // put into curent subbucket if time is within 10 secs
+                subBucket.push(comment);
+                // go to next comment if it's within the threshold (saving in the same bucket)
                 if (
-                    comment.time - currentBucket <= TIME_THRESHOLD
-                    && index !== parsed.length - 1
+                    index !== parsed.length - 1
+                    && parsed[index + 1].time - comment.time <= TIME_THRESHOLD
                 ) {
-                    subBucket.push(comment);
                     return;
                 }
-                if (comment.time - currentBucket <= TIME_THRESHOLD) {
-                    subBucket.push(comment);
-                }
                 /**
                  * Process the bucket
                  */
-                if (subBucket.length >= MIN_BUCKET_SIZE) {
-                    // select floor median has the display time
-                    const th = Math.floor(subBucket.length / 3);
-                    const median = subBucket[th].time;
-                    // Find matching song around timestamp
-                    const matchingSong = this.video?.songs?.find(
-                        (song) => Math.abs(song.start - median) <= TIME_THRESHOLD,
-                    );
-                    if (!matchingSong) {
-                        // pick best comment to show
-                        const processed = subBucket
-                            .sort(
-                                (a, b) => b.occurence / b.text.length - a.occurence / a.text.length,
-                            ) // prioritize chapter comment
-                            .map((s) => s.text) // ParsedComment -> string
-                            .map(removePunctuations) // remove punctuations
-                            .map(removeStopWords) // remove stop words
-                            .map((c) => c.trim()) // strip white spaces
-                            .filter((c) => c.length > 1); // filter out clutter
+                // select floor median has the display time
+                const th = Math.floor(subBucket.length / 3);
+                const median = subBucket[th].time;
+                // Find matching song around timestamp
+                const matchingSong = this.video?.songs?.find(
+                    (song) => Math.abs(song.start - median) <= TIME_THRESHOLD,
+                );
+                if (!matchingSong) {
+                    // pick best comment to show
+                    const processed = subBucket
+                        .sort(
+                            (a, b) => b.occurence / b.text.length - a.occurence / a.text.length,
+                        ) // prioritize chapter comment
+                        .map((s) => s.text) // ParsedComment -> string
+                        .map(removePunctuations) // remove punctuations
+                        .map(removeStopWords) // remove stop words
+                        .map((c) => c.trim()) // strip white spaces
+                        .filter((c) => c.length > 1); // filter out clutter
 
-                        if (processed.length > 0) {
-                            let best = processed[0];
+                    if (processed.length > 0) {
+                        let best = processed[0];
 
-                            const stricter = processed
-                                .filter(filterByWordCount(2))
-                                .filter((c) => !/(?:clip\s?(?:it|this)|[!?]{3})/i.test(c));
-                            // console.log(stricter);
-                            if (stricter.length > 0) [best] = stricter;
+                        const stricter = processed
+                            .filter(filterByWordCount(2))
+                            .filter((c) => !/(?:clip\s?(?:it|this)|[!?]{3})/i.test(c));
+                        // console.log(stricter);
+                        if (stricter.length > 0) [best] = stricter;
 
-                            if (best.length > 60) best = `${best.slice(0, 60)}...`;
+                        if (best.length > 60) best = `${best.slice(0, 60)}...`;
 
-                            const medianMS = median * 1000;
-                            const absolute = new Date(
-                                VIDEO_START_TIMESTAMP + medianMS,
-                            ).toISOString();
-                            // console.log(best, processed);
-                            buckets.push({
-                                time: median,
-                                count: subBucket.length,
-                                best,
-                                display: formatDuration(medianMS),
-                                absolute,
-                            });
-                        }
+                        const medianMS = median * 1000;
+                        const absolute = new Date(
+                            VIDEO_START_TIMESTAMP + medianMS,
+                        ).toISOString();
+                        // console.log(best, processed);
+                        buckets.push({
+                            time: median,
+                            count: subBucket.length,
+                            best,
+                            display: formatDuration(medianMS),
+                            absolute,
+                        });
                     }
                 }
                 // clear and set a new bucket
-                currentBucket = comment.time;
                 subBucket = [];
-                subBucket.push(comment);
             });
 
             // Render song item instead of text
             buckets.push(
                 ...(this.video.songs?.map((song) => ({
                     time: song.start,
-                    count: subBucket.length,
+                    count: 1,
                     song: {
                         ...song,
                         channel: this.video.channel,