2   ================================================================================
 
   4   ================================================================================
 
   5   Copyright (C) 2017 AT&T Intellectual Property
 
   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
 
  11        http://www.apache.org/licenses/LICENSE-2.0
 
  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   ================================================================================
 
  20 <div class="microservice-add-details-model">
 
  21         <div id="microservice-add-details-title" class="title">Microservice Details</div>
 
  23         <div id="microservices" class="microservice-scrolling-table">
 
  24                 <div class="microservice-properties-main"
 
  25                         scroll-top="microserviceAddDetails.scrollApi">
 
  26                         <form id="microservices-details-form" name="serviceForm" novalidate
 
  28                                 <div class="item required">
 
  29                                         <div class="item-label">Microservice Name</div>
 
  30                                         <input id="microservice-details-input-name" class="table-search-field"
 
  31                                                 type="text" name="name" ng-pattern="/^[\w -]*$/" maxlength="100"
 
  32                                                 ng-model="microserviceAddDetails.service.name"
 
  33                                                 ng-change="microserviceAddDetails.updateServiceName()"
 
  36                                         <div class="error-container"
 
  37                                                 ng-show="(microserviceAddDetails.emptyServiceName || serviceForm.name.$dirty)">
 
  38                                                 <div ng-messages="serviceForm.name.$error" class="error-container">
 
  39                                                         <small id="microservices-details-input-name-required"
 
  40                                                                 class="err-message" ng-message="required">Microservice
 
  41                                                                 Name is required</small> <small
 
  42                                                                 id="microservices-details-input-name-pattern"
 
  43                                                                 class="err-message" ng-message="pattern">Microservice
 
  44                                                                 Name must be letters, numbers, or underscore</small>
 
  48                                         <div class="error-container"
 
  49                                                 ng-show="microserviceAddDetails.dupliateName == true">
 
  50                                                 <small id="microservices-details-input-name-dupliated"
 
  51                                                         class="err-message">Name not available - choose different
 
  56                                 <div class="item required">
 
  57                                         <div class="item-label">Microservice Description</div>
 
  58                                         <textarea b2b-reset b2b-reset-textarea id="widgets-details-input-desc"
 
  59                                                 name="desc" ng-model="microserviceAddDetails.service.desc"
 
  60                                                 ng-change="microserviceAddDetails.updateDesc()"></textarea>
 
  61                                         <div class="error-container"
 
  62                                                 ng-show="(microserviceAddDetails.emptyServiceDesc 
 
  63                                         || (serviceForm.desc.$dirty && microserviceAddDetails.service.desc == ''))">
 
  64                                                 <small id="microservices-details-input-desc-required"
 
  65                                                         class="err-message">Microservice Description is required</small>
 
  72                                         ng-show="microserviceAddDetails.isEditMode && microserviceAddDetails.availableWidgets.length > 0">
 
  73                                         <div class="item-label">Client Widgets</div>
 
  74                                         <div ng-repeat="widget in microserviceAddDetails.availableWidgets">{{widget.name}}</div>
 
  77                                 <div class="item required">
 
  78                                         <div class="item-label">Application Name</div>
 
  79                                         <div class="service-select">                                    
 
  80                                                 <div class="table-dropdown">
 
  81                                                         <select id="microservice-details-input-app" name="app" b2b-dropdown placeholder-text="Select Application" ng-model="microserviceAddDetails.service.application.name" ng-change="microserviceAddDetails.updateApp()">
 
  82                                                 <option b2b-dropdown-list option-repeat="d in microserviceAddDetails.availableApps" value="{{d.name}}">{{d.name}}</option>
 
  87                                         <div class="error-container"
 
  88                                                 ng-show="(microserviceAddDetails.emptyServiceApp 
 
  89                                         || (serviceForm.app.$dirty && microserviceAddDetails.service.application == null))">
 
  90                                                 <small id="microservices-details-input-url-required"
 
  91                                                         class="err-message">Please select microservice
 
  96                                 <div class="item required">
 
  97                                         <div class="item-label">Microservice Endpoint URL</div>
 
  98                                         <input id="microservice-details-input-endpoint-url"
 
  99                                                 class="table-search-field" ng-model="microserviceAddDetails.service.url"
 
 100                                                 ng-change="microserviceAddDetails.updateURL()" type="text"
 
 101                                                 name="url" maxlength="200" />
 
 103                                         <div class="error-container"
 
 104                                                 ng-show="(microserviceAddDetails.emptyServiceURL 
 
 105                                         || (serviceForm.url.$dirty && microserviceAddDetails.service.url == ''))">
 
 106                                                 <small id="microservices-details-input-url-required"
 
 107                                                         class="err-message">Microservice Endpoint URL is required</small>
 
 111                                 <div class="item required">
 
 112                                         <div class="item-label">Security Type</div>
 
 113                                         <div class="service-select">                                    
 
 114                                                 <div class="table-dropdown">
 
 115                                                         <select id="microservice-details-input-security-type" name="microservice-details-input-security-type" b2b-dropdown placeholder-text="Select Application" ng-model="microserviceAddDetails.service.security.name" ng-change="microserviceAddDetails.updateApp()">
 
 116                                                 <option b2b-dropdown-list option-repeat="d in microserviceAddDetails.availableSecurityTypes" value="{{d.name}}">{{d.name}}</option>                                             
 
 123                                         ng-show="microserviceAddDetails.service.security.id == 1">
 
 124                                         <div class="item-label">Username</div>
 
 125                                         <input id="microservice-details-input-username" class="table-search-field"
 
 126                                                 type="text" name="username" maxlength="100"
 
 127                                                 ng-model="microserviceAddDetails.service.username" />
 
 131                                         ng-show="microserviceAddDetails.service.security.id == 1">
 
 132                                         <div class="item-label">Password</div>
 
 133                                         <input id="microservice-details-input-password" class="table-search-field"
 
 134                                                 type="password" name="password" maxlength="100"
 
 135                                                 ng-model="microserviceAddDetails.service.password" />
 
 139                                 <div class="item" ng-show="microserviceAddDetails.isEditMode">
 
 140                                         <div class="left-test-item">
 
 141                                                 <div class="item-label">Test Microservice</div>
 
 143                                         <div class="right-test-item">
 
 144                                                 <div id="microservice-details-test-button" class="test-button"
 
 145                                                         ng-click="microserviceAddDetails.testServiceURL()">Test</div>
 
 149                                 <div class="item" ng-show="microserviceAddDetails.isEditMode">
 
 150                                         <div class="item-label">JSON output</div>
 
 151                                         <textarea id="microservice-details-input-json" class="json-field"
 
 152                                                 name="json"></textarea>
 
 155                                 <div class="add-para-item">
 
 156                                         <div class="item-label add-label-left">Add User Parameter</div>
 
 157                                         <div class="icon-primary-accordion-plus"
 
 158                                                 ng-click="microserviceAddDetails.addParameter()"></div>
 
 161                                         <div class="para-label-item-left"
 
 162                                                 ng-show="microserviceAddDetails.service.parameterList.length > 0">
 
 164                                         <div class="para-label-item-right"
 
 165                                                 ng-show="microserviceAddDetails.service.parameterList.length > 0">
 
 166                                                 Parameter Default Value</div>
 
 168                                         <div id="microservice-details-user-paramters"
 
 169                                                 ng-repeat="parameter in microserviceAddDetails.service.parameterList">
 
 171                                                 <div class="para-item-left">
 
 172                                                         <input id="microservice-details-input-user-parameter-key"
 
 173                                                                 class="table-search-field" type="text" name="param-key" maxlength="200"
 
 174                                                                 ng-model="parameter.para_key" />
 
 176                                                 <div class="para-item-middle">
 
 177                                                         <input id="microservice-details-input-user-parameter-value"
 
 178                                                                 class="table-search-field" type="text" name="param-value"
 
 179                                                                 maxlength="200" ng-model="parameter.para_value" />
 
 182                                                 <div class="icon-primary-accordion-minus para-item-right"
 
 183                                                         ng-click="microserviceAddDetails.removeParamItem(parameter)"></div>
 
 186                                         <div class="microservice-property">
 
 187                                                 <input id="microservices-checkbox-app-is-enabled" type="checkbox"
 
 188                                                         class="checkbox-field"
 
 189                                                         ng-model="microserviceAddDetails.service.active" />
 
 190                                                 <div class="property-label checkbox-label">Active</div>
 
 195                                 <div id="microservice-scroll-end"></div>
 
 196                                 <div class="dialog-control">
 
 197                                         <button class="btn btn-alt btn-small" id="microservice-details-save-button" ng-click="microserviceAddDetails.saveChanges()">Save</button>                               
 
 198                                         <button class="btn btn-alt btn-small" id="microservice-details-close-button" ng-click="microserviceAddDetails.closeThisDialog()">Close</button> 
 
 208 $(document).ready(function(){
 
 209     $(".ngdialog-close").attr('id','dialog-close');