Expand category icon (#18459)

* add aria-hidden="true" * aria-hidden="true" * default string and toggle * lanuage * strings in js?? * jtext * javascript * === thanks @C-Lodder * update keys as suggested by @infograf768
joomla · Nov 1, 2017 · 1f5b845 · 1f5b845
1 parent 5510a98
commit 1f5b845
Show file tree

Hide file tree

Showing 9 changed files with 43 additions and 8 deletions.
diff --git a/components/com_contact/views/categories/tmpl/default.php b/components/com_contact/views/categories/tmpl/default.php
@@ -11,6 +11,11 @@
 
 JHtml::addIncludePath(JPATH_COMPONENT . '/helpers');
 JHtml::_('behavior.caption');
+JHtml::_('behavior.core');
+
+// Add strings for translations in Javascript.
+JText::script('JGLOBAL_EXPAND_CATEGORIES ');
+JText::script('JGLOBAL_COLLAPSE_CATEGORIES');
 
 JFactory::getDocument()->addScriptDeclaration("
 jQuery(function($) {
@@ -19,6 +24,12 @@
 		btn.on('click', function() {
 			btn.find('span').toggleClass('icon-plus');
 			btn.find('span').toggleClass('icon-minus');
+			if (btn.attr('aria-label') === Joomla.JText._('JGLOBAL_EXPAND_CATEGORIES '))
+			{
+				btn.attr('aria-label', Joomla.JText._('JGLOBAL_COLLAPSE_CATEGORIES'));
+			} else {
+				btn.attr('aria-label', Joomla.JText._('JGLOBAL_EXPAND_CATEGORIES '));
+			}
 		});
 	});
 });");

diff --git a/components/com_contact/views/categories/tmpl/default_items.php b/components/com_contact/views/categories/tmpl/default_items.php
@@ -35,7 +35,7 @@
 					<?php endif; ?>
 					<?php if ($this->maxLevelcat > 1 && count($item->getChildren()) > 0) : ?>
 						<a id="category-btn-<?php echo $item->id; ?>" href="#category-<?php echo $item->id; ?>"
-							data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right"><span class="icon-plus"></span></a>
+							data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right" aria-label="<?php echo JText::_('JGLOBAL_EXPAND_CATEGORIES '); ?>"><span class="icon-plus" aria-hidden="true"></span></a>
 					<?php endif; ?>
 				</h3>
 				<?php if ($this->params->get('show_subcat_desc_cat') == 1) : ?>

diff --git a/components/com_content/views/categories/tmpl/default.php b/components/com_content/views/categories/tmpl/default.php
@@ -11,6 +11,11 @@
 
 JHtml::addIncludePath(JPATH_COMPONENT . '/helpers');
 JHtml::_('behavior.caption');
+JHtml::_('behavior.core');
+
+// Add strings for translations in Javascript.
+JText::script('JGLOBAL_EXPAND_CATEGORIES ');
+JText::script('JGLOBAL_COLLAPSE_CATEGORIES');
 
 JFactory::getDocument()->addScriptDeclaration("
 jQuery(function($) {
@@ -19,6 +24,12 @@
 		btn.on('click', function() {
 			btn.find('span').toggleClass('icon-plus');
 			btn.find('span').toggleClass('icon-minus');
+			if (btn.attr('aria-label') === Joomla.JText._('JGLOBAL_EXPAND_CATEGORIES '))
+			{
+				btn.attr('aria-label', Joomla.JText._('JGLOBAL_COLLAPSE_CATEGORIES'));
+			} else {
+				btn.attr('aria-label', Joomla.JText._('JGLOBAL_EXPAND_CATEGORIES '));
+			}		
 		});
 	});
 });");

diff --git a/components/com_content/views/categories/tmpl/default_items.php b/components/com_content/views/categories/tmpl/default_items.php
@@ -37,7 +37,7 @@
 				<?php endif; ?>
 				<?php if (count($item->getChildren()) > 0 && $this->maxLevelcat > 1) : ?>
 					<a id="category-btn-<?php echo $item->id; ?>" href="#category-<?php echo $item->id; ?>"
-						data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right"><span class="icon-plus"></span></a>
+						data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right" aria-label="<?php echo JText::_('JGLOBAL_EXPAND_CATEGORIES '); ?>"><span class="icon-plus" aria-hidden="true"></span></a>
 				<?php endif; ?>
 			</h3>
 			<?php if ($this->params->get('show_description_image') && $item->getParams()->get('image')) : ?>

diff --git a/components/com_content/views/category/tmpl/blog_children.php b/components/com_content/views/category/tmpl/blog_children.php
@@ -39,7 +39,7 @@
 					<?php echo $this->escape($child->title); ?></a>
 
 					<?php if ($this->maxLevel > 1 && count($child->getChildren()) > 0) : ?>
-						<a href="#category-<?php echo $child->id; ?>" data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right"><span class="icon-plus"></span></a>
+						<a href="#category-<?php echo $child->id; ?>" data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right" aria-label="<?php echo JText::_('JGLOBAL_EXPAND_CATEGORIES '); ?>"><span class="icon-plus" aria-hidden="true"></span></a>
 					<?php endif; ?>
 				</h3>
 				<?php else : ?>
@@ -53,7 +53,7 @@
 					<?php endif; ?>
 
 					<?php if ($this->maxLevel > 1 && count($child->getChildren()) > 0) : ?>
-						<a href="#category-<?php echo $child->id; ?>" data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right"><span class="icon-plus"></span></a>
+						<a href="#category-<?php echo $child->id; ?>" data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right" aria-label="<?php echo JText::_('JGLOBAL_EXPAND_CATEGORIES '); ?>"><span class="icon-plus" aria-hidden="true"></span></a>
 					<?php endif; ?>
 				</h3>
 				<?php endif; ?>

diff --git a/components/com_content/views/category/tmpl/default_children.php b/components/com_content/views/category/tmpl/default_children.php
@@ -42,7 +42,7 @@
 					<?php echo $this->escape($child->title); ?></a>
 
 					<?php if (count($child->getChildren()) > 0 && $this->maxLevel > 1) : ?>
-						<a href="#category-<?php echo $child->id; ?>" data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right"><span class="icon-plus"></span></a>
+						<a href="#category-<?php echo $child->id; ?>" data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right" aria-label="<?php echo JText::_('JGLOBAL_EXPAND_CATEGORIES '); ?>"><span class="icon-plus" aria-hidden="true"></span></a>
 					<?php endif; ?>
 				</h3>
 				<?php else : ?>
@@ -55,7 +55,7 @@
 					<?php endif; ?>
 
 					<?php if (count($child->getChildren()) > 0 && $this->maxLevel > 1) : ?>
-						<a href="#category-<?php echo $child->id; ?>" data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right"><span class="icon-plus"></span></a>
+						<a href="#category-<?php echo $child->id; ?>" data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right" aria-label="<?php echo JText::_('JGLOBAL_EXPAND_CATEGORIES '); ?>"><span class="icon-plus" aria-hidden="true"></span></a>
 					<?php endif; ?>
 				</h3>
 				<?php endif; ?>

diff --git a/components/com_newsfeeds/views/categories/tmpl/default.php b/components/com_newsfeeds/views/categories/tmpl/default.php
@@ -11,6 +11,11 @@
 
 JHtml::addIncludePath(JPATH_COMPONENT . '/helpers');
 JHtml::_('behavior.caption');
+JHtml::_('behavior.core');
+
+// Add strings for translations in Javascript.
+JText::script('JGLOBAL_EXPAND_CATEGORIES ');
+JText::script('JGLOBAL_COLLAPSE_CATEGORIES');
 
 JFactory::getDocument()->addScriptDeclaration("
 jQuery(function($) {
@@ -19,6 +24,12 @@
 		btn.on('click', function() {
 			btn.find('span').toggleClass('icon-plus');
 			btn.find('span').toggleClass('icon-minus');
+			if (btn.attr('aria-label') === Joomla.JText._('JGLOBAL_EXPAND_CATEGORIES '))
+			{
+				btn.attr('aria-label', Joomla.JText._('JGLOBAL_COLLAPSE_CATEGORIES'));
+			} else {
+				btn.attr('aria-label', Joomla.JText._('JGLOBAL_EXPAND_CATEGORIES '));
+			}			
 		});
 	});
 });");

diff --git a/components/com_newsfeeds/views/categories/tmpl/default_items.php b/components/com_newsfeeds/views/categories/tmpl/default_items.php
@@ -33,8 +33,8 @@
 					<?php endif; ?>
 					<?php if (count($item->getChildren()) > 0 && $this->maxLevelcat > 1) : ?>
 						<a id="category-btn-<?php echo $item->id; ?>" href="#category-<?php echo $item->id; ?>"
-							data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right">
-							<span class="icon-plus"></span>
+							data-toggle="collapse" data-toggle="button" class="btn btn-mini pull-right" aria-label="<?php echo JText::_('JGLOBAL_EXPAND_CATEGORIES '); ?>">
+							<span class="icon-plus" aria-hidden="true"></span>
 						</a>
 					<?php endif; ?>
 				</h3>

diff --git a/language/en-GB/en-GB.ini b/language/en-GB/en-GB.ini
@@ -191,6 +191,7 @@ JGLOBAL_CATEGORY_NOT_FOUND="Category not found"
 JGLOBAL_CENTER="Center"
 JGLOBAL_CHECK_ALL="Check All Items"
 JGLOBAL_CLICK_TO_SORT_THIS_COLUMN="Select to sort by this column"
+JGLOBAL_COLLAPSE_CATEGORIES="Show less categories"
 JGLOBAL_CREATED_DATE_ON="Created on %s"
 JGLOBAL_CUSTOM_CATEGORY="New Categories"
 JGLOBAL_DESCRIPTION="Description"
@@ -199,6 +200,7 @@ JGLOBAL_EDIT="Edit"
 JGLOBAL_EDIT_TITLE="Edit article"
 JGLOBAL_EMAIL="Email"
 JGLOBAL_EMAIL_TITLE="Email this link to a friend"
+JGLOBAL_EXPAND_CATEGORIES ="Show more categories"
 JGLOBAL_FIELD_ADD="Add"
 JGLOBAL_FIELD_CATEGORIES_CHOOSE_CATEGORY_DESC="Categories that are within this category will be displayed."
 JGLOBAL_FIELD_CATEGORIES_CHOOSE_CATEGORY_LABEL="Select a Top Level Category"