// Création de l'objet Relations

var annuaire = new Relations();

// Premier exemple : Coloriage

var tableDessin = d3.select("#dessin tbody");

var i = 0, j = 0, ligs = 1;

function focus(objet) {

	objet.style("opacity", 0.5);

}

function blur(objet) {

	objet.style("opacity", 1);

}

var cell = null, ligne = tableDessin.select("tr");

function ajouterCouleur(couleur) {

	if (i==ligs) {

		if (j==0) {

			ligne = tableDessin.append("tr");

		}

		cell = ligne.append("td");

		if (++j==ligs) {

			j = 0;

			i = 0;

			++ligs;

		}

	}

	else {

		tableDessin.selectAll("tr").each(function(d, index) {

			if (index==i) {

				cell = d3.select(this).append("td");

			}

		});

		++i;

	}

	cell.style("background-color", couleur);

	// on ajoute des actions en plus sur les boutons de couleur 

	annuaire.add("cellule" + (ligs*ligs + i + j), cell)

		.bindTo("mouseover", "bouton."+couleur, focus)

		.bindTo("mouseout", "bouton."+couleur, blur);

	//console.log("i : "+i+"; j : "+j+"; ligs : "+ligs);

}

// on enregistre les boutons de couleurs avec des actions pour ajouter une case

// de couleur au tableau

annuaire.add("bouton.red", d3.select("#couleurs .rouge"))

	.click(function() { ajouterCouleur("red"); });

annuaire.add("bouton.green", d3.select("#couleurs .vert"))

	.click(function() { ajouterCouleur("green"); });

annuaire.add("bouton.blue", d3.select("#couleurs .bleu"))

	.click(function() { ajouterCouleur("blue"); });

// Deuxième exemple : Piano

// fonction pour colorier les touches

function toucheAppuyee(touche) {

	if (touche.classed("enfonce")) {

		touche.classed("enfonce", false);

	}

	else {

		touche.classed("enfonce", true);

	}

}

// On enregistre les touches du piano (li) et on leur associe sur elles-mêmes

// une action

d3.selectAll("#piano li").each(function(datum, index) {

	var item = d3.select(this);

	annuaire.add("touche" + (index + 1), item).click(toucheAppuyee);

});

// On conditionne un bouton reset pour remettre en blanc toutes

// les touches grâce à la méthode each

var message = "";

function resetBouton(objet, details) {

	if (objet.classed("enfonce")) {

		objet.classed("enfonce", false);

		if (""!=message) {

			message+= ",";

		}

		message+= details[1];

	}

}

// On parcourt par une boucle each toutes les touches du piano

annuaire.add("bouton.reset", d3.select("#piano button"))

	.click(function() {

		message = "";

		annuaire.each("touche[[digit]]", resetBouton, true);

		alert("les touches "+message+ " ont été relevées");

	});