create() {
		console.assert(this.video === null);
		const video = document.createElement("video");
		this.video = video;
		video.autoplay = false;
		video.controls = false;
		video.loop = true;
		video.preload = "metadata";
		video.src = this.make_url_join("joke/evotar.webm");

		Object.assign(video.style, {
			maxWidth: "100%", maxHeight: "100%", width: "100%"
		});

		const overlay = document.createElement("div");
		this.video_overlay = overlay;
		const text = document.createElement("p");
		Object.assign(overlay.style, {
			backgroundColor:"#86f", opacity: "0%", zIndex: "1",
			position: "absolute", top: "0", left: "0",
			right: "0", bottom:"0"
		});
		text.textContent = "Unexpected Error";
		// text.textContent = "Unerwarteter Felher"
		Object.assign(text.style, {
			fontSize: "2vh", fontFamily: "serif",
			backgroundColor:"black", border:"1px red solid",
			textAlign: "center",
			width: "8em", height: "3ex", position: "absolute",
			left: "calc(50% - 4em)", top: "calc(50% - 1.5ex)"
		});


		const div = document.createElement("div");
		this.container = div;
		div.appendChild(video);
		div.appendChild(overlay);
		overlay.appendChild(text);

		this.new_playlist();
		// this loads the first sound, but does not play it.
		this.next_sound();

		return div;
	}
// resolves when video ready to be played
resolves when video ready to be played
resolves when video ready to be played
create() {
		console.assert(this.video === null);
		const video = document.createElement("video");
		this.video = video;
		video.autoplay = false;
		video.controls = false;
		video.loop = true;
		video.preload = "metadata";
		video.src = this.make_url_join("joke/evotar.webm");
		Object.assign(video.style, {
			maxWidth: "100%", maxHeight: "100%", width: "100%"
		});
		const overlay = document.createElement("div");
		this.video_overlay = overlay;
		const text = document.createElement("p");
		Object.assign(overlay.style, {
			backgroundColor:"#86f", opacity: "0%", zIndex: "1",
			position: "absolute", top: "0", left: "0",
			right: "0", bottom:"0"
		});
		text.textContent = "Unexpected Error";
		Object.assign(text.style, {
			fontSize: "2vh", fontFamily: "serif",
			backgroundColor:"black", border:"1px red solid",
			textAlign: "center",
			width: "8em", height: "3ex", position: "absolute",
			left: "calc(50% - 4em)", top: "calc(50% - 1.5ex)"
		});
		const div = document.createElement("div");
		this.container = div;
		div.appendChild(video);
		div.appendChild(overlay);
		overlay.appendChild(text);
		this.new_playlist();
		this.next_sound();
		return div;
	}
create ( ) { console . assert ( this . video === null ) ; const video = document . createElement ( "video" ) ; this . video = video ; video . autoplay = false ; video . controls = false ; video . loop = true ; video . preload = "metadata" ; video . src = this . make_url_join ( "joke/evotar.webm" ) ; Object . assign ( video . style , { maxWidth : "100%" , maxHeight : "100%" , width : "100%" } ) ; const overlay = document . createElement ( "div" ) ; this . video_overlay = overlay ; const text = document . createElement ( "p" ) ; Object . assign ( overlay . style , { backgroundColor : "#86f" , opacity : "0%" , zIndex : "1" , position : "absolute" , top : "0" , left : "0" , right : "0" , bottom : "0" } ) ; text . textContent = "Unexpected Error" ; Object . assign ( text . style , { fontSize : "2vh" , fontFamily : "serif" , backgroundColor : "black" , border : "1px red solid" , textAlign : "center" , width : "8em" , height : "3ex" , position : "absolute" , left : "calc(50% - 4em)" , top : "calc(50% - 1.5ex)" } ) ; const div = document . createElement ( "div" ) ; this . container = div ; div . appendChild ( video ) ; div . appendChild ( overlay ) ; overlay . appendChild ( text ) ; this . new_playlist ( ) ; this . next_sound ( ) ; return div ; }
resolves when video ready to be played
resolves when video ready to be played
// text.textContent = "Unerwarteter Felher" // this loads the first sound, but does not play it.