/* eslint-disable @typescript-eslint/no-unused-vars */

class WebEngineTypeVimeo {
	static instance: WebEngineTypeVimeo;
	callOut: WebEngineVideoCallout;
	id: string;
	constructor(callOut: WebEngineVideoCallout) {
		this.callOut = callOut;
		WebEngineTypeVimeo.instance = this;
		// <div id="{$popup_id}" class="wevideopopup youtube{$extraClasses}"{$outer_style}>
		// 	<div{$inner_style}>
		// 		<div class="wevideoplayer youtube"
		// 			id="{$player_id}"
		// 			data-video="{$video_data}"
		// 		></div>
		// 	</div>
		// </div>
		this.id = this.callOut.getFrame();

		if (this.callOut.data && this.callOut.data.delay) {
			this.callOut.hide();
		}
		if (this.callOut.data && this.callOut.data.delay) {
			this.callOut.hide();
		}
		// this.callOut.appendScript(
		// 	`function onYouTubeIframeAPIReady() {
		// 		WebEngineTypeVimeo.instance.init();
		// 	}`);
		this.callOut.loadScript('https://player.vimeo.com/api/player.js');
		//innserstyle was the padding to set aspect - we can detect that instead
		// document.addEventListener('DOMContentLoaded', function() {

		WebEngineTypeVimeo.instance.check();
		// });
	}
	check() {
		if (typeof (window as any).Vimeo === 'undefined') {
			setTimeout(function () {
				WebEngineTypeVimeo.instance.check();
			}, 100);
		} else {
			this.init();
		}
	}
	init() {
		if (this.callOut.data) {
			if (!(-1 === this.callOut.data.delay)) {
				setTimeout(function () {
					WebEngineTypeVimeo.instance.launch();
				}, this.callOut.data.delay);
			}
		}
	}
	player: any;
	launch() {
		if (this.callOut.data) {
			this.callOut.show();
			// set vimeo props
			// calloutPlayer is the DIV - this.id is its *id*
			// <iframe src="https://player.vimeo.com/video/{video_id}?h={hash_parameter}" width="{videoWidth}" height="{videoHeight}" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
			this.callOut.play();
		}
	}
	play() {
		const opts = {
			id: this.callOut.data.id,
			height: this.callOut.data.styles.frame.height,
			width: this.callOut.data.styles.frame.width,
			autoplay: this.callOut.data.autoplay,
			muted: this.callOut.data.mute,
			controls: this.callOut.data.controls,
		};
		//this.callOut.player.setAttribute('data-vimeo-id', this.callOut.data.id);
		this.player = new (window as any).Vimeo.Player(
			this.callOut.id_content,
			opts
		);
		this.player.setCurrentTime(this.callOut.data.starttime);
		// let div = document.createElement('div');
		// div.setAttribute('data-vimeo-id', this.callOut.data.id);
		// this.callOut.player.appendChild(div);
		// this.player = new (window as any).Vimeo.Player(div);

		//if (this.callOut.data.must_play === false) {
		this.callOut.played();
		//}
	}
}
/* eslint-enable @typescript-eslint/no-unused-vars */