JavaScript video player that plays a ding sound on every cut
A "cut" is one of the most fundamental techniques in video editing. It's essentially a transition from one clip to another, and it’s the simplest and most straightforward way to move between scenes.
The most common kind of cut is a "straight cut", where one shot instantly changes to another. No fancy effects—just a simple, clean transition.
Often when we watch videos, we are not aware that the video has a cut. We are so used to the "language" of video editing, which in some styles has a lot of fast cuts. Some TV commercials, documentaries, or other videos, make use of many straight cuts.
By playing a ding as soon as every cut is detected, this tool allows for insight into the rhythm, timing, and style of how the video was edited.
- To get started, click here to load up the video player.
- Select your video. (Not to worry, it won't be uploaded anywhere, it just loads it locally in your browser.)
- Then start playing the video, and you'll hear a ding sound when a cut is detected in the video.
- You can try adjusting the sensitivity slider if the dings are happening too often or not enough.
- You can select a custom ding sound if you want a different "ding" than the default.
You can try this video I made, which makes use of a lot of straight cuts.
- Download it to your computer first, and then you can select it in the web app.
Some more example ding sounds can be found at: https://github.com/geoff604/video-cut-detection/tree/main/sounds
The CutDetector class implements a video cut detection algorithm using frame differencing and adaptive thresholding.
The algorithm analyzes pixel data from the currently displayed frames as they progress, to detect significant changes between frames.
To improve performance, downsampling and converting to grayscale are done prior to comparing frames in order to determine if the difference is over the threshold.
Changing the sensitivity slider affects the threshold calculation to make the detection more or less sensitive.
Finally, the class CutDetector fires an event when a cut is detected, and a ding sound is played when the event is received.
video-cut-detection was written by Geoff Peters a software developer based in Vancouver BC Canada. Initial release was on January 31st 2025. Feel free to contact Geoff on X at https://x.com/gpeters or email him at [email protected]
Thanks for checking out video-cut-detection and have a great day.