${moyenneGenerale}
${totalGrades }
${Object.keys(this.semesters).length}
${moduleStats.validated}/${moduleStats.total}
${this.lang == "fr" ? "NOUVELLE MISE À JOUR DU TABLEAU DE BORD DISPONIBLE ! v" + this.scriptVersion + " → v"+this.scriptGitVersion.join(".") : "NEW DASHBOARD UPDATE AVAILABLE! v" + this.scriptVersion + " → v"+this.scriptGitVersion.join(".")}
${this.lang == "fr" ? "Ignorer" : "Ignore"}
OFFLINE
` : ""}
✅
-
0 ? " show" : ""}">
`;
const notifContainer = document.createElement("div");
notifContainer.className = "selected-card-notif-container";
const intranetFold = document.querySelector(".intranet-fold");
if (intranetFold) {
intranetFold.parentNode.insertBefore(this.ecamDash, intranetFold);
}
else {
Object.values(document.body.children).forEach(child => {child.remove()});
document.body.appendChild(this.ecamDash);
}
this.ecamDash.insertBefore(notifContainer, this.ecamDash.querySelector("#dash-header"));
// Create the new grades notification and its associated new grades table if at least one new grade is detected
this.createNewGradesNotifDiv();
if (this.error) {
setTimeout(() => {
const offlineTitle = document.querySelector(".offline-mode-title");
const offlineSubTitle = document.querySelector(".offline-mode-subtitle");
offlineTitle.classList.add("show");
offlineSubTitle.classList.add("show");
}, 1)
}
this.generateContent({manageIndividualSubjectCardFolding: false, fadeIn:false});
}
//MARK: language Sensitive
async languageSensitiveContent(fadeIn=true) {
// Language Sensitive text in the Dashboard Header and Semester filter tab (which don't refresh on calling the generateContent() method)
if (this.error) {
const offlineTitle = document.querySelector(".offline-mode-title");
const offlineSubTitle = document.querySelector(".offline-mode-subtitle");
offlineSubTitle.innerHTML = this.lang == "fr"
? `Les serveurs de l'ECAM sont actuellement inaccessibles ! ${!this.firstLoad
? `Pour l'instant, tu ne peux pas voir si tu as des nouvelles notes... En attendant, voici le tableau de bord en mode offline, tu as donc accès aux notes que j'ai gentiment sauvegardées dans le cache la dernière fois ! De rien ! <3`
: "Pour l'instant, tu ne peux pas voir tes notes... Tu peux quand même commencer à configurer tes modules, et reviens quand les serveurs sont de nouveau opérationnels pour voir tes notes !"
}`
: `ECAM's servers are currently down! ${!this.firstLoad
? `For now, you can't see if you have new grades... While waiting for the servers to be back up, here are the grades I nicely saved in your cache last time, so you can still see them even with the server down! You're welcome! <3`
: "For now, you can't see your grades... You can still start by configuring your modules, and come back once the servers are up again to see your grades!"
}`
;
}
const dashTitle = document.querySelector(".dash-title-text");
const dashPatchNotesLink = document.querySelector(".patch-notes-link");
const dashSubtitle = document.querySelector(".dash-subtitle");
dashTitle.innerHTML = this.lang == "fr" ? 'Tableau de Bord des Notes ECAM' : "ECAM Grades Dashboard";
dashPatchNotesLink.title = this.lang == "fr" ? "Aller voir les notes de cette mise à jour" : "Go see this update's notes";
dashSubtitle.innerHTML = this.lang == "fr" ? 'Vue complète de vos résultats académiques !' : "Complete view of your academic results!";
const infoNotif = document.querySelector(".temp-notif");
if (infoNotif) {
infoNotif.classList.toggle("fr");
infoNotif.classList.toggle("en");
}
const frBtn = document.querySelectorAll("#fr-lang-btn");
const enBtn = document.querySelectorAll("#en-lang-btn");
frBtn.title = this.lang == "fr" ? "Maj+L" : "Shift+L";
enBtn.title = this.lang == "fr" ? "Maj+L" : "Shift+L";
const reportIssueBtn = document.querySelector(".issue.issue-btn");
const mailInfo = document.querySelector(".issue.mail-info");
const mailInfoText = document.querySelector(".over-header-btn-mail-info-text");
const mailInfoCopied = document.querySelector(".over-header-btn-copied-cue");
const shareConfig = document.querySelector(".issue.share-config");
const suggestIdea = document.querySelector(".issue.suggest-idea");
const reportIssue = document.querySelector(".issue.report-issue");
const helpMenu = document.querySelector(".over-header-btn.how-to-use-btn");
const docBtn = document.querySelector(".over-header-btn.doc-btn");
// const tutoBtn = document.querySelector(".over-header-btn.tuto-btn");
const keybindsBtn = document.querySelector(".over-header-btn.keybinds-btn");
const settingsBtn = document.querySelector(".over-header-btn.settings-btn");
const newUserNotif = document.querySelector(".new-user-notif");
const newUserNotifText = document.querySelector(".new-user-notif-text");
if (this.lang == "fr") {
reportIssueBtn .title = "Signaler...";
mailInfo .title = "Clique pour copier mon adresse email !";
shareConfig .title = "Partage une configuration sur mon GitHub";
suggestIdea .title = "Suggère une idée sur mon GitHub";
reportIssue .title = "Signale un problème sur mon GitHub";
helpMenu .title = "Comment s'en servir?";
docBtn .title = "Aller vers la documentation";
// tutoBtn .title = "Démarrer le tutoriel";
keybindsBtn .title = "Voir les raccourcis clavier";
settingsBtn .title = "Ouvrir les paramètres";
if (((newUserNotif?.style?.display || "none" == "none")?.toString() || "true") == "false") newUserNotif.title = "Clique pour fermer";
shareConfig .innerHTML = `Partager une config ${this.createExternalLinkSymbol({margin: [0,0,0,4]})}`;
suggestIdea .innerHTML = `Suggérer une idée ${this.createExternalLinkSymbol({margin: [0,0,0,4]})}`;
reportIssue .innerHTML = `Signaler un problème ${this.createExternalLinkSymbol({margin: [0,0,0,4]})}`;
mailInfoText .innerHTML = "Par mail: baptiste.jacquin@ecam.fr 📋";
mailInfoCopied .innerHTML = "Copié !";
if (((newUserNotif?.style?.display || "none" == "none")?.toString() || "true") == "false") newUserNotifText.innerHTML = "Bonjour! Nouveau ici? Clique ici pour apprendre à utiliser cette extension!";
mailInfo .classList.replace("en", "fr");
shareConfig.classList.replace("en", "fr");
suggestIdea.classList.replace("en", "fr");
reportIssue.classList.replace("en", "fr");
docBtn .classList.replace("en", "fr");
// tutoBtn .classList.replace("en", "fr");
keybindsBtn.classList.replace("en", "fr");
}
else {
reportIssueBtn .title = "Report...";
mailInfo .title = "Click to copy my email adress!";
shareConfig .title = "Share a configuration on my GitHub";
suggestIdea .title = "Suggest an idea on my GitHub";
reportIssue .title = "Report an issue on my GitHub";
helpMenu .title = "How to use?";
docBtn .title = "Go to the documentation";
// tutoBtn .title = "Start the tutorial";
keybindsBtn .title = "See the keyboard shortcuts";
settingsBtn .title = "Open the settings";
if (((newUserNotif?.style?.display || "none" == "none")?.toString() || "true") == "false") newUserNotif.title = "Click to dismiss";
shareConfig .innerHTML = `Share a config ${this.createExternalLinkSymbol({margin: [0,0,0,4]})}`;
suggestIdea .innerHTML = `Suggest an idea ${this.createExternalLinkSymbol({margin: [0,0,0,4]})}`;
reportIssue .innerHTML = `Report an issue ${this.createExternalLinkSymbol({margin: [0,0,0,4]})}`;
mailInfoText .innerHTML = "By mail: baptiste.jacquin@ecam.fr 📋";
mailInfoCopied .innerHTML = "Copied!";
if (((newUserNotif?.style?.display || "none" == "none")?.toString() || "true") == "false") newUserNotifText.innerHTML = "Hey! New here? Click here to find a tutorial on how to use this extension!";
mailInfo .classList.replace("fr", "en");
shareConfig.classList.replace("fr", "en");
suggestIdea.classList.replace("fr", "en");
reportIssue.classList.replace("fr", "en");
docBtn .classList.replace("fr", "en");
// tutoBtn .classList.replace("fr", "en");
keybindsBtn.classList.replace("fr", "en");
}
const keybindsTableModalBody = document.querySelector("#keyboardShortcutListModalBody");
if (keybindsTableModalBody) { this.appendKeyboardShortcutsList(keybindsTableModalBody); }
const settingsModal = document.querySelector("#settingsModal");
const settingsModalBody = document.querySelector("#settingsModalBody");
if (settingsModal) { if (settingsModalBody) {settingsModalBody.remove()} this.appendSettingsModalBody(); }
const importBtn = document.getElementById("importBtn");
const editModeBtn = document.getElementById("editModeBtn");
const exportBtn = document.getElementById("exportBtn");
importBtn .innerHTML = `${this.lang == "fr" ? "Importer Config": "Import Config"}`;
editModeBtn .innerHTML = `+
🖊️
`;
exportBtn .innerHTML = `${this.lang == "fr" ? "Exporter Config": "Export Config"}`;
editModeBtn .title = this.lang == "fr" ? "Maj+E" : "Shift+E";
if (this.editMode) {editModeBtn.classList.add('on')}
else {editModeBtn.classList.remove('on')}
const importMenu = document.getElementById("importMenu");
const importFile = importMenu.querySelector(".import-menu-btn.file");
const importClear = importMenu.querySelector(".import-menu-btn.clear");
const importOnline = importMenu.querySelector(".import-menu-btn.online");
importFile.children[0].innerHTML = this.lang == "fr" ? "Importer un fichier de configuration .json" : "Import a .json configuration file";
importClear.innerHTML = this.lang == "fr" ? "Effacer Config" : "Clear Config";
importClear.title = this.lang == "fr" ? "Clique ici pour effacer ta configuration actuelle" : "Click here to clear your current configuration";
importOnline.children[1].innerHTML = this.lang == "fr" ? "Obtenir un fichier de configuration en ligne" : "Get a configuration file online";
const onlineCfgPickerHeader = document.querySelector(".online-cfg-picker-menu-header");
if (onlineCfgPickerHeader) {
onlineCfgPickerHeader.innerHTML = this.lang == "fr"
? "Note: Choisir une configuration effacera les traces de configuration pré-existante de l'année correspondante, mais pas des autres années"
: "Tip: Choosing a configuration will erase all traces of pre-existing configuration of the corresponding year, but not of the other years"
;
}
if (this.lang == "fr") {
document.querySelectorAll(".drop-module-card-insert-text, .drop-field-remove-from-module-text, .drop-field-create-module-text").forEach(dropFieldText => {
dropFieldText.classList.replace("en", "fr")
})
document.querySelectorAll(".online-cfg-picker-menu-dir-tree-header").forEach(dirTreeHeader => {
dirTreeHeader.classList.replace("en","fr")
})
}
else {
document.querySelectorAll(".drop-module-card-insert-text, .drop-field-remove-from-module-text, .drop-field-create-module-text").forEach(dropFieldText => {
dropFieldText.classList.replace("fr", "en")
})
document.querySelectorAll(".online-cfg-picker-menu-dir-tree-header").forEach(dirTreeHeader => {
dirTreeHeader.classList.replace("fr","en")
})
}
const avgLabel = document.querySelector(".average-label");
avgLabel.innerHTML = `/20 ${this.lang == "fr" ? "Moyenne Générale" : "Global Average"}`;
const statLabelsArray = document.querySelectorAll(".stat-label");
statLabelsArray[0].innerHTML = this.lang == "fr" ? "Notes" : "Grades";
statLabelsArray[1].innerHTML = this.lang == "fr" ? "Semestres" : "Semesters";
statLabelsArray[2].innerHTML = this.lang == "fr" ? "Modules Validés" : "Validated module";
const allFilterTabs = document.querySelectorAll(`.filter-tab`);
allFilterTabs.forEach(tab => {
if (tab.dataset.filter == "all") {tab.innerHTML = this.lang == "fr" ? `Tous` : `All`}
tab.title = this.lang == "fr" ? `Maj+Flèche Droite/Gauche` : `Shift+Left/Right Arrow`;
})
document.querySelector(`.view-toggle`).children[0].innerHTML = this.lang == "fr" ? `Basculer le mode d'affichage` : `Toggle display mode`;
document.querySelector(`.fold-toggle`) .innerHTML = this.lang == "fr" ? `Plier tous les modules` : `Fold every module`;
document.querySelector(`.view-toggle`).children[0].title = this.lang == "fr" ? `Maj+D` : `Shift+D`;
document.querySelector(`.fold-toggle`) .title = this.lang == "fr" ? `Maj+F` : `Shift+F`;
const viewBtnsArray = document.querySelectorAll(".view-btn");
viewBtnsArray[0].title = this.lang == "fr" ? "Vue détaillée" : "Detailed view";
viewBtnsArray[1].title = this.lang == "fr" ? "Vue compacte" : "Compact view";
const intranetSubtext = document.querySelector(".intranet-subtext");
if (intranetSubtext) intranetSubtext.innerHTML = this.lang == "fr" ? "Afficher le tableau des notes d'Espace ECAM" : "Show ECAM Intranet's Grades Table";
const updateNotif = document.querySelector(".update-available-notif-header");
if (updateNotif) {
updateNotif.querySelector(".update-available-notif-text").innerHTML = this.lang == "fr" ? "NOUVELLE MISE À JOUR DU TABLEAU DE BORD DISPONIBLE ! v" + this.scriptVersion + " → v"+this.scriptGitVersion.join(".") : "NEW DASHBOARD UPDATE AVAILABLE! v" + this.scriptVersion + " → v"+this.scriptGitVersion.join(".");
updateNotif.querySelector(".update-available-notif-btns").children[0].innerHTML = this.lang == "fr" ? "INSTALLER" : "INSTALL";
updateNotif.querySelector(".update-available-notif-btns").children[1].innerHTML = this.lang == "fr" ? "Ignorer" : "Ignore";
updateNotif.querySelector(".update-available-notif-btns").children[1].title = this.lang == "fr" ? "Ignorer pour aujourd'hui" : "Ignore for today";
}
if (document.querySelector(".new-grades-card").children.length > 1) {document.querySelector(".new-grades-card").children[1].remove()}
document.querySelector(".new-grades-card-title").innerHTML = `
${this.newGrades.length > 0
? `${this.lang == "fr"
? `${this.newGrades.length} Nouvelle${ this.newGrades.length > 1 ? "s" : ""} Note${this.newGrades.length > 1 ? "s" : ""} !`
: `${this.newGrades.length} New Grade${this.newGrades.length > 1 ? "s" : ""}!`
}`
: `${this.lang == "fr"
? `Pas de nouvelle note${this.error ? ", que je sache (mode offline)" : ""}`
: `No new grade${this.error ? ", as far as I know (offline mode)" : ""}`
}`
}
`;
document.querySelector(".new-grades-mark-as-read-text").innerHTML = this.lang == "fr" ? "Marquer comme lu" : "Mark as read";
document.querySelector(".new-grades-mark-as-read").title = this.lang == "fr" ? "Marquer comme lu" : "Mark as read";
document.querySelectorAll(".selected-card-notif-div").forEach(notifDiv => {
notifDiv.children[2].innerHTML = this.lang == "fr" ? `est sélectionné!` : `is selected!`;
})
if (fadeIn) {
this.ecamDash.parentElement.classList.add("fade-in");
clearTimeout(this?.timeouts?.renderFadeIn);
this.timeouts.renderFadeIn = setTimeout(() => {this.ecamDash.parentElement.classList.remove("fade-in")}, 300);
}
}
//MARK: create new grades notif
createNewGradesNotifDiv() {
let newGradesNotif = document.querySelector(".new-grades-notif");
if (!newGradesNotif) {
newGradesNotif = document.createElement("div");
newGradesNotif.className = "new-grades-notif";
this.ecamDash.appendChild(newGradesNotif);
setTimeout(() => {if (this.newGrades.length > 0) {
document.querySelector(".new-grades-notif").classList.add("on")
}}, 1)
}
newGradesNotif.innerHTML = this.lang == "fr"
? `${this.newGrades.length} NOUVELLE${ this.newGrades.length>1 ? "S !" : " !"} NOTE${this.newGrades.length>1 ? "S !" : " !"}`
: `${this.newGrades.length} NEW GRADE${this.newGrades.length>1 ? "S!" : "!" }`
+ ``;
}
// MARK: renderRecentGrades
renderRecentGrades() {
const newGradesCard = document.querySelector(".new-grades-card");
const grades = {};
if (this.newGrades.length > 0) {
// sorting the new grades by subjects
this.newGrades.forEach((grade => {
if (!grades[grade.subject]) {
grades[grade.subject] = [grade];
}
else {
grades[grade.subject].push(grade)
}
}))
let html = `${this.lang == "fr" ? "Mode Édition" : "Edit Mode"}
`;
Object.keys(grades).forEach(subject => {
html += `
`;
grades[subject].forEach(grade => {
html +=
`
`;
})
html += `
`;
newGradesCard.innerHTML += html;
}
}
// MARK: — GenerateContent
generateContent({manageIndividualSubjectCardFolding=true, fadeIn=true}={manageIndividualSubjectCardFolding: true, fadeIn: true}) {
if (fadeIn == "big") {this.languageSensitiveContent(true);}
else {this.languageSensitiveContent(false);}
// Call renderRecentGrades to... well... render the recent grades' section
this.renderRecentGrades()
// Content area, refreshing often
const moduleStats = this.getModuleStats();
const validatedEUsStatLabel = document.querySelectorAll(".stat-value")[2];
validatedEUsStatLabel.innerHTML = `${moduleStats.validated}/${moduleStats.total}`;
let semesterKeys = [];
if (this.currentSemester === "all") {
semesterKeys = Object.keys(this.semesters).sort((a,b) => a-b);
}
else if (this.currentSemester === "last") {
semesterKeys = [Object.keys(this.semesters).sort((a,b) => a-b).at(-1)];
}
else {
semesterKeys = [this.currentSemester];
}
const contentArea = document.getElementById("contentArea");
contentArea.innerHTML = "";
semesterKeys.forEach(sem => {
const section = document.createElement("div");
section.className = `semester-section`;
const moyenneSem = Object.keys(this.semesters[sem]).length > 0 ? this.moyennePonderee([].concat(...Object.values(this.semesters[sem] || {}))) : " - ";
const avgClass = Object.keys(this.semesters[sem]).length > 0 ? this.getAverageColor(moyenneSem) : "";
const unclassified = this.getUnclassifiedSubjects(sem);
const moduleConfig = this.moduleConfig?.[sem] || {};
section.innerHTML = `
${subject}
| ${grade.type} | ${grade.grade}/20 | ${grade.coef}% | ${grade.classAvg}/20 | ${grade.date} | ${grade.prof} |
📚 ${this.lang == "fr" ? 'Semestre' : "Semester"} ${sem}
${moyenneSem==" - " ? "" : `${moyenneSem >= 10 ? '✅' : '⚠️'}`}
${moyenneSem}/20
${this.createAllModuleCards(sem, manageIndividualSubjectCardFolding)}
Rien à voir ici pour l'instant...
`
: `Nothing to see here yet...
`;
}
return html;
}
createModuleCard(sem, moduleName, moduleIndex=-1, manageIndividualSubjectCardFolding=true) {
const moduleGrades = this.calculateModuleGrades(sem, moduleName);
const includedGrades = (moduleGrades || []).filter(n => !this.gradeIsDisabled(n));
let weight = 0; includedGrades.forEach(grade => {weight += grade.coef/100})
const moyenne = this.gradesDatas[sem][moduleName].average;
const hasSim = this.gradesDatas[sem][moduleName].simGrades.length > 0 ? true : false;
const hasDisabled = this.gradesDatas[sem][moduleName].disabledSimGrades.length + this.gradesDatas[sem][moduleName].disabledRealGrades.length > 0 ? true : false;
const folded = manageIndividualSubjectCardFolding && this.foldedModuleCardsId.includes(`module-card-${moduleName}-in-semester-${sem}`);
const cardIsSelected = this.selectedModuleCardsId.includes(`module-card-${moduleName}-in-semester-${sem}`);
let html = `
= 10 ? 'validated' : 'failed'}`} ${folded ? "fold" : ""}" id="module-card-${moduleName}-in-semester-${sem}" data-semester="${sem}" data-module="${moduleName}" data-index="${moduleIndex}" ${folded ? `style="height: 77px"` : ""}>
`;
return html
}
// MARK: Create Subject Card
/**
* Call this method to create the outer HTML of all subject cards of a module.
*
* Detects automatically from the name of the moduleName and from `this.gradesDatas` (as a safe guard, also from `this.moduleConfig`) if the card is classified or unclassified,
* and detects automatically from this.compactSubjCardsId if the card is detailed or compact.
*
* @param {number | string} sem Number of the semester of the subject
* @param {string} moduleName Name of the subject's module
* @return {string} The outer HTML of all the subject cards of a module, in a single string
*/
createAllSubjCards(sem, moduleName, manageIndividualSubjectCardFolding=true) {
const moduleData = this.gradesDatas[sem][moduleName];
let html = this.editMode && moduleName != "__#unclassified#__" && this.moduleConfig[sem]?.[moduleName] != undefined
? this.createDropFieldInsertionField("subject", {sem, moduleName, index:0})
: ""
;
Object.values(moduleData.subjects).forEach((_value, _index) => {
html += this.createSubjCard(sem, moduleName, _value.subjName, _index, manageIndividualSubjectCardFolding);
html += this.editMode && moduleName != "__#unclassified#__" && this.moduleConfig[sem]?.[moduleName] != undefined
? this.createDropFieldInsertionField("subject", {sem, moduleName, index:_index+1})
: ""
;
})
return html;
}
/**
* Call this method to create the outer HTML of a subject card.
*
* Detects automatically from the name of the moduleName and from `this.gradesDatas` (to error-proof the moduleName, also from `this.moduleConfig`) if the card is classified or unclassified,
* and detects automatically from this.compactSubjCardsId if the card is detailed or compact.
*
* @param {number | string} sem Number of the semester of the subject
* @param {string} moduleName Name of the subject's module
* @param {string} subject Name of the subject
* @param {number} [index=-1] Default: -1 — Index of the subject in its module, necessary if the subject is classified, useless if the subject is unclassified
* @return {string} The outer HTML of the subject card
*/
createSubjCard(sem, moduleName, subject, index=-1, manageIndividualSubjectCardFolding=true) {
const moduleData = this.gradesDatas[sem][moduleName];
const subjectData = moduleData.subjects[subject];
const subjectGrades = subjectData.grades;
const moduleMoy = moduleData.average;
const subjAvg = subjectData?.average >= 0 ? subjectData.average : " - ";
const pct = subjectData.coef;
const isCustom = subjectData.isCustom;
const nbGrades = subjectGrades.length;
const includedGradesLength = nbGrades - subjectData.disabledRealGrades.length - subjectData.disabledSimGrades.length;
const nbSimGrades = subjectData.simGrades.length;
const nbRealGrades = nbGrades - nbSimGrades;
const classified = moduleName != "__#unclassified#__" && this.moduleConfig[sem]?.[moduleName] != undefined;
const subjectCardId = `subject-card-semester-${sem}-subject-${subject}`;
const detailed = (this.detailedSubjCardsId.includes(subjectCardId) && manageIndividualSubjectCardFolding) || (this.viewMode == "detailed" && !manageIndividualSubjectCardFolding);
const cardIsSelected = this.selectedSubjectCardsId.includes(`subject-card-semester-${sem}-subject-${subject}`);
const cardClientHeight = 166 + 40*nbGrades;
let html = `
= 10 ? 'validated' : 'failed'}`}" id="module-header-${moduleName}-in-semester${sem}" data-semester="${sem}" data-module="${moduleName}" ${this.editMode ? `draggable="true"` : ""}>
${this.editMode
?
`
`
:
`
${cardIsSelected
? ``
: this.createDraggableIcon("module", {targetId: `module-card-${moduleName}-in-semester-${sem}`})
}
${moduleName}
`
}
${this.lang == "fr" ? `Coef Total des matières :` : `Total Subjects Coef:`}
= 10 ? 'good' : 'bad'}`}" data-semester="${sem}" data-module="${moduleName}" ${this.editMode ? "" : 'style="width:151px"'}>
${moyenne}/20
${hasDisabled
?
``
: ``
}
${hasSim
?
``
: ``
}
${this.createAllSubjCards(sem, moduleName, manageIndividualSubjectCardFolding)}
= 10 ? `${moduleMoy < 10 ? `meh` : `good`}` : `${moduleMoy >= 10 ? `meh` : `bad`}`}`}" id="${subjectCardId}" style="${this.editMode ? `cursor: grab; user-select: none;` : ""}${detailed ? ` height: ${cardClientHeight};` : ""}"" data-semester="${sem}" data-module="${moduleName}" data-subject="${subject}" data-custom="${isCustom}" data-index="${index}" data-height="${cardClientHeight}">
= 10 ? `${moduleMoy < 10 ? `meh` : `good`}` : `${moduleMoy >= 10 ? `meh` : `bad`}`}`}" style="${this.editMode ? `user-select: text;` : ``}" id="grades-table-${subject}-semester${sem}" data-subject="${subject}">
`;
html += `
`;
return html;
}
updateFirstLoadEvent() {
const dashPatchNotesLink = document.querySelector(".patch-notes-link");
const newIndicatorContainer = document.createElement("div");
newIndicatorContainer.className = "new-indicator-container";
newIndicatorContainer.style.top = "-14px";
newIndicatorContainer.style.right = "31px";
newIndicatorContainer.dataset.attached = dashPatchNotesLink.id;
newIndicatorContainer.innerHTML = ``;
dashPatchNotesLink.appendChild(newIndicatorContainer);
dashPatchNotesLink.onclick = () => {
newIndicatorContainer.remove();
this.saveUpdateFirstLoad();
};
}
//#endregion
//#region -Icons
createDraggableIcon(source="subject", {size=undefined, width=undefined, height=undefined, fontSize=undefined, targetId="none"}={targetId:"none"}) {
return `
`;
}
createExternalLinkSymbol({fillColor="white", strokeColor="none", size=15, margin=0}={fillColor:"white", strokeColor:"none", size:15, margin:0}) {
return ``;
// viewBox="0 0 24 24" = 10 ? `${moduleMoy < 10 ? `meh` : `good`}` : `${moduleMoy >= 10 ? `meh` : `bad`}`}`} ${classified ? "classified" : "unclassified"}" ${this.editMode ? `style="cursor: grab;" draggable="true"` : ``} data-module="${moduleName}">
`;
html += `
${this.editMode
? `
${cardIsSelected
? ``
: this.createDraggableIcon(`subject`, {targetId: subjectCardId})
}
`
: ""
}
${isCustom
? ``
: `
${subject}
`
}
${classified
? ` ${this.lang == "fr"
? "Poids dans module: "
: "Weight in module: "
}
${this.editMode
? `%`
: `${pct}%`
}
`
: ""
}
${classified ? "• " : ""}
${nbGrades===0
? `${this.lang == "fr" ? "aucune note publiée" : "no published grade"}`
: `${nbGrades} ${this.lang == "fr" ? `note${nbGrades>1?"s":""} au total` : `grade${nbGrades>1?"s":""} total`}`
}
${nbGrades>0
? ` •
${includedGradesLength}/${nbGrades}
${this.lang == "fr" ? `note${includedGradesLength>1?"s":""} activée${includedGradesLength>1?"s":""}` : `grade${includedGradesLength>1?"s":""} enabled`}${includedGradesLength`
: ``
}
${nbSimGrades>0
? ` • ${nbSimGrades} ${this.lang == "fr" ? `note${nbSimGrades>1?"s":""} simulée${nbSimGrades>1?"s":""}` : `simulated grade${nbSimGrades>1?"s":""}`}`
: ``
}
${this.lang == "fr" ? `Coef Total des notes :` : `Total Grades Coef:`}
=10 ? 'good' : 'bad'}`}">
${subjAvg}/20
| ${this.lang == "fr" ? "Intitulé" : "Title"} | ${this.lang == "fr" ? "Note" : "Grade"} | ${this.lang == "fr" ? "Coef" : "Coef"} | ${this.lang == "fr" ? "Moy. Classe" : "Class Avg"} | ${this.lang == "fr" ? "Date" : "Date"} | ${this.lang == "fr" ? "Prof(s)" : "Teacher(s)"} | |
|---|---|---|---|---|---|---|
| ${gradeIsSim ? `` : `` } | ${gradeIsSim ? ` /20` : `${grade.grade}/20` } | ${gradeIsSim ? ` %` : `${grade.coef} %` } | ${gradeIsSim ? ` — ` : `${grade.classAvg}/20` } | ${gradeIsSim ? ` — ` : `${grade.date}` } | 0 ? `style="display: none;"` : ""}> ${gradeIsSim ? ` — ` : `${`${grade.prof.split(" / ").length <= 3 ? grade.prof : grade.prof.split(" / ").slice(0,3).join(" / ") + " / ... "}`||''}` } | ${ gradeIsSim ? `` : `` } |
|
${this.lang == "fr" ? "Ajouter une note simulée: " : "Add a simulated grade: "}
|
/20 | % | ||||
| ${keybind.text()} | ${keybind.keys()} |
Clique sur l'écran pour rafraichir la page et appliquer la mise à jour !
Utilisateurs de MAC, copiez le script qui s'est ouvert et collez-le dans votre extension à la place de l'ancien script
`
: `Click on the screen to reload the page and apply the update!
MAC users, copy the script that opened up and paste it in your extension to replace the old script
`;
}
document.body.style.height = "290px";
document.body.style.overflow = "hidden";
const fullScreenNotif = document.createElement("div");
container.appendChild(fullScreenNotif);
fullScreenNotif.outerHTML = `
${text}
`;
const newFullScreenNotif = document.querySelector("#fullScreeNotif");
newFullScreenNotif.title = this.lang == "fr" ? "Rafraichir" : "Reload";
setTimeout(() => {newFullScreenNotif.classList.add("show");}, 100)
newFullScreenNotif.onclick = () => {window.location.reload();};
}
appendSettingsModalBody(container=document.querySelector("#settingsModal")) {
if (container instanceof HTMLElement) {
const settingsModalBody = document.createElement("div");
settingsModalBody.className = "settings-modal-body";
settingsModalBody.id = "settingsModalBody";
container.appendChild(settingsModalBody);
Object.keys(this.settings).forEach((settingId, _index, settingsIdArray) => {
const settingChildren = this.settings[settingId].children;
if (settingChildren.length > 0) {
const settingValue = this.settings[settingId].value;
let html = ``;
html += ``;
html += this.createSettingRow(settingId, _index);
settingChildren.forEach((settingChildData) => {
html += this.createSettingRow(settingChildData.childName, _index);
settingsIdArray.splice(settingsIdArray.indexOf(settingChildData.childName), 1);
})
settingsModalBody.innerHTML += html + `
`;
}
else {
settingsModalBody.innerHTML += this.createSettingRow(settingId, _index);
}
})
}
}
createSettingRow(settingId, index) {
const settingName = this.settings[settingId].name();
const settingDesc = this.settings[settingId].description();
const settingInfo = this.settings[settingId].info();
const settingValue = this.settings[settingId].value;
const settingParents = this.settings[settingId].parents;
const settingChildren = this.settings[settingId].children;
let html = ``;
let settingParentsValidValue = true;
let settingTotalParentsCount = 0;
let settingInvalidPartialParentsCount = 0;
settingParents.forEach(parentData => {
if (parentData.controlType == "total") {
settingTotalParentsCount++;
}
if (this.settings[parentData.parentName].value !== true) {
if (parentData.controlType == "total") {
settingParentsValidValue = false;
}
else if (parentData.controlType == "partial") {
settingInvalidPartialParentsCount++;
}
}
});
if (settingParentsValidValue == true && settingInvalidPartialParentsCount > 0 && settingInvalidPartialParentsCount == settingParents.length - settingTotalParentsCount) {
settingParentsValidValue = false;
}
html += `
0 ? " parent": ""}${settingParentsValidValue && settingValue ? "" : " disabled"}"
id="settings-row-${settingId}"
${index > 0 && settingParents.length==0 ? `style="border-top: 1px solid"` : ``}
data-setting="${settingId}"
data-parent="${settingParents.length > 0 ? settingParents[0].parentName : ""}"
>
`;
return html;
}
firstLoadEvent() {
const overHeaderBtns = document.querySelector(".over-header-help-btns");
const newUserNotif = document.createElement("div");
newUserNotif.className = "new-user-notif";
newUserNotif.title = this.lang == "fr" ? "Clique pour fermer" : "Click to dismiss";
newUserNotif.innerHTML = `
${settingName}
0 ? `data-parent="${settingParents[0].parentName}"` : ""}
${settingParentsValidValue ? "" : "disabled"}
${settingValue ? "checked" : ""}
>
${settingDesc}
${settingInfo}
${
this.lang == "fr"
? "Bonjour! Nouveau ici? Clique ici pour apprendre à utiliser cette extension!"
: "Hey! New here? Click here to find a tutorial on how to use this extension!"
}
`;
overHeaderBtns.appendChild(newUserNotif);
const newUserNotifFullScreen = document.createElement("div");
newUserNotifFullScreen.className = "new-user-notif-fullscreen-effect";
this.ecamDash.appendChild(newUserNotifFullScreen);
setTimeout(() => {newUserNotifFullScreen?.classList?.add("focus");}, 10);
newUserNotif.onclick = () => {this.dismissFirstTimeNotif();}
}
startTutorial() {
}
//#endregion
// MARK: Regenerate subject and module averages and total coef debug texts
regenAveragesAndTotalCoefs(sem, moduleName="__#unclassified#__", subject) {
// subject average modification
if (subject) {
const subjAvg = this.gradesDatas[sem][moduleName||"__#unclassified#__"].subjects[subject].average;
const subjAvgDiv = document.querySelector(`.subject-card[data-subject="${subject}"]`).querySelector(".subj-moyenne");
subjAvgDiv.innerHTML = subjAvg + "/20";
subjAvgDiv.classList.remove("good"); subjAvgDiv.classList.remove("bad");
if (subjAvg >= 10) {
subjAvgDiv.classList.add("good");
}
else {
subjAvgDiv.classList.add("bad");
}
}
// module average modification
if (moduleName != "__#unclassified#__") {
const moduleAvg = this.gradesDatas[sem][moduleName].average;
const moduleCard = document.querySelector(`.module-card[data-module="${moduleName}"]`);
const moduleCardHeader = moduleCard.querySelector(`.module-header`);
const moduleAvgDiv = moduleCard.querySelector(`.module-moyenne[data-module="${moduleName}"]`);
moduleAvgDiv.childNodes[0].data = moduleAvg + "/20";
moduleCard.classList.remove("validated"); moduleCard.classList.remove("failed"); moduleCard.classList.remove("unknown");
moduleCardHeader.classList.remove("validated"); moduleCardHeader.classList.remove("failed"); moduleCardHeader.classList.remove("unknown");
moduleAvgDiv.classList.remove("good"); moduleAvgDiv.classList.remove("bad"); moduleAvgDiv.classList.remove("unknown");
if (moduleAvg == " - ") {
moduleCard.classList.add("unknown");
moduleAvgDiv.classList.add("unknown");
}
else if (moduleAvg >= 10) {
moduleCard.classList.add("validated");
moduleCardHeader.classList.add("validated");
moduleAvgDiv.classList.add("good");
}
else {
moduleCard.classList.add("failed");
moduleCardHeader.classList.add("failed");
moduleAvgDiv.classList.add("bad");
}
this.setGradesTableTotalCoef(moduleCard);
}
else if (subject) {
const subjCard = document.querySelector(`.subject-card[data-semester="${sem}"][data-subject="${subject}"]`);
this.setGradesTableTotalCoef(subjCard);
}
}
//#endregion
//#region ________ — General Events — _________
attachAllEventListeners() {
this.attachDocumentMouseListeners();
this.attachAllAnyInputsListeners();
this.attachLangBtnsListener();
this.attachOverHeaderBtnsMouseListeners();
this.attachEditModeListener();
this.attachImportBtnListener();
this.attachExportBtnListener();
this.attachNewGradesNotifListener();
this.attachNewGradesMarkAsReadBtnListener();
this.attachAllNewGradesSubjectCardsListener();
this.attachFilterSemesterListener();
this.attachViewModeBtnsListener();
this.attachFoldToggleBtnListener();
this.attachAllSubjectCardRelatedEvenListenersForEverySubjectCard();
this.attachModuleInfoClearBtns();
this.attachAllModuleDeleteBtnsListener();
if (this.editMode) { this.attachDropFieldsEventListeners(); } else { this.detachOnDragEventListeners(); }
}
//#region -—Attach Event Listeners
//#region Document listeners
attachDocumentMouseListeners(eventName="all") {
if (eventName == "onclick" || eventName == "all") {
document.onclick = (e) => {
// Toggle intranet table
if (e.target.closest('.intranet-fold')) {
const header = e.target.closest('.intranet-fold');
const intranetTable = document.querySelector('.greyGridTable');
const intranetToggle = header.querySelectorAll('.intranet-toggle');
intranetToggle.forEach(t => {
if (t.previousElementSibling == null){
t.classList.toggle('openLeft')
} else {
t.classList.toggle('openRight');
}
});
if (intranetTable.style.display == 'none') {
intranetTable.style.display = 'block';
} else {
intranetTable.style.display = 'none';
}
}
if (!e.target.closest(".import-menu") && document.getElementById("importMenu").classList.contains("show")) {
document.getElementById("importMenu").classList.remove("show");
clearTimeout(this?.timeouts?.closeImportMenu);
this.timeouts.closeImportMenu = setTimeout(() => {document.getElementById("importMenu").style.display = "none"}, 300);
}
if (!e.target.closest(".over-header-btn.issue.issue-btn, .over-header-btn.issue.mail-info, .over-header-btn.how-to-use-btn")) {
this.dismissAllOverHeaderBtns();
}
};
}
if (eventName == "onmousedown" || eventName == "all") {
// Fold/Unfold modules
document.onmousedown = (e) => {
// Toggle semesters
if (e.target.closest('.semester-header')) {
this.semesterHeaderMouseUpNoMoveAction();
}
else if (e.target.closest('.module-header') && !e.target.closest('.module-title.input, .module-delete-btn, .drag-icon, .tick-icon')) {
this.moduleHeaderMouseUpNoMoveAction(e)
}
else if (e.target.closest('.subject-card-header, .subject-card.compact') && !e.target.closest('.any-input, .drag-icon, .tick-icon, .subject-delete-btn')) {
this.subjectHeaderMouseUpNoMoveAction(e)
}
};
}
}
attachAllAnyInputsListeners() {
document.querySelectorAll(".any-input").forEach(input => {
this.attachAnyInputListeners(input)
})
}
attachAnyInputListeners(input) {
input.onfocus = () => {this.generalKeyboardEvents("edit sim grade", input)}
input.onblur = () => {this.generalKeyboardEvents("general")};
input.ondragover = (e) => {e.preventDefault(); e.dataTransfer.dropEffect = "none";}
input.ondrop = (e) => {e.preventDefault(); e.dataTransfer.dropEffect = "link";};
if (input.classList.contains("module-title")) { // Change modules name
input.onfocus = () => { if (this.editMode) {
this.detachOnDragEventListeners();
this.generalKeyboardEvents("edit sim grade", input);
document.querySelectorAll(".module-header").forEach(card => {card.draggable = false});
} }
input.onblur = () => { if (this.editMode) {
this.attachOnDragEventListeners();
this.generalKeyboardEvents("general");
document.querySelectorAll(".module-header").forEach(card => {card.draggable = true;});
} }
input.onchange = (e) => { this.moduleTitleInputChangeAction(e.target) };
}
else {
input.onfocus = ( ) => { if (this.editMode) {this.detachOnDragEventListeners(); this.generalKeyboardEvents("edit sim grade", input); } };
input.onblur = ( ) => { if (this.editMode) {this.attachOnDragEventListeners(); this.generalKeyboardEvents("general"); } };
}
}
//#endregion
//#region Dashboard listeners
attachPinDockbarListener() {
document.querySelector(".pin-dockbar").children[0].children[0].onclick = () => {
// when clicking on the button to unpin the dockbar, this event listener is triggered before the action of unpinning the dockbar is actually done,
// so the order might seem reverse logical but that's how it works
if (!document.body.classList.contains("lfr-dockbar-pinned")) {
document.querySelector(".scroll-field.up").style.transform = "translateY(45px)";
}
else {
document.querySelector(".scroll-field.up").style.transform = "";
}
}
}
attachLangBtnsListener() {
// Change to English
document.getElementById('en-lang-btn').onclick = () => {
if (this.lang == "fr") {
this.lang = "en";
localStorage.setItem("ECAM_DASHBOARD_DEFAULT_LANGUAGE", this.lang)
document.getElementById('fr-lang-btn').classList.remove('active')
document.getElementById('en-lang-btn').classList.add('active')
this.generateContent({fadeIn: false});
}
};
// Change to French
document.getElementById('fr-lang-btn').onclick = () => {
if (this.lang == "en") {
this.lang = "fr";
localStorage.setItem("ECAM_DASHBOARD_DEFAULT_LANGUAGE", this.lang)
document.getElementById('fr-lang-btn').classList.add('active')
document.getElementById('en-lang-btn').classList.remove('active')
this.generateContent({fadeIn: false});
}
};
}
attachOverHeaderBtnsMouseListeners() {
const issueBtn = document.querySelector(".issue.issue-btn");
const mailInfo = document.querySelector(".issue.mail-info");
const helpBtn = document.querySelector(".over-header-btn.how-to-use-btn");
// const tutoBtn = document.querySelector(".over-header-btn.tuto-btn");
const keybindsBtn = document.querySelector(".over-header-btn.keybinds-btn");
const settingsBtn = document.querySelector(".over-header-btn.settings-btn");
issueBtn.onclick = () => {if (issueBtn.classList.contains("open")) { this.dismissIssuesOverHeaderBtns(); } else { this.openIssuesOverHeaderBtns(); }};
mailInfo.onclick = () => {
navigator.clipboard.writeText("baptiste.jacquin@ecam.fr");
const mailInfoText = document.querySelector(".over-header-btn-mail-info-text");
const mailInfoCopied = document.querySelector(".over-header-btn-copied-cue");
mailInfoText .classList.add("lighten");
mailInfoCopied.classList.add("show");
mailInfoCopied.onanimationend = (e) => {
mailInfoText .classList.remove("lighten");
mailInfoCopied.classList.remove("show");
}
};
helpBtn.onclick = () => {if (helpBtn.classList.contains("open")) { this.dismissHelpOverHeaderBtns(); } else { this.openHelpOverHeaderBtns(); }};
// tutoBtn.onclick = () => { this.startTutorial(); };
keybindsBtn.onclick = () => { this.openKeybindsModal(); };
settingsBtn.onclick = () => { this.openSettingsModal(); };
}
attachEditModeListener() {
document.getElementById('editModeBtn').onclick = () => {
this.editMode = !this.editMode;
localStorage.setItem("ECAM_DASHBOARD_DEFAULT_EDIT_MODE", this.editMode);
this.generateContent({fadeIn: true});
};
}
attachImportBtnListener() {
document.getElementById('importBtn').onclick = () => this.toggleImportMenu();
}
attachExportBtnListener() {
document.getElementById('exportBtn').onclick = () => this.exportData();
}
//#endregion
//#region Modals
attachSettingsModalContainerListeners(container=document.querySelector("#settingsModalContainer")) {
container.onmousedown = (e) => {
if (e.target.closest(".modal-close-btn") || !e.target.closest(".settings-modal")) {
container.onmouseup = (e) => {
if (e.target.closest(".modal-close-btn") || !e.target.closest(".settings-modal")) {
this.closeSettingsModal();
}
container.onmouseup = null;
}
}
else if (e.target.closest(".settings-checkbox")) {
container.onmouseup = (e) => {
if (e.target.closest(".settings-checkbox")) {
const chbx = e.target.closest(".settings-checkbox");
const settingId = chbx.dataset.setting;
const settingRow = container.querySelector(`#settings-row-${settingId}`);
const settingRowFamily = container.querySelector(`#settings-row-family-${settingId}`);
this.settings[settingId].value = !chbx.checked; // The event is fired before the checkbox is actually checked, so we reverse the value of the checkbox
this.settings[settingId].action();
const settingChildren = this.settings[settingId].children.map(settingChildData => {return settingChildData.childName});
if (chbx.checked) {
settingRow.classList.add("disabled");
settingRowFamily?.classList?.add("disabled");
}
else {
settingRow.classList.remove("disabled");
settingRowFamily?.classList?.remove("disabled");
}
settingChildren.forEach(settingChildId => {
const childSettingRow = container.querySelector(`#settings-row-${settingChildId}`);
const childChbx = childSettingRow.querySelector(".settings-checkbox");
if (chbx.checked) {
childSettingRow.querySelector(".settings-checkbox").disabled = true;
childSettingRow.classList.add("disabled");
}
else {
childSettingRow.querySelector(".settings-checkbox").disabled = false;
if (childChbx.checked) childSettingRow.classList.remove("disabled");
}
})
container.onmouseup = null;
}
}
}
};
}
//#endregion
//#region New grades listeners
attachNewGradesNotifListener() {
const newGradesNotif = document.querySelector(".new-grades-notif");
if (newGradesNotif) {
document.querySelector(".new-grades-notif").onclick = (e) => {
if (!e.target.closest("#closeNewGradesNotif")) {
const newGradesCard = document.querySelector(".new-grades-card");
newGradesCard.scrollIntoView({behavior: "instant"});
newGradesCard.classList.add("myhighlight");
setTimeout(() => {newGradesCard.classList.remove("myhighlight")},300)
}
else {
document.querySelector(".new-grades-notif").classList.remove("on");
setTimeout(() => {document.querySelector(".new-grades-notif").remove();}, 500)
}
};
}
}
attachNewGradesMarkAsReadBtnListener() {
document.querySelector(".new-grades-mark-as-read").onclick = () => {
this.newGrades = [];
this.savedReadGrades = Array(...this.grades);
this.saveReadGrades();
if (document.querySelector(".new-grades-card").children.length > 1) {
document.querySelector(".new-grades-card").children[1].remove()
}
document.querySelector(".new-grades-card").classList.add("none");
document.querySelector(".new-grades-card-header").classList.add("none");
document.querySelector(".new-grades-card-title").innerHTML = this.lang == "fr"
? `Pas de nouvelle note${this.error ? ", que je sache (mode offline)" : ""}`
: `No new grade${this.error ? ", as far as I know (offline mode)" : ""}`
;
document.querySelector(".new-grades-card-title").classList.add("none");
document.querySelector(".new-grades-mark-as-read").parentElement.disabled = true;
document.querySelector(".new-grades-mark-as-read").parentElement.style.display = "none";
document.querySelector(".new-grades-notif")?.classList?.remove("on");
setTimeout(() => {
document.querySelector(".new-grades-notif")?.remove();
}, 500)
this.renderRecentGrades()
};
}
attachAllNewGradesSubjectCardsListener(container=document) {
if (container instanceof HTMLElement || container instanceof HTMLDocument) {
container.querySelectorAll(".new-grades-subject-card").forEach(card => { // Scroll to the corresponding subject/grade on which the user clicked
this.attachNewGradesSubjectCardsListener(card);
})
}
}
attachNewGradesSubjectCardsListener(card) {
if (card instanceof HTMLElement && card.classList.contains("new-grades-subject-card")) {
card.onclick = (e) => {
if (e.target.dataset.semester) {
this.currentSemester = e.target.dataset.semester;
document.querySelectorAll('.filter-tab').forEach(t => t.classList.remove('active'));
document.getElementById('filter-tab-semester-'+this.currentSemester).classList.add('active');
this.generateContent({fadeIn: false});
this.saveSemesterFilter();
}
const targetElem = document.getElementById(`subject-card-semester-${e.target.dataset.semester}-subject-${e.target.dataset.subject}`);
this.unfoldSubjCard(targetElem);
this.scrollToClientHighestElem({id:targetElem.id, smooth: true, block: "center", margin:0})
targetElem.classList.add("scroll-to");
targetElem.onmouseenter = () => {targetElem.classList.remove("scroll-to")};
}
card.onmouseenter = (e) => {
card.classList.add("hover");
card.querySelector(".new-grades-subject-card-title").classList.add("hover");
}
card.onmouseleave = (e) => {
card.classList.remove("hover");
card.querySelector(".new-grades-subject-card-title").classList.remove("hover");
}
}
}
//#endregion
//#region filter/view mode listeners
attachFilterSemesterListener() {
document.querySelectorAll('.filter-tab').forEach(tab => {
tab.onclick = (e) => {
if (!e.target.classList.contains('active'))
{
document.querySelectorAll('.filter-tab').forEach(t => t.classList.remove('active'));
e.target.classList.add('active');
this.currentSemester = e.target.dataset.filter;
this.saveSemesterFilter();
this.removeCardFromSelection();
this.generateContent({fadeIn: true});
}
};
});
}
attachViewModeBtnsListener() {
document.querySelectorAll('.view-btn').forEach(btn => {
btn.onclick = (e) => {
const unclassifiedSection = document.querySelector(".unclassified-section");
this.releaseElementHeight(unclassifiedSection);
document.querySelectorAll('.view-btn').forEach(b => b.classList.remove('active'));
e.target.classList.add('active');
this.viewMode = e.target.dataset.view;
this.toggleFoldAllSubjCards();
this.saveViewMode();
this.holdElementHeight(unclassifiedSection, 1000);
};
});
}
attachFoldToggleBtnListener() {
document.querySelector(".fold-toggle").onclick = (e) => {
e.target.classList.toggle("active");
this.toggleFoldAllModuleCards();
}
}
//#endregion
//#region Selection Notifs listeners
attachNotifBtnsListener(notifDiv=document) {
if (notifDiv?.classList?.contains("selected-card-notif-div")) {
this.attachNotifDelBtnListener(notifDiv.querySelector(".selected-card-notif-div-del-btn"));
this.attachNotifScrollBtnListener(notifDiv.querySelector(".selected-card-notif-div-scroll-btn"));
}
else {
const validContainer = notifDiv instanceof HTMLElement || notifDiv instanceof HTMLDocument ? notifDiv : document;
validContainer.querySelectorAll(".selected-card-notif-div-del-btn").forEach(delBtn => {
this.attachNotifDelBtnListener(delBtn);
})
validContainer.querySelectorAll(".selected-card-notif-div-scroll-btn").forEach(scrollBtn => {
this.attachNotifScrollBtnListener(scrollBtn);
})
}
}
attachNotifDelBtnListener(delBtn) {
delBtn.onclick = (e) => {
const notifDiv = e.target.closest(".selected-card-notif-div");
this.removeCardFromSelection(notifDiv);
};
}
attachNotifScrollBtnListener(scrollBtn) {
scrollBtn.onclick = (e) => {
this.scrollToClientHighestElem({id: e.target.dataset.targetid, smooth: true, block: "center"})
}
}
//#endregion
//#region Module cards listeners
attachModuleInfoClearBtns() {
document.querySelectorAll(".module-info-clear.sim"). forEach(simClear => {
simClear.onclick = () => {
this.clearSimGrades(simClear.dataset.semester, simClear.dataset.module);
this.generateContent({fadeIn: true});
}
});
document.querySelectorAll(".module-info-clear.disabled").forEach(disClear => {
disClear.onclick = () => {
this.clearIgnoredGradesForModule(disClear.dataset.semester, disClear.dataset.module);
this.generateContent({fadeIn: true});
}
});
}
attachAllModuleDeleteBtnsListener(container=document.body) {
container.querySelectorAll(".module-delete-btn").forEach(btn => {
this.attachModuleCardDeleteBtnListener(btn);
})
}
attachModuleCardDeleteBtnListener(btn) {
btn.onclick = (e) => {this.moduleCardDeleteBtnAction(e)};
}
//#endregion
//#region Subject cards listeners
attachAllSubjectCardRelatedEvenListenersForEverySubjectCard(container=document.body) {
if (this.editMode) {this.attachOnDragEventListeners(container);}
this.attachAllDragOrTickIconsListener(container);
this.attachAllSubjectNameInputsListener(container);
this.attachAllSubjectCoefInputBoxesListeners(container);
this.attachAllSubjectsDeleteBtnListener(container);
this.attachCheckboxesListeners(container);
this.attachAllSubjectSimAddBtnsListener(container);
this.attachAllSubjectSimDelBtnsListener(container);
this.attachAllSubjectSimInputEditsListener(container);
}
attachAllSubjectCardRelatedEventListeners(subjCard) {
const isClassified = subjCard.classList.contains("classified");
const isDetailed = subjCard.classList.contains("detailed");
const coefInputBox = subjCard.querySelector(".subject-coef-input-box");
const nameInputBox = subjCard.querySelector(".subject-name.input");
const simAddBtn = subjCard.querySelector(".sim-add-btn");
const simDelBtn = subjCard.querySelector(".sim-del-btn");
if (isClassified) {this.attachCheckboxesListeners(subjCard);}
if (isDetailed) {this.attachAllSubjectSimInputEditsListener(subjCard);}
if (coefInputBox) {this.attachSubjectCoefInputBoxListeners(coefInputBox);}
if (nameInputBox) {this.attachSubjectNameInputListener(nameInputBox);}
if (simAddBtn) {this.attachSubjectSimAddBtnListener(simAddBtn);}
if (simDelBtn) {this.attachSubjectSimDelBtnListener(simDelBtn);}
this.attachDragOrTickIconListener(subjCard)
if (this.editMode) {this.attachSubjectCardOnDragEventListeners(subjCard);};
}
/** Ensures all selected Subject Cards have a tick icon with their assigned event listeners instead of the default drag icon, and attach them the correct event listener */
attachAllDragOrTickIconsListener(container=document.body) {
container.querySelectorAll(".subject-card, .module-card").forEach(card => {
this.attachDragOrTickIconListener(card);
})
}
attachDragOrTickIconListener(card) {
const type = card?.classList?.contains("subject-card") ? "subject" : (card?.classList?.contains("module-card") ? "module" : undefined) ;
if (type) {
if (card.querySelector(`.drag-icon.${type}`)) {
const dragIcon = card.querySelector(`.drag-icon.${type}`);
dragIcon.onclick = (e) => { this.dragIconOnClickEvent(e) };
}
else
if (card.querySelector(`.tick-icon.${type}`)) {
const tick = card.querySelector(`.tick-icon.${type}`);
tick.onclick = (e) => { this.tickIconOnClickEvent(e, tick) };
}
}
}
attachAllSubjectCoefInputBoxesListeners(container=document.body) {
container.querySelectorAll(".subject-coef-input-box").forEach(inputBox => {
this.attachSubjectCoefInputBoxListeners(inputBox);
})
}
attachSubjectCoefInputBoxListeners(inputBox) {
inputBox.onchange = e => {
const semX = e.target.dataset.semester;
const moduleName = e.target.dataset.module;
const subject = e.target.dataset.subject;
const newCoef = e.target.value;
this.moduleConfig[semX][moduleName].coefficients[subject] = newCoef;
this.saveConfig();
this.getGradesDatas();
this.regenAveragesAndTotalCoefs(semX, moduleName, subject);
};
}
attachAllSubjectsDeleteBtnListener(container=document.body) {
container.querySelectorAll(".subject-delete-btn").forEach(btn => {
this.attachSubjectCardDeleteBtnListener(btn);
})
}
attachSubjectCardDeleteBtnListener(btn) {
btn.onclick = (e) => {this.subjectCardDeleteBtnAction(e.target)};
}
attachCheckboxesListeners(container=document.body) {
// Reusable method to attach listeners to grade checkboxes
container.querySelectorAll('.grade-checkbox').forEach(chbx => {
chbx.onclick = (e) => {
const semX = e.target.dataset.semester;
const module = e.target.dataset.module;
const subj = e.target.dataset.subj;
const simTimeStamp = e.target.dataset.simtimestamp;
const gradeId = e.target.dataset.gradeid;
const ignoredKey = [semX, subj, simTimeStamp || gradeId].join("\\");
if (e.target.checked) {
// remove this specific ignored key if present
this.disabledGrades = this.disabledGrades?.filter(id => id !== ignoredKey);
} else {
// add ignored key if not already present
if (!this.disabledGrades?.includes(ignoredKey)) this.disabledGrades.push(ignoredKey);
}
this.saveIgnoredGrades();
this.getGradesDatas();
document.querySelector(".average-number").innerHTML = this.moyennePonderee(this.grades);
// this.getGradesDatas({semX, module:undefined, subj});
this.regenAveragesAndTotalCoefs(semX, module, subj)
}
});
}
attachAllSubjectNameInputsListener(container=document.body) {
container.querySelectorAll(".subject-name.input").forEach(input => {
this.attachSubjectNameInputListener(input);
})
}
attachSubjectNameInputListener(input) {
input.onchange = (e) => {this.subjectCardNameInputAction(e.target)};
}
attachAllSubjectSimAddBtnsListener(container=document.body) {
container.querySelectorAll('.sim-add-btn').forEach(btn=>{
this.attachSubjectSimAddBtnListener(btn);
});
}
attachSubjectSimAddBtnListener(btn) {
btn.onclick = (e) => {this.subjectCardSimAddBtnAction(e.target)};
}
attachAllSubjectSimDelBtnsListener(container=document.body) {
container.querySelectorAll('.sim-del-btn').forEach(btn=>{
this.attachSubjectSimDelBtnListener(btn)
})
}
attachSubjectSimDelBtnListener(btn) {
btn.onclick = (e) => {this.subjectCardSimDelBtnAction(e.target)};
}
attachAllSubjectSimInputEditsListener(container=document.body) {
container.querySelectorAll(".simulated-grade-input-edit").forEach(input => {
this.attachSubjectSimInputEditListener(input)
})
}
attachSubjectSimInputEditListener(input) {
input.onchange = (e) => {this.subjectCardSimInputEditAction(e.target)};
}
//#endregion
//#endregion
//#region -—Events Action
//#region Over header btns
dismissAllOverHeaderBtns() {
this.dismissHelpOverHeaderBtns();
this.dismissIssuesOverHeaderBtns();
}
openIssuesOverHeaderBtns() {
const issueBtn = document.querySelector(".issue.issue-btn");
const mailInfo = document.querySelector(".issue.mail-info");
const shareConfig = document.querySelector(".issue.share-config");
const suggestIdea = document.querySelector(".issue.suggest-idea");
const reportIssue = document.querySelector(".issue.report-issue");
issueBtn .classList.add("open");
mailInfo .classList.add("open"); mailInfo .tabIndex = "0";
shareConfig.classList.add("open"); shareConfig.tabIndex = "0";
suggestIdea.classList.add("open"); suggestIdea.tabIndex = "0";
reportIssue.classList.add("open"); reportIssue.tabIndex = "0";
}
dismissIssuesOverHeaderBtns() {
const issueBtn = document.querySelector(".issue.issue-btn");
const mailInfo = document.querySelector(".issue.mail-info");
const shareConfig = document.querySelector(".issue.share-config");
const suggestIdea = document.querySelector(".issue.suggest-idea");
const reportIssue = document.querySelector(".issue.report-issue");
issueBtn .classList.remove("open");
mailInfo .classList.remove("open"); mailInfo .tabIndex = "-1";
shareConfig.classList.remove("open"); shareConfig.tabIndex = "-1";
suggestIdea.classList.remove("open"); suggestIdea.tabIndex = "-1";
reportIssue.classList.remove("open"); reportIssue.tabIndex = "-1";
}
openHelpOverHeaderBtns() {
const helpBtn = document.querySelector(".over-header-btn.how-to-use-btn");
const helpMenu = document.querySelector(".over-header-how-to-use-btns");
const docBtn = document.querySelector(".over-header-btn.doc-btn");
// const tutoBtn = document.querySelector(".over-header-btn.tuto-btn");
helpBtn .classList.add("open");
helpMenu.style.display = "";
clearTimeout(this.timeouts?.openHelpMenu);
this.timeouts.openHelpMenu = setTimeout(()=>{helpMenu.classList.add("open");}, 10);
docBtn .tabIndex = "0";
// tutoBtn .tabIndex = "0";
this.dismissFirstTimeNotif();
}
dismissHelpOverHeaderBtns() {
const helpBtn = document.querySelector(".over-header-btn.how-to-use-btn");
const helpMenu = document.querySelector(".over-header-how-to-use-btns");
const docBtn = document.querySelector(".over-header-btn.doc-btn");
// const tutoBtn = document.querySelector(".over-header-btn.tuto-btn");
helpBtn .classList.remove("open");
helpMenu .classList.remove("open");
clearTimeout(this.timeouts?.openHelpMenu);
this.timeouts.openHelpMenu = setTimeout(()=>{helpMenu.style.display = "none";}, 200);
docBtn .tabIndex = "-1";
// tutoBtn .tabIndex = "-1";
}
dismissFirstTimeNotif() {
const newUserNotif = document.querySelector(".new-user-notif");
if (newUserNotif) {
const newUserNotifFullScreen = document.querySelector(".new-user-notif-fullscreen-effect");
const newUserNotifArrows = document.querySelectorAll(".new-user-notif-arrow-path");
newUserNotifFullScreen.classList.remove("focus");
setTimeout(() => {newUserNotifFullScreen.style.display = "none";}, 500);
newUserNotif.style.animationPlayState = "paused";
newUserNotifArrows.forEach(arrow => {arrow.style.animationPlayState = "paused";})
newUserNotif.style.top = `-40px`;
newUserNotif.style.opacity = "0%";
newUserNotif.style.cursor = "default";
newUserNotif.onclick = null;
setTimeout(() => {newUserNotif.style.display = "none"}, 300);
localStorage.setItem("ECAM_DASHBOARD_FIRST_LOAD", false);
this.firstLoad = false;
setTimeout(() => {newUserNotifFullScreen.remove(); newUserNotif.remove()}, 500);
}
}
//#endregion
//#region Modals
closeEveryModal() {
this.closeKeybindsModal();
this.closeOnlineCfgPickerModal();
this.closeSettingsModal();
}
openKeybindsModal(closeOtherModals=true) {
if (closeOtherModals) { this.closeEveryModal() }
const keybindsMenu = document.createElement("div");
keybindsMenu.className = "keyboard-shortcut-list-container";
keybindsMenu.id = "keyboardShortcutListContainer";
keybindsMenu.innerHTML = `
\>
${target}${!isSubject ? ` Module` : ""}
${this.lang == "fr" ? `est sélectionné!` : `is selected!`}
x
`;
return selectionNotifDiv;
}
// MARK: remove from subject selection
/**
* Manage all the actions involving the deletion of a card from the selection of cards
*
* @param {String} notifDiv the div of the notif linked to the selected subject card
*/
removeCardFromSelection(notifDiv="all") {
if (notifDiv=="all") { // clear all subject card selection as well as their respective notif
const selectedCardsId = this.selectedSubjectCardsId.length > 0 ? this.selectedSubjectCardsId : this.selectedModuleCardsId;
selectedCardsId.forEach(selectedCardId => {
const correspNotifDiv = document.querySelector(`.selected-card-notif-div[data-targetid="${selectedCardId}"]`);
correspNotifDiv.classList.remove("on");
setTimeout(() => {correspNotifDiv.remove();}, 300);
this.changeTickIconToDragIcon(document.getElementById(selectedCardId));
})
clearTimeout(this?.timeouts?.documentOnDragEnd?.hideTeacherTable);
if (!this?.timeouts?.removeCardFromSelection) { this.timeouts.removeCardFromSelection = {} }
this.timeouts.removeCardFromSelection.hideTeacherTable = setTimeout(() => {document.querySelectorAll(".grades-table-header-teacher").forEach(teacher => {teacher.style.display = "table-cell"})}, 100);
document.querySelector(".semester-content") .classList.remove("dragging");
document.querySelector(".drop-field.create-module") .classList.remove("show");
document.querySelector(".drop-field-create-module-hitbox") .classList.remove("show");
document.querySelector(".drop-field.remove-from-module") .classList.remove("show");
document.querySelector(".drop-field-remove-from-module-hitbox") .classList.remove("show");
this.selectedSubjectCardsId = [];
this.selectedModuleCardsId = [];
this.selectedSubjectCardsSortedByModule = {};
}
else if (notifDiv?.classList?.contains("selected-card-notif-div")) { // clear the specifically given notifDiv from the selection
const card = document.getElementById(notifDiv.dataset.targetid);
const type = notifDiv.dataset.type;
notifDiv.classList.remove("on");
setTimeout(()=>{notifDiv.remove()}, 300);
if (type == "subject") {
if (this.selectedSubjectCardsId.includes(card.id)) this.selectedSubjectCardsId.splice(this.selectedSubjectCardsId.indexOf(card.id), 1);
Object.keys(this.selectedSubjectCardsSortedByModule).forEach(moduleName => {
this.selectedSubjectCardsSortedByModule[moduleName].forEach((selectedSubjectCard, subjIndex) => {
this.selectedSubjectCardsSortedByModule[moduleName].splice(subjIndex, 1);
})
if (this.selectedSubjectCardsSortedByModule[moduleName].length == 0) {
delete this.selectedSubjectCardsSortedByModule[moduleName];
}
})
if (this.selectedSubjectCardsId.length == 0) this.draggedElementOnDragEndAction(null, card);
}
else if (type == "module") {
if (this.selectedModuleCardsId.includes(card.id)) this.selectedModuleCardsId.splice(this.selectedModuleCardsId.indexOf(card.id), 1);
if (this.selectedModuleCardsId.length == 0) this.draggedElementOnDragEndAction(null, card);
}
this.changeTickIconToDragIcon(card);
}
// Ensure the subject insertion drop fields are displaying the right text
document.querySelectorAll(".drop-field.insert-field").forEach(subjInsertField => {
if (this.selectedSubjectCardsId.length == 0 && this.selectedModuleCardsId.length == 0) {
subjInsertField.querySelector(".drop-module-card-insert-plus , .drop-subject-card-insert-plus ").classList.add("show");
subjInsertField.querySelector(".drop-module-card-insert-arrow, .drop-subject-card-insert-arrow").classList.remove("show");
subjInsertField.querySelector(".drop-module-card-insert-text, .drop-subject-card-insert-text" ).classList.replace("insert", "add");
subjInsertField.querySelector(".drop-module-card-insert-text, .drop-subject-card-insert-text" ).parentElement.classList.replace("insert", "add");
}
else {
subjInsertField.querySelector(".drop-module-card-insert-plus , .drop-subject-card-insert-plus ").classList.remove("show");
subjInsertField.querySelector(".drop-module-card-insert-arrow, .drop-subject-card-insert-arrow").classList.add("show");
subjInsertField.querySelector(".drop-module-card-insert-text, .drop-subject-card-insert-text" ).classList.replace("add", "insert");
subjInsertField.querySelector(".drop-module-card-insert-text, .drop-subject-card-insert-text" ).parentElement.classList.replace("add", "insert");
}
});
}
//#endregion
//#region -— Drop fields actions ________________
// MARK: attach dropFields listeners
attachDropFieldsEventListeners(target="all", insertFieldsContainer="") {
const dropFieldAdd = document.querySelector(".drop-field.create-module");
const dropFieldAddHitbox = document.querySelector(".drop-field-create-module-hitbox");
const dropFieldRemove = document.querySelector(".drop-field.remove-from-module");
const dropFieldRemoveHitbox = document.querySelector(".drop-field-remove-from-module-hitbox");
const insertFieldHitboxes = (insertFieldsContainer || document).querySelectorAll(".drop-subject-card-insert-hitbox, .drop-module-card-insert-hitbox");
if (target == "add" || target == "all") {
dropFieldAdd.style.background = "";
dropFieldAddHitbox.ondragover = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldAdd.classList.add("hover");
dropFieldAdd.querySelectorAll(".drop-field-create-module-text, .drop-field-create-module-plus").forEach(text => {text.classList.add("hover");})
}};
dropFieldAddHitbox.ondragleave = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldAdd.classList.remove("hover");
dropFieldAdd.querySelectorAll(".drop-field-create-module-text, .drop-field-create-module-plus").forEach(text => {text.classList.remove("hover");})
}};
dropFieldAddHitbox.ondrop = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
e.dataTransfer.dropEffect = "link";
dropFieldAdd.classList.remove("hover");
dropFieldAdd.querySelectorAll(".drop-field-create-module-text, .drop-field-create-module-plus").forEach(text => {text.classList.remove("hover");})
this.dropFieldToNewModuleAction(e.dataTransfer.getData("text"));
}};
// Custom :hover event, cuz otherwise it would trigger when the fields are not shown
dropFieldAddHitbox.onmouseenter = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldAdd.classList.add("hover");
dropFieldAdd.querySelectorAll(".drop-field-create-module-text, .drop-field-create-module-plus").forEach(text => {text.classList.add("hover");})
}};
dropFieldAddHitbox.onmouseleave = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldAdd.classList.remove("hover");
dropFieldAdd.querySelectorAll(".drop-field-create-module-text, .drop-field-create-module-plus").forEach(text => {text.classList.remove("hover");})
}};
dropFieldAddHitbox.onclick = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
e.target.classList.remove("hover");
e.target.querySelectorAll(".drop-field-create-module-text, .drop-field-create-module-plus").forEach(text => {text.classList.remove("hover");})
if (this.selectedSubjectCardsId.length > 0) {
this.dropFieldToNewModuleAction(this.selectedSubjectCardsId[0]);
}
}};
}
if (target == "remove" || target == "all") {
dropFieldRemove.style.background = "";
dropFieldRemoveHitbox.ondragover = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldRemove.classList.add("hover");
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-text").forEach(text => {text.classList.add("hover");})
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-minus").forEach(text => {text.classList.add("hover", "slight-horiz-shake"); text.onanimationend = () => {text.classList.remove("slight-horiz-shake"); text.onanimationend = null;}})
}};
dropFieldRemoveHitbox.ondragleave = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldRemove.classList.remove("hover");
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-text").forEach(text => {text.classList.remove("hover");})
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-minus").forEach(text => {text.classList.remove("hover", "slight-horiz-shake"); text.onanimationend = null;})
}};
dropFieldRemoveHitbox.ondrop = (e) => {if (e.target.classList.contains("show")){
e.preventDefault();
e.dataTransfer.dropEffect = "link";
dropFieldRemove.classList.remove("hover");
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-text").forEach(text => {text.classList.remove("hover");})
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-minus").forEach(text => {text.classList.remove("hover", "slight-horiz-shake"); text.onanimationend = null;})
this.dropFieldRemoveAction(e.dataTransfer.getData("text"));
}};
// Custom :hover event, cuz otherwise it would trigger when the fields are not shown
dropFieldRemoveHitbox.onmouseenter = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldRemove.classList.add("hover");
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-text").forEach(text => {text.classList.add("hover");})
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-minus").forEach(text => {text.classList.add("hover", "slight-horiz-shake"); text.onanimationend = () => {text.classList.remove("slight-horiz-shake"); text.onanimationend = null;}})
}};
dropFieldRemoveHitbox.onmouseleave = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldRemove.classList.remove("hover");
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-text").forEach(text => {text.classList.remove("hover");})
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-minus").forEach(text => {text.classList.remove("hover", "slight-horiz-shake"); text.onanimationend = null;})
}};
dropFieldRemoveHitbox.onclick = (e) => {if (e.target.classList.contains("show")) {
e.preventDefault();
dropFieldRemove.classList.remove("hover");
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-text").forEach(text => {text.classList.remove("hover");})
dropFieldRemove.querySelectorAll(".drop-field-remove-from-module-minus").forEach(text => {text.classList.remove("hover", "slight-horiz-shake"); text.onanimationend = null;})
if (this.selectedSubjectCardsId.length > 0) {
this.dropFieldRemoveAction(this.selectedSubjectCardsId[0]);
}
}};
}
if (target == "insert" || target == "all") {
insertFieldHitboxes.forEach(insertFieldHitbox => {
this.attachInsertFieldHitboxEventListeners(insertFieldHitbox)
})
}
}
// MARK: dropFieldToNewModuleAction
dropFieldToNewModuleAction(cardId, index=0) {
const sem = this.currentSemester;
let bypasseReplacement = false;
let newModuleConfig = {subjects: [], coefficients: {}};
let newModuleName = "Module 1"; let count = 1;
if (!this.moduleConfig[sem]) this.moduleConfig[sem] = {__modules__: []};
while (this.moduleConfig?.[sem]?.[newModuleName]) {count++; newModuleName = `Module ${count}`;}
if (cardId) {
const card = document.getElementById(cardId);
if (card.classList.contains('subject-card')) {
let cardIsSelected = false;
this.selectedSubjectCardsId.forEach(selectedSubjectCardId => {if (selectedSubjectCardId == card.id) cardIsSelected = true;});
let subject, oldModuleName, manageSim = true;
if (!this.sim[sem]) manageSim = false;
if (!cardIsSelected) { // 1 unselected subj card dropped in the drop field "add"
subject = card.dataset.subject;
oldModuleName = card.dataset.module;
const moduleIndex = this.moduleConfig[sem].__modules__.indexOf(oldModuleName);
if (!card.classList.contains("unclassified")) { // If the subj card doesn't come from the unclassified container:
// We get its index in its module configured in moduleConfig
const subjectIndex = this.moduleConfig[sem][oldModuleName].subjects.indexOf(subject);
if (this.moduleConfig[sem][oldModuleName].subjects.toSpliced(subjectIndex,1).length == 0 && oldModuleName.match(/Module (\d)/)) {
// If the action of removing the subject's name from the list of subject names of the module empties the list, then we don't delete anything at all:
// the subj card was the only subj card of its previous module card, therefore we don't need to create nor make a new one, we just set the subject's coef to 100%.
// This case is only to avoid taking a subj card from a module named "Module [X]", putting it in a new module named "Module [X+1]", deleting "Module [X]",
// and realizing that it was pointless lol
// newModuleName = oldModuleName;
// newModuleConfig.coefficients[subject] = 100;
bypasseReplacement = true;
}
else {
newModuleConfig = {subjects: [subject], coefficients: {[subject]: 100}};
this.moduleConfig[sem][oldModuleName].subjects.splice(subjectIndex,1);
delete this.moduleConfig[sem][oldModuleName].coefficients[subject];
if (manageSim) {if (!this.sim[sem][oldModuleName]) manageSim = false;}
if (manageSim) {
this.sim[sem] = {[newModuleName]: {}, ...this.sim[sem]}
this.sim[sem][newModuleName][subject] = [];
this.sim[sem][oldModuleName][subject].forEach((_, index) => {
this.sim[sem][newModuleName][subject].push(this.sim[sem][oldModuleName][subject][index].shift())
})
this.deleteUnusedSimPath(false, sem, oldModuleName, subject);
this.saveSim();
}
}
if (this.moduleConfig[sem][oldModuleName].subjects.length == 0) {
this.moduleConfig[sem].__modules__.splice(moduleIndex, 1);
delete this.moduleConfig[sem][oldModuleName];
}
}
else {
newModuleConfig = {subjects: [subject], coefficients: {[subject]: 100}};
}
} else { // multiple subj cards dropped through selection in the drop field "add"
let remainingCoef = 100;
// Scanning through all the modules of the selected matiere cards to get the name of the module of name "Module [x]", so that instead of creating a new Module,
// we replace the module with the lowest x that would have been deleted
let lowestModuleIndexNameToReplace = -1;
Object.keys(this.selectedSubjectCardsSortedByModule).forEach((_moduleName, _moduleIndex) => {
const _moduleSelection = this.selectedSubjectCardsSortedByModule[_moduleName];
const match = _moduleName.match(/Module (\d+)/);
// if the name matches "Module [x]" (1st condition)
// and if the selection of subj cards of same module that will be removed from their module matches the number of subj in the said module (cond 2):
// we save the number of the module
if (match && _moduleSelection.length == this.moduleConfig[sem][_moduleName].subjects.length) {
lowestModuleIndexNameToReplace = match[1];
}
})
if (lowestModuleIndexNameToReplace > -1) {
newModuleName = "Module "+lowestModuleIndexNameToReplace;
}
Object.keys(this.selectedSubjectCardsSortedByModule).forEach((_moduleName, _moduleIndex) => {
oldModuleName = _moduleName;
const _moduleSelection = this.selectedSubjectCardsSortedByModule[oldModuleName];
_moduleSelection.forEach((selectedSubjectCard, _subjIndex) => {
const subjectCard = document.getElementById(selectedSubjectCard.cardId);
const selectionIndex = selectedSubjectCard.selectionIndex;
subject = subjectCard.dataset.subject;
if (selectionIndex+1 == this.selectedSubjectCardsId.length) {
newModuleConfig.coefficients[subject] = remainingCoef;
} else {
const coef = Math.round(100/this.selectedSubjectCardsId.length);
newModuleConfig.coefficients[subject] = coef;
remainingCoef -= coef;
}
newModuleConfig.subjects[selectionIndex] = subject;
if (!subjectCard.classList.contains("unclassified")) {
// removing the subject card from its former module
const oldModuleIndex = this.moduleConfig[sem].__modules__.indexOf(oldModuleName); // get the old module's index in the modules ordered array of the semester
const subjectIndexInOldModule = this.moduleConfig[sem][oldModuleName].subjects.indexOf(subject); // get the subject's index in the subjects ordered array of the old module
delete this.moduleConfig[sem][oldModuleName].coefficients[subject]; // delete coefficient data
this.moduleConfig[sem][oldModuleName].subjects.splice(subjectIndexInOldModule,1); // remove the subject from the subjects ordered array of the old module
if (this.moduleConfig[sem][oldModuleName].subjects.length == 0) {
// If, after removing the subject card from its former module, the said module is empty, we remove it
delete this.moduleConfig[sem][oldModuleName];
this.moduleConfig[sem].__modules__.splice(oldModuleIndex, 1);
}
if (manageSim) {if (!this.sim[sem][oldModuleName][subject]) manageSim = false} // checking if the subject card had sim grades
if (manageSim) {
// if the subject card had sim grades, change their path in this.sim to match the module change
this.sim[sem][newModuleName][subject] = [];
this.sim[sem][oldModuleName][subject].forEach((_, index) => {
this.sim[sem][newModuleName][subject].push(this.sim[sem][oldModuleName][subject][index].shift())
})
this.deleteUnusedSimPath(false, sem, oldModuleName, subject);
this.saveSim();
}
}
})
})
// this the last step, so that if the new module has the same same as an old module that gets deleted (in order to replace it, "Module [x]" case), we don't remove the wrong one
this.moduleConfig[sem][newModuleName] = newModuleConfig;
this.moduleConfig[sem].__modules__.splice(index, 0, newModuleName);
}
}
else if (card.classList.contains('module-card')) {
let cardIsSelected = false;
this.selectedModuleCardsId.forEach(selectedModuleCardId => {if (selectedModuleCardId == card.id) cardIsSelected = true;});
let oldModuleName, manageSim = true;
if (!this.sim[sem]) manageSim = false;
if (!cardIsSelected) { // 1 unselected module card dropped in the "add" drop field
oldModuleName = card.dataset.module;
newModuleName = oldModuleName;
const moduleIndex = this.moduleConfig[sem].__modules__.indexOf(oldModuleName);
// reordering the dropped module card first in the list of modules
this.moduleConfig[sem].__modules__.splice(moduleIndex,1);
this.moduleConfig[sem].__modules__.splice(0,0,oldModuleName);
} else { // multiple module cards dropped through selection in the "add" drop field
let remainingCoef = 100;
// Scanning through all the selected module cards to get their name if they match "Module [x]", so that instead of creating a new module name,
// we replace the module with the lowest x that would have been deleted
let lowestModuleIndexNameToReplace = count;
Object.keys(this.selectedModuleCardsId).forEach(_moduleName => {
const match = _moduleName.match(/Module (\d+)/);
// if the name matches "Module [x]" (1st condition)
// and if the selection of subj cards of same module that will be removed from their module matches the number of subj in the said module (2nd condition):
// we save the number of the module
if (parseInt(match?.[1] || lowestModuleIndexNameToReplace) < lowestModuleIndexNameToReplace) {
lowestModuleIndexNameToReplace = parseInt(match[1]);
}
})
// correcting the the name of the new module in case it should inherit the name of one of the selected module card
// because the later had a lower index than the new module's name anticipated
if (lowestModuleIndexNameToReplace < count) {
newModuleName = "Module "+lowestModuleIndexNameToReplace;
}
// Initiating the new module's data
newModuleConfig = {subjects: [], coefficients: {}};
// scanning through all the selected modules
this.selectedModuleCardsId.forEach(_moduleCardId => {
const selectedModuleCard = document.getElementById(_moduleCardId);
const selectedModuleName = selectedModuleCard.dataset.module;
// scanning through all the currently scanned selected module's subjects
this.moduleConfig[sem][selectedModuleName].subjects.forEach(_subjectName => {
const coef = this.moduleConfig[sem][selectedModuleName].coefficients[_subjectName];
// adding the info of the subject in the new module
newModuleConfig.subjects.push(_subjectName);
newModuleConfig.coefficients[_subjectName] = coef;
})
// deleting the selected module once all its informations have been transfered to the new module
delete this.moduleConfig[sem][selectedModuleName]
})
// this the last step, so that if the new module has the same same as an old module that gets deleted (in order to replace it, "Module [x]" case), we don't remove the wrong one
this.moduleConfig[sem][newModuleName] = newModuleConfig;
this.moduleConfig[sem].__modules__.splice(index, 0, newModuleName);
}
}
}
else {
const newSubjName = this.lang == "fr" ? "Nouvelle matière" : "New subject";
newModuleConfig.subjects.push(newSubjName);
newModuleConfig.coefficients[newSubjName] = 100;
}
if (!document.getElementById(cardId)?.classList?.contains('module-card') && !bypasseReplacement) {
// Editing the module config
this.moduleConfig[sem][newModuleName] = newModuleConfig;
const newModuleIndexInSem = this.moduleConfig[sem].__modules__.indexOf(newModuleName);
if (newModuleIndexInSem > -1) {
this.moduleConfig[sem].__modules__.splice(newModuleIndexInSem, 1, newModuleName)
}
else {
this.moduleConfig[sem].__modules__.splice(index, 0, newModuleName)
}
}
this.removeCardFromSelection();
this.saveConfig();
this.getGradesDatas();
this.generateContent();
this.scrollToClientHighestElem("first/ignore-setting", {id: `module-card-${newModuleName}-in-semester-${sem}`, smooth: true})
}
// MARK: dropFieldRemoveAction
dropFieldRemoveAction(cardId) {
const card = document.getElementById(cardId);
let cardIsSelected = false;
this.selectedSubjectCardsId.forEach(selectedSubjectCardId => {if (selectedSubjectCardId == card.id) cardIsSelected = true;})
if (card?.classList?.contains("subject-card") && !card?.classList?.contains("unclassified")) {
const sem = card.dataset.semester;
const module = card.dataset.module;
const subj = card.dataset.subject;
if (!cardIsSelected) {
const moduleIndex = this.moduleConfig[sem].__modules__.indexOf(module);
const subjectIndex = this.moduleConfig[sem][module].subjects.indexOf(subj);
this.moduleConfig[sem][module].subjects.splice(subjectIndex,1);
delete this.moduleConfig[sem][module].coefficients[subj];
if (this.moduleConfig[sem][module].subjects.length == 0) {
this.moduleConfig[sem].__modules__.splice(moduleIndex, 1);
delete this.moduleConfig[sem][module];
}
}
else {
let subject = "";
this.selectedSubjectCardsId.forEach(selectedSubjectCardId => {
const selectedSubjectCard = document.getElementById(selectedSubjectCardId);
subject = selectedSubjectCard.dataset.subject;
const moduleIndex = this.moduleConfig[sem].__modules__.indexOf(module);
const subjectIndex = this.moduleConfig[sem][module].subjects.indexOf(subject);
this.moduleConfig[sem][module].subjects.splice(subjectIndex,1);
delete this.moduleConfig[sem][module].coefficients[subject];
if (this.moduleConfig[sem][module].subjects.length == 0) {
this.moduleConfig[sem].__modules__.splice(moduleIndex, 1);
delete this.moduleConfig[sem][module];
}
if (this.compactSubjCardsId.includes(selectedSubjectCard)) {
this.compactSubjCardsId.splice(this.compactSubjCardsId.indexOf(selectedSubjectCard), 1);
}
if (this.detailedSubjCardsId.includes(selectedSubjectCard)) {
this.detailedSubjCardsId.splice(this.detailedSubjCardsId.indexOf(selectedSubjectCard), 1);
}
})
}
if (this.moduleConfig[sem].__modules__.length == 0) {delete this.moduleConfig[sem]}
this.removeCardFromSelection();
this.saveConfig();
this.getGradesDatas();
this.generateContent();
}
else if (card?.classList?.contains("subject-card") && card?.classList?.contains("unclassified") && cardIsSelected) {
this.removeCardFromSelection();
}
else if (card?.classList?.contains("module-card")) {
if (cardIsSelected) {
this.selectedModuleCardsId.forEach(cardId => {
const moduleCard = document.getElementById(cardId);
if (moduleCard) {
this.moduleCardDeleteBtnAction(moduleCard);
}
this.removeCardFromSelection();
})
}
else {
this.moduleCardDeleteBtnAction(card);
}
}
}
// MARK: dropFieldSubjectInsertAction
dropFieldSubjectInsertAction(cardId=null, methodCaller=null) {
const sem = this.currentSemester;
if (cardId) { // When dropping a ".drop-field.insert-field.subject" class div
const card = document.getElementById(cardId);
if (card?.classList?.contains('subject-card')) {
let cardIsSelected = false;
this.selectedSubjectCardsId.forEach(selectedSubjectCardId => {if (selectedSubjectCardId == card.id) cardIsSelected = true;});
const targetModuleName = methodCaller.dataset.module;
const insertionIndex = methodCaller.dataset.index;
// The same thing happens whether this method is triggered from a selection or a single subject card, we just have to choose the right card id
(cardIsSelected ? this.selectedSubjectCardsId : [card.id]).forEach(subjectCardId => {
const subjectCard = document.getElementById(subjectCardId);
const subject = subjectCard.dataset.subject;
const oldModuleName = subjectCard.dataset.module;
const oldModuleIndex = this.moduleConfig[sem].__modules__.indexOf(oldModuleName);
const subjectOldIndex = this.moduleConfig?.[sem]?.[oldModuleName]?.subjects?.indexOf(subject);
// CASE 1: subject card comes from unclassified section to a module -> (default/easy case)
// CASE 2: subject card comes from a module to another module -> (moving case)
// CASE 3: subject card comes from a module to the same module at a different index -> (reordering case)
// CASE 4: subject card comes from a module to the same module at the same index -> (it's no-use, so nothing happens. It shouldn't be reached though, since the adjacent insertion fields disappear when dragging a card)
switch (`
subject card comes from ${oldModuleName
? `a module and is ${targetModuleName==oldModuleName
? `reorganized to ${subjectOldIndex == insertionIndex || subjectOldIndex+1 == insertionIndex
? "the same index"
: "a different index"}`
: "moved to a different module"}`
: "the unclassified section"}
`.trim()) {
case "subject card comes from the unclassified section":
// Just set the unclassified subject in the moduleConfig
this.moduleConfig[sem][targetModuleName].subjects.splice(insertionIndex, 0, subject);
this.moduleConfig[sem][targetModuleName].coefficients[subject] = this.gradesDatas[sem][targetModuleName].totalCoefSubjects <= 100 ? (100 - this.gradesDatas[sem][targetModuleName].totalCoefSubjects) : 0;
break;
case "subject card comes from a module and is moved to a different module":
// We move the datas from the old module to the new module
this.moduleConfig[sem][targetModuleName].subjects.splice(insertionIndex, 0, subject);
this.moduleConfig[sem][targetModuleName].coefficients[subject] = Number (this.moduleConfig[sem][oldModuleName].coefficients[subject]);
this.moduleConfig[sem][oldModuleName].subjects.splice(subjectOldIndex, 1);
delete this.moduleConfig[sem][oldModuleName].coefficients[subject];
break;
case "subject card comes from a module and is reorganized to a different index":
// We move the datas while paying attention to at which index was the original subject before moving it (in order to not mess up with the insertion index)
this.moduleConfig[sem][targetModuleName].subjects.splice(insertionIndex, 0, subject);
this.moduleConfig[sem][targetModuleName].coefficients[subject] = Number (this.moduleConfig[sem][oldModuleName].coefficients[subject]);
const subjectCorrectOldIndex = subjectOldIndex + (insertionIndex<=subjectOldIndex && this.moduleConfig[sem][targetModuleName].subjects.includes(subject) ? 1 : 0);
this.moduleConfig[sem][oldModuleName].subjects.splice(subjectCorrectOldIndex, 1);
break;
case "subject card comes from a module and is reorganized to the same index":
"Alas, nothing happens... This case is never reached!";
break;
}
if (this.moduleConfig[sem]?.[oldModuleIndex]?.subjects?.length == 0) {
this.moduleConfig[sem]?.__modules__?.splice(oldModuleIndex, 1);
delete this.moduleConfig[sem][oldModuleIndex];
if (this.moduleConfig?.[sem]?.__modules__?.length == 0) {
delete this.moduleConfig[sem]
}
}
})
this.removeCardFromSelection();
this.saveConfig();
this.getGradesDatas();
this.generateContent();
this.setGradesTableTotalCoef();
}
else if (card?.classList?.contains('module-card')) { // Inserting all selected module cards at the place of the insertion field, in order of selection
let cardIsSelected = false;
this.selectedModuleCardsId.forEach(selectedModuleCardId => {if (selectedModuleCardId == card.id) cardIsSelected = true;});
const targetModuleName = methodCaller.dataset.module;
const insertionIndex = parseInt(methodCaller.dataset.index);
if (targetModuleName) {
// reversing the list of selected module cards so that the insertion index can remain constant
(cardIsSelected ? this.selectedModuleCardsId.reverse() : [card.id]).forEach(moduleCardId => {
const moduleCard = document.getElementById(moduleCardId);
const oldModuleName = moduleCard.dataset.module;
const oldModuleIndex = this.moduleConfig[sem].__modules__.indexOf(oldModuleName);
const subjectCards = Array.from(moduleCard.querySelectorAll(".subject-card"));
// reversing the list of subject cards so that the insertion index can remain constant
subjectCards.reverse().forEach((subjectCard, _index) => {
const subject = subjectCard.dataset.subject;
this.moduleConfig[sem][targetModuleName].subjects.splice(insertionIndex, 0, subject);
this.moduleConfig[sem][targetModuleName].coefficients[subject] = Number(this.moduleConfig[sem][oldModuleName].coefficients[subject]);
this.moduleConfig[sem][oldModuleName].subjects.splice(this.moduleConfig[sem][oldModuleName].subjects.length-1,1);
delete this.moduleConfig[sem][oldModuleName].coefficients[subject];
})
this.moduleConfig[sem].__modules__.splice(oldModuleIndex, 1)
delete this.moduleConfig[sem][oldModuleName];
if (this.moduleConfig?.[sem]?.__modules__?.length == 0) {
delete this.moduleConfig[sem]
}
})
}
else {
(cardIsSelected ? this.selectedModuleCardsId : [card.id]).forEach((moduleCardId, _index) => {
const moduleCard = document.getElementById(moduleCardId);
const oldModuleName = moduleCard.dataset.module;
const oldModuleIndex = this.moduleConfig[sem].__modules__.indexOf(oldModuleName);
const correctedInsertionIndex = insertionIndex < oldModuleIndex ? insertionIndex + _index : insertionIndex;
const correctedOldModuleIndex = correctedInsertionIndex < oldModuleIndex ? oldModuleIndex + 1 : oldModuleIndex;
// Insert the module at the right place,
this.moduleConfig[sem].__modules__.splice(correctedInsertionIndex, 0, oldModuleName)
this.moduleConfig[sem].__modules__.splice(correctedOldModuleIndex, 1)
})
}
this.removeCardFromSelection();
this.saveConfig();
this.getGradesDatas();
this.generateContent();
this.setGradesTableTotalCoef();
}
}
else { // When clicking on a ".drop-field.insert-field.subject" class div
const addDivClicked = methodCaller;
const sem = addDivClicked.dataset.semester;
const module = addDivClicked.dataset.module;
const moduleCard = document.getElementById(`module-card-${module}-in-semester-${sem}`);
const moduleDetails = moduleCard.querySelector(".module-details");
let newSubjName = `${this.lang == "fr" ? "Nouvelle matière" : "New subject"} 1`; let count = 1;
while (this.gradesDatas[sem][module].subjects[newSubjName]) {
count++; newSubjName = `${this.lang == "fr" ? "Nouvelle matière" : "New subject"} ${count}`;
}
const insertionIndex = methodCaller ? methodCaller.dataset.index : this.moduleConfig[sem][module].subjects.length;
this.moduleConfig [sem][module].subjects.splice(insertionIndex, 0, newSubjName);
this.moduleConfig [sem][module].coefficients [newSubjName] = 0;
this.saveConfig();
this.getGradesDatas();
moduleDetails.innerHTML = this.createAllSubjCards(sem, module);
this.attachAllSubjectCardRelatedEvenListenersForEverySubjectCard();
this.setGradesTableTotalCoef();
}
}
// MARK: dropFieldModuleInsertAction
dropFieldModuleInsertAction(cardId=null, methodCaller=null) {
const sem = this.currentSemester;
debugger;
if (cardId) {
const card = document.getElementById(cardId);
if (card?.classList?.contains("module-card")) {
const oldModuleIndex = card.dataset.index;
const newModuleIndex = methodCaller?.dataset?.index || 0;
const compensatedNewModuleIndex = oldModuleIndex > newModuleIndex ? newModuleIndex : newModuleIndex - 1;
const moduleName = this.moduleConfig[sem].__modules__.splice(oldModuleIndex, 1)[0];
this.moduleConfig[sem].__modules__.splice(compensatedNewModuleIndex,0,moduleName);
this.saveConfig();
this.getGradesDatas();
this.generateContent();
this.setGradesTableTotalCoef();
this.scrollToClientHighestElem({id: card.id, smooth: true})
}
}
}
// MARK: createDropFieldInsertionField
createDropFieldInsertionField(type="subject", {sem=0, moduleName="", index=-1}={sem:0, moduleName:"", index:-1}) {
const thereIsSelection = this.selectedSubjectCardsId.length > 0;
return `
+
→