A script to click a YouTube video play button at specific target time, useful for video-time syncing.

YouTubeCountdownSync.js

(function() {
	/** Start of Configuration */
	let Config = {
		/** Set the target time, this uses your Browser Local Time which usually is the same as your system timezone */
		"target_time": {
			"year": 2024,
			"month": 1,
			"date": 1,
			"hour": 0,
			"minute": 0,
			"second": 0,
		},

		/** Set the starting offset
		 * 	
		 * 	@description The video will be started earlier before the configured target_time,
		 * 	useful to play specific section in the video at the target time
		 * 
		 * 	@type {number} The offset in miliseconds
		 * 
		 * 	@example
		 * 	Positive Number represents how much earlier the video will be started
		 * 	Negative Number represents how much later the video will be started
		*/
		"start_offset": 5000,

		/** Timer resolution */
		"timer_resolution": 20, // in miliseconds

		/** Adjusts how often the countdown is logged in the console */
		"logging_resolution": 300, // in miliseconds

		/** Set the video to be played in fullscreen, requires User Gesture Requirement to be OFF */
		"fullscreen": true,
	}

	/** End of Configuration */
	let PlayButton = document.querySelector("#movie_player > div.ytp-chrome-bottom > div.ytp-chrome-controls > div.ytp-left-controls > button");
	let FullScreenButton = document.querySelector("#movie_player > div.ytp-chrome-bottom > div.ytp-chrome-controls > div.ytp-right-controls > button.ytp-fullscreen-button.ytp-button");

	// Make sure PlayButton exists on the page
	if (!PlayButton) {
		console.error("There is no YouTube play button detected on the page")
		return;
	}

	const DateTarget = new Date(
		Config["target_time"]["year"],
		Config["target_time"]["month"] - 1, // the parameter must be an index, January is 0, December is 11
		Config["target_time"]["date"],
		Config["target_time"]["hour"],
		Config["target_time"]["minute"],
		Config["target_time"]["second"],
	);

	// Calculate the time difference between the target time and the current time
	let TimeTargetWithOffset = DateTarget.getTime() - Date.now() - Config["start_offset"];
	let Started = false;

	// Countdown
	let IntervalInstance = setInterval(() => {
		TimeTargetWithOffset = DateTarget.getTime() - Date.now() - Config["start_offset"];

		// Display time left as seconds
		if (TimeTargetWithOffset % Config["logging_resolution"] < Config["timer_resolution"]) {
			console.log(`Time left: ${TimeTargetWithOffset / 1000}s`);
		}

		if (TimeTargetWithOffset < 0 && !Started) {
			// If the video should be in fullscreen, make sure it is fullscreen
			if (Config["fullscreen"] && !document.fullscreenElement) {
				FullScreenButton.click();
			}

			// Start the video now !
			PlayButton.click();
			console.log("The video has been started")
			Started = true;
		}

		// If the offset is already going negative and is lower than the start_offset, clear the interval
		if (TimeTargetWithOffset <= -Config["start_offset"]) {
			console.log("The target time has been reached, clearing the interval")
			clearInterval(IntervalInstance);
		}
	}, Config["timer_resolution"]);
})()