1
0
forked from ScoDoc/ScoDoc
ScoDoc/app/static/js/scodoc.js

393 lines
10 KiB
JavaScript

// JS for all ScoDoc pages (using jQuery UI)
$(function () {
// Autocomplete recherche etudiants par nom
$(".in-expnom").autocomplete({
delay: 300, // wait 300ms before suggestions
minLength: 2, // min nb of chars before suggest
position: { collision: "flip" }, // automatic menu position up/down
source: SCO_URL + "search_etud_by_name",
select: function (event, ui) {
$(".in-expnom").val(ui.item.value);
$("#form-chercheetud").submit();
},
});
// Date picker
$(".datepicker").datepicker({
showOn: "button",
buttonImage: "/ScoDoc/static/icons/calendar_img.png",
buttonImageOnly: true,
dateFormat: "dd/mm/yy",
duration: "fast",
firstDay: 1, // Start with Monday
dayNames: [
"Dimanche",
"Lundi",
"Mardi",
"Mercredi",
"Jeudi",
"Vendredi",
"Samedi",
],
dayNamesMin: ["Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa"],
dayNamesShort: ["Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam"],
monthNames: [
"Janvier",
"Février",
"Mars",
"Avril",
"May",
"Juin",
"Juillet",
"Août",
"Septembre",
"Octobre",
"Novembre",
"Décembre",
],
monthNamesShort: [
"Jan",
"Fév",
"Mar",
"Avr",
"Mai",
"Juin",
"Juil",
"Aoû",
"Sep",
"Oct",
"Nov",
"Déc",
],
});
$(".datepicker").datepicker(
"option",
$.extend({ showMonthAfterYear: false }, $.datepicker.regional["fr"])
);
/* Barre menu */
var sco_menu_position = { my: "left top", at: "left bottom" };
$("#sco_menu")
.menu({
position: sco_menu_position,
blur: function () {
$(this).menu("option", "position", sco_menu_position);
},
focus: function (e, ui) {
if ($("#sco_menu").get(0) !== $(ui).get(0).item.parent().get(0)) {
$(this).menu("option", "position", {
my: "left top",
at: "right top",
});
}
},
})
.mouseleave(function (x, y) {
$("#sco_menu").menu("collapseAll");
});
$("#sco_menu > li > a > span").switchClass(
"ui-icon-carat-1-e",
"ui-icon-carat-1-s"
);
/* Les menus isoles dropdown */
$(".sco_dropdown_menu")
.menu({
position: sco_menu_position,
})
.mouseleave(function (x, y) {
$(".sco_dropdown_menu").menu("collapseAll");
});
$(".sco_dropdown_menu > li > a > span").switchClass(
"ui-icon-carat-1-e",
"ui-icon-carat-1-s"
);
/* up-to-date status */
var update_div = document.getElementById("update_warning");
if (update_div) {
fetch("install_info")
.then((response) => response.text())
.then((text) => {
update_div.innerHTML = text;
if (text) {
update_div.style.display = "block";
}
});
}
});
function sco_capitalize(string) {
return string[0].toUpperCase() + string.slice(1).toLowerCase();
}
// Affiche un message transitoire (duration milliseconds, 0 means infinity)
function sco_message(msg, className = "message_custom", duration = 0) {
var div = document.createElement("div");
div.className = className;
div.innerHTML = msg;
document.querySelector("body").appendChild(div);
if (duration) {
setTimeout(() => {
div.remove();
}, duration);
}
}
function sco_error_message(msg) {
sco_message(msg, (className = "message_error"), (duration = 0));
}
function get_query_args() {
var s = window.location.search; // eg "?x=1&y=2"
var vars = {};
s.replace(
/[?&]+([^=&]+)=?([^&]*)?/gi, // regexp
function (m, key, value) {
// callback
vars[key] = value !== undefined ? value : "";
}
);
return vars;
}
// Tables (gen_tables)
$(function () {
if ($("table.gt_table, table.gt_table_searchable").length > 0) {
var table_options = {
paging: false,
searching: false,
info: false,
/* "autoWidth" : false, */
fixedHeader: {
header: true,
footer: true,
},
orderCellsTop: true, // cellules ligne 1 pour tri
aaSorting: [], // Prevent initial sorting
order: "",
drawCallback: function (settings) {
// permet de conserver l'ordre de tri des colonnes
let currentTable = $(settings.nTable);
let order_info_key = get_table_order_info_key(currentTable.attr("id"));
let dataTableInstance = $(currentTable).DataTable();
let order_info = JSON.stringify(dataTableInstance.order());
localStorage.setItem(order_info_key, order_info);
},
};
$('.gt_table').each(function() {
const x = localStorage.getItem(get_table_order_info_key(this.id));
if (x) {
try {
let order_info = JSON.parse(x);
console.log("set order=" + order_info);
table_options.order = order_info;
} catch (error) {
console.error(error);
delete table_options.order;
}
} else {
delete table_options.order;
}
$(this).DataTable(table_options);
});
table_options["searching"] = true;
$("table.gt_table_searchable").each(function() {
$(this).DataTable(table_options);
});
}
});
function get_table_order_info_key(table_id) {
const url = new URL(document.URL);
return JSON.stringify(["table_order", table_id, url.pathname]);
}
// Show tags (readonly)
function readOnlyTags(nodes) {
// nodes are textareas, hide them and create a span showing tags
for (var i = 0; i < nodes.length; i++) {
var node = $(nodes[i]);
node.hide();
var tags = nodes[i].value.split(",");
node.after(
'<span class="ro_tags"><span class="ro_tag">' +
tags.join('</span><span class="ro_tag">') +
"</span></span>"
);
}
}
/* Editeur pour champs
* Usage: créer un élément avec data-oid (object id)
* La méthode d'URL save sera appelée en POST avec deux arguments: oid et value,
* value contenant la valeur du champs.
* Inspiré par les codes et conseils de Seb. L.
*/
class ScoFieldEditor {
constructor(selector, save_url, read_only) {
this.save_url = save_url;
this.read_only = read_only;
this.selector = selector;
this.installListeners();
}
// Enregistre l'élément obj
save(obj) {
var value = obj.innerText.trim();
if (value.length == 0) {
value = "";
}
if (value == obj.dataset.value) {
return true; // Aucune modification, pas d'enregistrement mais on continue normalement
}
obj.classList.add("sco_wait");
// DEBUG
// console.log(`
// data : ${value},
// id: ${obj.dataset.oid}
// `);
$.post(
this.save_url,
{
oid: obj.dataset.oid,
value: value,
},
function (result) {
obj.classList.remove("sco_wait");
obj.classList.add("sco_modified");
}
);
return true;
}
/*****************************/
/* Gestion des évènements */
/*****************************/
installListeners() {
if (this.read_only) {
return;
}
document.body.addEventListener("keydown", this.key);
let editor = this;
this.handleSelectCell = (event) => {
editor.selectCell(event);
};
this.handleModifCell = (event) => {
editor.modifCell(event);
};
this.handleBlur = (event) => {
editor.blurCell(event);
};
this.handleKeyCell = (event) => {
editor.keyCell(event);
};
document.querySelectorAll(this.selector).forEach((cellule) => {
cellule.addEventListener("click", this.handleSelectCell);
cellule.addEventListener("dblclick", this.handleModifCell);
cellule.addEventListener("blur", this.handleBlur);
});
}
/*********************************/
/* Interaction avec les cellules */
/*********************************/
blurCell(event) {
let currentModif = document.querySelector(".sco_modifying");
if (currentModif) {
if (!this.save(currentModif)) {
return;
}
}
}
selectCell(event) {
let obj = event.currentTarget;
if (obj) {
if (obj.classList.contains("sco_modifying")) {
return; // Cellule en cours de modification, ne pas sélectionner.
}
let currentModif = document.querySelector(".sco_modifying");
if (currentModif) {
if (!this.save(currentModif)) {
return;
}
}
this.unselectCell();
obj.classList.add("sco_selected");
}
}
unselectCell() {
document
.querySelectorAll(".sco_selected, .sco_modifying")
.forEach((cellule) => {
cellule.classList.remove("sco_selected", "sco_modifying");
cellule.removeAttribute("contentEditable");
cellule.removeEventListener("keydown", this.handleKeyCell);
});
}
modifCell(event) {
let obj = event.currentTarget;
if (obj) {
obj.classList.add("sco_modifying");
obj.contentEditable = true;
obj.addEventListener("keydown", this.handleKeyCell);
obj.focus();
}
}
key(event) {
switch (event.key) {
case "Enter":
this.modifCell(document.querySelector(".sco_selected"));
event.preventDefault();
break;
}
}
keyCell(event) {
let obj = event.currentTarget;
if (obj) {
if (event.key == "Enter") {
event.preventDefault();
event.stopPropagation();
if (!this.save(obj)) {
return;
}
obj.classList.remove("sco_modifying");
// ArrowMove(0, 1);
// modifCell(document.querySelector(".sco_selected"));
this.unselectCell();
}
}
}
}
function getCurrentScriptPath() {
// Get all the script elements on the page
var scripts = document.getElementsByTagName("script");
// Find the last script element (which is the currently executing script)
var currentScript = scripts[scripts.length - 1];
// Retrieve the src attribute of the script element
var scriptPath = currentScript.src;
return scriptPath;
}
function removeLastTwoComponents(path) {
// Split the path into individual components
var components = path.split("/");
// Remove the last two components (filename and enclosing directory)
components.splice(-2);
// Join the remaining components back into a path
var newPath = components.join("/");
return newPath;
}