feat: Mise à jour de l'utilisation des notes en surbrillance

Author: PaulBayfield

src/css/fix.css

@@ -74,3 +74,15 @@ header > div.header-info > div.card-header-actions {
 .topbar-btn {
     border-radius: 0 !important;
 }
+
+.new-note-checkbox {
+    margin-right: 1rem !important;
+    width: 1.3rem !important;
+    height: 1.3rem !important;
+}
+
+a.disabled {
+    pointer-events: none !important;
+    cursor: not-allowed !important;
+    opacity: 0.4 !important;
+}

src/functions.js

@@ -726,6 +726,7 @@ export function createRow(grade, isAverage, isNew = false) {
         if (content === null) {
             if (isNew) {
                 const checkbox = document.createElement('input');
+                checkbox.classList.add('new-note-checkbox');
                 checkbox.type = 'checkbox';
                 checkbox.id = 'note-' + grade.id;
                 checkbox.value = grade.id;
@@ -846,9 +847,10 @@ export function createCardHead() {
     console.info("[Better IUT RCC] Création de l'entête du tableau...");
 
     const head = document.createElement('div');
-    head.classList.add('card-header');
     head.style.display = 'flex';
     head.style.justifyContent = 'space-between';
+    head.style.alignItems = 'center';
+    head.style.gap = '10px';
 
     const card = document.querySelector("#mainContent > div:first-child > div:nth-child(4) > div > header");
     card.append(head);
@@ -859,6 +861,7 @@ export function createCardHead() {
 /**
  * Fonction pour ajouter un bouton de réinitialisation.
  * 
+ * @param {HTMLDivElement} head - Entête du tableau.
  * @returns {HTMLButtonElement} - Élément de bouton HTML créé.
  */
 export function addResetButton(head) {
@@ -871,10 +874,29 @@ export function addResetButton(head) {
 /**
  * Fonction pour ajouter un bouton de sauvegarde.
  * 
+ * @param {Array} checkboxes - Tableau d'éléments de case à cocher.
+ * @param {HTMLDivElement} head - Entête du tableau.
  * @returns {HTMLButtonElement} - Élément de bouton HTML créé.
  */
-export function addSaveButton(head) {
-    let button = createButton('Sauvegarder les notes connues', 'pink', 'save')
+export function addSaveButton(head, checkboxes) {
+    let button = createButton("Sauvegarder les notes connues", "pink", "save")
+    if (checkboxes.length === 0) {
+        button = createButton("Sauvegarder les notes connues", "gray", "save")
+        button.classList.add('disabled');
+    }
+
+    head.prepend(button)
+    return button;
+}
+
+/**
+ * Fonction pour ajouter un bouton d'information.
+ * 
+ * @param {HTMLDivElement} head - Entête du tableau.
+ * @returns {HTMLButtonElement} - Élément de bouton HTML créé.
+ */
+export function addInformationButton(head) {
+    let button = createButton('Notes en surbrillance', 'info', 'square-check')
     head.prepend(button)
 
     return button;

src/main.js

@@ -1,8 +1,7 @@
-
 import 'apexcharts/dist/apexcharts.css';
 import './css/fix.css'
 
-import { addButtons, cleanCards, createBilanCard, generateHtml, updateTopBar, createCardHead, orderCards, fetchAllSortedGrades, recreateTable, updateMenu, addSearchBar, addSaveButton, addResetButton, addAvisNotification, addUpdateNotification } from "./functions";
+import { addButtons, cleanCards, createBilanCard, generateHtml, updateTopBar, createCardHead, orderCards, fetchAllSortedGrades, recreateTable, updateMenu, addSearchBar, addSaveButton, addResetButton, addAvisNotification, addUpdateNotification, addInformationButton } from "./functions";
 import { applyTheme } from './theme.js';
 import { Utils } from './utils.js';
 import { Average } from './average.js';
@@ -95,6 +94,8 @@ console.info(`[Better IUT RCC] Thème actif : ${activeTheme}`);
 
             const tableHead = createCardHead();
 
+            const checkboxes = document.querySelectorAll("tr.new-note input[type='checkbox']");
+
             addResetButton(tableHead).addEventListener('click', async (e) => {
                 console.warn("[Better IUT RCC] Réinitialisation des notes déjà connues !");
 
@@ -103,7 +104,7 @@ console.info(`[Better IUT RCC] Thème actif : ${activeTheme}`);
                 location.reload();
             });
 
-            addSaveButton(tableHead).addEventListener('click', (e) => {
+            addSaveButton(tableHead, checkboxes).addEventListener('click', (e) => {
                 console.info("[Better IUT RCC] Sauvegarde des notes déjà connues !");
 
                 e.preventDefault();
@@ -161,6 +162,16 @@ console.info(`[Better IUT RCC] Thème actif : ${activeTheme}`);
                 });
             });
 
+            if (checkboxes.length > 0) {
+                addInformationButton(tableHead).addEventListener('click', (e) => {
+                    e.preventDefault();
+
+                    alert("Certaines notes sont actuellement en surbrillance. Cela signifie que vous disposez de nouvelles notes que vous n'avez pas encore sauvegardées. Pour les sauvegarder, cochez les cases correspondantes et cliquez sur le bouton \"Sauvegarder\".\n\nSi vous ne cochez aucune case, toutes les notes seront sauvegardées.");
+
+                    console.info("[Better IUT RCC] Informations concernant la surbrillance affichées !");
+                });
+            }
+
             console.info("[Better IUT RCC] Vérification des paramètres de notification...");
             browser.storage.local.get('hideAvisNotification').then((result) => {
                 console.info(`[Better IUT RCC] Paramètre de notification : ${result.hideAvisNotification}`);