var FilesAjax = (function() {
	var pub = {};

	var notify;
	var form;
	var table;

	var progress; /* For XMLHttpRequest Level 2 */

	function handle_xml_response(responseXML)
	{
		var newNotifies = responseXML.getElementsByTagName('notifies')[0].getElementsByTagName('li');
		while (newNotifies.length)
			notify.appendChild(newNotifies[0]);

		var newTable = responseXML.getElementsByTagName('files')[0].getElementsByTagName('table')[0];
		table.parentNode.replaceChild(newTable, table);
		table = newTable;
		handle_deletes();
	}

	function handle_form()
	{
		if (!(new XMLHttpRequest().upload))
			return;

		var submit = form.querySelector('input[type="submit"]');
		submit.parentNode.removeChild(submit);

		var uploads = document.createElement('ul');
		form.appendChild(uploads);

		var inputFile = form.querySelector('input[type="file"]');
		inputFile.addEventListener('change', function(event) {
			var files = event.target.files;
			for (var i = 0; i < files.length; i++) {
				var progress = document.createElement('progress');
				progress.setAttribute('max', '100');
				progress.setAttribute('value', '0');
				progress.appendChild(document.createTextNode('0%'));
				var li = document.createElement('li');
				li.appendChild(document.createTextNode(files[i].name + ' '));
				li.appendChild(progress);
				if (uploads.getElementsByTagName('fieldset').length)
					uploads.getElementsByTagName('fieldset')[0].appendChild(li);
				else
					uploads.appendChild(li);

				var xhr = new XMLHttpRequest();
				(function(xhr, li, progress) {
					xhr.upload.addEventListener('progress', function(e) {
						if (e.lengthComputable) {
							var percentage = Math.round((e.loaded * 100) / e.total);
							progress.setAttribute('value', percentage);
							progress.textContent = percentage + '%';
						}
					}, false);

					xhr.upload.addEventListener('load', function(e) {
						progress.setAttribute('value', 100);
						progress.textContent = 100;
					}, false);

					xhr.onreadystatechange = function() {
						if (xhr.readyState == 4 && xhr.status == 200) {
							li.parentNode.removeChild(li);
							handle_xml_response(xhr.responseXML);
						}
					}
				})(xhr, li, progress);
				xhr.open('POST', form.getAttribute('action'));
				xhr.setRequestHeader('X-Ajax', 'true');
				xhr.send(new FormData(form));
			}
			this.value = '';
		}, false);
	}

	function handle_deletes()
	{
		var deleteLink = table.querySelectorAll('a.delete');
		for (var i = 0; i < deleteLink.length; i++) {
			deleteLink[i].addEventListener('click', function(event) {
				var xhr = new XMLHttpRequest();
				xhr.onreadystatechange = function() {
					if (xhr.readyState == 4 && xhr.status == 200)
						handle_xml_response(xhr.responseXML);
				}
				xhr.open('GET', this.getAttribute('href'));
				xhr.setRequestHeader('X-Ajax', 'true');
				xhr.send();

				event.preventDefault();
			}, false);
		}
	}

	pub.init = function(_form, _table)
	{
		notify = document.getElementById('notify');
		form = _form;
		table = _table;
		handle_deletes();
		handle_form();
	};
	
	return pub;
}());

(function() {
	function attach_files_management()
	{
		var filesManagement = document.querySelectorAll('.files-management');
		for (var i = 0; i < filesManagement.length; i++) {
			var form = filesManagement[i].querySelector('form');
			var table = filesManagement[i].querySelector('table');

			var files = FilesAjax.init(form, table);
		}
	}

	if (window.addEventListener)
		window.addEventListener('DOMContentLoaded', attach_files_management, false);
	else if (window.attachEvent)
		window.attachEvent('onload', attach_files_management);
})();

