Merge pull request #221 from NIAEFEUP/fix/expand-and-class-page

NIAEFEUP · Nov 29, 2024 · ebd79d9 · ebd79d9
2 parents d45dffc + 7e67690
commit ebd79d9
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 11 deletions.
diff --git a/content-scripts/modules/expandable-card.js b/content-scripts/modules/expandable-card.js
@@ -3,6 +3,7 @@
  * @param {Element} innerContent
  * @param {Number} max_size
  */
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const toggleExpandableCard = (innerContent, max_size) => {
     function clickEvent() {
         /** @type {Keyframe[]} */
@@ -12,7 +13,7 @@ const toggleExpandableCard = (innerContent, max_size) => {
                 [{ transform: "rotate(0)" }, { transform: "rotate(180deg)" }],
                 { duration: 300, fill: "forwards", easing: "ease-in" },
             );
-            innerContent.style.maxHeight = `${max_size}px`;
+            innerContent.style.maxHeight = `9999px`;
         } else {
             this.dataset.expanded = "false";
             this.animate(

diff --git a/content-scripts/pages/class_page.js b/content-scripts/pages/class_page.js
@@ -16,13 +16,11 @@ const titleClick = (table, title) => {
     }
 };
 
-const createPhotosDialog = async (title, index) => {
+const createPhotosDialog = async (url, index) => {
     const dialog = document.createElement("dialog");
     const wrapper = document.createElement("div");
     const closeButton = document.createElement("span");
 
-    const url = getPhotosLink(title);
-
     const html = await fetchSigarraPage(url);
     const table = html.querySelector("#layout0 > table");
 
@@ -41,24 +39,36 @@ const createPhotosDialog = async (title, index) => {
     return dialog;
 };
 
-const createPhotosButton = (icon, dialog) => {
+const createPhotosButton = (icon, url, classIndex) => {
     const button = document.createElement("span");
     button.appendChild(icon);
     button.classList.add("photosButton");
 
-    button.addEventListener("click", (event) => {
+    button.addEventListener("click", async (event) => {
         event.stopPropagation();
+        // TODO: THIS IS EXTREMELY HACKY! the url ends up here so that we are able to retrieve the page and create the dialog at the same time, only when the button is pressed. if you are refactoring this page, THERE MUST BE A BETTER WAY!
+        const dialog = await createPhotosDialog(url, classIndex);
+        document.body.appendChild(dialog);
         dialog.showModal();
     });
 
     return button;
 };
 
 const getPhotosLink = (title) => {
+    console.log(title);
+
     return title.children[2].href;
 };
 
-const editTitle = async (title, table, dialog, enrolled, enrolledText) => {
+const editTitle = async (
+    title,
+    table,
+    enrolled,
+    enrolledText,
+    classIndex,
+    url,
+) => {
     const titleText = document.createElement("h3");
     const enrolledQnt = document.createElement("h3");
     const leftSide = document.createElement("div");
@@ -79,7 +89,11 @@ const editTitle = async (title, table, dialog, enrolled, enrolledText) => {
     titleText.innerText = className;
     leftSide.appendChild(classLinks[0]); // email button
 
-    const photosButton = createPhotosButton(classLinks[1].children[0], dialog); // photos button
+    const photosButton = createPhotosButton(
+        classLinks[1].children[0],
+        url,
+        classIndex,
+    ); // photos button
     leftSide.appendChild(photosButton);
 
     enrolledQnt.classList.add("classTitle");
@@ -121,12 +135,12 @@ const groupClasses = async (enrolledTable) => {
         const groupElement = document.createElement("section");
         const tableWrapperElement = document.createElement("div");
         const titleWrapperElement = document.createElement("div");
-        const photosDialog = await createPhotosDialog(title, classIndex);
 
         parent.insertBefore(groupElement, title);
         groupElement.classList.add("classWrapper");
         tableWrapperElement.classList.add("tableWrapper");
         titleWrapperElement.classList.add("titleWrapper");
+        const url = getPhotosLink(title);
 
         title.remove();
         table.remove();
@@ -135,14 +149,14 @@ const groupClasses = async (enrolledTable) => {
         tableWrapperElement.appendChild(table);
         groupElement.appendChild(titleWrapperElement);
         groupElement.appendChild(tableWrapperElement);
-        groupElement.appendChild(photosDialog);
 
         editTitle(
             titleWrapperElement,
             tableWrapperElement,
-            photosDialog,
             enrolled,
             enrolledText,
+            classIndex,
+            url,
         );
         titleWrapperElement.dataset.expand = "true";