mirror of
https://github.com/LDAPAccountManager/lam.git
synced 2025-10-06 03:49:56 +02:00
accessibility updates
This commit is contained in:
parent
50c9e1b637
commit
c70fe30ea1
3 changed files with 41 additions and 8 deletions
|
@ -1273,7 +1273,7 @@ class htmlAccountPageButton extends htmlButton {
|
||||||
class htmlSelect extends htmlElement {
|
class htmlSelect extends htmlElement {
|
||||||
|
|
||||||
/** name of select field */
|
/** name of select field */
|
||||||
private $name;
|
protected $name;
|
||||||
/** size */
|
/** size */
|
||||||
private $size;
|
private $size;
|
||||||
/** allows multi-selection */
|
/** allows multi-selection */
|
||||||
|
@ -1388,7 +1388,7 @@ class htmlSelect extends htmlElement {
|
||||||
echo '<div class="hidden">';
|
echo '<div class="hidden">';
|
||||||
}
|
}
|
||||||
// print select box
|
// print select box
|
||||||
echo '<select' . $this->getDataAttributesAsString() . $class . $style
|
echo '<select' . $this->getDataAttributesAsString() . $this->getAccessibilityMarkup() . $class . $style
|
||||||
. $name . $size . $multi . $disabled . $onchange
|
. $name . $size . $multi . $disabled . $onchange
|
||||||
. ' tabindex="' . $tabindex . "\">\n";
|
. ' tabindex="' . $tabindex . "\">\n";
|
||||||
$tabindex++;
|
$tabindex++;
|
||||||
|
@ -2078,6 +2078,8 @@ class htmlInputCheckbox extends htmlElement {
|
||||||
protected $elementsToDisable = array();
|
protected $elementsToDisable = array();
|
||||||
/** onclick event code */
|
/** onclick event code */
|
||||||
private $onClick;
|
private $onClick;
|
||||||
|
/** title */
|
||||||
|
private ?string $title = null;
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -2115,6 +2117,10 @@ class htmlInputCheckbox extends htmlElement {
|
||||||
if ($this->checked) {
|
if ($this->checked) {
|
||||||
$checked = ' checked';
|
$checked = ' checked';
|
||||||
}
|
}
|
||||||
|
$title = '';
|
||||||
|
if ($this->title !== null) {
|
||||||
|
$title = ' title="' . $this->title . '"';
|
||||||
|
}
|
||||||
$tabindexValue = ' tabindex="' . $tabindex . '"';
|
$tabindexValue = ' tabindex="' . $tabindex . '"';
|
||||||
$tabindex++;
|
$tabindex++;
|
||||||
$disabled = '';
|
$disabled = '';
|
||||||
|
@ -2210,7 +2216,7 @@ class htmlInputCheckbox extends htmlElement {
|
||||||
$onClick = ' onclick="' . $this->onClick . '"';
|
$onClick = ' onclick="' . $this->onClick . '"';
|
||||||
}
|
}
|
||||||
echo '<input type="checkbox" id="' . $this->name . '" name="' . $this->name . '"' . $classes . $tabindexValue
|
echo '<input type="checkbox" id="' . $this->name . '" name="' . $this->name . '"' . $classes . $tabindexValue
|
||||||
. $this->getAccessibilityMarkup() . $onChange . $onClick . $checked . $disabled . '>';
|
. $this->getAccessibilityMarkup() . $onChange . $onClick . $title . $checked . $disabled . '>';
|
||||||
echo $script;
|
echo $script;
|
||||||
if ($this->transient) {
|
if ($this->transient) {
|
||||||
return array();
|
return array();
|
||||||
|
@ -2311,6 +2317,15 @@ class htmlInputCheckbox extends htmlElement {
|
||||||
return $this->name;
|
return $this->name;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Sets the title.
|
||||||
|
*
|
||||||
|
* @param string|null $title title
|
||||||
|
*/
|
||||||
|
public function setTitle(?string $title): void {
|
||||||
|
$this->title = $title;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
@ -4367,7 +4382,7 @@ class htmlResponsiveSelect extends htmlSelect {
|
||||||
$row = new htmlResponsiveRow();
|
$row = new htmlResponsiveRow();
|
||||||
// label text
|
// label text
|
||||||
$labelGroup = new htmlGroup();
|
$labelGroup = new htmlGroup();
|
||||||
$labelGroup->addElement(new htmlOutputText($this->label));
|
$labelGroup->addElement(new htmlLabel($this->name, $this->label));
|
||||||
if (!empty($this->helpID)) {
|
if (!empty($this->helpID)) {
|
||||||
$helpLinkLabel = new htmlHelpLink($this->helpID, $this->helpModule);
|
$helpLinkLabel = new htmlHelpLink($this->helpID, $this->helpModule);
|
||||||
$helpLinkLabel->setCSSClasses(array('hide-on-tablet', 'margin-left5'));
|
$helpLinkLabel->setCSSClasses(array('hide-on-tablet', 'margin-left5'));
|
||||||
|
|
|
@ -370,6 +370,7 @@ class lamList {
|
||||||
$navInput->setMinimumAndMaximumNumber(1, $pageCount);
|
$navInput->setMinimumAndMaximumNumber(1, $pageCount);
|
||||||
$navInput->setCSSClasses(array('listPageInput'));
|
$navInput->setCSSClasses(array('listPageInput'));
|
||||||
$navInput->setOnKeyPress('listPageNumberKeyPress(\'' . $url . '\', event);');
|
$navInput->setOnKeyPress('listPageNumberKeyPress(\'' . $url . '\', event);');
|
||||||
|
$navInput->setAccessibilityLabel(_('Page'));
|
||||||
$navGroup->addElement($navInput);
|
$navGroup->addElement($navInput);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
|
@ -453,26 +454,32 @@ class lamList {
|
||||||
if ($this->sortDirection < 0) {
|
if ($this->sortDirection < 0) {
|
||||||
$down = new htmlLink(null, $link . '&sortdirection=1', '../../graphics/pan-down.svg');
|
$down = new htmlLink(null, $link . '&sortdirection=1', '../../graphics/pan-down.svg');
|
||||||
$down->setCSSClasses(array('icon noMarginSides'));
|
$down->setCSSClasses(array('icon noMarginSides'));
|
||||||
|
$down->setTitle(_('Sort ascending'));
|
||||||
$buttons->addElement($down);
|
$buttons->addElement($down);
|
||||||
$up = new htmlLink(null, $link . '&sortdirection=-1', '../../graphics/pan-up.svg');
|
$up = new htmlLink(null, $link . '&sortdirection=-1', '../../graphics/pan-up.svg');
|
||||||
$up->setCSSClasses(array('icon icon-active noMarginSides'));
|
$up->setCSSClasses(array('icon icon-active noMarginSides'));
|
||||||
|
$up->setTitle(_('Sort descending'));
|
||||||
$buttons->addElement($up);
|
$buttons->addElement($up);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
$down = new htmlLink(null, $link . '&sortdirection=1', '../../graphics/pan-down.svg');
|
$down = new htmlLink(null, $link . '&sortdirection=1', '../../graphics/pan-down.svg');
|
||||||
$down->setCSSClasses(array('icon icon-active noMarginSides'));
|
$down->setCSSClasses(array('icon icon-active noMarginSides'));
|
||||||
|
$down->setTitle(_('Sort ascending'));
|
||||||
$buttons->addElement($down);
|
$buttons->addElement($down);
|
||||||
$up = new htmlLink(null, $link . '&sortdirection=-1', '../../graphics/pan-up.svg');
|
$up = new htmlLink(null, $link . '&sortdirection=-1', '../../graphics/pan-up.svg');
|
||||||
$up->setCSSClasses(array('icon noMarginSides'));
|
$up->setCSSClasses(array('icon noMarginSides'));
|
||||||
|
$up->setTitle(_('Sort descending'));
|
||||||
$buttons->addElement($up);
|
$buttons->addElement($up);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
$down = new htmlLink(null, $link . '&sortdirection=1', '../../graphics/pan-down.svg');
|
$down = new htmlLink(null, $link . '&sortdirection=1', '../../graphics/pan-down.svg');
|
||||||
$down->setCSSClasses(array('icon noMarginSides'));
|
$down->setCSSClasses(array('icon noMarginSides'));
|
||||||
|
$down->setTitle(_('Sort ascending'));
|
||||||
$buttons->addElement($down);
|
$buttons->addElement($down);
|
||||||
$up = new htmlLink(null, $link . '&sortdirection=-1', '../../graphics/pan-up.svg');
|
$up = new htmlLink(null, $link . '&sortdirection=-1', '../../graphics/pan-up.svg');
|
||||||
$up->setCSSClasses(array('icon noMarginSides'));
|
$up->setCSSClasses(array('icon noMarginSides'));
|
||||||
|
$up->setTitle(_('Sort descending'));
|
||||||
$buttons->addElement($up);
|
$buttons->addElement($up);
|
||||||
}
|
}
|
||||||
$sortElements[] = $buttons;
|
$sortElements[] = $buttons;
|
||||||
|
@ -490,6 +497,7 @@ class lamList {
|
||||||
$selectAll = new htmlInputCheckbox('tableSelectAll', false);
|
$selectAll = new htmlInputCheckbox('tableSelectAll', false);
|
||||||
$selectAll->setCSSClasses(array('align-middle'));
|
$selectAll->setCSSClasses(array('align-middle'));
|
||||||
$selectAll->setOnClick('list_switchAccountSelection();');
|
$selectAll->setOnClick('list_switchAccountSelection();');
|
||||||
|
$selectAll->setTitle(_('Select all'));
|
||||||
$actionElement->addElement($selectAll);
|
$actionElement->addElement($selectAll);
|
||||||
$actionElement->addElement(new htmlSpacer('1rem', null));
|
$actionElement->addElement(new htmlSpacer('1rem', null));
|
||||||
$actionElement->addElement(new htmlOutputText(_('Filter')));
|
$actionElement->addElement(new htmlOutputText(_('Filter')));
|
||||||
|
@ -534,6 +542,7 @@ class lamList {
|
||||||
$filterInput = new htmlInputField('filter' . $attrName, $value, null);
|
$filterInput = new htmlInputField('filter' . $attrName, $value, null);
|
||||||
$filterInput->setOnKeyPress("SubmitForm('apply_filter', event);");
|
$filterInput->setOnKeyPress("SubmitForm('apply_filter', event);");
|
||||||
$filterInput->setFieldSize(null);
|
$filterInput->setFieldSize(null);
|
||||||
|
$filterInput->setTitle(_('Filter'));
|
||||||
return $filterInput;
|
return $filterInput;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -558,6 +567,7 @@ class lamList {
|
||||||
$filterInput->setCSSClasses(array($this->type->getScope() . '-bright'));
|
$filterInput->setCSSClasses(array($this->type->getScope() . '-bright'));
|
||||||
$filterInput->setHasDescriptiveElements(true);
|
$filterInput->setHasDescriptiveElements(true);
|
||||||
$filterInput->setOnchangeEvent('document.getElementsByName(\'apply_filter\')[0].click();');
|
$filterInput->setOnchangeEvent('document.getElementsByName(\'apply_filter\')[0].click();');
|
||||||
|
$filterInput->setAccessibilityLabel(_('Filter'));
|
||||||
return $filterInput;
|
return $filterInput;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -608,6 +618,7 @@ class lamList {
|
||||||
$checkbox = new htmlInputCheckbox($rowID, false);
|
$checkbox = new htmlInputCheckbox($rowID, false);
|
||||||
$checkbox->setOnClick("list_click('" . $rowID . "');");
|
$checkbox->setOnClick("list_click('" . $rowID . "');");
|
||||||
$checkbox->setCSSClasses(array('accountBoxUnchecked align-middle'));
|
$checkbox->setCSSClasses(array('accountBoxUnchecked align-middle'));
|
||||||
|
$checkbox->setTitle(_('Select'));
|
||||||
$actionElement->addElement($checkbox);
|
$actionElement->addElement($checkbox);
|
||||||
$actionElement->addElement(new htmlSpacer('0.5rem', null));
|
$actionElement->addElement(new htmlSpacer('0.5rem', null));
|
||||||
$rowNumber = $i - $table_begin + 2;
|
$rowNumber = $i - $table_begin + 2;
|
||||||
|
@ -975,6 +986,7 @@ class lamList {
|
||||||
$suffixSelect->setRightToLeftTextDirection(true);
|
$suffixSelect->setRightToLeftTextDirection(true);
|
||||||
$suffixSelect->setSortElements(false);
|
$suffixSelect->setSortElements(false);
|
||||||
$suffixSelect->setHasDescriptiveElements(true);
|
$suffixSelect->setHasDescriptiveElements(true);
|
||||||
|
$suffixSelect->setAccessibilityLabel(_('Suffix'));
|
||||||
$group->addElement($suffixSelect);
|
$group->addElement($suffixSelect);
|
||||||
}
|
}
|
||||||
return $group;
|
return $group;
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
<?php
|
<?php
|
||||||
namespace LAM\LOGIN;
|
namespace LAM\LOGIN;
|
||||||
use htmlLabel;
|
use htmlLabel;
|
||||||
|
use htmlResponsiveSelect;
|
||||||
use LAM\ENV\LAMLicenseValidator;
|
use LAM\ENV\LAMLicenseValidator;
|
||||||
use LAM\LIB\TWO_FACTOR\TwoFactorProviderService;
|
use LAM\LIB\TWO_FACTOR\TwoFactorProviderService;
|
||||||
use \LAMConfig;
|
use \LAMConfig;
|
||||||
|
@ -405,10 +406,9 @@ function display_LoginPage(?LAMLicenseValidator $licenseValidator, ?string $erro
|
||||||
$serverUrlDiv = new htmlDiv(null, $serverUrl);
|
$serverUrlDiv = new htmlDiv(null, $serverUrl);
|
||||||
$serverUrlDiv->setCSSClasses(array('text-left', 'margin3'));
|
$serverUrlDiv->setCSSClasses(array('text-left', 'margin3'));
|
||||||
$row->addField($serverUrlDiv);
|
$row->addField($serverUrlDiv);
|
||||||
$row->addLabel(new htmlOutputText(_("Server profile")));
|
$profileSelect = new htmlResponsiveSelect('profile', $profiles, array($_SESSION['config']->getName()), _("Server profile"));
|
||||||
$profileSelect = new htmlSelect('profile', $profiles, array($_SESSION['config']->getName()));
|
|
||||||
$profileSelect->setOnchangeEvent('loginProfileChanged(this)');
|
$profileSelect->setOnchangeEvent('loginProfileChanged(this)');
|
||||||
$row->addField($profileSelect);
|
$row->add($profileSelect);
|
||||||
|
|
||||||
parseHtml(null, $row, array(), true, $tabindex, 'user');
|
parseHtml(null, $row, array(), true, $tabindex, 'user');
|
||||||
?>
|
?>
|
||||||
|
@ -461,10 +461,16 @@ function displayLoginHeader() : void {
|
||||||
?>
|
?>
|
||||||
</span>
|
</span>
|
||||||
</a>
|
</a>
|
||||||
|
<?php
|
||||||
|
if (!isLAMProVersion()) {
|
||||||
|
?>
|
||||||
<span class="hide-on-mobile lam-margin-small">
|
<span class="hide-on-mobile lam-margin-small">
|
||||||
|
|
||||||
<a href="http://www.ldap-account-manager.org/lamcms/lamPro"> <?php if (!isLAMProVersion()) { echo _("Want more features? Get LAM Pro!");} ?> </a>
|
<a href="http://www.ldap-account-manager.org/lamcms/lamPro"><?php echo _("Want more features? Get LAM Pro!"); ?></a>
|
||||||
</span>
|
</span>
|
||||||
|
<?php
|
||||||
|
}
|
||||||
|
?>
|
||||||
</div>
|
</div>
|
||||||
<a class="lam-header-right lam-menu-icon hide-on-tablet" href="javascript:void(0);" class="icon" onclick="window.lam.topmenu.toggle();">
|
<a class="lam-header-right lam-menu-icon hide-on-tablet" href="javascript:void(0);" class="icon" onclick="window.lam.topmenu.toggle();">
|
||||||
<img class="align-middle" width="16" height="16" alt="menu" src="../graphics/menu.svg">
|
<img class="align-middle" width="16" height="16" alt="menu" src="../graphics/menu.svg">
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue