fix a11y stuff in individual rooms-groups, closes #1094

Closes #1094

Merge request studip/studip!651

4 files changed, 56 insertions, 88 deletions

diff --git a/templates/sidebar/clipboard-area.php b/templates/sidebar/clipboard-area.php
index 6aa036b..64c3d03 100644
--- a/templates/sidebar/clipboard-area.php
+++ b/templates/sidebar/clipboard-area.php
@@ -17,49 +17,31 @@
         <? if (!$readonly): ?>
 
             <input class="clipboard-name invisible" type="text" name="clipboard_name" value="">
-
-            <?= Icon::create('edit', 'clickable')->asImg(
-                '20px',
+            <?= Icon::create('edit')->asInput(
                 [
-                    'class' => 'middle clipboard-edit-button'
-                           . (
-                               $clipboards ? '' : ' invisible'
-                           ),
-                    'onClick' => "STUDIP.Clipboard.toggleEditButtons('"
-                             . htmlReady($clipboard_widget_id)
-                             . "');"
+                    'data-widget-id' => $clipboard_widget_id,
+                    'class' => 'middle clipboard-edit-button' . ($clipboards ? '' : ' invisible')
                 ]
             ) ?>
 
-            <?= Icon::create('accept', 'clickable')->asImg(
-                '20px',
+            <?= Icon::create('accept')->asInput(
                 [
                     'class' => 'middle clipboard-edit-accept invisible',
-                    'onClick' => "STUDIP.Clipboard.rename(
-                        {
-                            'clipboard_id': '" . htmlReady($selected_clipboard_id) ."',
-                            'widget_id': '" . htmlReady($clipboard_widget_id) . "'
-                        });"
+                    'data-widget-id' => $clipboard_widget_id
                 ]
             ) ?>
 
-            <?= Icon::create('decline', 'clickable')->asImg(
-                '20px',
+            <?= Icon::create('decline')->asInput(
                 [
+                    'data-widget-id' => $clipboard_widget_id,
                     'class' => 'middle clipboard-edit-cancel invisible',
-                    'onClick' => "STUDIP.Clipboard.toggleEditButtons('"
-                             . htmlReady($clipboard_widget_id)
-                             . "');"
                 ]
             ) ?>
 
-            <?= Icon::create('trash', 'clickable')->asImg(
-                '20px',
+            <?= Icon::create('trash')->asInput(
                 [
-                    'class' => 'middle clipboard-remove-button'
-                           . (
-                               $clipboards ? '' : ' invisible'
-                           )
+                    'class' => 'middle clipboard-remove-button' . ($clipboards ? '' : ' invisible'),
+                    'data-confirm-message' => _('Sind Sie sicher?')
                 ]
             ) ?>
         <? endif ?>
@@ -72,6 +54,9 @@
                                                ? 'invisible'
                                                : '' ?>"
                        data-id="<?= htmlReady($clipboard->id) ?>">
+                    <colgroup>
+                        <col style="width: 70%">
+                    </colgroup>
                     <? $items = $clipboard->getContent(false) ?>
                     <? if ($items): ?>
                         <? foreach ($items as $item): ?>
@@ -98,11 +83,11 @@
                                                             ? 'draggable'
                                                             : '' ?>"
                                     data-range_id="<?= htmlReady($item['range_id']) ?>">
-                                    <td class="item-name">
+                                    <td>
                                         <label>
                                             <input type="checkbox"
                                                    name="selected_clipboard_items[]"
-                                                   title="<?= _('Diesen Eintrag auswählen.') ?>"
+                                                   title="<?= sprintf(_('%s auswählen.'), htmlReady($item['name'])) ?>"
                                                    value="<?= htmlReady($item['id']) ?>"
                                                    <?= in_array($item['id'], $selected_clipboard_items)
                                                      ? 'checked="checked"'
@@ -114,10 +99,11 @@
                                         </label>
                                     </td>
                                     <? if (!$readonly): ?>
-                                        <td class="item-actions">
-                                        <?= Icon::create('trash', 'clickable')->asImg(
-                                            '16px',
+                                        <td class="actions">
+                                        <?= Icon::create('trash')->asInput(
                                             [
+                                                'title' => sprintf(_('%s löschen.'), htmlReady($item['name'])),
+                                                'data-confirm-message' => _('Sind Sie sicher?'),
                                                 'class' => 'text-bottom clipboard-item-remove-button'
                                             ]
                                         ) ?>
@@ -154,8 +140,7 @@
                             </td>
                             <? if (!$readonly): ?>
                                 <td class="item-actions">
-                                    <?= Icon::create('trash', 'clickable')->asImg(
-                                        '16px',
+                                    <?= Icon::create('trash')->asInput(
                                         [
                                             'class' => 'text-bottom clipboard-item-remove-button'
                                         ]
@@ -170,6 +155,9 @@
         <table id="Clipboard_CLIPBOARD_ID"
                class="clipboard-area clipboard-template invisible"
                data-id="CLIPBOARD_ID">
+            <colgroup>
+                <col style="width: 80%">
+            </colgroup>
             <tr class="empty-clipboard-message">
                 <td>
                 <?= htmlReady($empty_clipboard_string) ?>
@@ -191,12 +179,13 @@
                     data-range_id="">
                     <td>
                         <input type="checkbox"
-                               name="clipboard_selected_items[]"
+                               name="selected_clipboard_items[]"
+                               title="<?= _('Diesen Eintrag auswählen.') ?>"
                                value="">
+                        <label></label>
                     </td>
                     <td>
-                        <?= Icon::create('trash', 'clickable')->asImg(
-                            '16px',
+                        <?= Icon::create('trash')->asInput(
                             [
                                 'class' => 'text-bottom clipboard-item-remove-button'
                             ]
diff --git a/templates/sidebar/clipboard-widget.php b/templates/sidebar/clipboard-widget.php
index dc2b911..46015e7 100644
--- a/templates/sidebar/clipboard-widget.php
+++ b/templates/sidebar/clipboard-widget.php
@@ -36,7 +36,9 @@
             <input type="text" name="name" placeholder="<?= _('Name des neuen Merkzettels') ?>"
         </label>
 
-        <?= Icon::create('add', 'clickable',
+        <?= Icon::create(
+            'add',
+            Icon::ROLE_CLICKABLE,
             [   'title' => _('Hinzufügen')])->asInput([
                 'name'   => 'save',
                 'id' => 'add-clipboard-button',
diff --git a/templates/sidebar/room-clipboard-item.php b/templates/sidebar/room-clipboard-item.php
index ae5c47d..2fc220b 100644
--- a/templates/sidebar/room-clipboard-item.php
+++ b/templates/sidebar/room-clipboard-item.php
@@ -30,7 +30,7 @@ if (!$item) {
 ?>
 <tr class="<?= htmlReady($classes) ?>"
     data-range_id="<?= htmlReady($item['range_id']) ?>">
-    <td class="item-name">
+    <td>
         <label>
             <input type="checkbox"
                    name="selected_clipboard_items[]"
@@ -46,50 +46,30 @@ if (!$item) {
             <?= htmlReady($item['name']) ?>
         </label>
     </td>
-    <td class="item-actions">
-        <?
-        $actions = ActionMenu::get()->setContext($item['name'] ?: '');
-        $actions->addLink(
-            Room::getLinkForAction(
-                'show',
-                ($item ? $item['range_id'] : 'RANGE_ID')
-            ),
-            _('Info'),
-            Icon::create('info', 'clickable'),
-            [
-                'data-dialog' => '1'
-            ]
-        );
-        $actions->addLink(
-            Room::getLinkForAction(
-                'booking_plan',
-                ($item ? $item['range_id'] : 'RANGE_ID')
-            ),
-            _('Wochenbelegung'),
-            Icon::create('timetable', 'clickable'),
-            [
-                'target' => '_blank'
-            ]
-        );
-        $actions->addLink(
-            Room::getLinkForAction(
-                'semester_plan',
-                ($item ? $item['range_id'] : 'RANGE_ID')
-            ),
-            _('Semesterbelegung'),
-            Icon::create('timetable', 'clickable'),
-            [
-                'target' => '_blank'
-            ]
-        );
-        ?>
-        <span class="clipboard-item-actions-container">
-            <?= $actions->render() ?>
-        </span>
+    <td class="actions">
+        <a href="<?= Room::getLinkForAction('show', ($item ? $item['range_id'] : 'RANGE_ID')) ?>" data-dialog>
+            <?= Icon::create(
+                    'info',
+                    Icon::ROLE_CLICKABLE,
+                    [
+                        'title' => _('Rauminformationen'),
+                        'class' => 'text-bottom'
+                    ])?>
+        </a>
+        <a href="<?= Room::getLinkForAction('semester_plan', ($item ? $item['range_id'] : 'RANGE_ID')) ?>" target="_blank">
+            <?= Icon::create(
+                    'timetable',
+                    Icon::ROLE_CLICKABLE,
+                    [
+                        'title' => _('Semesterbelegung'),
+                        'class' => 'text-bottom'
+                    ]
+            )?>
+        </a>
         <? if (!$readonly): ?>
-            <?= Icon::create('trash', 'clickable')->asImg(
-                '20px',
+            <?= Icon::create('trash')->asInput(
                 [
+                    'data-confirm-message' => _('Sind Sie sicher?'),
                     'class' => 'text-bottom clipboard-item-remove-button'
                 ]
             ) ?>
diff --git a/templates/sidebar/room-clipboard-widget.php b/templates/sidebar/room-clipboard-widget.php
index ca58443..c6a9830 100644
--- a/templates/sidebar/room-clipboard-widget.php
+++ b/templates/sidebar/room-clipboard-widget.php
@@ -14,11 +14,8 @@
 
     <ul class="widget-list widget-links invisible">
     <? foreach ($elements as $index => $element): ?>
-        <li id="<?= htmlReady('link-' . md5($element->url)) ?>" <?= $element->icon ? 'style="' . $element->icon->asCSS() .'"' : '' ?>>
-        <a <?= arrayToHtmlAttributes($element->attributes) ?>
-            data-url_path = "<?= htmlReady($element->url) ?>">
-            <?= htmlReady($element->label) ?>
-        </a>
+        <li id="<?= htmlReady($index) ?>" <?= $element->icon ? 'style="' . $element->icon->asCSS() .'"' : '' ?>>
+            <?= $element->render() ?>
         </li>
     <? endforeach; ?>
     </ul>
@@ -39,7 +36,7 @@
             <?= tooltipIcon(_('Geben Sie bitte einen Namen ein und klicken Sie auf das Plus-Symbol um eine neue Raumgruppe zu erstellen.')) ?>
             <input type="text" name="name" placeholder="<?= _('Name der neuen Raumgruppe') ?>">
 
-            <?= Icon::create('add', 'clickable',
+            <?= Icon::create('add', Icon::ROLE_CLICKABLE,
                 [   'title' => _('Hinzufügen')])->asInput([
                     'name'   => 'save',
                     'id' => 'add-clipboard-button',