Skip to content

Commit

Permalink
Update label handling to accommodate checkboxes and special fields th…
Browse files Browse the repository at this point in the history 
…at do not have visible input elements. (CFM-219) (#85)

* Update label handling to accommodate checkboxes and special fields that do not have input elements. (CFM-219)

* Change variable name for clarity (CFM-219)

* Post-rebase fix to correct labels for read-only fields - e.g. Jobs UI (CFM-219)
  • Loading branch information
@arlen
arlen authored Mar 23, 2023
1 parent 25784ad commit 997a207
Show file tree
Hide file tree
Showing 4 changed files with 46 additions and 27 deletions.
45 changes: 35 additions & 10 deletions app/src/View/Helper/FieldHelper.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,10 +99,17 @@ public function control(string $fieldName,

// Specify a class on the <li> form control wrapper
$liClass = $cssClass;

// Get the field type from the map of fields (e.g. 'boolean', 'string', 'timestamp')
$fieldMap = $this->getView()->get('vv_field_types');
$fieldType = $fieldMap[$fieldName];

// Collect any supplemental markup and/or JavaScript to pass along for field construction.
// Suppliment is an array: supplement['beforeField' => 'string', 'afterField' => 'string'].
$fieldSupplement = !empty($config['supplement']) ? $config['supplement'] : [];

// For special fields that should not include <label> markup, allow fields to make the label text only
$labelIsTextOnly = !empty($config['labelIsTextOnly']) ? $config['labelIsTextOnly'] : false;

// Remove prefix from field value
if(isset($config['prefix'], $this->getView()->get('vv_obj')->$fieldName)) {
Expand All @@ -121,6 +128,13 @@ public function control(string $fieldName,
// Note this will be ignored for non-select controls.
$coptions['empty'] = true;
}

// A boolean field is a checkbox. Set the label and class to improve rendering
// and accessibility.
if($fieldType == 'boolean') {
$coptions['label'] = $labelText;
$coptions['class'] = 'form-check-input';
}

// Generate the form control or pass along the markup generated in a wrapper function
$controlCode = empty($ctrlCode) ? $this->Form->control($fieldName, $coptions) : $ctrlCode;
Expand Down Expand Up @@ -156,7 +170,7 @@ public function control(string $fieldName,
}

return $this->startLine($liClass)
. $this->formNameDiv($fieldName, $labelText)
. $this->formNameDiv($fieldName, $labelText, $fieldType, $labelIsTextOnly)
. ( !empty($config['prefix']) ?
$this->formInfoWithPrefixDiv($controlCode, $config['prefix'], $fieldSupplement) :
$this->formInfoDiv($controlCode, $fieldSupplement) )
Expand Down Expand Up @@ -275,8 +289,9 @@ protected function endLine(): string {
* Generate a form info (control, value) box.
*
* @since COmanage Registry v5.0.0
* @param string $content Content HTML
* @return string Form Info HTML
* @param string $content Content HTML
* @param string $supplement Supplemental markup to place before and/or after the field control
* @return string Form Info HTML
*/

protected function formInfoDiv(string $content, array $supplement): string {
Expand All @@ -297,9 +312,10 @@ protected function formInfoDiv(string $content, array $supplement): string {
* Generate a form info (control, value) box with a non editable prefix.
*
* @since COmanage Registry v5.0.0
* @param string $content Content HTML
* @param string $prefix Prefix value
* @return string Form Info HTML
* @param string $content Content HTML
* @param string $prefix Prefix value
* @param string $supplement Supplemental markup to place before and/or after the field control
* @return string Form Info HTML
*/

protected function formInfoWithPrefixDiv(string $context, string $prefix, array $supplement): string {
Expand Down Expand Up @@ -327,10 +343,12 @@ protected function formInfoWithPrefixDiv(string $context, string $prefix, array
* @since COmanage Registry v5.0.0
* @param string $fieldName Form field
* @param string $labelText Label text (fieldName language key used by default)
* @param string $fieldType Type of field (string, boolean, timestamp, etc)
* @param boolean $labelIsTextOnly True if label should be text only. Otherwise false.
* @return string Form Name HTML
*/

protected function formNameDiv(string $fieldName, string $labelText=null): string {
protected function formNameDiv(string $fieldName, string $labelText=null, string $fieldType, bool $labelIsTextOnly=false): string {
$label = $labelText;
$desc = null;

Expand Down Expand Up @@ -390,7 +408,9 @@ protected function formNameDiv(string $fieldName, string $labelText=null): strin

return '<div class="field-name">
<div class="field-title">'
. $this->Form->label($fn, $label)
. (!($labelIsTextOnly) && ($fieldType != 'boolean')
? $this->Form->label($fn, $label)
: $label)
. ($this->editable
&& in_array($fn, $this->reqFields)
? ' <span class="required">*</span>'
Expand All @@ -408,13 +428,15 @@ protected function formNameDiv(string $fieldName, string $labelText=null): strin
* @param string $status Status text
* @param array $link Link information, including 'url', 'label', 'class', 'confirm'
* @param string $labelText Label text (fieldName language key used by default)
* @param array $config Custom FormHelper configuration options
* @return string
*/

public function statusControl(string $fieldName,
string $status,
array $link=[],
string $labelText=null): string {
string $labelText=null,
array $config=[]): string {
$linkHtml = $status;

if($link) {
Expand All @@ -439,9 +461,12 @@ public function statusControl(string $fieldName,
);
}
}

// For special fields that should not include <label> markup, allow fields to make the label text only
$labelIsTextOnly = !empty($config['labelIsTextOnly']) ? $config['labelIsTextOnly'] : false;

return $this->startLine()
. $this->formNameDiv($fieldName, $labelText)
. $this->formNameDiv($fieldName, $labelText, 'string', $labelIsTextOnly)
. $linkHtml
. $this->endLine();
}
Expand Down
9 changes: 7 additions & 2 deletions app/templates/ApiUsers/fields.inc
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ if($vv_action == 'add' || $vv_action == 'edit') {

// We link to the "Generate" button on edit only
$generateLink = [];
$config = [];

if(!empty($vv_obj->id)) {
$generateLink = [
Expand All @@ -45,14 +46,18 @@ if($vv_action == 'add' || $vv_action == 'edit') {
$vv_obj->id
],
'label' => __d('operation', 'api.key.generate'),
'class' => 'provisionbutton',
'class' => 'provisionbutton nospin',
'confirm' => __d('operation', 'api.key.generate.confirm')
];

$config = ['labelIsTextOnly' => true];
}

print $this->Field->statusControl('api_key',
!empty($vv_obj->api_key) ? __d('enumeration', 'SetBooleanEnum.1') : __d('enumeration', 'SetBooleanEnum.0'),
$generateLink);
$generateLink,
null,
$config);

print $this->Field->control('status', ['empty' => false]);

Expand Down
2 changes: 1 addition & 1 deletion app/templates/element/menuTop.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -86,7 +86,7 @@
'action' => 'select',
'plugin' => false],
['escape' => false,
'id' => 'login',
'id' => 'login-button',
'class' => 'btn btn-small']);
}
?>
Expand Down
17 changes: 3 additions & 14 deletions app/webroot/css/co-base.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -331,7 +331,7 @@ body.cos.select #top-bar {
margin: 0 0 0.25rem;
}
/* LOGIN & LOGOUT */
#login {
#login-button {
display: inline-block;
padding: 0.25em 1em;
text-decoration: none;
Expand Down Expand Up @@ -1178,19 +1178,8 @@ ul.form-list li.field-stack textarea {
ul.form-list .field-suppliment {
font-size: 0.9em;
}
.checkbox {
margin-bottom: 0.5em;
}
.checkbox input {
float: left;
margin: 4px 4px 0 0;
}
.checkbox label {
margin-left: 1.5em;
display: block;
}
.checkbox label::first-line {
margin-left: 0;
.checkbox label input {
margin-right: 0.5em;
}
.checkbox .subfield {
margin-left: 1.5em;
Expand Down

0 comments on commit 997a207

Please sign in to comment.