ScoDocMM/app/static/js/groupmgr.js

450 lines
15 KiB
JavaScript
Raw Normal View History

2020-09-26 16:19:37 +02:00
/* -*- mode: javascript -*-
*
* ScoDoc: Affectation des groupes de TD
* re-ecriture utilisant jQuery de l'ancien code
*/
/* --- Globals ---- */
2021-06-21 18:46:35 +02:00
var EtudColors = ["#E8EEF7", "#ffffff"]; // [ "#E8EEF7", "#E0ECFF", "#E5E6BE", "#F3EAE2", "#E3EAE1" ];
2020-09-26 16:19:37 +02:00
var EtudColorsIdx = 0;
var NbEtuds = 0;
var ETUDS = new Object(); // { etudid : etud }
var ETUD_GROUP = new Object(); // { etudid : group_id }
var groups_unsaved = false;
var groups = new Object(); // Liste des groupes
function loadGroupes() {
$("#gmsg")[0].innerHTML = 'Chargement des groupes en cours...';
var partition_id = document.formGroup.partition_id.value;
$.get(SCO_URL + '/XMLgetGroupsInPartition', { partition_id: partition_id })
2020-09-26 16:19:37 +02:00
.done(
2021-06-21 18:46:35 +02:00
function (data) {
var nodes = data.getElementsByTagName('group');
if (nodes) {
var nbgroups = nodes.length;
// put last group at first (etudiants sans groupes)
if (nodes.length > 1 && nodes[nbgroups - 1].attributes.getNamedItem("group_id").value == '_none_') {
populateGroup(nodes[nodes.length - 1]);
nbgroups -= 1;
}
// then standard groups
for (var i = 0; i < nbgroups; i++) {
populateGroup(nodes[i]);
}
}
$("#gmsg")[0].innerHTML = '';
updateginfo();
}
2020-09-26 16:19:37 +02:00
)
}
2021-06-21 18:46:35 +02:00
function populateGroup(node) {
2020-09-26 16:19:37 +02:00
var group_id = node.attributes.getNamedItem("group_id").value;
2021-06-21 18:46:35 +02:00
var group_name = node.attributes.getNamedItem("group_name").value;
2020-09-26 16:19:37 +02:00
// CREE LA BOITE POUR CE GROUPE
if (group_id) {
2021-06-21 18:46:35 +02:00
var gbox = new CGroupBox(group_id, group_name);
2020-09-26 16:19:37 +02:00
var etuds = node.getElementsByTagName('etud');
2021-06-21 18:46:35 +02:00
var x = '';
2020-09-26 16:19:37 +02:00
gbox.sorting = false; // disable to speedup
EtudColorsIdx = 0; // repart de la premiere couleur
2021-06-21 18:46:35 +02:00
for (var j = 0; j < etuds.length; j++) {
2020-09-26 16:19:37 +02:00
var nom = etuds[j].attributes.getNamedItem("nom").value;
var prenom = etuds[j].attributes.getNamedItem("prenom").value;
var sexe = etuds[j].attributes.getNamedItem("sexe").value;
var etudid = etuds[j].attributes.getNamedItem("etudid").value;
var origin = etuds[j].attributes.getNamedItem("origin").value;
2021-06-21 18:46:35 +02:00
var etud = new CDraggableEtud(nom, prenom, sexe, origin, etudid);
2020-09-26 16:19:37 +02:00
gbox.createEtudInGroup(etud, group_id);
}
gbox.sorting = true;
gbox.updateTitle(); // sort
}
}
/* --- Boite pour un groupe --- */
var groupBoxes = new Object(); // assoc group_id : groupBox
var groupsToDelete = new Object(); // list of group_id to be supressed
2021-06-21 18:46:35 +02:00
var CGroupBox = function (group_id, group_name) {
2020-09-26 16:19:37 +02:00
group_id = $.trim(group_id);
var regex = /^\w+$/;
2021-06-21 18:46:35 +02:00
if (!regex.test(group_id)) {
2020-09-26 16:19:37 +02:00
alert("Id de groupe invalide");
return;
}
2021-06-21 18:46:35 +02:00
if (group_id in groups) {
2020-09-26 16:19:37 +02:00
alert("Le groupe " + group_id + " existe déjà !");
return;
}
groups[group_id] = 1;
this.group_id = group_id;
this.group_name = group_name;
this.etuds = new Object();
this.nbetuds = 0;
this.isNew = false; // true for newly user-created groups
this.sorting = true; // false to disable sorting
2021-06-21 18:46:35 +02:00
2020-09-26 16:19:37 +02:00
this.groupBox = document.createElement("div");
this.groupBox.className = "simpleDropPanel";
this.groupBox.id = group_id;
var titleDiv = document.createElement("div");
titleDiv.className = "groupTitle0";
titleDiv.appendChild(this.groupTitle());
this.groupBox.appendChild(titleDiv);
var gdiv = document.getElementById('groups');
gdiv.appendChild(this.groupBox);
this.updateTitle();
$(this.groupBox).droppable(
{
2021-06-21 18:46:35 +02:00
accept: ".box",
2020-09-26 16:19:37 +02:00
activeClass: "activatedPanel",
2021-06-21 18:46:35 +02:00
drop: function (event, ui) {
2020-09-26 16:19:37 +02:00
// alert("drop on " + this.group_name);
var etudid = ui.draggable[0].id;
var etud = ETUDS[etudid];
2021-06-21 18:46:35 +02:00
var newGroupName = this.id;
2020-09-26 16:19:37 +02:00
var oldGroupName = ETUD_GROUP[etudid];
$(groupBoxes[newGroupName].groupBox).append(ui.draggable)
ui.draggable[0].style.left = ""; // fix style (?)
ui.draggable[0].style.top = "";
etud.changeGroup(oldGroupName, newGroupName);
etud.htmlElement.style.fontStyle = 'italic'; // italic pour les etudiants deplaces
}
});
/* On peut s'amuser a deplacer tout un groupe (visuellement: pas droppable) */
2021-06-21 18:46:35 +02:00
$(this.groupBox).draggable({
2020-09-26 16:19:37 +02:00
cursor: 'move',
containment: '#groups'
});
groupBoxes[group_id] = this; // register
updateginfo();
}
$.extend(CGroupBox.prototype, {
// menu for group title
2021-06-21 18:46:35 +02:00
groupTitle: function () {
2020-09-26 16:19:37 +02:00
var menuSpan = document.createElement("span");
menuSpan.className = "barrenav";
var h = "<table><tr><td><ul class=\"nav\"><li onmouseover=\"MenuDisplay(this)\" onmouseout=\"MenuHide(this)\"><a href=\"#\" class=\"menu custommenu\"><span id=\"titleSpan" + this.group_id + "\" class=\"groupTitle\">menu</span></a><ul>";
if (this.group_id != '_none_') {
2021-06-21 18:46:35 +02:00
h += "<li><a href=\"#\" onClick=\"suppressGroup('" + this.group_id + "');\">Supprimer</a></li>";
h += "<li><a href=\"#\" onClick=\"renameGroup('" + this.group_id + "');\">Renommer</a></li>";
2020-09-26 16:19:37 +02:00
}
h += "</ul></li></ul></td></tr></table>";
menuSpan.innerHTML = h;
return menuSpan;
},
// add etud to group, attach to DOM
2021-06-21 18:46:35 +02:00
createEtudInGroup: function (etud) {
2020-09-26 16:19:37 +02:00
this.addEtudToGroup(etud);
this.groupBox.appendChild(etud.htmlElement);
},
// add existing etud to group (does not affect DOM)
2021-06-21 18:46:35 +02:00
addEtudToGroup: function (etud) {
2020-09-26 16:19:37 +02:00
etud.group_id = this.group_id;
this.etuds[etud.etudid] = etud;
this.nbetuds++;
ETUD_GROUP[etud.etudid] = this.group_id;
this.updateTitle();
},
// remove etud
2021-06-21 18:46:35 +02:00
removeEtud: function (etud) {
2020-09-26 16:19:37 +02:00
delete this.etuds[etud.etudid];
this.nbetuds--;
this.updateTitle();
},
// Update counter display
2021-06-21 18:46:35 +02:00
updateTitle: function () {
2020-09-26 16:19:37 +02:00
var tclass = '';
if (this.isNew) {
tclass = ' class="newgroup"'
}
2021-06-21 18:46:35 +02:00
var titleSpan = document.getElementById('titleSpan' + this.group_id);
if (this.group_id != '_none_')
titleSpan.innerHTML = '<span' + tclass + '>Groupe ' + this.group_name + ' (' + this.nbetuds + ')</span>';
2020-09-26 16:19:37 +02:00
else
2021-06-21 18:46:35 +02:00
titleSpan.innerHTML = '<span' + tclass + '>Etudiants sans groupe' + ' (' + this.nbetuds + ')</span>';
2020-09-26 16:19:37 +02:00
this.sortList(); // maintient toujours la liste triee
},
// Tri de la boite par nom
2021-06-21 18:46:35 +02:00
sortList: function () {
if (!this.sorting)
2020-09-26 16:19:37 +02:00
return;
var newRows = new Array();
2021-06-21 18:46:35 +02:00
for (var i = 1; i < this.groupBox.childNodes.length; i++) { // 1 car div titre
newRows[i - 1] = this.groupBox.childNodes[i];
2020-09-26 16:19:37 +02:00
}
2021-06-21 18:46:35 +02:00
var sortfn = function (a, b) {
2020-09-26 16:19:37 +02:00
// recupere les noms qui sont dans un span
var nom_a = a.childNodes[1].childNodes[0].nodeValue;
var nom_b = b.childNodes[1].childNodes[0].nodeValue;
// console.log( 'comp( %s, %s )', nom_a, nom_b );
2021-06-21 18:46:35 +02:00
if (nom_a == nom_b)
2020-09-26 16:19:37 +02:00
return 0;
2021-06-21 18:46:35 +02:00
if (nom_a < nom_b)
2020-09-26 16:19:37 +02:00
return -1;
return 1;
};
2021-06-21 18:46:35 +02:00
newRows.sort(sortfn);
for (var i = 0; i < newRows.length; i++) {
2020-09-26 16:19:37 +02:00
this.groupBox.appendChild(newRows[i]);
newRows[i].style.backgroundColor = EtudColors[EtudColorsIdx];
EtudColorsIdx = (EtudColorsIdx + 1) % EtudColors.length;
}
}
});
2021-06-21 18:46:35 +02:00
function suppressGroup(group_id) {
2020-09-26 16:19:37 +02:00
// 1- associate all members to group _none_
if (!groupBoxes['_none_']) {
// create group _none_
2021-06-21 18:46:35 +02:00
var gbox = new CGroupBox('_none_', 'Etudiants sans groupe');
2020-09-26 16:19:37 +02:00
}
var dst_group_id = groupBoxes['_none_'].group_id;
var src_box_etuds = groupBoxes[group_id].etuds;
for (var etudid in src_box_etuds) {
var etud = src_box_etuds[etudid];
etud.changeGroup(group_id, dst_group_id);
groupBoxes['_none_'].groupBox.appendChild(etud.htmlElement);
}
groupBoxes['_none_'].updateTitle();
// 2- add group to list of groups to be removed (unless it's a new group)
if (!groupBoxes[group_id].isNew)
groupsToDelete[group_id] = true;
// 3- delete objects and remove from DOM
var div = document.getElementById(group_id);
div.remove();
delete groupBoxes[group_id];
groups_unsaved = true;
updateginfo();
}
2021-06-21 18:46:35 +02:00
function renameGroup(group_id) {
2020-09-26 16:19:37 +02:00
// 1-- save modifications
if (groups_unsaved) {
2021-06-21 18:46:35 +02:00
alert("Enregistrez ou annulez vos changement avant !");
2020-09-26 16:19:37 +02:00
} else {
2021-06-21 18:46:35 +02:00
// 2- form rename
document.location = 'group_rename?group_id=' + group_id;
2020-09-26 16:19:37 +02:00
}
}
var createdGroupId = 0;
function newGroupId() {
var gid;
do {
gid = 'NG' + createdGroupId.toString();
createdGroupId += 1;
} while (gid in groupBoxes);
return gid;
}
// Creation d'un groupe
function createGroup() {
var group_name = document.formGroup.groupName.value.trim();
if (!group_name) {
alert("Nom de groupe vide !");
return false;
}
if (group_name.length >= 32) { // SHORT_STR_LEN
alert("Nom de groupe trop long !");
return false;
}
2020-09-26 16:19:37 +02:00
// check name:
2021-06-21 18:46:35 +02:00
for (var group_id in groupBoxes) {
2020-09-26 16:19:37 +02:00
if (group_id != 'extend') {
if (groupBoxes[group_id].group_name == group_name) {
2021-06-21 18:46:35 +02:00
alert("Nom de groupe déja existant !");
return false;
2020-09-26 16:19:37 +02:00
}
}
}
var group_id = newGroupId();
groups_unsaved = true;
2021-06-21 18:46:35 +02:00
var gbox = new CGroupBox(group_id, group_name);
2020-09-26 16:19:37 +02:00
gbox.isNew = true;
gbox.updateTitle();
return true;
}
/* --- Etudiant draggable --- */
2021-06-21 18:46:35 +02:00
var CDraggableEtud = function (nom, prenom, sexe, origin, etudid) {
this.type = 'Custom';
this.name = etudid;
2020-09-26 16:19:37 +02:00
this.etudid = etudid;
this.nom = nom;
this.prenom = prenom;
this.sexe = sexe;
this.origin = origin;
this.createNode();
ETUDS[etudid] = this;
2021-06-21 18:46:35 +02:00
NbEtuds++;
2020-09-26 16:19:37 +02:00
}
$.extend(CDraggableEtud.prototype, {
2021-06-21 18:46:35 +02:00
repr: function () {
return this.sexe + ' ' + this.prenom + ' <span class="nom">' + this.nom + '</span> ' + '<b>' + this.origin + '</b>';
2020-09-26 16:19:37 +02:00
},
2021-06-21 18:46:35 +02:00
createNode: function () {
2020-09-26 16:19:37 +02:00
// Create DOM element for student
var e = document.createElement("div");
this.htmlElement = e;
e.className = "box";
e.id = this.etudid;
// e.style.backgroundColor = EtudColors[EtudColorsIdx];
// EtudColorsIdx = (EtudColorsIdx + 1) % EtudColors.length;
//var txtNode = document.createTextNode( this.repr() );
//e.appendChild(txtNode);
e.innerHTML = this.repr();
// declare as draggable
2021-06-21 18:46:35 +02:00
$(e).draggable({
2020-09-26 16:19:37 +02:00
cursor: 'move',
stack: '#groups div',
containment: '#groups',
revert: 'invalid'
});
},
2021-06-21 18:46:35 +02:00
endDrag: function () {
2020-09-26 16:19:37 +02:00
var el = this.htmlElement;
var p = el.parentNode;
// alert("endDrag: [" + this.name +"] " + p.id );
2021-06-21 18:46:35 +02:00
this.changeGroup(this.group_id, p.id);
2020-09-26 16:19:37 +02:00
this.htmlElement.style.fontStyle = 'italic'; // italic pour les etudiants deplaces
},
// Move a student from a group to another
2021-06-21 18:46:35 +02:00
changeGroup: function (oldGroupName, newGroupName) {
if (oldGroupName == newGroupName) {
// drop on original group, just sort
groupBoxes[oldGroupName].updateTitle();
return;
2020-09-26 16:19:37 +02:00
}
var oldGroupBox = null;
if (oldGroupName) {
2021-06-21 18:46:35 +02:00
oldGroupBox = groupBoxes[oldGroupName];
2020-09-26 16:19:37 +02:00
}
var newGroupBox = groupBoxes[newGroupName];
newGroupBox.addEtudToGroup(this);
if (oldGroupBox)
2021-06-21 18:46:35 +02:00
oldGroupBox.removeEtud(this);
2020-09-26 16:19:37 +02:00
groups_unsaved = true;
updatesavedinfo();
}
2021-06-21 18:46:35 +02:00
});
2020-09-26 16:19:37 +02:00
/* --- Upload du resultat --- */
function processResponse(value) {
location.reload(); // necessaire pour reinitialiser les id des groupes créés
}
2021-06-21 18:46:35 +02:00
function handleError(msg) {
alert('Error: ' + msg);
console.log('Error: ' + msg);
2020-09-26 16:19:37 +02:00
}
function submitGroups() {
2021-06-21 18:46:35 +02:00
var url = SCO_URL + '/setGroups';
2020-09-26 16:19:37 +02:00
// build post request body: groupname \n etudid; ...
var groupsLists = '';
2021-06-21 18:46:35 +02:00
var groupsToCreate = '';
for (var group_id in groupBoxes) {
2020-09-26 16:19:37 +02:00
if (group_id != 'extend') { // je ne sais pas ce dont il s'agit ???
if (group_id != '_none_') { // ne renvoie pas le groupe des sans-groupes
2021-06-21 18:46:35 +02:00
groupBox = groupBoxes[group_id];
if (groupBox.isNew) {
groupsToCreate += groupBox.group_name + ';';
for (var etudid in groupBox.etuds) {
if (etudid != 'extend')
groupsToCreate += etudid + ';';
}
groupsToCreate += '\n';
groupBox.isNew = false; // is no more new !
} else {
groupsLists += group_id + ';';
for (var etudid in groupBox.etuds) {
if (etudid != 'extend')
groupsLists += etudid + ';';
}
groupsLists += '\n';
}
2020-09-26 16:19:37 +02:00
}
}
}
var todel = '';
for (var group_id in groupsToDelete) {
2021-06-21 18:46:35 +02:00
todel += group_id + ';';
2020-09-26 16:19:37 +02:00
}
groupsToDelete = new Object(); // empty
var partition_id = document.formGroup.partition_id.value;
// Send to server
2021-06-21 18:46:35 +02:00
$.get(url, {
groupsLists: groupsLists, // encodeURIComponent
partition_id: partition_id,
groupsToDelete: todel,
groupsToCreate: groupsToCreate
})
.done(function (data) {
processResponse(data);
2020-09-26 16:19:37 +02:00
})
2021-06-21 18:46:35 +02:00
.fail(function () {
2020-09-26 16:19:37 +02:00
handleError("Erreur lors de l'enregistrement de groupes");
});
2021-06-21 18:46:35 +02:00
}
2020-09-26 16:19:37 +02:00
// Move to another partition (specified by menu)
function GotoAnother() {
if (groups_unsaved) {
alert("Enregistrez ou annulez vos changement avant !");
} else
document.location = SCO_URL + '/affect_groups?partition_id=' + document.formGroup.other_partition_id.value;
2020-09-26 16:19:37 +02:00
}
// Boite information haut de page
function updateginfo() {
var g = document.getElementById('ginfo');
var group_names = new Array();
for (var group_id in groupBoxes) {
2021-06-21 18:46:35 +02:00
if ((group_id != 'extend') && (groupBoxes[group_id].group_name)) {
2020-09-26 16:19:37 +02:00
group_names.push(groupBoxes[group_id].group_name);
}
}
g.innerHTML = '<b>Groupes définis: ' + group_names.join(', ') + '<br/>'
+ "Nombre d'etudiants: " + NbEtuds + '</b>';
2021-06-21 18:46:35 +02:00
2020-09-26 16:19:37 +02:00
updatesavedinfo();
}
// Boite indiquant si modifications non enregistrees ou non
function updatesavedinfo() {
var g = document.getElementById('savedinfo');
if (groups_unsaved) {
g.innerHTML = 'modifications non enregistrées';
2021-06-21 18:46:35 +02:00
g.style.visibility = 'visible';
2020-09-26 16:19:37 +02:00
} else {
g.innerHTML = '';
2021-06-21 18:46:35 +02:00
g.style.visibility = 'hidden';
2020-09-26 16:19:37 +02:00
}
return true;
}
2021-06-21 18:46:35 +02:00
$(function () {
2020-09-26 16:19:37 +02:00
loadGroupes();
});
/* debug:
var g = new CGroupBox('G0', 'Toto');
*/