Add "Switch Matchgrid" link to User Menu; also add material icons to …

…login/logout (CO-2483) (COmanage#45)
skoranda · Oct 27, 2022 · 04dce0d · 04dce0d
1 parent 4f071af
commit 04dce0d
Showing 3 changed files with 45 additions and 3 deletions.
diff --git a/app/resources/locales/en_US/default.po b/app/resources/locales/en_US/default.po
@@ -580,6 +580,9 @@ msgstr "Resolve matching records when COmanage determines the same person may be
 msgid "match.in.matchgrid.select"
 msgstr "Select the Matchgrid you would like to work with."
 
+msgid "match.in.matchgrid.switch"
+msgstr "Switch Matchgrid"
+
 msgid "match.in.matchgrids.none"
 msgstr "There are no matchgrids currently defined."
 

diff --git a/app/templates/element/menuTop.php b/app/templates/element/menuTop.php
@@ -72,10 +72,10 @@
         <em class="material-icons icon-adjust">person</em>
       </a>
       <!-- Account Dropdown -->
-      <div id="user-panel"  class="dropdown-menu" aria-labelledby="user-panel-toggle">
+      <div id="user-panel"  class="dropdown-menu<?= (count($vv_matchgrids) > 1) ? ' with-mg-switcher' : ''; ?>" aria-labelledby="user-panel-toggle">
         <div id="logout-in-panel">
           <?php
-          print $this->Html->link(__('match.op.logout'),
+          print $this->Html->link('<em class="material-icons" aria-hidden="true">logout</em> ' . __('match.op.logout'),
                                   '/auth/logout/logout.php',
                                   ['escape'     => false,
                                     'class'      => 'btn']);
@@ -86,6 +86,17 @@
           <div id="user-panel-cn"><?= $vv_user['username']; ?></div>
           <div id="user-panel-id"><?php print $this->getRequest()->getSession()->read('Auth.User.username'); ?></div>
         </div>
+
+        <?php if(count($vv_matchgrids) > 1): // More than one Matchgrid is available, so present the switch button ?>
+          <div id="user-panel-switch-mg">
+            <?= $this->Html->link('<em class="material-icons" aria-hidden="true">transfer_within_a_station</em> ' . __('match.in.matchgrid.switch'),
+              '/matchgrids/select',
+              ['escape'     => false,
+               'id'         => 'mg-switch-link',
+               'class'      => 'btn']);
+            ?>
+          </div>
+        <?php endif; ?>
       </div>
     </li>
   </ul>
@@ -94,7 +105,7 @@
 <?php if(!isset($noLoginLogout) || !$noLoginLogout) : ?>
   <?php
   if(!$vv_user) {
-    print $this->Html->link(__('match.op.login'),
+    print $this->Html->link('<em class="material-icons" aria-hidden="true">login</em> '. __('match.op.login'),
                             ['controller' => 'matchgrids',
                               'action'     => 'select',
                               'plugin'     => false],

diff --git a/app/webroot/css/co-base.css b/app/webroot/css/co-base.css
@@ -264,6 +264,25 @@ body.logged-in #top-menu {
 #user-panel #panel-orgid {
   margin-top: 0;
 }
+#user-panel.with-mg-switcher {
+  padding-bottom: 0;
+}
+#user-panel #user-panel-switch-mg {
+  clear: both;
+  text-align: center;
+  border-top: 1px solid var(--cmg-color-lightgray-006);
+  margin-top: 1em;
+  padding: 0;
+}
+#user-panel #mg-switch-link {
+  text-transform: unset;
+  font-size: 1.1em;
+  display: block;
+  padding: 1em;
+}
+#user-panel #mg-switch-link .material-icons {
+  margin-right: 1px;
+}
 /* LOGIN & LOGOUT */
 #login {
   margin-top: -2px;
@@ -297,6 +316,15 @@ body.logged-in #top-menu {
   margin: 4px 0 -8px;
   text-align: right;
 }
+#login .material-icons, 
+#logout-in-panel .material-icons {
+  font-size: 1rem;
+  vertical-align: top;
+  margin-top: 0.25rem;
+}
+#login .material-icons {
+  margin: 0.5rem 0;
+}
 /* Shib IDP */
 #idp-select-container {
   clear: both;