Fixed issues with accessibility, improved ux, added zero states

internet2 · Apr 6, 2021 · 5c1f122 · 5c1f122
1 parent d12d5bb
commit 5c1f122
Show file tree

Hide file tree

Showing 13 changed files with 308 additions and 255 deletions.
diff --git a/Lib/lang.php b/Lib/lang.php
@@ -96,6 +96,7 @@
   'pl.grouperlite.action.view-in-grouper' => 'View in Grouper',
   'pl.grouperlite.action.view-members' => 'View members',
   'pl.grouperlite.action.close' => 'Close',
+  'pl.grouperlite.action.clear' => 'Clear',
 
   'pl.grouperlite.form.group.template.label' => 'Select a template',
   'pl.grouperlite.form.group.template.empty' => '(choose one)',
@@ -133,5 +134,7 @@
   'pl.grouperlite.search.tags.text' => 'Search',
 
   'pl.grouperlite.pagination.counter' => 'Viewing {:start}-{:end} of {:count}',
-  'pl.grouperlite.attributes.zero-state' => 'No Attributes Associated to this Group.'
+  'pl.grouperlite.attributes.zero-state' => 'No Attributes Associated to this Group.',
+  'pl.grouperlite.groups.zero-state' => 'No groups found.',
+  'pl.grouperlite.working-groups.zero-state' => 'No working groups found.'
 );
diff --git a/View/Elements/Components/groupattributes.ctp b/View/Elements/Components/groupattributes.ctp
@@ -1,25 +1,27 @@
-<table class="table table-striped w-100">
-    <thead>
-        <tr>
-            <th class="attr"><?php echo _txt('pl.grouperlite.table.attribute-name'); ?></th>
-            <th class="attr definition"><?php echo _txt('pl.grouperlite.table.attribute-description'); ?></th>
-            <th class="attr action"><?php echo _txt('pl.grouperlite.table.action'); ?></th>
-        </tr>
-    </thead>
-    <tbody>
-        <?php foreach ($attributes as $attr) : ?>
+<?php if (count($attributes) > 0) : ?>
+    <table class="table table-striped w-100">
+        <thead>
             <tr>
-                <td><?php echo $attr['attributeDefNameName']; ?></td>
-                <td><?php echo $attr['attributeDefName'] ?></td>
-                <td>
-                    <a href="<?php echo $baseUrl . $attr['attributeDefNameId']; ?>" class="btn btn-grouper btn btn-primary btn btn-raised btn btn-block" target="_blank" role="button">
-                        <?php echo _txt('pl.grouperlite.action.view'); ?> <i class="fa fa-external-link"></i>
-                    </a>
-                </td>
+                <th class="attr"><?php echo _txt('pl.grouperlite.table.attribute-name'); ?></th>
+                <th class="attr definition"><?php echo _txt('pl.grouperlite.table.attribute-description'); ?></th>
+                <th class="attr action"><?php echo _txt('pl.grouperlite.table.action'); ?></th>
             </tr>
-        <?php endforeach; ?>
-    </tbody>
-</table>
+        </thead>
+        <tbody>
+            <?php foreach ($attributes as $attr) : ?>
+                <tr>
+                    <td><?php echo $attr['attributeDefNameName']; ?></td>
+                    <td><?php echo $attr['attributeDefName'] ?></td>
+                    <td>
+                        <a href="<?php echo $baseUrl . $attr['attributeDefNameId']; ?>" class="btn btn-grouper btn btn-primary btn btn-raised btn btn-block" target="_blank" role="button">
+                            <?php echo _txt('pl.grouperlite.action.view'); ?> <i class="fa fa-external-link"></i>
+                        </a>
+                    </td>
+                </tr>
+            <?php endforeach; ?>
+        </tbody>
+    </table>
+<?php endif; ?>
 <?php if (count($attributes) < 1) : ?>
     <div class="alert alert-info">
         <p class="lead mb-0 text-center"><?php echo _txt('pl.grouperlite.attributes.zero-state'); ?></p>

diff --git a/View/Elements/Components/navigation-emaillists.ctp b/View/Elements/Components/navigation-emaillists.ctp
@@ -40,15 +40,15 @@
     <?php if ($isuserowner === 'T') { ?>
         <div class="align-self-center">
             <?php
-            $createEmailUrl = $this->Html->url(
+            $createTemplateGroupUrl = $this->Html->url(
                 array(
                     'controller' => 'grouper_groups',
-                    'action' => 'groupcreatetemplateform'
+                    'action' => 'groupcreatetemplate'
                 )
             );
             ?>
-            <a href="<?php echo $createEmailUrl; ?>" class="btn btn-grouper btn btn-link px-3 py-2">
-                <i class="fa fa-plus-circle"></i>&nbsp; <?php echo _txt('pl.grouperlite.nav.create-email'); ?>
+            <a href="<?php echo $createTemplateGroupUrl; ?>" class="btn btn-grouper btn btn-link px-3 py-2">
+                <i class="fa fa-plus-circle"></i>&nbsp; <?php echo _txt('pl.grouperlite.nav.create-working-group'); ?>
             </a>
         </div>
     <?php } ?>

diff --git a/View/Elements/Components/optAction.ctp b/View/Elements/Components/optAction.ctp
@@ -1,8 +1,9 @@
 <?php echo $this->Form->create(false, array(
   'url' => array('controller' => 'grouper_groups', 'action' => $action),
-  'class' => 'd-flex justify-content-center'
+  'class' => 'd-flex justify-content-center',
+  'id' => 'join-group.' . $idx
 )); ?>
-<?php print $this->Form->hidden('GroupName', array('default' => $group)); ?>
+<?php print $this->Form->hidden('GroupName', array('default' => $group, 'id' => 'groupName.'.$idx)); ?>
 <button class="btn btn-block btn-<?php echo $member ? 'danger' : 'success'; ?>" type="submit">
     <?php echo $member ? _txt('pl.grouperlite.action.leave') : _txt('pl.grouperlite.action.join') ?> &nbsp;
     <i class="fa fa-<?php echo $member ? 'user-times' : 'users'; ?> fa-sm"></i>

diff --git a/View/Elements/Components/search.ctp b/View/Elements/Components/search.ctp
@@ -27,8 +27,9 @@
             <!--<input type="text" name="search" class="form-control" value="<?php echo isset($searchcriteria) ? $searchcriteria : ''; ?>" /> -->
             <div class="input-group-append">
                 <?php if (isset($searchcriteria) && $searchcriteria !== '') { ?>
-                    <button class="btn btn-grouper btn-outline-secondary shadow-none" type="button" value="Clear" id="reset-search">
+                    <button class="btn btn-grouper btn-outline-secondary shadow-none" type="button" value="Clear" id="reset-search" aria-label="<?php echo _txt("pl.grouperlite.action.clear"); ?>">
                         <i class="fa fa-times"></i>
+                        <span class="sr-only"><?php echo _txt("pl.grouperlite.action.clear"); ?></span>
                     </button>
                 <?php } ?>
                 <button class="btn btn-grouper btn-primary px-4" type="submit" value="Submit">

diff --git a/View/GrouperGroups/base.ctp b/View/GrouperGroups/base.ctp
@@ -12,7 +12,7 @@ $this->Html->addCrumb(_txt('pl.grouperlite.crumb.root'), array('controller' => '
 <div id="grouper-plugin" class="grouper pt-2">
     <div class="d-flex align-items-center mb-4">
         <?php print $this->Html->image('GrouperLite.Grouper.jpg', array('class' => 'img-fluid mr-2', 'style' => 'height: 50px')); ?>
-        <h2><?php echo $title; ?></h2>
+        <h1 class="h2"><?php echo $title; ?></h1>
         <!--<div class="ml-auto"><a href="#">Why Grouper?</a></div>-->
     </div>
     <?php echo $this->fetch('content'); ?>

diff --git a/View/GrouperGroups/emaillistsmanage.ctp b/View/GrouperGroups/emaillistsmanage.ctp
@@ -2,53 +2,61 @@
 <?php $this->Html->addCrumb(_txt('pl.grouperlite.title.emaillists-manage')); ?>
 <?php echo $this->element('Components/navigation-emaillists', array('active' => 'emaillistsmanage', 'create' => true)); ?>
 <?php echo $this->element('Components/search', array('active' => 'emaillistsmanaged')); ?>
-<div class="">
-    <table class="table table-striped w-100 mb-0">
-        <thead>
-            <tr>
-                <th class="group name"><?php echo _txt('pl.grouperlite.table.name'); ?></th>
-                <th class="group description"><?php echo _txt('pl.grouperlite.table.description'); ?></th>
-                <th class="group groups"><?php echo _txt('pl.grouperlite.table.groups'); ?></th>
-                <th class="group groups"><?php echo _txt('pl.grouperlite.table.open'); ?></th>
-                <th class="group action text-center"><?php echo _txt('pl.grouperlite.table.action'); ?></th>
-            </tr>
-        </thead>
-        <tbody>
-            <tr>
-                <td><?php echo $this->Html->link(
-                        isset($group['name']) ? $group['domain'] . ':' . $group['name'] : "--",
-                        array(
-                            'controller' => 'grouper_groups',
-                            'action' => 'emaillistinfo',
-                            '?' => array('groupname' => urlencode($group['name']))
-                        )
-                    ) ?></td>
-                <td><?php echo isset($group['description']) ? $group['description'] : "--"; ?></td>
-                <td>
-                    <a href="#"><?php echo _txt('pl.grouperlite.table.user-type-members'); ?> (10)</a> |
-                    <a href="#"><?php echo _txt('pl.grouperlite.table.user-type-moderators'); ?> (2)</a> |
-                    <a href="#"><?php echo _txt('pl.grouperlite.table.user-type-owners'); ?> (1)</a>
-                </td>
-                <td><?php echo isset($group['open']) && $group['open'] === 'T' ? _txt('pl.grouperlite.table.status-open') : _txt('pl.grouperlite.table.status-moderated'); ?></td>
-                <td class="text-right">
-                    <span class="d-flex flex-column flex-lg-row justify-content-center align-items-center">
-                        <button class="btn btn-grouper btn btn-raised btn btn-primary w-50 mr-1" disabled>
-                            <?php echo _txt('pl.grouperlite.action.edit-group'); ?> &nbsp;
-                            <i class="fa fa-pencil fa-sm"></i>
-                        </button>
-                        <button class="btn btn-grouper btn btn-raised btn btn-danger ml-1 flex-fill" disabled>
-                            <?php echo _txt('pl.grouperlite.action.disable-group'); ?> &nbsp;
-                            <i class="fa fa-ban fa-sm"></i>
-                        </button>
-                    </span>
-                </td>
-            </tr>
-        </tbody>
-    </table>
-    <?php print $this->element("pagination", array(
-        'goto' => false,
-        'limit' => true,
-        'numbers' => true,
-        'counter' => false
-    )); ?>
-</div>
+
+<?php if (count($emailgroups) > 0) : ?>
+    <div class="">
+        <table class="table table-striped w-100 mb-0">
+            <thead>
+                <tr>
+                    <th class="group name"><?php echo _txt('pl.grouperlite.table.name'); ?></th>
+                    <th class="group description"><?php echo _txt('pl.grouperlite.table.description'); ?></th>
+                    <th class="group groups"><?php echo _txt('pl.grouperlite.table.groups'); ?></th>
+                    <th class="group groups"><?php echo _txt('pl.grouperlite.table.open'); ?></th>
+                    <th class="group action text-center"><?php echo _txt('pl.grouperlite.table.action'); ?></th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td><?php echo $this->Html->link(
+                            isset($group['name']) ? $group['domain'] . ':' . $group['name'] : "--",
+                            array(
+                                'controller' => 'grouper_groups',
+                                'action' => 'emaillistinfo',
+                                '?' => array('groupname' => urlencode($group['name']))
+                            )
+                        ) ?></td>
+                    <td><?php echo isset($group['description']) ? $group['description'] : "--"; ?></td>
+                    <td>
+                        <a href="#"><?php echo _txt('pl.grouperlite.table.user-type-members'); ?> (10)</a> |
+                        <a href="#"><?php echo _txt('pl.grouperlite.table.user-type-moderators'); ?> (2)</a> |
+                        <a href="#"><?php echo _txt('pl.grouperlite.table.user-type-owners'); ?> (1)</a>
+                    </td>
+                    <td><?php echo isset($group['open']) && $group['open'] === 'T' ? _txt('pl.grouperlite.table.status-open') : _txt('pl.grouperlite.table.status-moderated'); ?></td>
+                    <td class="text-right">
+                        <span class="d-flex flex-column flex-lg-row justify-content-center align-items-center">
+                            <button class="btn btn-grouper btn btn-raised btn btn-primary w-50 mr-1" disabled>
+                                <?php echo _txt('pl.grouperlite.action.edit-group'); ?> &nbsp;
+                                <i class="fa fa-pencil fa-sm"></i>
+                            </button>
+                            <button class="btn btn-grouper btn btn-raised btn btn-danger ml-1 flex-fill" disabled>
+                                <?php echo _txt('pl.grouperlite.action.disable-group'); ?> &nbsp;
+                                <i class="fa fa-ban fa-sm"></i>
+                            </button>
+                        </span>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+        <?php print $this->element("pagination", array(
+            'goto' => false,
+            'limit' => true,
+            'numbers' => true,
+            'counter' => false
+        )); ?>
+    </div>
+<?php endif; ?>
+<?php if (count($emailgroups) < 1) : ?>
+    <div class="alert alert-info">
+        <p class="lead mb-0 text-center"><?php echo _txt('pl.grouperlite.working-groups.zero-state'); ?></p>
+    </div>
+<?php endif; ?>
diff --git a/View/GrouperGroups/emaillistsmember.ctp b/View/GrouperGroups/emaillistsmember.ctp
@@ -3,43 +3,51 @@
 <?php echo $this->element('Components/navigation-emaillists', array('active' => 'emaillistsmember')); ?>
 <?php echo $this->element('Components/search', array('active' => 'emaillistsmember')); ?>
 
-<div class="">
-    <table class="table table-striped w-100 mb-0">
-        <thead>
-            <tr>
-                <th class="group name"><?php echo _txt('pl.grouperlite.table.name'); ?></th>
-                <th class="group description"><?php echo _txt('pl.grouperlite.table.description'); ?></th>
-                <th class="group action text-center"><?php echo _txt('pl.grouperlite.table.action'); ?></th>
-            </tr>
-        </thead>
-        <tbody>
-            <?php foreach ($emailgroups as $group) : ?>
-            <tr>
-                <td><?php echo $this->Html->link(
+<?php if (count($emailgroups) > 0) : ?>
+    <div class="">
+        <table class="table table-striped w-100 mb-0">
+            <thead>
+                <tr>
+                    <th class="group name"><?php echo _txt('pl.grouperlite.table.name'); ?></th>
+                    <th class="group description"><?php echo _txt('pl.grouperlite.table.description'); ?></th>
+                    <th class="group action text-center"><?php echo _txt('pl.grouperlite.table.action'); ?></th>
+                </tr>
+            </thead>
+            <tbody>
+                <?php foreach ($emailgroups as $key => $group) : ?>
+                    <tr>
+                        <td><?php echo $this->Html->link(
 
-                    isset($group['name']) ? $group['domain'].':'.$group['name'] : "No Name",
-                    array(
-                        'controller' => 'grouper_groups',
-                        'action' => 'emaillistinfo',
-                        '?' => array('groupname' => urlencode($group['name']))
-                    )
-                ) ?></td>
-                <td><?php echo isset($group['description']) ? $group['description'] : _txt('pl.grouperlite.value.descr.zerostate'); ?></td>
-                <td>
-                  <?php echo $group['optedin'] ? $this->element('GrouperLite.Components/optAction', array(
-                    'member' => $group['optedin'],
-                    'action' => 'leavegroup',
-                    'group' => $group['name']
-                  )) : ''; ?>
-                </td>
-            </tr>
-            <?php endforeach; ?>
-        </tbody>
-    </table>
-    <?php print $this->element("pagination", array(
-        'goto' => false,
-        'limit' => true,
-        'numbers' => true,
-        'counter' => false
-    )); ?>
-</div>
+                                isset($group['name']) ? $group['domain'] . ':' . $group['name'] : "No Name",
+                                array(
+                                    'controller' => 'grouper_groups',
+                                    'action' => 'emaillistinfo',
+                                    '?' => array('groupname' => urlencode($group['name']))
+                                )
+                            ) ?></td>
+                        <td><?php echo isset($group['description']) ? $group['description'] : _txt('pl.grouperlite.value.descr.zerostate'); ?></td>
+                        <td>
+                            <?php echo $group['optedin'] ? $this->element('GrouperLite.Components/optAction', array(
+                                'member' => $group['optedin'],
+                                'action' => 'leavegroup',
+                                'group' => $group['name'],
+                                'idx' => $key
+                            )) : ''; ?>
+                        </td>
+                    </tr>
+                <?php endforeach; ?>
+            </tbody>
+        </table>
+        <?php print $this->element("pagination", array(
+            'goto' => false,
+            'limit' => true,
+            'numbers' => true,
+            'counter' => false
+        )); ?>
+    </div>
+<?php endif; ?>
+<?php if (count($emailgroups) < 1) : ?>
+    <div class="alert alert-info">
+        <p class="lead mb-0 text-center"><?php echo _txt('pl.grouperlite.working-groups.zero-state'); ?></p>
+    </div>
+<?php endif; ?>