/*
 * Don't load the 3rd party embedded content player unless the image is clicked.
 * This increases performance issues when many videos are embedded on the same page.
 *
 * Released under the MIT license
 * Copyright (c) 2013 Michael Save <savetheinternet@tinyboard.org>
 * Copyright (c) 2013-2014 Marcin Łabanowski <marcin@6irc.net>
 * Copyright (c) 2025 Zankaria Auxa <zankaria.auxa@mailu.io>
 *
 * Usage:
 *	$config['embedding'] = array();
 *	$config['embedding'][0] = array(
 *		'/^https?:\/\/(\w+\.)?(?:youtube\.com\/watch\?v=|youtu\.be\/)([a-zA-Z0-9\-_]{10,11})(&.+)?$/i',
 *		$config['youtube_js_html']);
 *	$config['additional_javascript'][] = 'js/jquery.min.js';
 *	$config['additional_javascript'][] = 'js/youtube.js';
 */

$(document).ready(function() {
	const ON = '[Remove]';
	const YOUTUBE = 'www.youtube.com';

	function makeEmbedNode(embedHost, videoId, width, height) {
		return $(`<iframe type="text/html" width="${width}" height="${height}" class="full-image"
			src="https://${embedHost}/embed/${videoId}?autoplay=1" allow="fullscreen" frameborder="0" referrerpolicy="strict-origin"/>`);
	}

	// Adds Options panel item.
	if (typeof localStorage.youtube_embed_proxy === 'undefined') {
		localStorage.youtube_embed_proxy = 'incogtube.com'; // Default value.
	}

	if (window.Options && Options.get_tab('general')) {
		Options.extend_tab("general",
			"<fieldset id='media-proxy-fs'><legend>" + _("Media Proxy (requires refresh)") + "</legend>"
			+ '<label id="youtube-embed-proxy-url">' + _('YouTube embed proxy url&nbsp;&nbsp;')
			+ '<input type="text" size=30></label>'
			+ '</fieldset>');

		$('#youtube-embed-proxy-url>input').val(localStorage.youtube_embed_proxy);
		$('#youtube-embed-proxy-url>input').on('input', function() {
			localStorage.youtube_embed_proxy = $('#youtube-embed-proxy-url>input').val();
		});
	}

	const proxy = localStorage.youtube_embed_proxy;

	function addEmbedButton(_i, node) {
		node = $(node);
		const contents    = node.contents();
		const embedUrl    = node.data('video-id');
		const embedWidth  = node.data('iframe-width');
		const embedHeight = node.data('iframe-height');
		const span        = $('<span>[Embed]</span>');
		const spanProxy   = $("<span>[Proxy]</span>");

		let iframeDefault = null;
		let iframeProxy = null;

		node.click(function(e) {
			e.preventDefault();

			if (span.text() == ON) {
				contents.css('display', '');
				spanProxy.css('display', '');

				if (iframeDefault !== null) {
					iframeDefault.remove();
				}
				if (iframeProxy !== null) {
					iframeProxy.remove();
				}

				span.text('[Embed]');
			} else {
				let useProxy = e.target == spanProxy[0];

				// Lazily create the iframes.
				if (useProxy) {
					if (iframeProxy === null) {
						iframeProxy = makeEmbedNode(proxy, embedUrl, embedWidth, embedHeight);
					}
					node.prepend(iframeProxy);
				} else {
					if (iframeDefault === null) {
						iframeDefault = makeEmbedNode(YOUTUBE, embedUrl, embedWidth, embedHeight);
					}
					node.prepend(iframeDefault);
				}

				contents.css('display', 'none');
				spanProxy.css('display', 'none');
				span.text(ON);
			}
		});

		node.append(span);
		node.append(spanProxy);
	}

	$('div.video-container', document).each(addEmbedButton);

	// Allow to work with auto-reload.js, etc.
	$(document).on('new_post', function(e, post) {
		$('div.video-container', post).each(addEmbedButton);
	});
});