Skip to content

Commit 944e8ab

Browse files
cdcabreracdcabrera
committed
DEV Prefix Validation & Copy Updates
Prefix validation, adjustments to copy
1 parent 26c953a commit 944e8ab

File tree

7 files changed

+137
-99
lines changed

7 files changed

+137
-99
lines changed

‎app/scripts/directives/editEnvironmentFrom.js

+12-11
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,16 @@
88
EditEnvironmentFrom
99
],
1010
bindings: {
11-
addRowLink: '@', // creates a link to "add row" and sets its text label
12-
entries: '=', // an array of objects containing configmaps and secrets
13-
envFromSelectorOptions: '<', // dropdown selector options, an array of objects
14-
selectorPlaceholder: '@', // placeholder copy for dropdown selector
15-
isReadonly: '<?' // display as read only values
11+
addRowLink: '@', // creates a link to "add row" and sets its text label
12+
entries: '=', // an array of objects containing configmaps and secrets
13+
envFromSelectorOptions: '<', // dropdown selector options, an array of objects
14+
prefixMinlength: '@?', // prefix minimum number of characters
15+
prefixValidator: '@', // prefix validation for ng-pattern
16+
prefixValidatorError: '@', // prefix validation error message
17+
prefixValidatorErrorTooltip: '@?', // prefix validation error tooltip message
18+
prefixValidatorErrorTooltipIcon: '@?',// prefix validation error tooltip icon
19+
selectorPlaceholder: '@', // placeholder copy for dropdown selector
20+
isReadonly: '<?' // display as read only values
1621
},
1722
templateUrl: 'views/directives/edit-environment-from.html'
1823
});
@@ -27,8 +32,9 @@
2732

2833
ctrl.setFocusClass = 'edit-environment-from-set-focus-' + uniqueId;
2934

30-
ctrl.viewOverlayPanel = function(entry) {
35+
ctrl.viewOverlayPanel = function(entry, prefix) {
3136
ctrl.overlayPaneEntryDetails = entry;
37+
ctrl.overlayPaneEntryPrefix = prefix;
3238
ctrl.overlayPanelVisible = true;
3339
};
3440

@@ -87,11 +93,6 @@
8793
}
8894
};
8995

90-
ctrl.removePrefix = function (entry) {
91-
delete entry.prefix;
92-
ctrl.editEnvironmentFromForm.$setDirty();
93-
};
94-
9596
ctrl.envFromObjectSelected = function(index, entry, selected) {
9697
var newEnvFrom = {};
9798

‎app/styles/_kve.less

+6
Original file line numberDiff line numberDiff line change
@@ -136,8 +136,14 @@
136136
margin-bottom: 0;
137137
padding-right: 5px;
138138
width: 100%;
139+
.environment-from-input {
140+
padding-right: 0;
141+
}
139142
@media(min-width: @screen-md-min) {
140143
width: 50%;
144+
.environment-from-input {
145+
padding-right: 5px;
146+
}
141147
}
142148
.faux-input-group,
143149
.ui-select {

‎app/views/directives/edit-environment-from.html

+29-12
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,13 @@
88
</div>
99
</div>
1010
<div class="form-group environment-from-editor-header value-header">
11-
<div class="input-group">
11+
<div class="input-group"
12+
ng-if="!$ctrl.isEnvFromReadonly() && $ctrl.hasOptions()">
1213
Prefix
1314
<small class="pficon pficon-help"
1415
aria-hidden="true"
1516
data-toggle="tooltip"
16-
data-original-title="Optional prefix added to each environment variable name for this resource."></small>
17+
data-original-title="Optional prefix added to each environment variable name."></small>
1718
</div>
1819
</div>
1920
</div>
@@ -48,13 +49,9 @@
4849
</div>
4950
<div ng-if="entry.configMapRef.name || entry.secretRef.name" class="faux-form-control readonly">
5051
Use all keys and values from
51-
<span ng-if="entry.prefix">prefixed</span>
52-
<span ng-if="entry.configMapRef.name">config map
53-
<span ng-if="entry.prefix">"{{entry.prefix}}"</span>
54-
{{entry.configMapRef.name}}</span>
55-
<span ng-if="entry.secretRef.name">secret
56-
<span ng-if="entry.prefix">"{{entry.prefix}}"</span>
57-
{{entry.secretRef.name}}</span>
52+
<span ng-if="entry.configMapRef.name">config map {{entry.configMapRef.name}}.</span>
53+
<span ng-if="entry.secretRef.name">secret {{entry.secretRef.name}}.</span>
54+
<span ng-if="entry.prefix">Names will be prefixed with "{{entry.prefix}}"</span>
5855
</div>
5956
</div>
6057

@@ -81,14 +78,34 @@
8178
</div>
8279

8380
<div class="form-group environment-from-input">
84-
<div class="environment-from-input" ng-if="!$ctrl.isEnvFromReadonly(entry) && $ctrl.hasOptions()">
81+
<div class="environment-from-input"
82+
ng-if="!$ctrl.isEnvFromReadonly(entry) && $ctrl.hasOptions()"
83+
ng-class="{ 'has-error': ($ctrl.editEnvironmentFromForm['envfrom-prefix-'+$index].$invalid && $ctrl.editEnvironmentFromForm['envfrom-prefix-'+$index].$touched) }">
8584
<label for="envfrom-prefix-{{$index}}" class="sr-only">Prefix</label>
8685
<input type="text"
8786
class="form-control"
8887
placeholder="Add prefix"
8988
id="envfrom-prefix-{{$index}}"
9089
name="envfrom-prefix-{{$index}}"
91-
ng-model="entry.prefix"/>
90+
ng-model="entry.prefix"
91+
ng-pattern="$ctrl.prefixValidator">
92+
93+
<span ng-show="$ctrl.editEnvironmentFromForm['envfrom-prefix-'+$index].$touched">
94+
<span class="help-block key-validation-error"
95+
ng-show="$ctrl.editEnvironmentFromForm['envfrom-prefix-'+$index].$error.pattern">
96+
<span class="validation-text">{{$ctrl.prefixValidatorError}}</span>
97+
<span ng-if="$ctrl.prefixValidatorErrorTooltip" class="help action-inline">
98+
<a
99+
aria-hidden="true"
100+
data-toggle="tooltip"
101+
data-placement="top"
102+
data-original-title="{{$ctrl.prefixValidatorErrorTooltip}}">
103+
<i class="{{$ctrl.prefixValidatorErrorTooltipIcon}}"
104+
ng-class="{'pficon pficon-help': !$ctrl.prefixValidatorErrorTooltipIcon}"></i>
105+
</a>
106+
</span>
107+
</span>
108+
</span>
92109
</div>
93110

94111
<div ng-if="!$ctrl.isEnvFromReadonly(entry) && $ctrl.hasEntries()" class="environment-from-editor-button">
@@ -112,7 +129,7 @@
112129
<a
113130
ng-if="entry.selectedEnvFrom"
114131
href=""
115-
ng-click="$ctrl.viewOverlayPanel(entry.selectedEnvFrom)">View Details</a>
132+
ng-click="$ctrl.viewOverlayPanel(entry.selectedEnvFrom, entry.prefix)">View Details</a>
116133
</div>
117134
</div>
118135
</div>

‎app/views/directives/edit-environment-variables.html

+3
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,9 @@ <h4 class="section-label">
4747
env-from-selector-options="$ctrl.valueFromObjects"
4848
add-row-link="Add ALL Values from Config Map or Secret"
4949
is-readonly="$ctrl.ngReadonly"
50+
prefix-validator="[A-Za-z_][A-Za-z0-9_]*"
51+
prefix-validator-error="Please enter a valid prefix."
52+
prefix-validator-error-tooltip="A valid prefix is an alphanumeric (a-z and 0-9) string beginning with a letter that may contain underscores."
5053
show-header>
5154
</edit-environment-from>
5255
</div>

0 commit comments

Comments
 (0)