feat: add event observer for course viewing

Introduces an event observer to inject JavaScript into courses containing the exp360 activity when the course is viewed.

The newly created `db/events.php` initializes event observers, while updates to `lib.php` define the event observer callback and the observer list. Enhancements to `global.js` include modal handling logic for improved UI interaction.

This aids in dynamically loading required scripts, enhancing user experience in courses with exp360 activities.
This commit is contained in:
Kumi 2024-07-05 12:02:11 +02:00
parent 3a08f0e564
commit 321c470a23
Signed by: kumi
GPG key ID: ECBCC9082395383F
3 changed files with 69 additions and 0 deletions

5
db/events.php Normal file
View file

@ -0,0 +1,5 @@
<?php
defined('MOODLE_INTERNAL') || die();
$observers = mod_exp360_get_event_observers();

View file

@ -1,4 +1,27 @@
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
const modalHTML = `
<div id="fullScreenModal" class="modal" tabindex="-1"
aria-labelledby="modalLabel" aria-hidden="true">
<div style="background-color:#294084;" class="modal-dialog modal-fullscreen">
<div style="background-color:#294084;" class="modal-content">
<div style="background-color:#294084;" class="modal-body"><iframe style="background-color:#294084;" id="modal-iframe"></iframe></div>
</div>
</div>
</div>
<div id="regularModal" style="background: rgb(255,255,255,.7);" class="modal" tabindex="-2"
aria-labelledby="modalLabel" aria-hidden="true">
<div style="background-color:#294084;height:90%;" class="modal-dialog modal-lg">
<div style="background-color:#294084;height:100%;" class="modal-content">
<div style="background-color:#294084;" class="modal-body"><iframe style="background-color:#294084;width:100%;height:100%;" id="regular-modal-iframe"></iframe></div>
</div>
</div>
</div>
`;
// Append the modal HTML to the document body
document.body.insertAdjacentHTML('beforeend', modalHTML);
// Function to load a script into the DOM // Function to load a script into the DOM
function loadScript(url, integrity, crossorigin) { function loadScript(url, integrity, crossorigin) {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {

41
lib.php
View file

@ -56,3 +56,44 @@ function mod_exp360_cm_info_dynamic(cm_info $cm)
$cm->set_no_view_link(); $cm->set_no_view_link();
$cm->set_content($script); $cm->set_content($script);
} }
/**
* Event observer for mod_exp360.
*/
function mod_exp360_event_observer($event)
{
global $PAGE, $DB;
// Get the course ID from the event.
$courseid = $event->courseid;
// Check if the course contains any instances of the exp360 activity.
$sql = "SELECT COUNT(*)
FROM {course_modules} cm
JOIN {modules} m ON cm.module = m.id
JOIN {exp360} e ON cm.instance = e.id
WHERE cm.course = :courseid
AND m.name = 'exp360'";
$params = ['courseid' => $courseid];
$count = $DB->count_records_sql($sql, $params);
// If the course contains at least one instance of exp360, inject the JavaScript.
if ($count > 0) {
$PAGE->requires->js('/mod/exp360/global.js');
}
}
/**
* Returns the list of event observers.
*
* @return array
*/
function mod_exp360_get_event_observers()
{
return [
[
'eventname' => '\core\event\course_viewed',
'callback' => 'mod_exp360_event_observer',
],
];
}