Skip to content
This repository has been archived by the owner on Feb 4, 2020. It is now read-only.

Proof of Concept: Improve accessibility of quickicons #296

Closed
wants to merge 3 commits into from
Closed

Proof of Concept: Improve accessibility of quickicons #296

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
b73eeb2
Make quickicons better accessible
chmst Jun 17, 2019
cb72365
Add sr-only description for quickicon number
fancyFranci Jun 19, 2019
c96b663
Change texts in select options: JHIDE, JSHOW and "with count"
chmst Jun 19, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion administrator/language/en-GB/en-GB.mod_quickicon.ini
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ MOD_QUICKICON_GROUP_LABEL="Group"
MOD_QUICKICON_HEADER_ICON_LABEL="Header Icon"
MOD_QUICKICON_INSTALL_EXTENSIONS="Install Extensions"
MOD_QUICKICON_LANGUAGE_MANAGER="Languages"
MOD_QUICKICON_LOAD_PLUGINS_LABEL="Load 3rd party plugins"
MOD_QUICKICON_MAINTENANCE="Maintenance"
MOD_QUICKICON_MEDIA_MANAGER="Media"
MOD_QUICKICON_MENUITEMS_ADD="New Menu Item"
Expand All @@ -49,10 +50,10 @@ MOD_QUICKICON_SHOW_MODULES_LABEL="Modules Icon"
MOD_QUICKICON_SHOW_OVERRIDEUPDATE_LABEL="Override Update Check"
MOD_QUICKICON_SHOW_PLUGINS_LABEL="Plugins Icon"
MOD_QUICKICON_SHOW_PRIVACYREQUEST_LABEL="Privacy Requests"
MOD_QUICKICON_LOAD_PLUGINS_LABEL="Load 3rd party plugins"
MOD_QUICKICON_SHOW_TEMPLATES_LABEL="Templates Icon"
MOD_QUICKICON_SHOW_USERS_LABEL="User Icon"
MOD_QUICKICON_SITE="Icons Site"
MOD_QUICKICON_SRONLY_NUMBER_OF="Number of %s"
MOD_QUICKICON_STRUCTURE="Structure"
MOD_QUICKICON_SYSTEM="Icons System"
MOD_QUICKICON_TEMPLATES="Templates"
Expand All @@ -63,4 +64,5 @@ MOD_QUICKICON_UPDATE="Icons Update"
MOD_QUICKICON_USERS="Users"
MOD_QUICKICON_USER_MANAGER="Users"
MOD_QUICKICON_USER_MANAGER_1="User"
MOD_QUICKICON_WITH_AMOUNT="Show with count"
MOD_QUICKICON_XML_DESCRIPTION="This module shows Quick Icons that are visible on the Dashboard (administrator area home page)."
61 changes: 48 additions & 13 deletions administrator/modules/mod_quickicon/Helper/QuickIconHelper.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,54 +65,77 @@ public static function &getButtons(Registry $params, CMSApplication $application

if ($params->get('show_users'))
{
self::$buttons[$key][] = [
'ajaxurl' => 'index.php?option=com_users&task=users.getQuickiconContent&format=json',
$tmp = [
'image' => 'fa fa-users',
'link' => Route::_('index.php?option=com_users'),
'linkadd' => Route::_('index.php?option=com_users&task=user.add'),
'name' => 'MOD_QUICKICON_USER_MANAGER',
'access' => array('core.manage', 'com_users', 'core.create', 'com_users'),
'group' => 'MOD_QUICKICON_SITE',
];

if ($params->get('show_users') == 2)
{
$tmp['ajaxurl'] = 'index.php?option=com_users&task=users.getQuickiconContent&format=json';
}

self::$buttons[$key][] = $tmp;
}

if ($params->get('show_menuItems'))
{
self::$buttons[$key][] = [
'ajaxurl' => 'index.php?option=com_menus&task=items.getQuickiconContent&format=json',
$tmp = [
'image' => 'fa fa-list',
'link' => Route::_('index.php?option=com_menus'),
'linkadd' => Route::_('index.php?option=com_menus&task=item.add'),
'name' => 'MOD_QUICKICON_MENUITEMS_MANAGER',
'access' => array('core.manage', 'com_menus', 'core.create', 'com_menus'),
'group' => 'MOD_QUICKICON_STRUCTURE',
];

if ($params->get('show_menuItems') == 2)
{
$tmp['ajaxurl'] = 'index.php?option=com_menus&task=items.getQuickiconContent&format=json';
}

self::$buttons[$key][] = $tmp;
}

if ($params->get('show_articles'))
{
self::$buttons[$key][] = [
'ajaxurl' => 'index.php?option=com_content&task=articles.getQuickiconContent&format=json',
$tmp = [
'image' => 'fa fa-file-alt',
'link' => Route::_('index.php?option=com_content'),
'linkadd' => Route::_('index.php?option=com_content&task=article.add'),
'name' => 'MOD_QUICKICON_ARTICLE_MANAGER',
'access' => array('core.manage', 'com_content', 'core.create', 'com_content'),
'group' => 'MOD_QUICKICON_SITE',
];

if ($params->get('show_articles') == 2)
{
$tmp['ajaxurl'] = 'index.php?option=com_content&task=articles.getQuickiconContent&format=json';
}

self::$buttons[$key][] = $tmp;
}

if ($params->get('show_categories'))
{
self::$buttons[$key][] = [
'ajaxurl' => 'index.php?option=com_categories&task=categories.getQuickiconContent&format=json',
$tmp = [
'link' => Route::_('index.php?option=com_categories'),
'image' => 'fa fa-folder-open',
'linkadd' => Route::_('index.php?option=com_categories&task=category.add'),
'name' => 'MOD_QUICKICON_CATEGORY_MANAGER',
'access' => array('core.manage', 'com_categories', 'core.create', 'com_categories'),
'group' => 'MOD_QUICKICON_SITE',
];

if ($params->get('show_categories') == 2)
{
$tmp['ajaxurl'] = 'index.php?option=com_categories&task=categories.getQuickiconContent&format=json';
}

self::$buttons[$key][] = $tmp;
}

if ($params->get('show_media'))
Expand All @@ -128,27 +151,39 @@ public static function &getButtons(Registry $params, CMSApplication $application

if ($params->get('show_modules'))
{
self::$buttons[$key][] = [
'ajaxurl' => 'index.php?option=com_modules&task=modules.getQuickiconContent&format=json',
$tmp = [
'image' => 'fa fa-cube',
'link' => Route::_('index.php?option=com_modules'),
'linkadd' => Route::_('index.php?option=com_modules&view=select'),
'name' => 'MOD_QUICKICON_MODULE_MANAGER',
'access' => array('core.manage', 'com_modules'),
'group' => 'MOD_QUICKICON_SITE'
];

if ($params->get('show_modules')== 2)
{
$tmp['ajaxurl'] = 'index.php?option=com_modules&task=modules.getQuickiconContent&format=json';
}

self::$buttons[$key][] = $tmp;
}

if ($params->get('show_plugins'))
{
self::$buttons[$key][] = [
'ajaxurl' => 'index.php?option=com_plugins&task=plugins.getQuickiconContent&format=json',
$tmp = [
'image' => 'fa fa-plug',
'link' => Route::_('index.php?option=com_plugins'),
'name' => 'MOD_QUICKICON_PLUGIN_MANAGER',
'access' => array('core.manage', 'com_plugins'),
'group' => 'MOD_QUICKICON_SITE'
];

if ($params->get('show_plugins') == 2)
{
$tmp['ajaxurl'] = 'index.php?option=com_plugins&task=plugins.getQuickiconContent&format=json';
}

self::$buttons[$key][] = $tmp;
}

if ($params->get('show_templates'))
Expand Down
40 changes: 20 additions & 20 deletions administrator/modules/mod_quickicon/mod_quickicon.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -69,73 +69,73 @@
</field>
<field
name="show_users"
type="radio"
class="switcher"
type="list"
label="MOD_QUICKICON_SHOW_USERS_LABEL"
default="0"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
<option value="2">MOD_QUICKICON_WITH_COUNT</option>
</field>
<field
name="show_articles"
type="radio"
class="switcher"
type="list"
label="MOD_QUICKICON_SHOW_ARTICLES_LABEL"
default="0"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
<option value="2">MOD_QUICKICON_WITH_COUNT</option>
</field>
<field
name="show_categories"
type="radio"
class="switcher"
label="MOD_QUICKICON_SHOW_CATEGORIES_LABEL"
name="show_modules"
type="list"
label="MOD_QUICKICON_SHOW_MODULES_LABEL"
default="0"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
<option value="2">MOD_QUICKICON_WITH_COUNT</option>
</field>
<field
name="show_media"
type="radio"
class="switcher"
label="MOD_QUICKICON_SHOW_MEDIA_LABEL"
name="show_categories"
type="list"
label="MOD_QUICKICON_SHOW_CATEGORIES_LABEL"
default="0"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
<option value="2">MOD_QUICKICON_WITH_COUNT</option>
</field>
<field
name="show_menuItems"
name="show_media"
type="radio"
class="switcher"
label="MOD_QUICKICON_SHOW_MENUITEMS_LABEL"
label="MOD_QUICKICON_SHOW_MEDIA_LABEL"
default="0"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
</field>
<field
name="show_modules"
type="radio"
class="switcher"
label="MOD_QUICKICON_SHOW_MODULES_LABEL"
name="show_menuitems"
type="list"
label="MOD_QUICKICON_SHOW_MENUITEMS_LABEL"
default="0"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
<option value="2">MOD_QUICKICON_WITH_COUNT</option>
</field>
<field
name="show_plugins"
type="radio"
class="switcher"
type="list"
label="MOD_QUICKICON_SHOW_PLUGINS_LABEL"
default="0"
>
<option value="0">JHIDE</option>
<option value="1">JSHOW</option>
<option value="2">MOD_QUICKICON_WITH_COUNT</option>
</field>
<field
name="show_templates"
Expand Down
4 changes: 4 additions & 0 deletions build/media_source/mod_quickicon/js/quickicon.es6.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,9 @@
if (Object.prototype.hasOwnProperty.call(response, 'data')) {
const name = quickicon.querySelector('.quickicon-name');
const nameSpan = document.createElement('span');
const srSpan = document.createElement('span');
srSpan.className = 'sr-only';
srSpan.textContent = counter.dataset.sr;

if (pulse) {
const className = response.data > 0 ? 'warning' : 'success';
Expand All @@ -48,6 +51,7 @@

// Set amount of number into counter span
counter.textContent = response.data;
counter.insertAdjacentElement('afterbegin', srSpan);
} else if (pulse) {
pulse.classList.add('error');
}
Expand Down
4 changes: 3 additions & 1 deletion layouts/joomla/quickicons/icon.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,8 @@
$add = '';
$name = '';
}

$dataSr = 'data-sr="' . Text::sprintf('MOD_QUICKICON_SRONLY_NUMBER_OF', $name) . ':"';
?>

<li class="quickicon col mb-3 d-flex <?php echo !empty($displayData['linkadd']) ? 'flex-column' : ''; ?>">
Expand All @@ -70,7 +72,7 @@
</div>
<?php endif; ?>
<?php if (isset($displayData['ajaxurl'])) : ?>
<div class="quickicon-amount" <?php echo $dataUrl ?>>
<div class="quickicon-amount" <?php echo $dataUrl ?> <?php echo $dataSr ?>>
<span class="fa fa-spinner" aria-hidden="true"></span>
</div>
<?php endif; ?>
Expand Down