catalog-ui/src/app/view-models/forms/input-form/input-form-view-modal.ts

   1 /*-
   2  * ============LICENSE_START=======================================================
   3  * SDC
   4  * ================================================================================
   5  * Copyright (C) 2017 AT&T Intellectual Property. All rights reserved.
   6  * ================================================================================
   7  * Licensed under the Apache License, Version 2.0 (the "License");
   8  * you may not use this file except in compliance with the License.
   9  * You may obtain a copy of the License at
  10  *
  11  *      http://www.apache.org/licenses/LICENSE-2.0
  12  *
  13  * Unless required by applicable law or agreed to in writing, software
  14  * distributed under the License is distributed on an "AS IS" BASIS,
  15  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  16  * See the License for the specific language governing permissions and
  17  * limitations under the License.
  18  * ============LICENSE_END=========================================================
  19  */
  20
  21 'use strict';
  22 import {FormState, PROPERTY_TYPES, ValidationUtils, PROPERTY_VALUE_CONSTRAINTS} from "app/utils";
  23 import {InputModel} from "app/models";
  24
  25 export  interface IInputEditModel {
  26     editInput:InputModel;
  27 }
  28
  29 export interface IInputFormViewModelScope extends ng.IScope {
  30     forms:any;
  31     editForm:ng.IFormController;
  32     footerButtons:Array<any>;
  33     isService:boolean;
  34     modalInstanceInput:ng.ui.bootstrap.IModalServiceInstance;
  35     isLoading:boolean;
  36     inputEditModel:IInputEditModel;
  37     myValue:any;
  38     maxLength:number;
  39
  40     save():void;
  41     close():void;
  42     validateIntRange(value:string):boolean;
  43     validateJson(json:string):boolean;
  44     getValidationPattern(type:string):RegExp;
  45     showSchema():boolean;
  46 }
  47
  48 export class InputFormViewModel {
  49
  50     static '$inject' = [
  51         '$scope',
  52         '$uibModalInstance',
  53         'ValidationUtils',
  54         'input'
  55     ];
  56
  57     private formState:FormState;
  58
  59
  60     constructor(private $scope:IInputFormViewModelScope,
  61                 private $uibModalInstance:ng.ui.bootstrap.IModalServiceInstance,
  62                 private ValidationUtils:ValidationUtils,
  63                 private input:InputModel) {
  64         this.initScope();
  65         this.initMyValue();
  66     }
  67
  68     private initMyValue = ():void => {
  69         switch (this.$scope.inputEditModel.editInput.type) {
  70             case PROPERTY_TYPES.MAP:
  71                 this.$scope.myValue = this.$scope.inputEditModel.editInput.defaultValue ? JSON.parse(this.$scope.inputEditModel.editInput.defaultValue) : {'': null};
  72                 break;
  73             case PROPERTY_TYPES.LIST:
  74                 this.$scope.myValue = this.$scope.inputEditModel.editInput.defaultValue ? JSON.parse(this.$scope.inputEditModel.editInput.defaultValue) : [];
  75                 break;
  76         }
  77     };
  78
  79     private initDefaultValueMaxLength = ():void => {
  80         switch (this.$scope.inputEditModel.editInput.type) {
  81             case PROPERTY_TYPES.MAP:
  82             case PROPERTY_TYPES.LIST:
  83                 this.$scope.maxLength = this.$scope.inputEditModel.editInput.schema.property.type == PROPERTY_TYPES.JSON ?
  84                     PROPERTY_VALUE_CONSTRAINTS.JSON_MAX_LENGTH :
  85                     PROPERTY_VALUE_CONSTRAINTS.MAX_LENGTH;
  86                 break;
  87             case PROPERTY_TYPES.JSON:
  88                 this.$scope.maxLength = PROPERTY_VALUE_CONSTRAINTS.JSON_MAX_LENGTH;
  89                 break;
  90             default:
  91                 this.$scope.maxLength = PROPERTY_VALUE_CONSTRAINTS.MAX_LENGTH;
  92         }
  93     };
  94
  95     private initScope = ():void => {
  96         this.$scope.forms = {};
  97         this.$scope.modalInstanceInput = this.$uibModalInstance;
  98         this.$scope.inputEditModel = {
  99             editInput: null
 100         };
 101         this.$scope.inputEditModel.editInput = this.input;
 102         this.initDefaultValueMaxLength();
 103
 104         //scope methods
 105         this.$scope.save = ():void => {
 106             if (this.$scope.showSchema()) {
 107                 this.$scope.inputEditModel.editInput.defaultValue = JSON.stringify(this.$scope.myValue);
 108             }
 109         };
 110
 111         this.$scope.close = ():void => {
 112             this.$uibModalInstance.close();
 113         };
 114
 115         this.$scope.validateIntRange = (value:string):boolean => {
 116             return !value || this.ValidationUtils.validateIntRange(value);
 117         };
 118
 119         this.$scope.validateJson = (json:string):boolean => {
 120             if (!json) {
 121                 return true;
 122             }
 123             return this.ValidationUtils.validateJson(json);
 124         };
 125
 126         this.$scope.showSchema = ():boolean => {
 127             return ['list', 'map'].indexOf(this.$scope.inputEditModel.editInput.type) > -1;
 128         };
 129
 130         this.$scope.getValidationPattern = (type:string):RegExp => {
 131             return this.ValidationUtils.getValidationPattern(type);
 132         };
 133
 134         // Add the done button at the footer.
 135         this.$scope.footerButtons = [
 136             {'name': 'Done', 'css': 'blue', 'callback': this.$scope.save},
 137             {'name': 'Cancel', 'css': 'grey', 'callback': this.$scope.close}
 138         ];
 139
 140         this.$scope.$watchCollection("forms.editForm.$invalid", (newVal, oldVal) => {
 141             this.$scope.footerButtons[0].disabled = this.$scope.forms.editForm.$invalid;
 142         });
 143
 144     };
 145 }
 146