@flexem/fc-gui 3.0.0-alpha.9 → 3.0.0-alpha.90

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (123) hide show
  1. package/CHANGELOG.md +381 -0
  2. package/bundles/@flexem/fc-gui.umd.js +17578 -16210
  3. package/bundles/@flexem/fc-gui.umd.js.map +1 -1
  4. package/bundles/@flexem/fc-gui.umd.min.js +5 -5
  5. package/bundles/@flexem/fc-gui.umd.min.js.map +1 -1
  6. package/communication/variable/variable-communicator.d.ts +1 -0
  7. package/config/alarm/alarm.store.d.ts +6 -0
  8. package/config/alarm/alarm.store.js +0 -0
  9. package/config/alarm/alarm.store.metadata.json +1 -0
  10. package/config/alarm/get-alarms-args.d.ts +9 -0
  11. package/config/alarm/get-alarms-args.js +9 -0
  12. package/config/alarm/get-alarms-args.metadata.json +1 -0
  13. package/config/alarm/index.d.ts +2 -0
  14. package/config/alarm/index.js +1 -0
  15. package/config/alarm/index.metadata.json +1 -0
  16. package/config/config-store.d.ts +2 -0
  17. package/config/index.d.ts +1 -0
  18. package/config/index.js +1 -0
  19. package/config/index.metadata.json +1 -1
  20. package/elements/air-quality/air-quality-element.d.ts +31 -0
  21. package/elements/air-quality/air-quality-element.js +194 -0
  22. package/elements/air-quality/air-quality-element.metadata.json +1 -0
  23. package/elements/alarm/alarm-element.d.ts +44 -0
  24. package/elements/alarm/alarm-element.js +382 -0
  25. package/elements/alarm/alarm-element.metadata.json +1 -0
  26. package/elements/bar-graph-element.d.ts +7 -1
  27. package/elements/bar-graph-element.js +70 -4
  28. package/elements/bar-graph-element.metadata.json +1 -1
  29. package/elements/base/readable-element.d.ts +6 -1
  30. package/elements/base/readable-element.js +31 -2
  31. package/elements/base/readable-element.metadata.json +1 -1
  32. package/elements/historical-curve/historical-curve.element.js +116 -13
  33. package/elements/historical-curve/historical-curve.element.metadata.json +1 -1
  34. package/elements/main-element.js +25 -4
  35. package/elements/main-element.metadata.json +1 -1
  36. package/elements/meter-element.d.ts +7 -1
  37. package/elements/meter-element.js +76 -7
  38. package/elements/meter-element.metadata.json +1 -1
  39. package/elements/numerical-display/numerical-display-element.d.ts +8 -2
  40. package/elements/numerical-display/numerical-display-element.js +55 -11
  41. package/elements/numerical-display/numerical-display-element.metadata.json +1 -1
  42. package/elements/per-view-variable-communicator.d.ts +2 -0
  43. package/elements/per-view-variable-communicator.js +8 -0
  44. package/elements/per-view-variable-communicator.metadata.json +1 -1
  45. package/elements/ring-graph/ring-graph-element.d.ts +10 -1
  46. package/elements/ring-graph/ring-graph-element.js +106 -3
  47. package/elements/ring-graph/ring-graph-element.metadata.json +1 -1
  48. package/elements/shared/graph/graph-state-element.js +0 -3
  49. package/elements/shared/text/text-element.js +13 -2
  50. package/elements/shared/text/text-state-element.js +1 -1
  51. package/elements/switch-indicator-light/bit-switch-operator.d.ts +1 -0
  52. package/elements/switch-indicator-light/bit-switch-operator.js +19 -0
  53. package/elements/switch-indicator-light/bit-switch-operator.metadata.json +1 -1
  54. package/elements/switch-indicator-light/switch-indicator-light-element.d.ts +8 -0
  55. package/elements/switch-indicator-light/switch-indicator-light-element.js +93 -23
  56. package/elements/switch-indicator-light/switch-indicator-light-element.metadata.json +1 -1
  57. package/elements/switch-indicator-light/switch-operator.d.ts +1 -0
  58. package/elements/switch-indicator-light/word-switch-operator.d.ts +1 -0
  59. package/elements/switch-indicator-light/word-switch-operator.js +6 -0
  60. package/elements/switch-indicator-light/word-switch-operator.metadata.json +1 -1
  61. package/elements/video/video-element.d.ts +4 -0
  62. package/elements/video/video-element.js +69 -20
  63. package/elements/video/video-element.metadata.json +1 -1
  64. package/elements/view-operation/view-operation.element.js +8 -0
  65. package/elements/weather/weater-element.js +0 -1
  66. package/gui/gui-context.d.ts +2 -1
  67. package/gui/gui-host.d.ts +1 -1
  68. package/gui/gui.component.d.ts +3 -0
  69. package/gui/gui.component.js +15 -2
  70. package/gui/gui.component.metadata.json +1 -1
  71. package/localization/localization.service.d.ts +7 -0
  72. package/localization/localization.service.js +8 -1
  73. package/localization/localization.service.metadata.json +1 -1
  74. package/localization/localization.service.zh_CN.js +8 -1
  75. package/localization/localization.service.zh_CN.metadata.json +1 -1
  76. package/modal/write-value/write-value-modal-args.d.ts +4 -1
  77. package/modal/write-value/write-value-modal-args.js +3 -1
  78. package/modal/write-value/write-value-modal-args.metadata.json +1 -1
  79. package/modal/write-value/write-value-modal.component.d.ts +9 -7
  80. package/modal/write-value/write-value-modal.component.html +9 -4
  81. package/modal/write-value/write-value-modal.component.js +39 -22
  82. package/modal/write-value/write-value-modal.component.metadata.json +1 -1
  83. package/model/air-quality/air-quality-info.d.ts +23 -0
  84. package/model/air-quality/air-quality-info.js +4 -0
  85. package/model/air-quality/air-quality-info.metadata.json +1 -0
  86. package/model/air-quality/air-quality.model.d.ts +7 -0
  87. package/model/air-quality/air-quality.model.js +0 -0
  88. package/model/air-quality/air-quality.model.metadata.json +1 -0
  89. package/model/alarm/alarm.model.d.ts +13 -0
  90. package/model/alarm/alarm.model.js +0 -0
  91. package/model/alarm/alarm.model.metadata.json +1 -0
  92. package/model/bar-graph/bar-graph.d.ts +4 -0
  93. package/model/base/readable-model.d.ts +4 -0
  94. package/model/historical-curve/historical-curve-axis-settings.d.ts +10 -0
  95. package/model/historical-curve/historical-curve-axis-settings.js +5 -0
  96. package/model/historical-curve/historical-curve-axis-settings.metadata.json +1 -1
  97. package/model/meter/meter.d.ts +4 -0
  98. package/model/numerical-display/numerical-display.d.ts +1 -0
  99. package/model/ring-graph/ring-graph.model.d.ts +8 -0
  100. package/model/switch-indicator-light/bit-switch-operation.d.ts +2 -1
  101. package/model/switch-indicator-light/bit-switch-operation.js +1 -0
  102. package/model/switch-indicator-light/bit-switch-operation.metadata.json +1 -1
  103. package/package.json +1 -1
  104. package/remote/communication/variable/remote-variable-communicator.d.ts +4 -0
  105. package/remote/communication/variable/remote-variable-communicator.js +23 -1
  106. package/remote/communication/variable/remote-variable-communicator.metadata.json +1 -1
  107. package/remote/communication/variable/remote-variable-protocol.d.ts +3 -0
  108. package/service/index.d.ts +1 -0
  109. package/service/index.metadata.json +1 -1
  110. package/service/released-variable/index.d.ts +1 -0
  111. package/service/released-variable/index.js +0 -0
  112. package/service/released-variable/index.metadata.json +1 -0
  113. package/service/released-variable/released-variable.service.d.ts +4 -0
  114. package/service/released-variable/released-variable.service.js +0 -0
  115. package/service/released-variable/released-variable.service.metadata.json +1 -0
  116. package/service/weather.service.d.ts +1 -0
  117. package/shared/gui-consts.d.ts +2 -0
  118. package/shared/gui-consts.js +2 -0
  119. package/shared/gui-consts.metadata.json +1 -1
  120. package/utils/data-type/data-type.service.d.ts +4 -7
  121. package/utils/data-type/data-type.service.js +29 -17
  122. package/utils/data-type/fbox-data-type.service.js +40 -0
  123. package/utils/numerical-operation.service.js +2 -2
@@ -11,6 +11,7 @@ export class VideoElement extends ConditionalDisplayElement {
11
11
  this.guiSize = guiSize;
12
12
  this.svgRootClass = svgRootClass;
13
13
  this.videoId = '';
14
+ this.isFullscreen = false;
14
15
  this.isMobileMode = DisplayMode.Mobile === injector.get(GlobalSettings).displayMode;
15
16
  this.localization = injector.get(LOCALIZATION);
16
17
  this.init();
@@ -50,12 +51,13 @@ export class VideoElement extends ConditionalDisplayElement {
50
51
  .attr('width', this.model.size.width)
51
52
  .attr('height', this.model.size.height);
52
53
  this.videoService.getVideoUrl(this.model.videoTag).then(result => {
53
- this.initVideo(result.url, result.isMobileType, this.videoId);
54
+ this.videoUrl = result.url;
55
+ this.initVideo(result.url, this.videoId);
54
56
  }).catch(() => {
55
57
  throw new Error('Failure of the videoService');
56
58
  });
57
59
  }
58
- initVideo(videoUrl, isMobileType, videoId) {
60
+ initVideo(videoUrl, videoId) {
59
61
  const patt = /https:.+.m3u8/;
60
62
  if (videoUrl.indexOf('http:') !== -1) {
61
63
  videoUrl = videoUrl.replace('http:', 'https:');
@@ -68,6 +70,8 @@ export class VideoElement extends ConditionalDisplayElement {
68
70
  this.addVideoAddressToolTip(videoToolTip);
69
71
  return;
70
72
  }
73
+ const isAndroid = !!navigator.userAgent.match(/(Android)/i);
74
+ const isIos = !!navigator.userAgent.match(/(Mac)/i);
71
75
  const currentRect = this.$element.find('rect#rect' + videoId).first();
72
76
  if (!currentRect.length) {
73
77
  return;
@@ -77,16 +81,18 @@ export class VideoElement extends ConditionalDisplayElement {
77
81
  const chartHeight = clientRect.height;
78
82
  const left = this.model.location.x / this.guiSize.width * $('.' + this.svgRootClass).find('.svg-content').width();
79
83
  const top = this.model.location.y / this.guiSize.height * $('.' + this.svgRootClass).find('.svg-content').height();
80
- let videoHtml = `<video scareX="${this.model.location.x / this.guiSize.width}"
81
- scareY="${this.model.location.y / this.guiSize.height}" id="${videoId}" src="${videoUrl}" style="
82
- position: absolute;top:${top}px;left:${left}px;width:${chartWidth}px;height:${chartHeight}px;object-fit:fill;z-index:0"
83
- playsInline webkit-playsinline `;
84
- const isAndroid = !!navigator.userAgent.match(/(Android)/i);
84
+ const scareX = this.model.location.x / this.guiSize.width;
85
+ const scareY = this.model.location.y / this.guiSize.height;
86
+ if (isIos) {
87
+ videoUrl = videoUrl + '#t=1';
88
+ }
89
+ const preload = isIos ? ' preload=\'metadata\'' : '';
90
+ let videoHtml = `<video scareX="${scareX}"
91
+ scareY="${scareY}" id="${videoId}" ${preload} src="${videoUrl}" width="${chartWidth}" height="${chartHeight}"
92
+ style="position: absolute;top:${top}px;left:${left}px;object-fit:fill;z-index:0;"
93
+ playsInline webkit-playsinline `;
85
94
  if (this.isMobileMode) {
86
95
  if (isAndroid) {
87
- if (isMobileType) {
88
- videoHtml += ' controls ';
89
- }
90
96
  videoHtml += ' autoplay muted></video>';
91
97
  }
92
98
  else {
@@ -100,10 +106,20 @@ export class VideoElement extends ConditionalDisplayElement {
100
106
  if (this.isShow === false) {
101
107
  $('#' + this.videoId).hide();
102
108
  }
103
- this.videoPlayer = new EZUIPlayer(videoId);
104
- if (isAndroid && !isMobileType) {
105
- this.setAndroidVideo(videoId);
106
- }
109
+ setTimeout(() => {
110
+ if (isAndroid) {
111
+ this.setAndroidVideo(videoId);
112
+ }
113
+ else if (isIos) {
114
+ this.setIosVideo(this.videoUrl, videoId);
115
+ }
116
+ this.videoPlayer = new EZUIPlayer(videoId);
117
+ }, 1000);
118
+ const style = document.createElement('style');
119
+ style.innerHTML = `#${videoId}::-webkit-media-controls-enclosure {
120
+ display: none;
121
+ }`;
122
+ document.head.append();
107
123
  }
108
124
  addVideoAddressToolTip(videoToolTip) {
109
125
  const size = this.model.size;
@@ -126,35 +142,68 @@ export class VideoElement extends ConditionalDisplayElement {
126
142
  this.$element.append(textElement.Element);
127
143
  }
128
144
  setAndroidVideo(videoId) {
129
- let isFullscreen = false;
130
145
  const videoElement = $('#' + videoId);
131
146
  let preHeight = videoElement.height();
132
147
  let preWidth = videoElement.width();
133
148
  let preTop = videoElement.css('top');
134
149
  let preLeft = videoElement.css('left');
150
+ const { StatusBar } = window;
135
151
  videoElement.on('click', () => {
136
- if (!isFullscreen) {
152
+ if (!this.isFullscreen) {
153
+ if (StatusBar) {
154
+ StatusBar.hide();
155
+ }
137
156
  preHeight = videoElement.height();
138
157
  preWidth = videoElement.width();
139
158
  preTop = videoElement.css('top');
140
159
  preLeft = videoElement.css('left');
141
- const width = document.body.clientWidth;
142
- const height = width * 9 / 16;
160
+ const width = document.documentElement.clientWidth;
161
+ const height = document.documentElement.clientHeight;
162
+ videoElement.css('object-fit', 'contain');
163
+ videoElement.css('background', '#000000');
143
164
  videoElement.css('width', width + 'px');
144
165
  videoElement.css('height', height + 'px');
145
166
  videoElement.css('left', '0px');
146
167
  videoElement.css('top', '0px');
147
168
  videoElement.css('z-index', '99');
148
- isFullscreen = true;
169
+ videoElement.css('position', 'fixed');
170
+ this.isFullscreen = true;
171
+ try {
172
+ screen.orientation.lock(screen.orientation.type);
173
+ }
174
+ catch (error) {
175
+ console.error(error);
176
+ }
149
177
  }
150
178
  else {
179
+ videoElement.css('object-fit', 'fill');
151
180
  videoElement.css('width', preWidth + 'px');
152
181
  videoElement.css('height', preHeight + 'px');
153
182
  videoElement.css('left', preLeft);
154
183
  videoElement.css('top', preTop);
155
184
  videoElement.css('z-index', '0');
156
- isFullscreen = false;
185
+ videoElement.css('position', 'absolute');
186
+ this.isFullscreen = false;
187
+ try {
188
+ if (screen.orientation.type.includes('portrait')) {
189
+ StatusBar.show();
190
+ }
191
+ }
192
+ catch (error) {
193
+ console.error(error);
194
+ }
157
195
  }
158
196
  });
159
197
  }
198
+ setIosVideo(videoUrl, videoId) {
199
+ const video = $('#' + this.videoId);
200
+ video.on('webkitendfullscreen', () => {
201
+ video.remove();
202
+ clearTimeout(this.refreshTimer);
203
+ this.refreshTimer = null;
204
+ this.refreshTimer = setTimeout(() => {
205
+ this.initVideo(videoUrl, videoId);
206
+ }, 500);
207
+ });
208
+ }
160
209
  }
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"VideoElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/conditional-display-element","name":"ConditionalDisplayElement","line":15,"character":34},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":23,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":24,"character":18},{"__symbolic":"reference","module":"../../service","name":"PermissionChecker","line":25,"character":27},{"__symbolic":"reference","module":"../../communication","name":"VariableCommunicator","line":26,"character":30},{"__symbolic":"reference","module":"../../config","name":"VariableStore","line":27,"character":23},{"__symbolic":"reference","module":"../../service","name":"VideoService","line":28,"character":39},{"__symbolic":"reference","module":"../../model","name":"Size","line":29,"character":34},{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"string"}]}],"dispose":[{"__symbolic":"method"}],"hide":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"init":[{"__symbolic":"method"}],"initVideo":[{"__symbolic":"method"}],"addVideoAddressToolTip":[{"__symbolic":"method"}],"setAndroidVideo":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"VideoElement":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../base/conditional-display-element","name":"ConditionalDisplayElement","line":15,"character":34},"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":27,"character":25,"context":{"typeName":"HTMLElement"}},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":28,"character":18},{"__symbolic":"reference","module":"../../service","name":"PermissionChecker","line":29,"character":27},{"__symbolic":"reference","module":"../../communication","name":"VariableCommunicator","line":30,"character":30},{"__symbolic":"reference","module":"../../config","name":"VariableStore","line":31,"character":23},{"__symbolic":"reference","module":"../../service","name":"VideoService","line":32,"character":39},{"__symbolic":"reference","module":"../../model","name":"Size","line":33,"character":34},{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"string"}]}],"dispose":[{"__symbolic":"method"}],"hide":[{"__symbolic":"method"}],"show":[{"__symbolic":"method"}],"init":[{"__symbolic":"method"}],"initVideo":[{"__symbolic":"method"}],"addVideoAddressToolTip":[{"__symbolic":"method"}],"setAndroidVideo":[{"__symbolic":"method"}],"setIosVideo":[{"__symbolic":"method"}]}}}}]
@@ -170,6 +170,9 @@ export class ViewOperationElement extends ConditionalEnableElement {
170
170
  const viewIndex = this.model.viewIndex;
171
171
  if (null != viewIndex) {
172
172
  this.popupViewService.popView(viewIndex, this.hostContainerId, this.el).subscribe(() => this.recordViewOperation(), error => this.logger.error(`ToggleView(${viewIndex}) failed. ${error}`));
173
+ $(`#${this.hostContainerId} video`)
174
+ .addClass('video-hidden')
175
+ .css('visibility', 'hidden');
173
176
  }
174
177
  else {
175
178
  this.logger.error('[GUI]Toggle View:invalid view index');
@@ -177,6 +180,11 @@ export class ViewOperationElement extends ConditionalEnableElement {
177
180
  }
178
181
  closeView() {
179
182
  this.popupViewService.closeView();
183
+ if ($(`#${this.hostContainerId} > svg > svg`).length === 0) {
184
+ $(`#${this.hostContainerId} .video-hidden`)
185
+ .removeClass('video-hidden')
186
+ .css('visibility', 'visible');
187
+ }
180
188
  this.recordViewOperation();
181
189
  }
182
190
  moveView(movementX, movementY) {
@@ -45,7 +45,6 @@ export class WeatherElement extends ConditionalDisplayElement {
45
45
  }
46
46
  handleGettingAddress() {
47
47
  this.handleUnusualCommon(this.localization.weatherNotAvailable);
48
- setTimeout(() => this.initWeatherInfo(), 1000 * 60);
49
48
  }
50
49
  handleNoAddress() {
51
50
  this.handleUnusualCommon(this.localization.weatherNotAddress);
@@ -1,12 +1,13 @@
1
1
  import { ConfigStore } from '../config';
2
2
  import { VariableCommunicator } from '../communication';
3
3
  import { SecurityChecker } from '../security';
4
- import { VideoService, WeatherService, PermissionChecker, OperationRecordService } from '../service';
4
+ import { VideoService, WeatherService, PermissionChecker, OperationRecordService, ReleasedVariableService } from '../service';
5
5
  export interface GuiContext {
6
6
  readonly configStore: ConfigStore;
7
7
  readonly variableCommunicator: VariableCommunicator;
8
8
  readonly permissionChecker: PermissionChecker;
9
9
  readonly operationRecordService: OperationRecordService;
10
+ readonly releasedVariableService: ReleasedVariableService;
10
11
  readonly securityChecker: SecurityChecker;
11
12
  readonly videoService: VideoService;
12
13
  readonly weatherService: WeatherService;
package/gui/gui-host.d.ts CHANGED
@@ -13,7 +13,7 @@ export declare class GuiHost implements Disposable {
13
13
  readonly el: ElementRef;
14
14
  private isLoaded;
15
15
  private currentView;
16
- private currentViewIndex;
16
+ currentViewIndex: number;
17
17
  private containerEl;
18
18
  private currentViewSize;
19
19
  private currentViewReiszeMode;
@@ -24,10 +24,12 @@ export declare class GuiComponent implements OnChanges, OnDestroy {
24
24
  initHeight: number;
25
25
  lastScale: number;
26
26
  isMobileMode: boolean;
27
+ hostContainerId: string;
27
28
  private $svg;
28
29
  private host;
29
30
  private get viewResizeMode();
30
31
  private readonly globalSettings;
32
+ private readonly viewService;
31
33
  constructor(el: ElementRef, localization: Localization, injector: Injector, bsModalService: BsModalService);
32
34
  ngOnChanges(changes: {
33
35
  [propKey: string]: SimpleChange;
@@ -39,4 +41,5 @@ export declare class GuiComponent implements OnChanges, OnDestroy {
39
41
  private onSizeChanged;
40
42
  private onResizeModeChanged;
41
43
  private onDisplayModeChanged;
44
+ refreshCurrentPage(): boolean;
42
45
  }
@@ -18,6 +18,7 @@ import { Size } from '../model';
18
18
  import { DisplayMode, GlobalSettings, ViewResizeMode } from '../settings';
19
19
  import { GuiHost } from './gui-host';
20
20
  import { Guid } from '../utils/guid';
21
+ import { ViewService } from '../view/view.service';
21
22
  let GuiComponent = class GuiComponent {
22
23
  constructor(el, localization, injector, bsModalService) {
23
24
  this.el = el;
@@ -29,6 +30,7 @@ let GuiComponent = class GuiComponent {
29
30
  this.lastScale = 1;
30
31
  this.isMobileMode = false;
31
32
  this.globalSettings = this.injector.get(GlobalSettings);
33
+ this.viewService = injector.get(ViewService);
32
34
  }
33
35
  get viewResizeMode() {
34
36
  switch (this.resizeMode) {
@@ -131,11 +133,11 @@ let GuiComponent = class GuiComponent {
131
133
  this.$svg = $(this.el.nativeElement).find('div.svgView').first();
132
134
  this.$svg.empty();
133
135
  const svgRootClass = 'S' + Guid.newGuid().toString('n');
134
- const hostContainerId = 'H' + Guid.newGuid().toString('n');
136
+ this.hostContainerId = 'H' + Guid.newGuid().toString('n');
135
137
  this.$svg.addClass(svgRootClass);
136
138
  const guiOptions = {
137
139
  svgRootClass: svgRootClass,
138
- hostContainerId: hostContainerId,
140
+ hostContainerId: this.hostContainerId,
139
141
  el: this.el
140
142
  };
141
143
  const host = new GuiHost(this.injector, this.bsModalService, newValue, guiOptions, this.el);
@@ -190,6 +192,17 @@ let GuiComponent = class GuiComponent {
190
192
  this.isMobileMode = this.displayMode === 'Mobile';
191
193
  this.globalSettings.displayMode = this.isMobileMode ? DisplayMode.Mobile : DisplayMode.Web;
192
194
  }
195
+ refreshCurrentPage() {
196
+ if (this.host.currentViewIndex === undefined) {
197
+ return false;
198
+ }
199
+ const toggleView = this.viewService.toggleViews.get(this.el);
200
+ if (!toggleView) {
201
+ return false;
202
+ }
203
+ toggleView(this.host.currentViewIndex, this.hostContainerId, this.el).subscribe();
204
+ return true;
205
+ }
193
206
  };
194
207
  __decorate([
195
208
  Input(),
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"GuiComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"fc-gui","template":"<div> <div class='svgView' style=\"position: relative;display: flex;justify-content: center;align-items: center;\"></div> </div> "}]}],"members":{"context":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":5}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":5}}]}],"resizeMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":5}}]}],"displayMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":5}}]}],"loadFailed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":21,"character":5}}]}],"loaded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":22,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":46,"character":9},"arguments":[{"__symbolic":"reference","module":"../localization","name":"LOCALIZATION","line":46,"character":16}]}],null,null],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":45,"character":37},{"__symbolic":"reference","module":"../localization","name":"Localization","line":46,"character":61},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":47,"character":35},{"__symbolic":"reference","module":"ngx-bootstrap/modal","name":"BsModalService","line":48,"character":41}]}],"ngOnChanges":[{"__symbolic":"method"}],"doubleFingerZooming":[{"__symbolic":"method"}],"getDistance":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onProviderChanged":[{"__symbolic":"method"}],"onSizeChanged":[{"__symbolic":"method"}],"onResizeModeChanged":[{"__symbolic":"method"}],"onDisplayModeChanged":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"GuiComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"fc-gui","template":"<div> <div class='svgView' style=\"position: relative;display: flex;justify-content: center;align-items: center;\"></div> </div> "}]}],"members":{"context":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":5}}]}],"size":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":5}}]}],"resizeMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":5}}]}],"displayMode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":5}}]}],"loadFailed":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":22,"character":5}}]}],"loaded":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":23,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":50,"character":9},"arguments":[{"__symbolic":"reference","module":"../localization","name":"LOCALIZATION","line":50,"character":16}]}],null,null],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":49,"character":37},{"__symbolic":"reference","module":"../localization","name":"Localization","line":50,"character":61},{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":51,"character":35},{"__symbolic":"reference","module":"ngx-bootstrap/modal","name":"BsModalService","line":52,"character":41}]}],"ngOnChanges":[{"__symbolic":"method"}],"doubleFingerZooming":[{"__symbolic":"method"}],"getDistance":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onProviderChanged":[{"__symbolic":"method"}],"onSizeChanged":[{"__symbolic":"method"}],"onResizeModeChanged":[{"__symbolic":"method"}],"onDisplayModeChanged":[{"__symbolic":"method"}],"refreshCurrentPage":[{"__symbolic":"method"}]}}}}]
@@ -4,8 +4,10 @@ export interface Localization {
4
4
  loadFailed: any;
5
5
  setting: any;
6
6
  submit: any;
7
+ submitting: any;
7
8
  numericalValueRequired: any;
8
9
  invalidNumericalValue: any;
10
+ writeValueTimeout: any;
9
11
  binaryType: any;
10
12
  decimalType: any;
11
13
  hexadecimalType: any;
@@ -30,7 +32,9 @@ export interface Localization {
30
32
  permissiontip: any;
31
33
  conditionIsNotMetTip: any;
32
34
  chartNoData: any;
35
+ lastThirtyMinutes: any;
33
36
  lastOneHour: any;
37
+ lastEightHour: any;
34
38
  lastTwentyFourHours: any;
35
39
  lastSevenDays: any;
36
40
  lastThirtyDays: any;
@@ -47,5 +51,8 @@ export interface Localization {
47
51
  weatherNotSupport: any;
48
52
  weatherNotAddress: any;
49
53
  weatherNotAvailable: any;
54
+ airQualityNotSupport: any;
55
+ airQualityNotAddress: any;
56
+ airQualityNotAvailable: any;
50
57
  }
51
58
  export declare const DefaultLocalization: Localization;
@@ -4,8 +4,10 @@ export const DefaultLocalization = {
4
4
  loadFailed: 'Load failed.',
5
5
  setting: 'Setting',
6
6
  submit: 'Submit',
7
+ submitting: 'Submitting···',
7
8
  numericalValueRequired: 'Numerical value can\'t be emtpy',
8
9
  invalidNumericalValue: 'Numerical value is not valid',
10
+ writeValueTimeout: 'write value error: timeout',
9
11
  binaryType: 'Binary',
10
12
  decimalType: 'Decimal',
11
13
  hexadecimalType: 'Hexadecimal',
@@ -30,7 +32,9 @@ export const DefaultLocalization = {
30
32
  permissiontip: 'You have no permission to operate.',
31
33
  conditionIsNotMetTip: 'Unsatisfied operating conditions or variable abnorma.',
32
34
  chartNoData: 'No Data Available',
35
+ lastThirtyMinutes: 'Last thirty minutes',
33
36
  lastOneHour: 'Last one hour',
37
+ lastEightHour: 'Last eight hours',
34
38
  lastTwentyFourHours: 'Last 24 hours',
35
39
  lastSevenDays: 'Last 7 days',
36
40
  lastThirtyDays: 'Last 30 days',
@@ -46,5 +50,8 @@ export const DefaultLocalization = {
46
50
  unconfiguredVideoAddress: 'Unconfigured Video Address',
47
51
  weatherNotSupport: 'Location not supported',
48
52
  weatherNotAddress: 'Address not configured',
49
- weatherNotAvailable: 'Address not yet available'
53
+ weatherNotAvailable: 'Address not yet available',
54
+ airQualityNotSupport: 'Location not supported',
55
+ airQualityNotAddress: 'Address not configured',
56
+ airQualityNotAvailable: 'Address not yet available'
50
57
  };
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"LOCALIZATION":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":2,"character":32},"arguments":["fc.gui.loc"]},"Localization":{"__symbolic":"interface"},"DefaultLocalization":{"loadFailed":"Load failed.","setting":"Setting","submit":"Submit","numericalValueRequired":"Numerical value can't be emtpy","invalidNumericalValue":"Numerical value is not valid","binaryType":"Binary","decimalType":"Decimal","hexadecimalType":"Hexadecimal","stringType":"String","numericalValueTooLong":"Numerical value too long","fractionDigitsMustLessThan":"Fraction digits must be less than ","canNotBeNegative":"Can not be negative","valueOutOfRange":"Numerical value is out of range","timeout":"timeout","confirmOperationPrompt":"Sure to do this operation?","confirm":"Yes","cancel":"Cancel","characterInputRequired":"Character input can't be empty","character":"(Character)","characterOutofRange":"Character length is out of range","writeValueRange":"Write value range","loading":"Loading","unbind":"Unbind","offline":"Offline","abnormal":"Data abnormal","disable":"Disable","permissiontip":"You have no permission to operate.","conditionIsNotMetTip":"Unsatisfied operating conditions or variable abnorma.","chartNoData":"No Data Available","lastOneHour":"Last one hour","lastTwentyFourHours":"Last 24 hours","lastSevenDays":"Last 7 days","lastThirtyDays":"Last 30 days","lastOneYear":"Last 1 year","grouped":"Grouped","stacked":"Stacked","passwordVerify":"Password verifiers","passwordError":"Password error","password":"Password","passwordToolTip":"Password error, please re-enter","passwordRequired":"Password can't be empty","invalidVideoAddress":"Invalid video address","unconfiguredVideoAddress":"Unconfigured Video Address","weatherNotSupport":"Location not supported","weatherNotAddress":"Address not configured","weatherNotAvailable":"Address not yet available"}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"LOCALIZATION":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":2,"character":32},"arguments":["fc.gui.loc"]},"Localization":{"__symbolic":"interface"},"DefaultLocalization":{"loadFailed":"Load failed.","setting":"Setting","submit":"Submit","submitting":"Submitting···","numericalValueRequired":"Numerical value can't be emtpy","invalidNumericalValue":"Numerical value is not valid","writeValueTimeout":"write value error: timeout","binaryType":"Binary","decimalType":"Decimal","hexadecimalType":"Hexadecimal","stringType":"String","numericalValueTooLong":"Numerical value too long","fractionDigitsMustLessThan":"Fraction digits must be less than ","canNotBeNegative":"Can not be negative","valueOutOfRange":"Numerical value is out of range","timeout":"timeout","confirmOperationPrompt":"Sure to do this operation?","confirm":"Yes","cancel":"Cancel","characterInputRequired":"Character input can't be empty","character":"(Character)","characterOutofRange":"Character length is out of range","writeValueRange":"Write value range","loading":"Loading","unbind":"Unbind","offline":"Offline","abnormal":"Data abnormal","disable":"Disable","permissiontip":"You have no permission to operate.","conditionIsNotMetTip":"Unsatisfied operating conditions or variable abnorma.","chartNoData":"No Data Available","lastThirtyMinutes":"Last thirty minutes","lastOneHour":"Last one hour","lastEightHour":"Last eight hours","lastTwentyFourHours":"Last 24 hours","lastSevenDays":"Last 7 days","lastThirtyDays":"Last 30 days","lastOneYear":"Last 1 year","grouped":"Grouped","stacked":"Stacked","passwordVerify":"Password verifiers","passwordError":"Password error","password":"Password","passwordToolTip":"Password error, please re-enter","passwordRequired":"Password can't be empty","invalidVideoAddress":"Invalid video address","unconfiguredVideoAddress":"Unconfigured Video Address","weatherNotSupport":"Location not supported","weatherNotAddress":"Address not configured","weatherNotAvailable":"Address not yet available","airQualityNotSupport":"Location not supported","airQualityNotAddress":"Address not configured","airQualityNotAvailable":"Address not yet available"}}}]
@@ -2,8 +2,10 @@ export const Localization_zh_CN = {
2
2
  loadFailed: '加载失败.',
3
3
  setting: '设置',
4
4
  submit: '提交',
5
+ submitting: '提交中···',
5
6
  numericalValueRequired: '数值不能为空',
6
7
  invalidNumericalValue: '数值格式不正确',
8
+ writeValueTimeout: '写值错误:超时',
7
9
  binaryType: '二进制',
8
10
  decimalType: '十进制',
9
11
  hexadecimalType: '十六进制',
@@ -28,7 +30,9 @@ export const Localization_zh_CN = {
28
30
  permissiontip: '您无权限执行此操作',
29
31
  conditionIsNotMetTip: '操作条件不满足或逻辑控制变量异常',
30
32
  chartNoData: '无数据',
33
+ lastThirtyMinutes: '最近30分钟',
31
34
  lastOneHour: '最近1小时',
35
+ lastEightHour: '最近8小时',
32
36
  lastTwentyFourHours: '最近24小时',
33
37
  lastSevenDays: '最近7天',
34
38
  lastThirtyDays: '最近30天',
@@ -44,5 +48,8 @@ export const Localization_zh_CN = {
44
48
  unconfiguredVideoAddress: '未配置视频地址',
45
49
  weatherNotSupport: '当前位置暂不支持',
46
50
  weatherNotAddress: '当前设备未设置地址',
47
- weatherNotAvailable: '暂未获取设备地址'
51
+ weatherNotAvailable: '暂未获取设备地址',
52
+ airQualityNotSupport: '当前位置暂不支持',
53
+ airQualityNotAddress: '当前设备未设置地址',
54
+ airQualityNotAvailable: '暂未获取设备地址'
48
55
  };
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"Localization_zh_CN":{"loadFailed":"加载失败.","setting":"设置","submit":"提交","numericalValueRequired":"数值不能为空","invalidNumericalValue":"数值格式不正确","binaryType":"二进制","decimalType":"十进制","hexadecimalType":"十六进制","stringType":"字符串","numericalValueTooLong":"数值超长","fractionDigitsMustLessThan":"小数位不能超过","canNotBeNegative":"不能为负数","valueOutOfRange":"数值超出范围","timeout":"超时","confirmOperationPrompt":"是否确认要执行此操作?","confirm":"确定","cancel":"取消","characterInputRequired":"请输入至少一个字符","character":"(字符串)","characterOutofRange":"字符长度超限","writeValueRange":"写值范围","loading":"加载中","unbind":"未绑定","offline":"离线","abnormal":"数据异常","disable":"禁用","permissiontip":"您无权限执行此操作","conditionIsNotMetTip":"操作条件不满足或逻辑控制变量异常","chartNoData":"无数据","lastOneHour":"最近1小时","lastTwentyFourHours":"最近24小时","lastSevenDays":"最近7天","lastThirtyDays":"最近30天","lastOneYear":"最近1年","grouped":"分组","stacked":"叠加","passwordVerify":"密码校验","passwordError":"密码错误","password":"密码","passwordToolTip":"密码错误,请重新输入","passwordRequired":"密码不能为空","invalidVideoAddress":"无效的视频地址","unconfiguredVideoAddress":"未配置视频地址","weatherNotSupport":"当前位置暂不支持","weatherNotAddress":"当前设备未设置地址","weatherNotAvailable":"暂未获取设备地址"}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"Localization_zh_CN":{"loadFailed":"加载失败.","setting":"设置","submit":"提交","submitting":"提交中···","numericalValueRequired":"数值不能为空","invalidNumericalValue":"数值格式不正确","writeValueTimeout":"写值错误:超时","binaryType":"二进制","decimalType":"十进制","hexadecimalType":"十六进制","stringType":"字符串","numericalValueTooLong":"数值超长","fractionDigitsMustLessThan":"小数位不能超过","canNotBeNegative":"不能为负数","valueOutOfRange":"数值超出范围","timeout":"超时","confirmOperationPrompt":"是否确认要执行此操作?","confirm":"确定","cancel":"取消","characterInputRequired":"请输入至少一个字符","character":"(字符串)","characterOutofRange":"字符长度超限","writeValueRange":"写值范围","loading":"加载中","unbind":"未绑定","offline":"离线","abnormal":"数据异常","disable":"禁用","permissiontip":"您无权限执行此操作","conditionIsNotMetTip":"操作条件不满足或逻辑控制变量异常","chartNoData":"无数据","lastThirtyMinutes":"最近30分钟","lastOneHour":"最近1小时","lastEightHour":"最近8小时","lastTwentyFourHours":"最近24小时","lastSevenDays":"最近7天","lastThirtyDays":"最近30天","lastOneYear":"最近1年","grouped":"分组","stacked":"叠加","passwordVerify":"密码校验","passwordError":"密码错误","password":"密码","passwordToolTip":"密码错误,请重新输入","passwordRequired":"密码不能为空","invalidVideoAddress":"无效的视频地址","unconfiguredVideoAddress":"未配置视频地址","weatherNotSupport":"当前位置暂不支持","weatherNotAddress":"当前设备未设置地址","weatherNotAvailable":"暂未获取设备地址","airQualityNotSupport":"当前位置暂不支持","airQualityNotAddress":"当前设备未设置地址","airQualityNotAvailable":"暂未获取设备地址"}}}]
@@ -1,11 +1,14 @@
1
1
  import { NumericalOperation } from '../../model';
2
+ import { ReleasedVariableService } from '../../service';
2
3
  export declare class WriteValueModalArgs {
3
4
  variableName: string;
4
5
  dataType: number;
6
+ fBoxDataType: number;
5
7
  integerDigits: number;
6
8
  fractionDigits: number;
7
9
  numericalOperation: NumericalOperation;
8
10
  version: number;
9
11
  enableDataParsed: boolean;
10
- constructor(variableName: string, dataType: number, integerDigits: number, fractionDigits: number, numericalOperation: NumericalOperation, version: number, enableDataParsed: boolean);
12
+ releasedVariableService: ReleasedVariableService;
13
+ constructor(variableName: string, dataType: number, fBoxDataType: number, integerDigits: number, fractionDigits: number, numericalOperation: NumericalOperation, version: number, enableDataParsed: boolean, releasedVariableService: ReleasedVariableService);
11
14
  }
@@ -1,11 +1,13 @@
1
1
  export class WriteValueModalArgs {
2
- constructor(variableName, dataType, integerDigits, fractionDigits, numericalOperation, version, enableDataParsed) {
2
+ constructor(variableName, dataType, fBoxDataType, integerDigits, fractionDigits, numericalOperation, version, enableDataParsed, releasedVariableService) {
3
3
  this.variableName = variableName;
4
4
  this.dataType = dataType;
5
+ this.fBoxDataType = fBoxDataType;
5
6
  this.integerDigits = integerDigits;
6
7
  this.fractionDigits = fractionDigits;
7
8
  this.numericalOperation = numericalOperation;
8
9
  this.version = version;
9
10
  this.enableDataParsed = enableDataParsed;
11
+ this.releasedVariableService = releasedVariableService;
10
12
  }
11
13
  }
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"WriteValueModalArgs":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","module":"../../model","name":"NumericalOperation","line":8,"character":35},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"boolean"}]}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"WriteValueModalArgs":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","module":"../../model","name":"NumericalOperation","line":10,"character":35},{"__symbolic":"reference","name":"number"},{"__symbolic":"reference","name":"boolean"},{"__symbolic":"reference","module":"../../service","name":"ReleasedVariableService","line":13,"character":40}]}]}}}}]
@@ -1,21 +1,21 @@
1
1
  import { OnInit } from '@angular/core';
2
- import { Observable } from 'rxjs';
3
2
  import { Localization } from '../../localization';
4
3
  import { NumericalOperation } from '../../model/numerical-display/numerical-operation';
5
4
  import { DataTypeService } from '../../utils/data-type/data-type.service';
6
5
  import { FractionDigitService } from '../../utils/fraction-digit.service';
7
6
  import { NumericalOperationService } from '../../utils/numerical-operation.service';
8
7
  import { WriteValueModalArgs } from './write-value-modal-args';
9
- import { WriteValueModelResult } from './write-value-model-result';
8
+ import { BsModalRef } from 'ngx-bootstrap/modal';
10
9
  export declare class WriteValueModalComponent implements OnInit {
11
10
  localization: Localization;
12
11
  private readonly dataTypeService;
13
12
  private readonly fractionDigitService;
14
13
  private readonly numericalOperationService;
15
- private _onClosed;
16
- get onClosed(): Observable<WriteValueModelResult>;
14
+ private readonly bsModalRef;
15
+ onClosed: any;
17
16
  args: WriteValueModalArgs;
18
17
  private dataType;
18
+ private fBoxDataType;
19
19
  private pattern;
20
20
  private fractionDigits;
21
21
  private integerDigits;
@@ -27,21 +27,23 @@ export declare class WriteValueModalComponent implements OnInit {
27
27
  valueType: string;
28
28
  variableName: string;
29
29
  enableNumericalOperation: boolean;
30
+ isNumericalOperation: boolean;
30
31
  numericalOperation: NumericalOperation;
31
32
  validationError: boolean;
32
33
  validationErrorText: string;
33
34
  writeMinValue: number;
34
35
  writeMaxValue: number;
35
36
  writeValueRangeText: string;
37
+ isSubmitting: boolean;
36
38
  get invalidErrorText(): string;
37
- constructor(localization: Localization, dataTypeService: DataTypeService, fractionDigitService: FractionDigitService, numericalOperationService: NumericalOperationService);
39
+ constructor(localization: Localization, dataTypeService: DataTypeService, fractionDigitService: FractionDigitService, numericalOperationService: NumericalOperationService, bsModalRef: BsModalRef);
38
40
  ngOnInit(): void;
39
41
  initData(option: WriteValueModalArgs): void;
40
42
  private setValueRangeAccordToDataParsed;
41
43
  getWriteValueRangeText(): string;
42
44
  save(): void;
43
- close(modalResult?: WriteValueModelResult): void;
44
- validate(): void;
45
+ close(): void;
46
+ validate(event?: any): void;
45
47
  private showValidationErrorInfo;
46
48
  private hideValidationErrorInfo;
47
49
  private getFractionDigits;
@@ -9,13 +9,18 @@
9
9
  </button>
10
10
  </div>
11
11
  <div class="modal-body">
12
- <span class="write-value-range">{{localization.writeValueRange}}:&nbsp;{{writeValueRangeText}}
12
+ <span class="write-value-range">{{localization.writeValueRange}}:</span>
13
+ <div class="write-value-range">
14
+ {{writeValueRangeText}}
13
15
  <span *ngIf="valueType">({{valueType}})</span>
14
- </span>
15
- <input type="text" name="valueInput" autoFocus class="form-control write-value" [(ngModel)]="value" (keyup)="validate()" autocomplete="off">
16
+ </div>
17
+ <input type="text" name="valueInput" autoFocus class="form-control write-value" [(ngModel)]="value" (keyup)="validate($event)" autocomplete="off">
16
18
  <span class="help-block text-danger" [hidden]="!validationError">{{validationErrorText}}</span>
17
19
  </div>
18
20
  <div class="modal-footer">
19
- <button type="submit" class="btn md-skip btn-primary btn-block" [disabled]="validationError">{{localization.submit}}</button>
21
+ <button type="submit" class="btn md-skip btn-primary btn-block" [disabled]="validationError || isSubmitting">
22
+ <ng-container *ngIf="!isSubmitting">{{localization.submit}}</ng-container>
23
+ <ng-container *ngIf="isSubmitting">{{localization.submitting}}</ng-container>
24
+ </button>
20
25
  </div>
21
26
  </form>