From c75965fdfdb9a770cb7a5252e73b2dafc7dc04f0 Mon Sep 17 00:00:00 2001
From: lehmann <sebastien.lehmann@uha.fr>
Date: Tue, 6 Sep 2022 01:01:01 +0200
Subject: [PATCH] Partition editor : bug add + improve UX

---
 app/static/css/partition_editor.css        | 13 +++++++++++-
 app/templates/scolar/partition_editor.html | 23 +++++++++++++++-------
 2 files changed, 28 insertions(+), 8 deletions(-)

diff --git a/app/static/css/partition_editor.css b/app/static/css/partition_editor.css
index 61e872e0..b0b89fef 100644
--- a/app/static/css/partition_editor.css
+++ b/app/static/css/partition_editor.css
@@ -43,6 +43,7 @@
 	padding: 8px 32px 8px 8px;
 	margin-bottom: 16px;
 	display: inline-block;
+	cursor: pointer;
 }
 
 main {
@@ -69,7 +70,17 @@ body:not(.editionActivated) .editing {
 
 .editionActivated #zoneChoix .etudiants>div {
 	pointer-events: none;
-	opacity: 0.5;
+	opacity: 0.2;
+}
+
+.highlight {
+	animation: boing 0.12s alternate;
+	animation-iteration-count: 4;
+	display: inline-block;
+}
+
+@keyframes boing {
+	100% {transform: translateY(-20px)}
 }
 
 /****************/
diff --git a/app/templates/scolar/partition_editor.html b/app/templates/scolar/partition_editor.html
index 4e641e78..6faf8409 100644
--- a/app/templates/scolar/partition_editor.html
+++ b/app/templates/scolar/partition_editor.html
@@ -182,14 +182,23 @@
 	/******************************/
 	/* Gestionnaire d'événements  */
 	/******************************/
-	function input() {
-		document.querySelector("body").classList.toggle("editionActivated");
+	function setEditMode() {
+		let editing = document.querySelector("[contentEditable=true]");
+		if (!editing) {
+			document.querySelector("body").classList.toggle("editionActivated");
+			return;
+		} 
+		this.checked = true;
+		if(!editing.classList.contains("highlight")) {
+			editing.classList.add("highlight");
+			setTimeout(()=>{editing.classList.remove("highlight")}, 1000);
+		}
 	}
 	function processEvents() {
 		/*--------------------*/
 		/* Edition partitions */
 		/*--------------------*/
-		document.querySelector(".edition>input").addEventListener("input", input);
+		document.querySelector(".edition>input").addEventListener("input", setEditMode);
 		document.querySelectorAll(".ajoutPartition, .ajoutGroupe").forEach(btnPlus => { btnPlus.addEventListener("click", addPartition) })
 		document.querySelectorAll(".modif").forEach(btn => { btn.addEventListener("click", editText) })
 		document.querySelectorAll(".suppr").forEach(btn => { btn.addEventListener("click", suppr) })
@@ -399,7 +408,7 @@
 					// Ajout de la zone pour chaque étudiant
 					let outputGroupes = "";
 
-					document.querySelectorAll(`#zonePartitions .grpPartitions`).forEach(e => {
+					document.querySelectorAll("#zoneChoix .grpPartitions").forEach(e => {
 						let etudid = e.previousElementSibling.dataset.etudid;
 
 						// Préparation pour la section suivante
@@ -469,7 +478,7 @@
 		// On sélectionne la zone
 		const range = document.createRange();
 		const selection = window.getSelection();
-		selection.removeAllRanges();  
+		selection.removeAllRanges();
 		range.selectNodeContents(e);
 		selection.addRange(range);
 	}
@@ -629,7 +638,7 @@
 		})
 
 		// Save positions
-		if (this.dataset.idpartition) {
+		if (this.parentElement.parentElement.parentElement.className == "partitions") {
 			let params = (new URL(document.location)).searchParams;
 			let formsemestre_id = params.get('formsemestre_id');
 			var url = `/ScoDoc/{{formsemestre.departement.acronym}}/api/formsemestre/${formsemestre_id}/partitions/order`;
@@ -639,7 +648,7 @@
 					parent.append(parent.querySelector(`[data-idpartition="${position}"]`))
 				})
 			})
-			document.querySelectorAll(`#zonePartitions .grpPartitions`).forEach(parent => {
+			document.querySelectorAll(`#zoneChoix .grpPartitions`).forEach(parent => {
 				positions.forEach(position => {
 					parent.append(parent.querySelector(`[data-idpartition="${position}"]`))
 				})