diff --git a/lib/classes/ContentGroupMenu.php b/lib/classes/ContentGroupMenu.php index d7533faa3707f00c47f4b8039f120aadc41e1a8f..dfc0cef6894cd1bbedb0abe6983675027b589d72 100644 --- a/lib/classes/ContentGroupMenu.php +++ b/lib/classes/ContentGroupMenu.php @@ -32,6 +32,7 @@ class ContentGroupMenu private $rows = 1; private $columns = 1; private $image = null; + private $image_link_attributes = []; private $label; private $aria_label; @@ -223,6 +224,7 @@ class ContentGroupMenu if ($this->image) { $template->image = $this->image; + $template->image_link_attributes = $this->image_link_attributes; } else { $template->image = "<div></div><div></div><div></div>"; } @@ -267,10 +269,13 @@ class ContentGroupMenu * Sets the icon of the menu. * * @param String $menu_image image html for the menu + * + * @param array $image_link_attributes Additional HTML attributes for the link that surrounds the image. */ - public function setIcon($menu_image) + public function setIcon($menu_image, array $image_link_attributes = []) { $this->image = $menu_image; + $this->image_link_attributes = $image_link_attributes; } /** diff --git a/lib/classes/sidebar/SearchWidget.php b/lib/classes/sidebar/SearchWidget.php index 39bf1ee94fa3a758529df2b7ffeb6b1b205c520e..2b7979e43d80a2580ea0506e5f31b6406b7bf576 100644 --- a/lib/classes/sidebar/SearchWidget.php +++ b/lib/classes/sidebar/SearchWidget.php @@ -34,24 +34,6 @@ class SearchWidget extends SidebarWidget $this->template = 'sidebar/search-widget'; } - /** - * Sets the id for the form element. - */ - public function setId($id) - { - $this->id = $id; - } - - /** - * Returns the id for the form element. - * - * @return mixed String containing the id or null if no id has been set. - */ - public function getId() - { - return $this->id; - } - /** * Sets the request method used for the form. */ @@ -143,7 +125,6 @@ class SearchWidget extends SidebarWidget $this->template_variables['url_params'] = $query_params; $this->template_variables['method'] = $this->method; - $this->template_variables['id'] = $this->id; foreach ($this->needles as $index => $needle) { if ($needle['quick_search']) { diff --git a/lib/classes/sidebar/SidebarWidget.php b/lib/classes/sidebar/SidebarWidget.php index 1957eda7598560b037bd44c9abde9c95f957f8e9..026ca0cda70c9ee2a148a57f2be69cce17bbf011 100644 --- a/lib/classes/sidebar/SidebarWidget.php +++ b/lib/classes/sidebar/SidebarWidget.php @@ -9,11 +9,37 @@ */ class SidebarWidget extends Widget { + protected $id = ''; + + public function __construct() { $this->layout = 'sidebar/widget-layout.php'; } + + /** + * Sets the ID of the HTML element that represents the widget. + * + * @param $id The element-ID to be used for the widget. + * + */ + public function setId(string $id) + { + $this->id = $id; + } + + + /** + * Returns the ID of this widget, if it is set. + * + * @return string The ID of the widget or an empty string, if it is not set. + */ + public function getId() : string + { + return $this->id; + } + /** * Sets the title of the widget. * @@ -46,7 +72,7 @@ class SidebarWidget extends Widget { $this->extra = $extra; } - + public function getExtra() { return $this->extra; @@ -65,6 +91,9 @@ class SidebarWidget extends Widget */ public function render($variables = []) { + if ($this->id) { + $this->template_variables['id'] = $this->id; + } return parent::render($variables); } -} \ No newline at end of file +} diff --git a/resources/assets/stylesheets/less/skiplinks.less b/resources/assets/stylesheets/less/skiplinks.less index edbf09a17cf9b8799373b6eaafdcde7117d8e9cb..2da49110bfb3d329fa2213dc3cd039a350677dad 100644 --- a/resources/assets/stylesheets/less/skiplinks.less +++ b/resources/assets/stylesheets/less/skiplinks.less @@ -23,6 +23,13 @@ #skiplink_list { display: none; + button.skiplink { + border: 0; + background-color: #fff; + color: @base-color; + line-height: 1em; + margin-bottom: 0.1em; + } } body.enable-skiplinks { diff --git a/templates/footer.php b/templates/footer.php index 1823e2b1459ffa0483b874af3ccd4aa4a8c79b7f..0ea313bd34ccc3ab2590734214fe11890f68d44f 100644 --- a/templates/footer.php +++ b/templates/footer.php @@ -1,4 +1,5 @@ <!-- Beginn Footer --> +<?= SkipLinks::addIndex(_('Fußzeile'), 'layout_footer',900) ?> <div id="layout_footer"> <? if (is_object($GLOBALS['user']) && $GLOBALS['user']->id != 'nobody') : ?> <div id="footer"> diff --git a/templates/header.php b/templates/header.php index 87005524252fc7d328b9becabde68c3e9473c4a9..8f2992130aed84fb3b60eefd7a2da961c6267b11 100644 --- a/templates/header.php +++ b/templates/header.php @@ -56,6 +56,7 @@ if (isset($_COOKIE['navigation-length'])) { <? if (PageLayout::hasCustomQuicksearch()): ?> <?= PageLayout::getCustomQuicksearch() ?> <? else: ?> + <? SkipLinks::addIndex(_('Suche'), 'globalsearch-input', 910) ?> <li id="quicksearch_item"> <script> var selectSem = function (seminar_id, name) { @@ -119,7 +120,10 @@ if (isset($_COOKIE['navigation-length'])) { $action_menu->addAttribute('data-action-menu-reposition', 'false'); $action_menu->setLabel(User::findCurrent()->getFullName()); $action_menu->setAriaLabel(_("Profilmenü")); - $action_menu->setIcon(Avatar::getAvatar(User::findCurrent()->id)->getImageTag(Avatar::MEDIUM)); + $action_menu->setIcon( + Avatar::getAvatar(User::findCurrent()->id)->getImageTag(Avatar::MEDIUM), + ['id' => 'header_avatar_image_link'] + ); foreach (Navigation::getItem('/avatar') as $subnav) { $action_menu->addLink( @@ -128,7 +132,7 @@ if (isset($_COOKIE['navigation-length'])) { $subnav->getImage() ); } - SkipLinks::addIndex(_("Profilmenü"), "header_avatar_menu", 2); + SkipLinks::addIndex(_("Profilmenü"), "header_avatar_image_link", 1); ?> <?= $action_menu->render(); ?> </div> @@ -148,7 +152,7 @@ if (isset($_COOKIE['navigation-length'])) { </div> --> - <? SkipLinks::addIndex(_('Hauptnavigation'), 'barTopMenu', 1); ?> + <? SkipLinks::addIndex(_('Hauptnavigation'), 'barTopMenu', 2); ?> <ul id="barTopMenu" role="navigation" <? if (count($header_nav['hidden']) > 0) echo 'class="overflown"'; ?>> <? foreach ($header_nav['visible'] as $path => $nav): ?> <?= $this->render_partial( diff --git a/templates/helpbar/helpbar.php b/templates/helpbar/helpbar.php index 5810049e5f36d94c1c466b3d8461274db1c7661d..2aedb8ca109c593d5aa8d0e480c8b7c481358927 100644 --- a/templates/helpbar/helpbar.php +++ b/templates/helpbar/helpbar.php @@ -1,5 +1,6 @@ <div class="helpbar-container"> - <a href="#" class="helpbar-toggler" data-toggles=".helpbar" title="<?= _('Hilfelasche anzeigen/verstecken') ?>"> + <?= SkipLinks::addIndex(_('Tipps & Hilfe'), 'helpbar_icon', 920) ?> + <a id="helpbar_icon" href="#" class="helpbar-toggler" data-toggles=".helpbar" title="<?= _('Hilfelasche anzeigen/verstecken') ?>"> <?= Icon::create('question-circle')->asImg(24) ?> </a> <div class="helpbar" <? if (!$open) echo 'style="display: none"'; ?>> diff --git a/templates/shared/contentgroup-row.php b/templates/shared/contentgroup-row.php index a50bd855819c86597932e1194aa6ed2833df810e..f374a360788ca3f2320f41c6ae4ae2314ecf034c 100644 --- a/templates/shared/contentgroup-row.php +++ b/templates/shared/contentgroup-row.php @@ -1,7 +1,8 @@ <? // class "action-menu" will be set from API ?> <nav <?= arrayToHtmlAttributes($attributes) ?>> <a class="action-menu-icon" title="<?= htmlReady($label) ?>" - aria-expanded="false" aria-label="<?= htmlReady($aria_label) ?>" href="#"> + aria-expanded="false" aria-label="<?= htmlReady($aria_label) ?>" href="#" + <?= $image_link_attributes ? arrayToHtmlAttributes($image_link_attributes) : '' ?>> <?= $image ?> </a> <div class="action-menu-content"> diff --git a/templates/sidebar/sidebar.php b/templates/sidebar/sidebar.php index a624596e296a5c272c3924a27163783026f71611..6c40e57ecdaf55d069308e9c7c77460104f80571 100644 --- a/templates/sidebar/sidebar.php +++ b/templates/sidebar/sidebar.php @@ -20,6 +20,15 @@ </div> <? foreach ($widgets as $index => $widget): ?> + <? + if ($widget instanceof NavigationWidget) { + $widget->setId('nav_layer_3'); + SkipLinks::addIndex(_('Dritte Navigationsebene'), 'nav_layer_3', 20, false); + } elseif ($widget instanceof ActionsWidget) { + $widget->setId('sidebar_actions'); + SkipLinks::addIndex(_('Aktionen'), 'sidebar_actions', 21, false); + } + ?> <?= $widget->render(['base_class' => 'sidebar']) ?> <? endforeach; ?> </section> diff --git a/templates/skiplinks.php b/templates/skiplinks.php index 0cb1800fb6a1169546268945d7afec95201474b6..b057c589ee82fb50033456fcc806f88d6862e49c 100644 --- a/templates/skiplinks.php +++ b/templates/skiplinks.php @@ -3,16 +3,15 @@ ?> <? if ($navigation instanceof Navigation && iterator_count($navigation) > 0) : ?> <ul role="navigation" id="skiplink_list"> - <? $i = 1 ?> <? foreach ($navigation as $nav) : ?> <li> <? if (mb_substr($url = $nav->getURL(), 0, 1) == '#') : ?> - <a href="<?= $url ?>" onclick="STUDIP.SkipLinks.setActiveTarget('<?= $url ?>');" tabindex="<?= $i++ ?>"><?= htmlReady($nav->getTitle()) ?></a> + <button class="skiplink" onclick="STUDIP.SkipLinks.setActiveTarget('<?= $url ?>');"><?= htmlReady($nav->getTitle()) ?></button> <? else : ?> <? if (is_internal_url($url)) : ?> - <a href="<?= URLHelper::getLink($url) ?>" tabindex="<?= $i++ ?>"><?= htmlReady($nav->getTitle()) ?></a> + <a href="<?= URLHelper::getLink($url) ?>"><?= htmlReady($nav->getTitle()) ?></a> <? else : ?> - <a href="<?= htmlReady($url) ?>" tabindex="<?= $i++ ?>"><?= htmlReady($nav->getTitle()) ?></a> + <a href="<?= htmlReady($url) ?>"><?= htmlReady($nav->getTitle()) ?></a> <? endif ?> <? endif ?> </li> diff --git a/templates/tabs.php b/templates/tabs.php index 02ce34803c875952ea5b203a8d5b790f479babae..eaf3876131e0d066cdb7ba2b24ed744a2280e105 100644 --- a/templates/tabs.php +++ b/templates/tabs.php @@ -8,7 +8,7 @@ foreach (Navigation::getItem("/")->getSubNavigation() as $path => $nav) { $ebene3 = []; ?> <div class="tabs_wrapper"> - <? SkipLinks::addIndex(_('Erste Reiternavigation'), 'tabs', 10); ?> + <? SkipLinks::addIndex(_('Zweite Navigationsebene'), 'tabs', 10); ?> <ul id="tabs" role="navigation"> <? if (!empty($navigation)): ?> <? foreach ($navigation as $path => $nav) : ?>