/**
 * draganddrop.js
 */
function init() {
	// événements sur la liste des joueurs sélectionnés
	var dropTarget = document.getElementById("players");
	dropTarget.addEventListener("drop", drop);
	dropTarget.addEventListener("dragstart", startDrag);
	dropTarget.addEventListener("dragend", endDrag);
	dropTarget.addEventListener("dragenter", setDrop);
	dropTarget.addEventListener("dragover", setDrop);
	
	// événement sur la liste des joueurs 
	dropTarget = document.getElementById("playersList");
	dropTarget.addEventListener("drop", drop);
	dropTarget.addEventListener("dragstart", startDrag);
	dropTarget.addEventListener("dragend", endDrag);
	dropTarget.addEventListener("dragenter", setDrop);
	dropTarget.addEventListener("dragover", setDrop);
	
	// ajout des propriétés ARIA aux éléments de la liste
	var list = document.getElementById("playersList");
	var array = list.getElementsByTagName("li");
	for (var i = 0; i < array.length; i++) {
		array[i].setAttribute("aria-grabbed", "false");
		array[i].setAttribute("tabindex", 0);
		// Entrées clavier
		array[i].addEventListener("keypress", keyPress);
	}
}

function startDrag(event) {
	console.log("Début du glisser-déposer");
	// déplacement: propriétés ARIA
	this.setAttribute("aria-grabbed", "true");
	this.setAttribute('aria-dropeffect', 'move');
	// déplacement: propriété HTML5
	event.dataTransfer.effectAllowed = "move";
	// stockage des données dans l'objet transfert
    event.dataTransfer.setData(
    			"Text", // données de type text 
    			event.target.getAttribute("id")); // source		    
}

function endDrag(event) {
	console.log("Fin du glisser-déposer");
	this.setAttribute("aria-grabbed", "false");
}

function drop(event) {
	console.log("Lâché de l'objet");
	// récupération des données dans l'objet transfert
    var element = event.dataTransfer.getData("Text");
	// ajout de l'élément récupéré dans l'élément destination
    event.target.appendChild(document.getElementById(element));
}

function setDrop(event) {
	event.preventDefault();
}
	
/* Entrée Clavier */
function keyPress(event) {
	if (event.keyCode == 32) { // Espace
		console.log("Espace");
		this.setAttribute("aria-grabbed", "true");
		this.setAttribute('aria-dropeffect', 'move');
		
		var origin = this.parentNode;
		
		var destination = document.getElementById("players");
		
		var item = this.cloneNode(true);
		origin.removeChild(this);
		destination.appendChild(item);
		
		this.setAttribute("aria-grabbed", "false");		
	}
}