// started on main page load
function init() {

	// Connect "Enter" in text field with Button click
	var url = document.getElementById("url");
	url.addEventListener("keyup", function(event) {
  		if (event.keyCode === 13) {
   			event.preventDefault();
   			on_start();
  		}
	});
}

function set_status(message) {
	if (message == "")
		message = " ";

	document.getElementById("status").innerHTML = message;
}

// started on button click: get filename
function on_start() {
	var xhr = new XMLHttpRequest();

	// run on data received back
	xhr.onreadystatechange = function() {
                                if (this.readyState != 4) {
					return;
				}
				if (this.status != 200) {
					set_status("Server Error while retrieving filename, " + filename + ", status: " + this.status + " " + this.statusText);
                                        return;
                                }

				var filename = this.responseText;

				get_file(filename);
	}

	var parser = new DOMParser();
	var xmlDocument = parser.parseFromString("<request></request>", "text/xml");
	
	var requestElement = xmlDocument.getElementsByTagName("request")[0];

	var commandElement = xmlDocument.createElement("command");
	commandElement.appendChild(document.createTextNode("getfilename"));
	requestElement.appendChild(commandElement);

	var urlElement = xmlDocument.createElement("url");
	urlElement.appendChild(document.createTextNode(document.getElementById("url").value));
	requestElement.appendChild(urlElement);

	var formatElement = xmlDocument.createElement("format");
	formatElement.appendChild(document.createTextNode(document.getElementById("mp3").checked ? "mp3" : "mp4"));
	requestElement.appendChild(formatElement);
	
	xhr.open("POST", "downtube.fcgi", true);
	xhr.setRequestHeader("Content-type", "text/xml");
	xhr.responseType = 'text';
	xhr.send(xmlDocument);

	set_status("Please wait while retrieving filename...");
}

// started on button click: get file
function get_file(filename) {
	var xhr = new XMLHttpRequest();

	// run on data received back
	xhr.onreadystatechange = function() {
				if (this.readyState == 3) {
					set_status("Please wait while downloading " + filename + " ...");
					return;
				}
                                if (this.readyState != 4) {
					return;
				}
				if (this.status != 200) {
					set_status("Server Error while retrieving " + filename + ", status: " + this.status + " " + this.statusText);
                                        return;
                                }

                                var a = document.getElementById("download-a");
                                a.setAttribute("download", filename);
                                var file = new Blob([this.response]);
                                a.href = window.URL.createObjectURL(file);
                                a.click();
				
				set_status(""); // OK
	}

	var parser = new DOMParser();
	var xmlDocument = parser.parseFromString("<request></request>", "text/xml");
	
	var requestElement = xmlDocument.getElementsByTagName("request")[0];

	var commandElement = xmlDocument.createElement("command");
	commandElement.appendChild(document.createTextNode("getfile"));
	requestElement.appendChild(commandElement);

	var urlElement = xmlDocument.createElement("url");
	urlElement.appendChild(document.createTextNode(document.getElementById("url").value));
	requestElement.appendChild(urlElement);

	var formatElement = xmlDocument.createElement("format");
	formatElement.appendChild(document.createTextNode(document.getElementById("mp3").checked ? "mp3" : "mp4"));
	requestElement.appendChild(formatElement);
	
	xhr.open("POST", "downtube.fcgi", true);
	xhr.setRequestHeader("Content-type", "text/xml");
	xhr.responseType = 'blob';
	xhr.send(xmlDocument);

	set_status("Please wait while server prepares " + filename + " ...");
}