Merge branch 'MDL-79061-401-2' of https://github.com/junpataleta/moodle into MOODLE_401_STABLE
This commit is contained in:
Huong Nguyen
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -14,6 +14,15 @@
|
||||
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
import ajax from 'core/ajax';
|
||||
import {get_string as getString} from "core/str";
|
||||
import SRLogger from "core/local/reactive/srlogger";
|
||||
|
||||
/**
|
||||
* Flag to determine whether the screen reader-only logger has already been set, so we only need to set it once.
|
||||
*
|
||||
* @type {boolean}
|
||||
*/
|
||||
let isLoggerSet = false;
|
||||
|
||||
/**
|
||||
* Default mutation manager
|
||||
@@ -65,6 +74,11 @@ export default class {
|
||||
* @param {number} targetCmId optional target cm id (for moving actions)
|
||||
*/
|
||||
async _sectionBasicAction(stateManager, action, sectionIds, targetSectionId, targetCmId) {
|
||||
const logEntry = this._getLoggerEntry(stateManager, action, sectionIds, {
|
||||
targetSectionId,
|
||||
targetCmId,
|
||||
itemType: 'section',
|
||||
});
|
||||
const course = stateManager.get('course');
|
||||
this.sectionLock(stateManager, sectionIds, true);
|
||||
const updates = await this._callEditWebservice(
|
||||
@@ -76,6 +90,7 @@ export default class {
|
||||
);
|
||||
stateManager.processUpdates(updates);
|
||||
this.sectionLock(stateManager, sectionIds, false);
|
||||
stateManager.addLoggerEntry(await logEntry);
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -87,6 +102,11 @@ export default class {
|
||||
* @param {number} targetCmId optional target cm id (for moving actions)
|
||||
*/
|
||||
async _cmBasicAction(stateManager, action, cmIds, targetSectionId, targetCmId) {
|
||||
const logEntry = this._getLoggerEntry(stateManager, action, cmIds, {
|
||||
targetSectionId,
|
||||
targetCmId,
|
||||
itemType: 'cm',
|
||||
});
|
||||
const course = stateManager.get('course');
|
||||
this.cmLock(stateManager, cmIds, true);
|
||||
const updates = await this._callEditWebservice(
|
||||
@@ -98,6 +118,56 @@ export default class {
|
||||
);
|
||||
stateManager.processUpdates(updates);
|
||||
this.cmLock(stateManager, cmIds, false);
|
||||
stateManager.addLoggerEntry(await logEntry);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get log entry for the current action.
|
||||
* @param {StateManager} stateManager the current state manager
|
||||
* @param {string} action the action name
|
||||
* @param {int[]|null} itemIds the element ids
|
||||
* @param {Object|undefined} data extra params for the log entry
|
||||
* @param {string|undefined} data.itemType the element type (will be taken from action if none)
|
||||
* @param {int|null|undefined} data.targetSectionId the target section id
|
||||
* @param {int|null|undefined} data.targetCmId the target cm id
|
||||
* @param {String|null|undefined} data.component optional component (for format plugins)
|
||||
* @return {Object} the log entry
|
||||
*/
|
||||
async _getLoggerEntry(stateManager, action, itemIds, data = {}) {
|
||||
if (!isLoggerSet) {
|
||||
// In case the logger has not been set from init(), ensure we set the logger.
|
||||
stateManager.setLogger(new SRLogger());
|
||||
isLoggerSet = true;
|
||||
}
|
||||
const feedbackParams = {
|
||||
action,
|
||||
itemType: data.itemType ?? action.split('_')[0],
|
||||
};
|
||||
let batch = '';
|
||||
if (itemIds.length > 1) {
|
||||
feedbackParams.count = itemIds.length;
|
||||
batch = '_batch';
|
||||
} else if (itemIds.length === 1) {
|
||||
const itemInfo = stateManager.get(feedbackParams.itemType, itemIds[0]);
|
||||
feedbackParams.name = itemInfo.title ?? itemInfo.name;
|
||||
// Apply shortener for modules like label.
|
||||
}
|
||||
if (data.targetSectionId) {
|
||||
feedbackParams.targetSectionName = stateManager.get('section', data.targetSectionId).title;
|
||||
}
|
||||
if (data.targetCmId) {
|
||||
feedbackParams.targetCmName = stateManager.get('cm', data.targetCmId).name;
|
||||
}
|
||||
|
||||
const message = await getString(
|
||||
`${action.toLowerCase()}_feedback${batch}`,
|
||||
data.component ?? 'core_courseformat',
|
||||
feedbackParams
|
||||
);
|
||||
|
||||
return {
|
||||
feedbackMessage: message,
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -108,10 +178,13 @@ export default class {
|
||||
* @param {StateManager} stateManager the state manager
|
||||
*/
|
||||
init(stateManager) {
|
||||
// Add a method to prepare the fields when some update is comming from the server.
|
||||
// Add a method to prepare the fields when some update is coming from the server.
|
||||
stateManager.addUpdateTypes({
|
||||
prepareFields: this._prepareFields,
|
||||
});
|
||||
// Use the screen reader-only logger (SRLogger) to handle the feedback messages from the mutations.
|
||||
stateManager.setLogger(new SRLogger());
|
||||
isLoggerSet = true;
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -22,6 +22,13 @@
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
|
||||
$string['cm_hide_feedback'] = '{$a->name} is now hidden.';
|
||||
$string['cm_moveleft_feedback'] = '{$a->name} has been moved to the left.';
|
||||
$string['cm_moveright_feedback'] = '{$a->name} has been moved to the right.';
|
||||
$string['cm_show_feedback'] = '{$a->name} is now shown.';
|
||||
$string['cm_stealth_feedback'] = '{$a->name} is now available but not shown on the course page.';
|
||||
$string['courseindex'] = 'Course index';
|
||||
$string['preference:coursesectionspreferences'] = 'Section user preferences for course {$a}';
|
||||
$string['privacy:metadata:preference:coursesectionspreferences'] = 'Section user preferences like collapsed and expanded.';
|
||||
$string['section_hide_feedback'] = 'The course section {$a->name} has been hidden.';
|
||||
$string['section_show_feedback'] = 'The course section {$a->name} has been shown.';
|
||||
|
||||
+17
@@ -0,0 +1,17 @@
|
||||
define("core/local/reactive/logger",["exports","core/toast"],(function(_exports,_toast){Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0;return _exports.default=
|
||||
/**
|
||||
* Default reactive mutations logger class.
|
||||
*
|
||||
* This logger is used by default by the StateManager to log mutation feedbacks
|
||||
* and actions. By default, feedbacks will be displayed as a toast. However, the
|
||||
* reactive instance can provide alternative loggers to provide advanced logging
|
||||
* capabilities.
|
||||
*
|
||||
* @module core/local/reactive/logger
|
||||
* @class Logger
|
||||
* @copyright 2023 Ferran Recio <ferran@moodle.com>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
class{constructor(){this._debug=!1}add(entry){entry.feedbackMessage&&(0,_toast.add)(entry.feedbackMessage)}},_exports.default}));
|
||||
|
||||
//# sourceMappingURL=logger.min.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"logger.min.js","sources":["../../../src/local/reactive/logger.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * Default reactive mutations logger class.\n *\n * This logger is used by default by the StateManager to log mutation feedbacks\n * and actions. By default, feedbacks will be displayed as a toast. However, the\n * reactive instance can provide alternative loggers to provide advanced logging\n * capabilities.\n *\n * @module core/local/reactive/logger\n * @class Logger\n * @copyright 2023 Ferran Recio <[email protected]>\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\n/**\n * Logger entry structure.\n *\n * @typedef {object} LoggerEntry\n * @property {string} feedbackMessage Feedback message.\n */\n\nimport {add as addToast} from 'core/toast';\n\n/**\n * Default reactive mutations logger class.\n * @class Logger\n */\nexport default class Logger {\n /**\n * Constructor.\n */\n constructor() {\n this._debug = false;\n }\n\n /**\n * Add a log entry.\n * @param {LoggerEntry} entry Log entry.\n */\n add(entry) {\n if (entry.feedbackMessage) {\n addToast(entry.feedbackMessage);\n }\n }\n}\n"],"names":["constructor","_debug","add","entry","feedbackMessage"],"mappings":";;;;;;;;;;;;;;MA8CIA,mBACSC,QAAS,EAOlBC,IAAIC,OACIA,MAAMC,gCACGD,MAAMC"}
|
||||
@@ -0,0 +1,3 @@
|
||||
define("core/local/reactive/srlogger",["exports","core/local/reactive/logger"],(function(_exports,_logger){var obj;Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_logger=(obj=_logger)&&obj.__esModule?obj:{default:obj};class SRLogger extends _logger.default{add(entry){if(entry.feedbackMessage){let loggerFeedback=document.getElementById(SRLogger.liveRegionId);loggerFeedback||(loggerFeedback=document.createElement("div"),loggerFeedback.id=SRLogger.liveRegionId,loggerFeedback.classList.add("sr-only"),loggerFeedback.setAttribute("aria-live","polite"),document.body.append(loggerFeedback)),loggerFeedback.innerHTML=entry.feedbackMessage,setTimeout((()=>{loggerFeedback.innerHTML=""}),4e3)}}}return _exports.default=SRLogger,function(obj,key,value){key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value}(SRLogger,"liveRegionId","sr-logger-feedback-container"),_exports.default}));
|
||||
|
||||
//# sourceMappingURL=srlogger.min.js.map
|
||||
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"srlogger.min.js","sources":["../../../src/local/reactive/srlogger.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * Screen reader-only (sr-only) reactive mutations logger class.\n *\n * This logger can be used by the StateManager to log mutation feedbacks and actions.\n * The feedback messages logged by this logger will be rendered in a sr-only, ARIA live region.\n *\n * @module core/local/reactive/srlogger\n * @class SRLogger\n * @copyright 2023 Jun Pataleta <[email protected]>\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nimport Logger from 'core/local/reactive/logger';\n\n/**\n * Logger entry structure.\n *\n * @typedef {object} LoggerEntry\n * @property {string} feedbackMessage Feedback message.\n */\n\n/**\n * Screen reader-only (sr-only) reactive mutations logger class.\n *\n * @class SRLogger\n */\nexport default class SRLogger extends Logger {\n /**\n * The element ID of the ARIA live region where the logger feedback will be rendered.\n *\n * @type {string}\n */\n static liveRegionId = 'sr-logger-feedback-container';\n\n /**\n * Add a log entry.\n * @param {LoggerEntry} entry Log entry.\n */\n add(entry) {\n if (entry.feedbackMessage) {\n // Fetch or create an ARIA live region that will serve as the container for the logger feedback.\n let loggerFeedback = document.getElementById(SRLogger.liveRegionId);\n if (!loggerFeedback) {\n loggerFeedback = document.createElement('div');\n loggerFeedback.id = SRLogger.liveRegionId;\n loggerFeedback.classList.add('sr-only');\n loggerFeedback.setAttribute('aria-live', 'polite');\n document.body.append(loggerFeedback);\n }\n // Set the ARIA live region's contents with the feedback.\n loggerFeedback.innerHTML = entry.feedbackMessage;\n\n // Clear the feedback message after 4 seconds to avoid the contents from being read out in case the user navigates\n // to this region. This is similar to the default timeout of toast messages before disappearing from view.\n setTimeout(() => {\n loggerFeedback.innerHTML = '';\n }, 4000);\n }\n }\n}\n"],"names":["SRLogger","Logger","add","entry","feedbackMessage","loggerFeedback","document","getElementById","liveRegionId","createElement","id","classList","setAttribute","body","append","innerHTML","setTimeout"],"mappings":"iQAyCqBA,iBAAiBC,gBAYlCC,IAAIC,UACIA,MAAMC,gBAAiB,KAEnBC,eAAiBC,SAASC,eAAeP,SAASQ,cACjDH,iBACDA,eAAiBC,SAASG,cAAc,OACxCJ,eAAeK,GAAKV,SAASQ,aAC7BH,eAAeM,UAAUT,IAAI,WAC7BG,eAAeO,aAAa,YAAa,UACzCN,SAASO,KAAKC,OAAOT,iBAGzBA,eAAeU,UAAYZ,MAAMC,gBAIjCY,YAAW,KACPX,eAAeU,UAAY,KAC5B,kLA9BMf,wBAMK"}
|
||||
+2
-3
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@@ -0,0 +1,60 @@
|
||||
// This file is part of Moodle - http://moodle.org/
|
||||
//
|
||||
// Moodle is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU General Public License as published by
|
||||
// the Free Software Foundation, either version 3 of the License, or
|
||||
// (at your option) any later version.
|
||||
//
|
||||
// Moodle is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU General Public License for more details.
|
||||
//
|
||||
// You should have received a copy of the GNU General Public License
|
||||
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
/**
|
||||
* Default reactive mutations logger class.
|
||||
*
|
||||
* This logger is used by default by the StateManager to log mutation feedbacks
|
||||
* and actions. By default, feedbacks will be displayed as a toast. However, the
|
||||
* reactive instance can provide alternative loggers to provide advanced logging
|
||||
* capabilities.
|
||||
*
|
||||
* @module core/local/reactive/logger
|
||||
* @class Logger
|
||||
* @copyright 2023 Ferran Recio <[email protected]>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
|
||||
/**
|
||||
* Logger entry structure.
|
||||
*
|
||||
* @typedef {object} LoggerEntry
|
||||
* @property {string} feedbackMessage Feedback message.
|
||||
*/
|
||||
|
||||
import {add as addToast} from 'core/toast';
|
||||
|
||||
/**
|
||||
* Default reactive mutations logger class.
|
||||
* @class Logger
|
||||
*/
|
||||
export default class Logger {
|
||||
/**
|
||||
* Constructor.
|
||||
*/
|
||||
constructor() {
|
||||
this._debug = false;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add a log entry.
|
||||
* @param {LoggerEntry} entry Log entry.
|
||||
*/
|
||||
add(entry) {
|
||||
if (entry.feedbackMessage) {
|
||||
addToast(entry.feedbackMessage);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,75 @@
|
||||
// This file is part of Moodle - http://moodle.org/
|
||||
//
|
||||
// Moodle is free software: you can redistribute it and/or modify
|
||||
// it under the terms of the GNU General Public License as published by
|
||||
// the Free Software Foundation, either version 3 of the License, or
|
||||
// (at your option) any later version.
|
||||
//
|
||||
// Moodle is distributed in the hope that it will be useful,
|
||||
// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
// GNU General Public License for more details.
|
||||
//
|
||||
// You should have received a copy of the GNU General Public License
|
||||
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
|
||||
|
||||
/**
|
||||
* Screen reader-only (sr-only) reactive mutations logger class.
|
||||
*
|
||||
* This logger can be used by the StateManager to log mutation feedbacks and actions.
|
||||
* The feedback messages logged by this logger will be rendered in a sr-only, ARIA live region.
|
||||
*
|
||||
* @module core/local/reactive/srlogger
|
||||
* @class SRLogger
|
||||
* @copyright 2023 Jun Pataleta <[email protected]>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
|
||||
import Logger from 'core/local/reactive/logger';
|
||||
|
||||
/**
|
||||
* Logger entry structure.
|
||||
*
|
||||
* @typedef {object} LoggerEntry
|
||||
* @property {string} feedbackMessage Feedback message.
|
||||
*/
|
||||
|
||||
/**
|
||||
* Screen reader-only (sr-only) reactive mutations logger class.
|
||||
*
|
||||
* @class SRLogger
|
||||
*/
|
||||
export default class SRLogger extends Logger {
|
||||
/**
|
||||
* The element ID of the ARIA live region where the logger feedback will be rendered.
|
||||
*
|
||||
* @type {string}
|
||||
*/
|
||||
static liveRegionId = 'sr-logger-feedback-container';
|
||||
|
||||
/**
|
||||
* Add a log entry.
|
||||
* @param {LoggerEntry} entry Log entry.
|
||||
*/
|
||||
add(entry) {
|
||||
if (entry.feedbackMessage) {
|
||||
// Fetch or create an ARIA live region that will serve as the container for the logger feedback.
|
||||
let loggerFeedback = document.getElementById(SRLogger.liveRegionId);
|
||||
if (!loggerFeedback) {
|
||||
loggerFeedback = document.createElement('div');
|
||||
loggerFeedback.id = SRLogger.liveRegionId;
|
||||
loggerFeedback.classList.add('sr-only');
|
||||
loggerFeedback.setAttribute('aria-live', 'polite');
|
||||
document.body.append(loggerFeedback);
|
||||
}
|
||||
// Set the ARIA live region's contents with the feedback.
|
||||
loggerFeedback.innerHTML = entry.feedbackMessage;
|
||||
|
||||
// Clear the feedback message after 4 seconds to avoid the contents from being read out in case the user navigates
|
||||
// to this region. This is similar to the default timeout of toast messages before disappearing from view.
|
||||
setTimeout(() => {
|
||||
loggerFeedback.innerHTML = '';
|
||||
}, 4000);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -30,6 +30,8 @@
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/
|
||||
|
||||
import Logger from 'core/local/reactive/logger';
|
||||
|
||||
/**
|
||||
* State manager class.
|
||||
*
|
||||
@@ -120,6 +122,8 @@ export default class StateManager {
|
||||
};
|
||||
this.target.addEventListener('state:loaded', initialStateDone);
|
||||
});
|
||||
|
||||
this.logger = new Logger();
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -443,6 +447,24 @@ export default class StateManager {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the logger class instance.
|
||||
*
|
||||
* Reactive instances can provide alternative loggers to provide advanced logging.
|
||||
* @param {Logger} logger
|
||||
*/
|
||||
setLogger(logger) {
|
||||
this.logger = logger;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add a new log entry into the reactive logger.
|
||||
* @param {LoggerEntry} entry
|
||||
*/
|
||||
addLoggerEntry(entry) {
|
||||
this.logger.add(entry);
|
||||
}
|
||||
|
||||
/**
|
||||
* Get an element from the state or form an alternative state object.
|
||||
*
|
||||
|
||||
Reference in New Issue
Block a user