Merge pull request #91 from AAU-P5-Moodle/52-homework-student-feature…

…-fix-links-in-homework-calendar-popup

52 homework student feature fix links in homework calendar popup

server/moodle/blocks/homework/amd/src/homework_injector.js

@@ -1,22 +1,25 @@
 define(function() {
     return {
         init: function(homework) {
-            //Check that the current page contains a calendar to stop the code on other pages with homework block.
+            // Check that the current page contains a calendar to stop the code on other pages with homework block.
             if (document.querySelector('[data-region="calendar"]') && JSON.stringify(homework).length > 1) {
 
                 // Function that shows the content in the moodle modal.
                 const addContentToModal = () => {
-                    //Run a timeout of 500ms to make sure the modal and content are there.
+                    // Run a timeout of 500ms to make sure the modal and content are there.
                     setTimeout(() => {
-                        //Get the modal and determine if is there
+                        // Get the modal and determine if is there
                         const modalContent = document.querySelector('.modal-content');
                         if (modalContent) {
-                            //Get the inlaying container and determine if it's there.
+                            // Get the inlaying container and determine if it's there.
                             const summaryContainer = modalContent.querySelector('.summary-modal-container');
                             if (summaryContainer) {
+                                // Get the eventid from the container
+                                let eventid = summaryContainer.getAttribute("data-event-id");
+
                                 // Get the container that contains text data
                                 const containerFluid = summaryContainer.querySelector('.container-fluid');
-                                //Loop through all links in the text area to see if one contains a link to a course and if so what is the course id
+                                // Loop through all links in the text area to see if one contains a link to a course and if so what is the course id
                                 let foundCourseLink = false;
                                 let Courseid;
                                 containerFluid.querySelectorAll('a').forEach((element) => {
@@ -32,13 +35,18 @@ define(function() {
                                 });
 
 
-                                //Filter out courses from incorrect course
+                                // Get the correct homework which has the correct eventid otherwise cancel
                                 let filteredHomework = Object.values(homework).filter((work) => {
-                                    return work.course === Courseid;
-                                })
+                                    return work.eventid === eventid;
+                                });
+                                if (filteredHomework.length === 0) {
+                                    return;
+                                }
+
+
                                 // Determine if the modal is in the dashboard, a course link and a there isn't already a homeworkrow
                                 if (foundCourseLink && window.location.href.includes("/my") && !document.getElementById("homeworkRow")) {
-                                    //set the div up accoring to the moodle standard
+                                    // Set the div up accoring to the moodle standard
                                     const homeworkDiv = document.createElement('div');
                                     homeworkDiv.className = 'row mt-1';
                                     homeworkDiv.id = 'homeworkRow';
@@ -50,14 +58,18 @@ define(function() {
                                     const homeworkLinkDiv = document.createElement('div');
                                     homeworkLinkDiv.className = 'description-content col-11';
                                     // Create the new string with all homework info for that course
-                                    let newString ='';
+                                    let newString = '';
                                     Object.values(filteredHomework).forEach((homeworkInfo) => {
-                                        newString += `<p>HomeWork name = ${homeworkInfo.name} Intro = ${homeworkInfo.intro} link = <a href="https://localhost/mod/homework/view.php?id=${homeworkInfo.id}">link to homework</a>` +
-                                            ` dueDate = ${homeworkInfo.duedate ? `Duedate is ${Date(homeworkInfo.duedate)}` : 'No duedate'}</p>`;
+                                        let convertedTime = new Date(homeworkInfo.duedate * 1000);
+                                        newString += `<p>HomeWork name = ${homeworkInfo.name} <br>
+                                                      Intro = ${homeworkInfo.intro ? homeworkInfo.intro : "No intro"} <br>
+                                                      link = <a href="/mod/homework/view.php?id=${homeworkInfo.course_module_id}">link to homework</a></p>
+                                                      dueDate = ${homeworkInfo.duedate ? `Duedate is ${convertedTime}` : 'No duedate'}</p>`;
+
                                     });
                                     homeworkLinkDiv.innerHTML = newString;
 
-                                    //Add the divs to each other
+                                    // Add the divs to each other
                                     homeworkDiv.appendChild(homeworkIconDiv);
                                     homeworkDiv.appendChild(homeworkLinkDiv);
 
@@ -71,46 +83,53 @@ define(function() {
                 // Observer setup
                 const observer = new MutationObserver((mutations) => {
                     mutations.forEach((mutation) => {
-                        //determine if the modal is shown based on the show class
+                        // Determine if the modal is shown based on the show class
                         if (mutation.target.classList.contains('show')) {
                             addContentToModal();
                         }
                     });
                 });
 
-                //Observe function called when the event button is clicked
+                // Observe function called when the event button is clicked
                 const observeBackdrop = () => {
-                    // get the modal
+                    // Get the modal
                     const modalBackdrop = document.querySelector('[data-region="modal-backdrop"]');
-                    //Determine if the modalback is there
+                    // Determine if the modalback is there
                     if (modalBackdrop) {
-                        //Start observing when the modal has appeared
-                        observer.observe(modalBackdrop, { attributes: true, attributeFilter: ['class'] });
+                        // Start observing when the modal has appeared
+                        observer.observe(modalBackdrop, {attributes: true, attributeFilter: ['class']});
                     } else {
-                        //If the modal was not found then try agian every 100 ms
+                        // If the modal was not found then try agian every 100 ms
                         setTimeout(observeBackdrop, 100);
                     }
                 };
 
                 // Perform an initial check for the modal
                 addContentToModal();
 
-                //Add a eventlisnter to all event buttons
+                // Add a eventlisnter to all event buttons
                 document.querySelectorAll('[data-region]').forEach(element => {
                     element.addEventListener('click', addEventListenerToButtons);
                 });
 
+                /**
+                 *
+                 * @param event
+                 */
                 function addEventListenerToButtons(event) {
-                    //Determine if the data region is an event button
+                    // Determine if the data region is an event button
                     const target = event.target;
                     if (target.classList.contains('eventname') || target.closest('.eventname')) {
                         addContentToModal();
                         observeBackdrop();
-                        //Remove the eventlistner after moodle has appeared due to the observer being better
+                        // Remove the eventlistner after moodle has appeared due to the observer being better
                         removeEventListeners();
                     }
                 }
 
+                /**
+                 *
+                 */
                 function removeEventListeners() {
                     document.querySelectorAll('[data-region]').forEach(element => {
                         element.removeEventListener('click', addEventListenerToButtons);

server/moodle/mod/homework/amd/src/eventlinker.js

@@ -0,0 +1,90 @@
+import Modal from 'core/modal';
+import Ajax from "../../../../lib/amd/src/ajax";
+
+/**
+ * Creates the event linker modal.
+ *
+ * @param {int} cmid
+ * @param {int} homeworkid
+ */
+export const init = async(cmid, homeworkid) => {
+    // Add an eventlistner to the open event linker button.
+    document.querySelector('#open-event-linker').addEventListener('click', async()=>{
+
+        // Call the server to get all avalible events.
+        Ajax.call([{
+            methodname: 'mod_homework_get_events_for_homework',
+            args: {homeworkid: homeworkid},
+            done: async function(response) {
+                     // Create a modal for the user to link events and homework.
+                    const modal = await Modal.create({
+                        title: 'Homework event linker',
+                        body: response.events,
+                        footer: '<button type="button" class="btn btn-primary" data-action="submit">Submit</button>\n' +
+                                '<button type="button" class="btn btn-secondary" data-action="cancel">Cancel</button>',
+                        show: true,
+                        removeOnClose: true,
+                    });
+
+                    modal.show();
+                    // If there is nothing to link then hide submit and cancel buttons.
+                    if (response.events.includes("There are no available events to link")) {
+                        modal.hideFooter();
+                    }
+
+                    // Attach event listeners for buttons
+                    modal.getRoot().on('click', '[data-action="submit"]', (e) => {
+                        e.preventDefault();
+                        submitEventLink(modal, homeworkid, cmid);
+                    });
+                    modal.getRoot().on('click', '[data-action="cancel"]', (e) => {
+                        e.preventDefault();
+                        modal.destroy();
+                        location.reload();
+                    });
+            },
+            fail: (error) => {
+                console.error("Fail:", error);
+            },
+        }]);
+
+
+    });
+
+
+};
+
+/**
+ * Sumbits the event and homework to link.
+ *
+ * @param {modal} modal
+ * @param {int} homeworkid
+ * @param {int} cmid
+ */
+function submitEventLink(modal, homeworkid, cmid) {
+
+    // Get the selected event
+    let form = document.getElementById("evntlinkerform");
+    let selectedEvent = form.querySelector('input[name="eventtolink"]:checked');
+
+    // If there are non click then complain
+
+    if (!selectedEvent) {
+        alert("Please select an event!");
+    } else {
+        // Submit the event to link
+        Ajax.call([{
+            methodname: 'mod_homework_homework_event_link',
+            args: {homeworkid: homeworkid, course_module_id: cmid, eventid: selectedEvent.value},
+            done: async function(response) {
+                modal.destroy();
+                location.reload();
+            },
+            fail: (error) =>{
+                console.log("Error: ", error);
+            }
+        }]);
+    }
+
+
+}