Wrangled this together for the modal so far.
The page also includes the option for the user to select the course, and recipient without using the Compose Message Modal. To be thorough and UX complete, we should also make this work for that recipient list. Additionally, after selecting the Recipient Item, from the list, it puts a pill in the TO area that shows the original list item, so another mutation would be necessary there too. This is one of those instances where I typically question how much code (time, support, download file size, etc) is necessary for the benefit. You can weigh that yourself. We can keep tinkering if it's worth it to you, the challenge is fun.
I'm going to leave this as is for now, unless you want to keep working through it using this as an example. I left comments, and the console.log lines in place to give an idea of what fires and stops and where that happens. This is the most deepest cascade of mutations I've attempted. The tricky bit is getting here without crashing the browser a couple times, leaving some observer.disconnect() in place might save a few restarts until you need to account multiple mutations, or working through the mutations the code presents. I tried something new here as well, as soon as the modal was opened I disconnected and started watching for mutations specifically within the modal.
Here's the updated version. Tagging @James for QA or thoughts?
Tested in TamperMonkey so far, not yet in Theme Editor.
(function () {
'use strict';
if (/^\/conversations/.test(window.location.pathname)) {
let swap_str = 'Teachers';
let with_str = 'Mentors';
const renameRecipientItem = function () {
let result_items = document.evaluate(`
let ta_item = result_items.iterateNext();
if (ta_item != null && ta_item.textContent === swap_str) {
console.log(`replacing ${swap_str}/Mentors`)
ta_item.textContent = with_str;
}
};
const newMessageMdl = function (mtx, obs) {
let watchResults = document.getElementById('ac-result-list-1');
if (watchResults) {
const watchForResultsList = function (mtx, obs) {
let resultList = document.querySelector("#ac-result-list-1 > div > div > ul");
if (resultList) {
console.log('result list updated');
renameRecipientItem();
}
};
const observer = new MutationObserver(watchForResultsList);
observer.observe(watchResults, {
childList: true,
subtree: true
});
}
obs.disconnect();
};
const watchForModal = function () {
console.log('compose btn clicked');
const uiDialog = function (mtx, obs) {
let composeMdl = document.getElementById('compose-new-message');
if (composeMdl) {
console.log('compose modal open');
obs.disconnect();
const observer = new MutationObserver(newMessageMdl);
observer.observe(document.getElementById('compose-new-message'), {
childList: true,
subtree: true
});
}
};
const observer = new MutationObserver(uiDialog);
observer.observe(document.body, {
childList: true,
subtree: true
});
}
document.getElementById('compose-btn').onclick = watchForModal;
}
})();
