This is an automated email from the ASF dual-hosted git repository.
akuznetsov pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/ignite.git
The following commit(s) were added to refs/heads/master by this push:
new 7fecdea IGNITE-10489 Web console: Fixed double validation at
"Configuration" screen.
7fecdea is described below
commit 7fecdeae5fd276285496b8109f9431f002ef977f
Author: Ilya Borisov <klast...@gmail.com>
AuthorDate: Tue Jan 29 14:52:12 2019 +0700
IGNITE-10489 Web console: Fixed double validation at "Configuration" screen.
---
.../{controller.js => controller.ts} | 59 +++++++++-------------
...rective.js => showValidationError.directive.ts} | 4 +-
.../{pcValidation.js => pcValidation.ts} | 26 ++++++----
.../frontend/app/primitives/form-field/index.scss | 1 +
modules/web-console/frontend/app/types/index.ts | 5 ++
5 files changed, 49 insertions(+), 46 deletions(-)
diff --git
a/modules/web-console/frontend/app/components/form-field/components/form-field-size/controller.js
b/modules/web-console/frontend/app/components/form-field/components/form-field-size/controller.ts
similarity index 80%
rename from
modules/web-console/frontend/app/components/form-field/components/form-field-size/controller.js
rename to
modules/web-console/frontend/app/components/form-field/components/form-field-size/controller.ts
index e158c0a..84e3cde 100644
---
a/modules/web-console/frontend/app/components/form-field/components/form-field-size/controller.js
+++
b/modules/web-console/frontend/app/components/form-field/components/form-field-size/controller.ts
@@ -16,25 +16,24 @@
*/
import get from 'lodash/get';
-
-export default class PCFormFieldSizeController {
- /** @type {ng.INgModelController} */
- ngModel;
- /** @type {number} */
- min;
- /** @type {number} */
- max;
- /** @type {ng.ICompiledExpression} */
- onScaleChange;
- /** @type {ng.IFormController} */
- innerForm;
- /** @type {boolean?} */
- autofocus;
+import {IInputErrorNotifier} from '../../../../types';
+
+export default class PCFormFieldSizeController implements IInputErrorNotifier {
+ ngModel: ng.INgModelController;
+ min?: number;
+ max?: number;
+ onScaleChange: ng.ICompiledExpression;
+ innerForm: ng.IFormController;
+ inputElement?: HTMLInputElement;
+ autofocus?: boolean;
+ id = Math.random();
+ sizesMenu?: ig.config.formFieldSize.ISizeTypes[keyof
ig.config.formFieldSize.ISizeTypes];
+ private _sizeScale: ig.config.formFieldSize.ISizeTypeOption;
+ value: number;
static $inject = ['$element', '$attrs'];
- /** @type {ig.config.formFieldSize.ISizeTypes} */
- static sizeTypes = {
+ static sizeTypes: ig.config.formFieldSize.ISizeTypes = {
bytes: [
{label: 'Kb', value: 1024},
{label: 'Mb', value: 1024 * 1024},
@@ -56,15 +55,7 @@ export default class PCFormFieldSizeController {
]
};
- /**
- * @param {JQLite} $element
- * @param {ng.IAttributes} $attrs
- */
- constructor($element, $attrs) {
- this.$element = $element;
- this.$attrs = $attrs;
- this.id = Math.random();
- }
+ constructor(private $element: JQLite, private $attrs: ng.IAttributes) {}
$onDestroy() {
delete this.$element[0].focus;
@@ -101,10 +92,7 @@ export default class PCFormFieldSizeController {
if ('min' in changes) this.ngModel.$validate();
}
- /**
- * @param {ig.config.formFieldSize.ISizeTypeOption} value
- */
- set sizeScale(value) {
+ set sizeScale(value: ig.config.formFieldSize.ISizeTypeOption) {
this._sizeScale = value;
if (this.onScaleChange) this.onScaleChange({$event: this.sizeScale});
if (this.ngModel) this.assignValue(this.ngModel.$viewValue);
@@ -114,10 +102,7 @@ export default class PCFormFieldSizeController {
return this._sizeScale;
}
- /**
- * @param {number} rawValue
- */
- assignValue(rawValue) {
+ assignValue(rawValue: number) {
if (!this.sizesMenu) this.setDefaultSizeType();
return this.value = rawValue
? rawValue / this.sizeScale.value
@@ -147,13 +132,17 @@ export default class PCFormFieldSizeController {
this.sizeScale = this.chooseSizeScale();
}
+ isTooltipValidation(): boolean {
+ return
!this.$element.parents('.theme--ignite-errors-horizontal').length;
+ }
+
notifyAboutError() {
- if (this.$element)
+ if (this.$element && this.isTooltipValidation())
this.$element.find('.form-field__error
[bs-tooltip]').trigger('mouseenter');
}
hideError() {
- if (this.$element)
+ if (this.$element && this.isTooltipValidation())
this.$element.find('.form-field__error
[bs-tooltip]').trigger('mouseleave');
}
diff --git
a/modules/web-console/frontend/app/components/form-field/showValidationError.directive.js
b/modules/web-console/frontend/app/components/form-field/showValidationError.directive.ts
similarity index 94%
rename from
modules/web-console/frontend/app/components/form-field/showValidationError.directive.js
rename to
modules/web-console/frontend/app/components/form-field/showValidationError.directive.ts
index 7560b90..0aebe5a 100644
---
a/modules/web-console/frontend/app/components/form-field/showValidationError.directive.js
+++
b/modules/web-console/frontend/app/components/form-field/showValidationError.directive.ts
@@ -15,6 +15,8 @@
* limitations under the License.
*/
+import {IInputErrorNotifier} from '../../types';
+
/**
* Brings user attention to invalid form fields.
* Use IgniteFormUtils.triggerValidation to trigger the event.
@@ -23,7 +25,7 @@ export function directive($timeout) {
return {
require: ['ngModel', '?^^bsCollapseTarget', '?^^igniteFormField',
'?formFieldSize', '?^^panelCollapsible'],
link(scope, el, attr, [ngModel, bsCollapseTarget, igniteFormField,
formFieldSize, panelCollapsible]) {
- const formFieldController = igniteFormField || formFieldSize;
+ const formFieldController: IInputErrorNotifier = igniteFormField
|| formFieldSize;
let onBlur;
diff --git
a/modules/web-console/frontend/app/components/page-configure/components/pcValidation.js
b/modules/web-console/frontend/app/components/page-configure/components/pcValidation.ts
similarity index 88%
rename from
modules/web-console/frontend/app/components/page-configure/components/pcValidation.js
rename to
modules/web-console/frontend/app/components/page-configure/components/pcValidation.ts
index 697e9e9..38c430a 100644
---
a/modules/web-console/frontend/app/components/page-configure/components/pcValidation.js
+++
b/modules/web-console/frontend/app/components/page-configure/components/pcValidation.ts
@@ -16,16 +16,16 @@
*/
import angular from 'angular';
+import {IInputErrorNotifier} from '../../../types';
-export class IgniteFormField {
+export class IgniteFormField implements IInputErrorNotifier {
static animName = 'ignite-form-field__error-blink';
static eventName = 'webkitAnimationEnd oAnimationEnd msAnimationEnd
animationend';
static $inject = ['$element', '$scope'];
- constructor($element, $scope) {
- Object.assign(this, {$element});
- this.$scope = $scope;
- }
+ onAnimEnd?: () => void;
+
+ constructor(private $element: JQLite, private $scope: ng.IScope) {}
$postLink() {
this.onAnimEnd = () =>
this.$element.removeClass(IgniteFormField.animName);
@@ -41,22 +41,28 @@ export class IgniteFormField {
if (!this.$element)
return;
- this.$element.addClass(IgniteFormField.animName);
- this.$element.find('.form-field__error
[bs-tooltip]').trigger('mouseenter');
+ if (this.isTooltipValidation())
+ this.$element.find('.form-field__error
[bs-tooltip]').trigger('mouseenter');
+ else
+ this.$element.addClass(IgniteFormField.animName);
}
hideError() {
if (!this.$element)
return;
- this.$element.find('.form-field__error
[bs-tooltip]').trigger('mouseleave');
+ if (this.isTooltipValidation())
+ this.$element.find('.form-field__error
[bs-tooltip]').trigger('mouseleave');
+ }
+
+ isTooltipValidation(): boolean {
+ return
!this.$element.parents('.theme--ignite-errors-horizontal').length;
}
/**
* Exposes control in $scope
- * @param {ng.INgModelController} control
*/
- exposeControl(control, name = '$input') {
+ exposeControl(control: ng.INgModelController, name = '$input') {
this.$scope[name] = control;
this.$scope.$on('$destroy', () => this.$scope[name] = null);
}
diff --git a/modules/web-console/frontend/app/primitives/form-field/index.scss
b/modules/web-console/frontend/app/primitives/form-field/index.scss
index 3e757f9..63d9841 100644
--- a/modules/web-console/frontend/app/primitives/form-field/index.scss
+++ b/modules/web-console/frontend/app/primitives/form-field/index.scss
@@ -401,6 +401,7 @@
float: none;
width: auto;
height: auto;
+ position: static;
text-align: left;
line-height: 14px;
diff --git a/modules/web-console/frontend/app/types/index.ts
b/modules/web-console/frontend/app/types/index.ts
index ad40c15..731c62c 100644
--- a/modules/web-console/frontend/app/types/index.ts
+++ b/modules/web-console/frontend/app/types/index.ts
@@ -62,3 +62,8 @@ export type NavigationMenuItem = {
);
export type NavigationMenu = Array<NavigationMenuItem>;
+
+export interface IInputErrorNotifier {
+ notifyAboutError(): void
+ hideError(): void
+}
