Add special "Start" button to Enrollment Flow views (CFM-428)

app/plugins/CoreEnroller/templates/EnrollmentAttributes/columns.inc

@@ -91,6 +91,7 @@ $action_args['vv_attr_id'] = $vv_user['username'];
 $action_args['vv_actions_type'] = 'mvea-add-menu';
 $action_args['vv_actions_title'] = __d('operation', 'add.attribute');
 $action_args['vv_actions_icon'] = 'add_circle';
+$action_args['vv_actions_icon_class'] = 'material-symbols-outlined';
 $action_args['vv_actions_class'] = 'mvea-add-menu';
 $actionOrderDefault = $this->Menu->getMenuOrder('Default');
 foreach ($attributes as $attr => $hr_name) {

app/resources/locales/en_US/error.po

@@ -54,8 +54,8 @@ msgstr "Username \"{0}\" not found in api_users table"
 msgid "auto.viewvar.type.unknown"
 msgstr "Unknown Auto View Var Type {0}"
 
-msgid "copy.error"
-msgstr "Could not copy."
+msgid "copy.javascript.clipboard"
+msgstr "Could not copy. (Note: This feature requires HTTPS.)"
 
 msgid "coid"
 msgstr "CO ID not found"

app/resources/locales/en_US/operation.po

@@ -117,6 +117,9 @@ msgstr "Continue"
 msgid "copy"
 msgstr "Copy"
 
+msgid "copy.flowUrl"
+msgstr "Copy Enrollment Flow URL"
+
 msgid "copy.value"
 msgstr "Copy value"
 

app/src/View/Helper/VueHelper.php

@@ -47,7 +47,7 @@ class VueHelper extends Helper {
       'SuspendableStatusEnum.S'
     ],
     'error' => [
-      'copy.error'
+      'copy.javascript.clipboard'
     ],
     'field' => [
       'email',

app/templates/element/subnavigation/navBar.php

@@ -52,6 +52,7 @@
       <?= $this->element('subnavigation/supertitle') ?>
       <?= $this->element('subnavigation/statusBadge') ?>
     </div>
+    <?= $this->element('subnavigation/upperButtons') ?>
   </div>
 
   <!-- Flash Messages are placed below supertitle when subnavigation exists. -->

app/templates/element/subnavigation/upperButtons.php

@@ -0,0 +1,72 @@
+<?php
+  /**
+   * COmanage Registry Subnavigation Upper Buttons Element
+   *
+   * Portions licensed to the University Corporation for Advanced Internet
+   * Development, Inc. ("UCAID") under one or more contributor license agreements.
+   * See the NOTICE file distributed with this work for additional information
+   * regarding copyright ownership.
+   *
+   * UCAID licenses this file to you under the Apache License, Version 2.0
+   * (the "License"); you may not use this file except in compliance with the
+   * License. You may obtain a copy of the License at:
+   *
+   * http://www.apache.org/licenses/LICENSE-2.0
+   *
+   * Unless required by applicable law or agreed to in writing, software
+   * distributed under the License is distributed on an "AS IS" BASIS,
+   * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+   * See the License for the specific language governing permissions and
+   * limitations under the License.
+   *
+   * @link          https://www.internet2.edu/comanage COmanage Project
+   * @package       registry
+   * @since         COmanage Registry v5.0.0
+   * @license       Apache License, Version 2.0 (http://www.apache.org/licenses/LICENSE-2.0)
+   *
+   *
+   */
+
+// Special "Start" and "Copy" buttons for Enrollment Flow configuration views.
+// This element can be expanded to other views if needed.
+if(
+  $vv_controller != 'EnrollmentFlows' &&
+  $vv_controller != 'EnrollmentFlowSteps' &&
+  $vv_controller != 'Petitions'
+) {
+  return;
+}
+
+$enrollmentFlowId = $vv_obj->id;
+if($vv_controller != 'EnrollmentFlows') {
+  $enrollmentFlowId = $vv_primary_link_obj->id;
+}
+
+$startButtonUrl = $this->Url->build(
+  ['controller'   => 'enrollment_flows',
+   'action'       => 'start',
+   $enrollmentFlowId
+  ],
+  ['fullBase' => true]
+);
+?>
+<div class="upper-buttons">
+  <a href="<?= $startButtonUrl ?>" class="btn btn-sm btn-tertiary">
+    <em class="material-symbols">play_arrow</em>
+    <?= __d('operation', 'EnrollmentFlows.start') ?>
+  </a>
+
+  <button
+    aria-label="<?= __d('operation','copy.flowUrl') ?>"
+    onclick="copyValStatic(
+      '<?= $startButtonUrl ?>',
+      this,
+      '<?= __d('operation','copy.flowUrl') ?>',
+      '<?= __d('information','value.copied') ?>',
+      '<?= __d('error','copy.javascript.clipboard') ?>')"
+    class="btn btn-sm btn-primary"
+  >
+    <em class="material-symbols-outlined">content_copy</em>
+    <?= __d('operation','copy') ?>
+  </button>
+</div>

app/webroot/css/co-base.css

@@ -26,7 +26,6 @@
 
 /* HTML, BODY, HEADINGS, ANCHORS, FONTS */
 @import url("fonts/opensans/stylesheet.css");
-@import url("fonts.material-symbols.material-symbols.css");
 @import url("fonts/material-symbols/stylesheet.css");
 
 html * {
@@ -1781,6 +1780,15 @@ li[data-pc-section="emptymessage"] {
   color: var(--cmg-color-txt-soft);
   background-color: unset;
 }
+/* ENROLLMENT FLOWS */
+.upper-buttons {
+  display: flex;
+  gap: 0.5em;
+  font-size: 0.9em;
+}
+.upper-buttons a {
+  padding: 0.5em 1em;
+}
 /* ENROLLMENT FLOWS: ATTRIBUTE COLLECTOR */
 body.attributecollectors main,
 body.basicattributecollectors main {

app/webroot/js/comanage/comanage.js

@@ -270,6 +270,38 @@ function clearTopSearch(formObj) {
   formObj.submit();
 }
 
+/**
+ * COmanage Registry Copy to Clipboard (for static, non-vuejs buttons)
+ * @param val              {string} String to copy
+ * @param clickedObj       {object} DOM object clicked, typically a button containing both text and an icon
+ * @param copyTxt          {string} aria-label describing what to copy
+ * @param successTxt       {string} aria-label success message after copy
+ * @param errorTxt         {string} error message if browser can't copy
+ */
+async function copyValStatic(
+  val,
+  clickedObj,
+  copyTxt,
+  successTxt,
+  errorTxt
+) {
+  try {
+    // remove extra white spaces and trim the value
+    let valWithNormalizedSpaces = val.replace(/\s+/g, ' ').trim();
+    // copy to clipboard
+    await navigator.clipboard.writeText(valWithNormalizedSpaces);
+    // provide feedback
+    $(clickedObj).find('em').text('thumb_up');
+    $(clickedObj).attr('aria-label', successTxt);
+    // reset feedback
+    setTimeout(() => $(clickedObj).find('em').text('content_copy'), 1200);
+    setTimeout(() => $(clickedObj).attr('aria-label', copyTxt), 3000);
+  } catch($e) {
+    // this will be rendered if browser is not on HTTPS
+    alert(errorTxt + "\n" + $e);
+  }
+}
+
 /**
  * COmanage Registry API AJAX Calls: general function for making an ajax call to Registry API v.2
  * @param url              {string} API Url

app/webroot/js/comanage/components/common/copy-value-button.js

@@ -54,7 +54,7 @@ export default {
         setTimeout(() => this.ariaLabel = this.txt['copy.value'], 2200);
       } catch($e) {
         // this will be rendered if browser is not on HTTPS
-        alert(this.txt["copy.error"] + "\n" + $e);
+        alert(this.txt["copy.javascript.clipboard"] + "\n" + $e);
       }
     }
   },