MDL-85990 mod_forum: Fix toggle accessibility in overview page
- Add aria-label to toggle buttons - Add SRLogger to toggle button interactions
This commit is contained in:
+2
-2
@@ -1,10 +1,10 @@
|
||||
define("mod_forum/forum_overview_toggle",["exports","core/notification","core/str","mod_forum/repository"],(function(_exports,_notification,_str,_repository){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}
|
||||
define("mod_forum/forum_overview_toggle",["exports","core/notification","core/str","core/local/reactive/srlogger","mod_forum/repository"],(function(_exports,_notification,_str,_srlogger,_repository){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}
|
||||
/**
|
||||
* Handle forum subscription/tracking toggling.
|
||||
*
|
||||
* @module mod_forum/forum_overview_toggle
|
||||
* @copyright 2025 Sara Arjona <sara@moodle.com>
|
||||
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
|
||||
*/function registerEventListeners(toggleElement){toggleElement.addEventListener("change",(()=>{"forum-subscription-toggle"===toggleElement.dataset.type&&async function(toggleElement){const forumId=toggleElement.dataset.forumid,newState=toggleElement.dataset.targetstate;if(!forumId||!newState)return;try{const newTargetState=!!(await _repository.default.setForumSubscriptionState(forumId,newState)).userstate.subscribed;updateSwitchState(toggleElement,newTargetState,newTargetState?"subscribe":"unsubscribe")}catch(error){_notification.default.exception(error)}}(toggleElement),"forum-track-toggle"===toggleElement.dataset.type&&async function(toggleElement){const forumId=toggleElement.dataset.forumid,newState=toggleElement.dataset.targetstate;if(!forumId||!newState)return;try{const newTargetState=!!(await _repository.default.setForumTrackingState(forumId,newState)).userstate.tracked;updateSwitchState(toggleElement,newTargetState,newTargetState?"trackingon":"trackingoff")}catch(error){_notification.default.exception(error)}}(toggleElement)}))}async function updateSwitchState(toggleElement,newTargetState,stringKey){toggleElement.dataset.targetstate=newTargetState?0:1;const string=await(0,_str.getString)(stringKey,"mod_forum");toggleElement.closest("td").querySelector('label[for="'.concat(toggleElement.id,'"] span')).textContent=string}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.init=void 0,_notification=_interopRequireDefault(_notification),_repository=_interopRequireDefault(_repository);_exports.init=toggleSelector=>{const toggleElement=document.querySelector(toggleSelector);toggleElement&®isterEventListeners(toggleElement)}}));
|
||||
*/function registerEventListeners(toggleElement){toggleElement.addEventListener("change",(()=>{"forum-subscription-toggle"===toggleElement.dataset.type&&async function(toggleElement){const forumId=toggleElement.dataset.forumid,forumName=toggleElement.dataset.forumname,newState=toggleElement.dataset.targetstate;if(!forumId||!newState)return;try{const newTargetState=!!(await _repository.default.setForumSubscriptionState(forumId,newState)).userstate.subscribed;await updateSwitchState(toggleElement,newTargetState,newTargetState?"subscribe":"unsubscribe");const feedbackMessage=await(0,_str.getString)(newTargetState?"subscribedtoforum":"unsubscribedfromforum","mod_forum",forumName);(new _srlogger.default).add({feedbackMessage:feedbackMessage})}catch(error){_notification.default.exception(error)}}(toggleElement),"forum-track-toggle"===toggleElement.dataset.type&&async function(toggleElement){const forumId=toggleElement.dataset.forumid,forumName=toggleElement.dataset.forumname,newState=toggleElement.dataset.targetstate;if(!forumId||!newState)return;try{const newTargetState=!!(await _repository.default.setForumTrackingState(forumId,newState)).userstate.tracked;await updateSwitchState(toggleElement,newTargetState,newTargetState?"trackingon":"trackingoff");const feedbackMessage=await(0,_str.getString)(newTargetState?"trackedforforum":"untrackedforforum","mod_forum",forumName);(new _srlogger.default).add({feedbackMessage:feedbackMessage})}catch(error){_notification.default.exception(error)}}(toggleElement)}))}async function updateSwitchState(toggleElement,newTargetState,stringKey){toggleElement.dataset.targetstate=newTargetState?0:1;const string=await(0,_str.getString)(stringKey,"mod_forum");toggleElement.closest("td").querySelector('label[for="'.concat(toggleElement.id,'"] span')).textContent=string}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.init=void 0,_notification=_interopRequireDefault(_notification),_srlogger=_interopRequireDefault(_srlogger),_repository=_interopRequireDefault(_repository);_exports.init=toggleSelector=>{const toggleElement=document.querySelector(toggleSelector);toggleElement&®isterEventListeners(toggleElement)}}));
|
||||
|
||||
//# sourceMappingURL=forum_overview_toggle.min.js.map
|
||||
File diff suppressed because one or more lines are too long
@@ -23,6 +23,7 @@
|
||||
|
||||
import Notification from 'core/notification';
|
||||
import {getString} from 'core/str';
|
||||
import SRLogger from 'core/local/reactive/srlogger';
|
||||
import Repository from 'mod_forum/repository';
|
||||
|
||||
/**
|
||||
@@ -48,6 +49,7 @@ function registerEventListeners(toggleElement) {
|
||||
*/
|
||||
async function subscriptionToggleClickHandler(toggleElement) {
|
||||
const forumId = toggleElement.dataset.forumid;
|
||||
const forumName = toggleElement.dataset.forumname;
|
||||
const newState = toggleElement.dataset.targetstate;
|
||||
if (!forumId || !newState) {
|
||||
return;
|
||||
@@ -56,11 +58,18 @@ async function subscriptionToggleClickHandler(toggleElement) {
|
||||
const context = await Repository.setForumSubscriptionState(forumId, newState);
|
||||
const newTargetState = !!context.userstate.subscribed;
|
||||
|
||||
updateSwitchState(
|
||||
await updateSwitchState(
|
||||
toggleElement,
|
||||
newTargetState,
|
||||
newTargetState ? 'subscribe' : 'unsubscribe',
|
||||
);
|
||||
|
||||
const feedbackMessage = await getString(
|
||||
newTargetState ? 'subscribedtoforum' : 'unsubscribedfromforum',
|
||||
'mod_forum',
|
||||
forumName,
|
||||
);
|
||||
new SRLogger().add({feedbackMessage});
|
||||
} catch (error) {
|
||||
Notification.exception(error);
|
||||
}
|
||||
@@ -74,6 +83,7 @@ async function subscriptionToggleClickHandler(toggleElement) {
|
||||
*/
|
||||
async function trackToggleClickHanldler(toggleElement) {
|
||||
const forumId = toggleElement.dataset.forumid;
|
||||
const forumName = toggleElement.dataset.forumname;
|
||||
const newState = toggleElement.dataset.targetstate;
|
||||
if (!forumId || !newState) {
|
||||
return;
|
||||
@@ -82,11 +92,18 @@ async function trackToggleClickHanldler(toggleElement) {
|
||||
const context = await Repository.setForumTrackingState(forumId, newState);
|
||||
const newTargetState = !!context.userstate.tracked;
|
||||
|
||||
updateSwitchState(
|
||||
await updateSwitchState(
|
||||
toggleElement,
|
||||
newTargetState,
|
||||
newTargetState ? 'trackingon' : 'trackingoff',
|
||||
);
|
||||
|
||||
const feedbackMessage = await getString(
|
||||
newTargetState ? 'trackedforforum' : 'untrackedforforum',
|
||||
'mod_forum',
|
||||
forumName,
|
||||
);
|
||||
new SRLogger().add({feedbackMessage});
|
||||
} catch (error) {
|
||||
Notification.exception(error);
|
||||
}
|
||||
|
||||
@@ -201,12 +201,18 @@ class overview extends \core_courseformat\activityoverviewbase {
|
||||
$label = get_string('trackforum', 'mod_forum');
|
||||
}
|
||||
|
||||
$arialabel = $tracked
|
||||
? get_string('untrackforforum', 'mod_forum', $this->forum->name)
|
||||
: get_string('trackforforum', 'mod_forum', $this->forum->name);
|
||||
|
||||
$renderer = $this->rendererhelper->get_renderer('mod_forum');
|
||||
$dataattributes = [
|
||||
$extraattributes = [
|
||||
['name' => 'data-type', 'value' => 'forum-track-toggle'],
|
||||
['name' => 'data-action', 'value' => 'toggle'],
|
||||
['name' => 'data-forumid', 'value' => $this->forum->id],
|
||||
['name' => 'data-forumname', 'value' => $this->forum->name],
|
||||
['name' => 'data-targetstate', 'value' => !$tracked],
|
||||
['name' => 'aria-label', 'value' => $arialabel],
|
||||
];
|
||||
$content = $renderer->render_from_template(
|
||||
'core/toggle',
|
||||
@@ -214,7 +220,7 @@ class overview extends \core_courseformat\activityoverviewbase {
|
||||
'id' => 'forum-track-toggle-' . $this->forum->id,
|
||||
'checked' => $tracked,
|
||||
'disabled' => $disabled,
|
||||
'extraattributes' => $dataattributes,
|
||||
'extraattributes' => $extraattributes,
|
||||
'label' => $label,
|
||||
'labelclasses' => 'visually-hidden',
|
||||
],
|
||||
@@ -265,20 +271,27 @@ class overview extends \core_courseformat\activityoverviewbase {
|
||||
}
|
||||
}
|
||||
|
||||
$arialabel = $subscribed
|
||||
? get_string('unsubscribefromforum', 'mod_forum', $this->forum->name)
|
||||
: get_string('subscribetoforum', 'mod_forum', $this->forum->name);
|
||||
|
||||
$renderer = $this->rendererhelper->get_renderer('mod_forum');
|
||||
$dataattributes = [
|
||||
$extraattributes = [
|
||||
['name' => 'data-type', 'value' => 'forum-subscription-toggle'],
|
||||
['name' => 'data-action', 'value' => 'toggle'],
|
||||
['name' => 'data-forumid', 'value' => $this->forum->id],
|
||||
['name' => 'data-forumname', 'value' => $this->forum->name],
|
||||
['name' => 'data-targetstate', 'value' => !$subscribed],
|
||||
['name' => 'aria-label', 'value' => $arialabel],
|
||||
];
|
||||
|
||||
$content = $renderer->render_from_template(
|
||||
'core/toggle',
|
||||
[
|
||||
'id' => 'forum-subscription-toggle-' . $this->forum->id,
|
||||
'checked' => $subscribed,
|
||||
'disabled' => $disabled,
|
||||
'extraattributes' => $dataattributes,
|
||||
'extraattributes' => $extraattributes,
|
||||
'label' => $label,
|
||||
'labelclasses' => 'visually-hidden',
|
||||
],
|
||||
|
||||
@@ -677,6 +677,8 @@ $string['subject'] = 'Subject';
|
||||
$string['subplugintype_forumreport'] = 'Forum report';
|
||||
$string['subplugintype_forumreport_plural'] = 'Forum reports';
|
||||
$string['subscribe'] = 'Subscribe to forum';
|
||||
$string['subscribedtoforum'] = 'Subscribed to {$a}';
|
||||
$string['subscribetoforum'] = 'Subscribe to forum {$a}';
|
||||
$string['subscribediscussion'] = 'Subscribe to this discussion';
|
||||
$string['subscribeall'] = 'Subscribe everyone to this forum';
|
||||
$string['subscribeenrolledonly'] = 'Sorry, only enrolled users are allowed to subscribe to forum post notifications.';
|
||||
@@ -715,6 +717,8 @@ $string['timestartenderror'] = 'Display end date cannot be earlier than the star
|
||||
$string['togglediscussionmenu'] = 'Toggle the discussion menu';
|
||||
$string['togglefullscreen'] = 'Toggle full screen';
|
||||
$string['togglesettingsdrawer'] = 'Toggle settings drawer';
|
||||
$string['trackedforforum'] = 'Tracking on for {$a}';
|
||||
$string['trackforforum'] = 'Track new posts for forum {$a}';
|
||||
$string['trackforum'] = 'Track unread posts';
|
||||
$string['trackreadposts_header'] = 'Forum tracking';
|
||||
$string['tracking'] = 'Track';
|
||||
@@ -734,6 +738,7 @@ $string['unreadposts'] = 'Unread posts';
|
||||
$string['unreadpostsnumber'] = '{$a} unread posts';
|
||||
$string['unreadpostsone'] = '1 unread post';
|
||||
$string['unsubscribe'] = 'Unsubscribe from forum';
|
||||
$string['unsubscribefromforum'] = 'Unsubscribe from forum {$a}';
|
||||
$string['unsubscribelink'] = 'Unsubscribe from this forum: {$a}';
|
||||
$string['unsubscribediscussion'] = 'Unsubscribe from this discussion';
|
||||
$string['unsubscribediscussionlink'] = 'Unsubscribe from this discussion: {$a}';
|
||||
@@ -744,7 +749,10 @@ $string['unsubscribeallconfirmdiscussions'] = 'You are currently subscribed to {
|
||||
$string['unsubscribealldone'] = 'All optional forum subscriptions were removed. You will still receive notifications from forums with forced subscription. To manage forum notifications go to Messaging in My Profile Settings.';
|
||||
$string['unsubscribeallempty'] = 'You are not subscribed to any forums. To disable all notifications from this server go to Messaging in My Profile Settings.';
|
||||
$string['unsubscribed'] = 'Unsubscribed';
|
||||
$string['unsubscribedfromforum'] = 'Unsubscribed from {$a}';
|
||||
$string['unsubscribeshort'] = 'Unsubscribe';
|
||||
$string['untrackedforforum'] = 'Tracking off for {$a}';
|
||||
$string['untrackforforum'] = 'Do not track new posts for forum {$a}';
|
||||
$string['useexperimentalui'] = 'Use experimental nested discussion view';
|
||||
$string['usermarksread'] = 'Manual message read marking';
|
||||
$string['usernavigation'] = 'User navigation';
|
||||
|
||||
Reference in New Issue
Block a user