@magic-xpa/angular 4.800.0-dev480.95 → 4.801.0-dev481.222

package/bundles/magic-xpa-angular.umd.js

@@ -669,6 +669,349 @@
         [utils$1.MagicProperties.Wallpaper, "background-image"]
     ]);
 
+    var CommandsCollectorMagicService = /** @class */ (function () {
+        function CommandsCollectorMagicService(magic) {
+            this.magic = magic;
+            this.count = 0;
+            this.commands = new mscorelib.List();
+            this.subscription = null;
+        }
+        CommandsCollectorMagicService.prototype.startCollecting = function () {
+            var _this = this;
+            this.count++;
+            utils$1.Logger.Instance.WriteDevToLog("CommandsCollectorMagicService.startCollecting() --- " + this.count);
+            if (this.subscription === null) {
+                this.subscription = this.magic.refreshDom
+                    .subscribe(function (command) {
+                    _this.commands.push(command);
+                });
+            }
+        };
+        CommandsCollectorMagicService.prototype.stopCollecting = function () {
+            this.count--;
+            utils$1.Logger.Instance.WriteDevToLog("CommandsCollectorMagicService.stopCollecting() --- " + this.count);
+            if (this.count === 0) {
+                this.subscription.unsubscribe();
+                this.subscription = null;
+            }
+        };
+        CommandsCollectorMagicService.prototype.GetCommands = function (taskId) {
+            var _this = this;
+            var commands = this.commands.filter(function (command) { return command.TaskTag === taskId; });
+            commands.forEach(function (command) { _this.commands.Remove(command); });
+            return commands;
+        };
+        return CommandsCollectorMagicService;
+    }());
+    CommandsCollectorMagicService.ɵfac = function CommandsCollectorMagicService_Factory(t) { return new (t || CommandsCollectorMagicService)(i0.ɵɵinject(EngineMagicService)); };
+    CommandsCollectorMagicService.ɵprov = i0.ɵɵdefineInjectable({ token: CommandsCollectorMagicService, factory: CommandsCollectorMagicService.ɵfac });
+    (function () {
+        i0.ɵsetClassMetadata(CommandsCollectorMagicService, [{
+                type: i0.Injectable
+            }], function () { return [{ type: EngineMagicService }]; }, null);
+    })();
+
+    var RouteCommand = /** @class */ (function () {
+        function RouteCommand() {
+        }
+        return RouteCommand;
+    }());
+    var RouterCommandsMagicService = /** @class */ (function () {
+        function RouterCommandsMagicService() {
+            this.pendingRouteCommands = [];
+        }
+        RouterCommandsMagicService.prototype.AddRouteCommand = function (routeCommand) {
+            this.pendingRouteCommands.push(routeCommand);
+        };
+        RouterCommandsMagicService.prototype.ExecuteNextCommand = function () {
+            var pendingRouteCommand = this.pendingRouteCommands.shift();
+            if (!util.isNullOrUndefined(pendingRouteCommand)) {
+                pendingRouteCommand.callerMgSubformServiceRef.ExecuteRouteCommand(pendingRouteCommand);
+            }
+        };
+        return RouterCommandsMagicService;
+    }());
+    RouterCommandsMagicService.ɵfac = function RouterCommandsMagicService_Factory(t) { return new (t || RouterCommandsMagicService)(); };
+    RouterCommandsMagicService.ɵprov = i0.ɵɵdefineInjectable({ token: RouterCommandsMagicService, factory: RouterCommandsMagicService.ɵfac });
+    (function () {
+        i0.ɵsetClassMetadata(RouterCommandsMagicService, [{
+                type: i0.Injectable
+            }], null, null);
+    })();
+
+    var SubformMagicService = /** @class */ (function () {
+        function SubformMagicService(task, activatedRoute, componentList, pendingCommandsCollector, router, routerCommandsMagicService, componentListMagicService, loader, injector) {
+            this.task = task;
+            this.activatedRoute = activatedRoute;
+            this.componentList = componentList;
+            this.pendingCommandsCollector = pendingCommandsCollector;
+            this.router = router;
+            this.routerCommandsMagicService = routerCommandsMagicService;
+            this.componentListMagicService = componentListMagicService;
+            this.loader = loader;
+            this.injector = injector;
+            this.subformsDict = {};
+            this.routesDict = {};
+            this.currentRouteDefinition = null;
+        }
+        SubformMagicService.prototype.mgGetComp = function (subformName) {
+            if (subformName in this.subformsDict) {
+                var formName = this.subformsDict[subformName].formName;
+                if (formName)
+                    return this.componentList.getComponent(formName);
+            }
+            return null;
+        };
+        SubformMagicService.prototype.mgGetParameters = function (subformName) {
+            if (subformName in this.subformsDict) {
+                return this.subformsDict[subformName].parameters;
+            }
+            else
+                return "";
+        };
+        SubformMagicService.prototype.deleteSubformComp = function (subformControlName, formName) {
+            if (Object.keys(this.subformsDict).indexOf(subformControlName) >= 0) {
+                if (this.subformsDict[subformControlName].formName === formName) {
+                    this.subformsDict[subformControlName] = {};
+                    this.task.refreshView();
+                }
+            }
+        };
+        SubformMagicService.prototype.addSubformComp = function (subformControlName, formName, taskId, taskDescription, routerPath, params, inDefaultOutlet) {
+            var _this = this;
+            this.pendingCommandsCollector.startCollecting();
+            var refreshNeeded = false;
+            if (util.isNullOrUndefined(routerPath)) {
+                if (Object.keys(this.subformsDict).indexOf(subformControlName) >= 0) {
+                    if (this.subformsDict[subformControlName].formName === formName) {
+                        this.subformsDict[subformControlName] = {};
+                        this.task.refreshView();
+                    }
+                }
+                var moduleRef_1 = this.componentListMagicService.getModuleRef(formName);
+                if (moduleRef_1 == null) {
+                    var lazyLoadModule = this.componentListMagicService.getLazyLoadModuleData(formName);
+                    if (lazyLoadModule != null) {
+                        this.loader
+                            .load(lazyLoadModule.modulePath + "#" + lazyLoadModule.moduleName)
+                            .then(function (moduleFactory) {
+                            moduleRef_1 = moduleFactory.create(_this.injector);
+                            _this.subformsDict[subformControlName] = {
+                                formName: formName,
+                                parameters: { taskIdParam: taskId, taskDescription: taskDescription }
+                            };
+                            _this.task.refreshView();
+                        });
+                    }
+                }
+                else {
+                    this.subformsDict[subformControlName] = {
+                        formName: formName,
+                        parameters: { taskIdParam: taskId, taskDescription: taskDescription }
+                    };
+                    refreshNeeded = true;
+                }
+            }
+            else {
+                if (inDefaultOutlet)
+                    subformControlName = "primary";
+                var routeParams = new mscorelib.List();
+                routeParams.push(routerPath);
+                if (params !== null) {
+                    routeParams = routeParams.concat(params);
+                }
+                var routeCommand = {
+                    callerMgSubformServiceRef: this,
+                    routerOutletName: subformControlName,
+                    formName: formName,
+                    parameters: { taskIdParam: taskId, taskDescription: taskDescription },
+                    routeParams: routeParams
+                };
+                if (SubformMagicService.currentCallerMgSubformServiceRef === null)
+                    this.ExecuteRouteCommand(routeCommand);
+                else
+                    this.routerCommandsMagicService.AddRouteCommand(routeCommand);
+            }
+            if (refreshNeeded)
+                this.task.refreshView();
+        };
+        SubformMagicService.prototype.ExecuteRouteCommand = function (routeCommand) {
+            var _a;
+            var reusingComponent = false;
+            var currentSubformMagicService = routeCommand.callerMgSubformServiceRef;
+            var relativeRoute = SubformMagicService.getRelativeRoute(currentSubformMagicService.activatedRoute);
+            if (currentSubformMagicService.routesDict[routeCommand.routerOutletName] === routeCommand.routeParams[0]) {
+                currentSubformMagicService.router.navigate([{ outlets: (_a = {}, _a[routeCommand.routerOutletName] = null, _a) }], { relativeTo: relativeRoute })
+                    .then(function (result) {
+                    SubformMagicService.currentCallerMgSubformServiceRef = currentSubformMagicService;
+                    currentSubformMagicService.currentRouteDefinition = {
+                        formName: routeCommand.formName,
+                        parameters: routeCommand.parameters
+                    };
+                    currentSubformMagicService.PerformRouterNavigate(routeCommand.routerOutletName, routeCommand.routeParams);
+                });
+            }
+            else {
+                SubformMagicService.currentCallerMgSubformServiceRef = currentSubformMagicService;
+                currentSubformMagicService.currentRouteDefinition = {
+                    formName: routeCommand.formName,
+                    parameters: routeCommand.parameters
+                };
+                if (SubformMagicService.routerContainers.length > 0) {
+                    var routeContainer = SubformMagicService.routerContainers[0];
+                    SubformMagicService.routerContainers.shift();
+                    routeContainer.initializeComponent();
+                }
+                else {
+                    currentSubformMagicService.PerformRouterNavigate(routeCommand.routerOutletName, routeCommand.routeParams);
+                }
+            }
+        };
+        SubformMagicService.prototype.PerformRouterNavigate = function (routerOutletName, routeParams) {
+            var _a;
+            var relativeRoute = SubformMagicService.getRelativeRoute(this.activatedRoute);
+            this.router.navigate([{ outlets: (_a = {}, _a[routerOutletName] = routeParams, _a) }], { relativeTo: relativeRoute })
+                .then(function (result) {
+                if (result !== null && !result) {
+                    var subformMagicService = SubformMagicService.currentCallerMgSubformServiceRef;
+                    subformMagicService.currentRouteDefinition = null;
+                    SubformMagicService.currentCallerMgSubformServiceRef = null;
+                    subformMagicService.pendingCommandsCollector.stopCollecting();
+                    subformMagicService.routerCommandsMagicService.ExecuteNextCommand();
+                }
+            });
+        };
+        SubformMagicService.prototype.init = function () {
+            var _this = this;
+            var pendingCommands = this.pendingCommandsCollector.GetCommands(this.task.taskId);
+            if (pendingCommands.length > 0) {
+                pendingCommands.forEach(function (command) { _this.task.executeCommand(command); });
+                this.task.refreshView();
+            }
+            this.pendingCommandsCollector.stopCollecting();
+        };
+        SubformMagicService.prototype.refreshView = function () {
+            this.task.refreshView();
+        };
+        SubformMagicService.getRelativeRoute = function (sendActivatedRoute) {
+            var currentActiveRoute = sendActivatedRoute;
+            if (currentActiveRoute.snapshot.routeConfig !== null && currentActiveRoute.snapshot.routeConfig.path === '') {
+                currentActiveRoute = currentActiveRoute.parent;
+                if (!currentActiveRoute.snapshot.routeConfig.loadChildren)
+                    console.log("getRelativeRoute(): both path and currentActiveRoute.snapshot.routeConfig.loadChildren are empty.");
+            }
+            return currentActiveRoute;
+        };
+        return SubformMagicService;
+    }());
+    SubformMagicService.currentCallerMgSubformServiceRef = null;
+    SubformMagicService.routerContainers = new Array();
+    SubformMagicService.ɵfac = function SubformMagicService_Factory(t) { return new (t || SubformMagicService)(i0.ɵɵinject(TaskMagicService), i0.ɵɵinject(i2.ActivatedRoute), i0.ɵɵinject(ComponentListMagicService), i0.ɵɵinject(CommandsCollectorMagicService), i0.ɵɵinject(i2.Router), i0.ɵɵinject(RouterCommandsMagicService), i0.ɵɵinject(ComponentListMagicService), i0.ɵɵinject(i0.NgModuleFactoryLoader), i0.ɵɵinject(i0.Injector)); };
+    SubformMagicService.ɵprov = i0.ɵɵdefineInjectable({ token: SubformMagicService, factory: SubformMagicService.ɵfac });
+    (function () {
+        i0.ɵsetClassMetadata(SubformMagicService, [{
+                type: i0.Injectable
+            }], function () { return [{ type: TaskMagicService }, { type: i2.ActivatedRoute }, { type: ComponentListMagicService }, { type: CommandsCollectorMagicService }, { type: i2.Router }, { type: RouterCommandsMagicService }, { type: ComponentListMagicService }, { type: i0.NgModuleFactoryLoader }, { type: i0.Injector }]; }, null);
+    })();
+
+    var RouterContainerMagicComponent = /** @class */ (function () {
+        function RouterContainerMagicComponent(activatedRoute, router, magic, containerTaskService, componentFactoryResolver, viewContainerRef, componentList, pendingCommandsCollector, routerCommandsMagicService) {
+            this.activatedRoute = activatedRoute;
+            this.router = router;
+            this.magic = magic;
+            this.containerTaskService = containerTaskService;
+            this.componentFactoryResolver = componentFactoryResolver;
+            this.viewContainerRef = viewContainerRef;
+            this.componentList = componentList;
+            this.pendingCommandsCollector = pendingCommandsCollector;
+            this.routerCommandsMagicService = routerCommandsMagicService;
+            this.componentRef = null;
+            this.parentMgSubformService = null;
+        }
+        Object.defineProperty(RouterContainerMagicComponent, "LastRoute", {
+            get: function () {
+                return RouterContainerMagicComponent.lastRoute;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        RouterContainerMagicComponent.prototype.ngOnInit = function () {
+            var outletname = this.activatedRoute.outlet;
+            var subformMagicService = SubformMagicService.currentCallerMgSubformServiceRef;
+            var currentActiveRoute = SubformMagicService.getRelativeRoute(this.activatedRoute);
+            RouterContainerMagicComponent.lastRoute = this.router.url;
+            if (subformMagicService == null || subformMagicService.currentRouteDefinition === null) {
+                this.insertRouteEvent(currentActiveRoute);
+                SubformMagicService.routerContainers.push(this);
+            }
+            else {
+                this.initializeComponent();
+            }
+        };
+        RouterContainerMagicComponent.prototype.insertRouteEvent = function (currentActiveRoute) {
+            var guiEvent = engine.getGuiEventObj('RouterNavigate', null, 0);
+            guiEvent.RouterPath = currentActiveRoute.snapshot.routeConfig.path;
+            if (currentActiveRoute.snapshot.outlet !== 'primary')
+                guiEvent.RouterOutletName = currentActiveRoute.snapshot.outlet;
+            var calcRouterPath = currentActiveRoute.routeConfig.path;
+            if (calcRouterPath.length > 0) {
+                var routerPath = calcRouterPath;
+                var tokens = utils$1.StrUtil.tokenize(routerPath, "/:");
+                guiEvent.RouterPath = tokens[0];
+                guiEvent.RouterParams = new mscorelib.List();
+                for (var i = 1; i < tokens.length; i++) {
+                    guiEvent.RouterParams.push(this.activatedRoute.snapshot.params[tokens[i]]);
+                }
+            }
+            this.containerTaskService.insertEvent(guiEvent);
+        };
+        RouterContainerMagicComponent.prototype.initializeComponent = function () {
+            var _this = this;
+            var subformMagicService = SubformMagicService.currentCallerMgSubformServiceRef;
+            if (subformMagicService.currentRouteDefinition !== null) {
+                var comp = this.componentList.getComponent(subformMagicService.currentRouteDefinition.formName);
+                var componentFactory = this.componentFactoryResolver.resolveComponentFactory(comp);
+                this.componentRef = this.viewContainerRef.createComponent(componentFactory);
+                Object.assign(this.componentRef.instance, subformMagicService.currentRouteDefinition.parameters);
+                var myActiveRoute_1 = SubformMagicService.getRelativeRoute(this.activatedRoute);
+                var routeParams = utils$1.StrUtil.tokenize(myActiveRoute_1.snapshot.routeConfig.path, "/:");
+                subformMagicService.routesDict[myActiveRoute_1.snapshot.outlet] = routeParams[0];
+                this.parentMgSubformService = subformMagicService;
+                subformMagicService.currentRouteDefinition = null;
+                SubformMagicService.currentCallerMgSubformServiceRef = null;
+                var ignoreParamChange_1 = true;
+                myActiveRoute_1.paramMap.subscribe(function (params) {
+                    if (!ignoreParamChange_1)
+                        _this.insertRouteEvent(myActiveRoute_1);
+                    ignoreParamChange_1 = false;
+                });
+                this.parentMgSubformService.refreshView();
+                this.routerCommandsMagicService.ExecuteNextCommand();
+            }
+        };
+        RouterContainerMagicComponent.prototype.ngOnDestroy = function () {
+            if (this.componentRef != null) {
+                this.componentRef.instance.task.close();
+                var currentActiveRoute = SubformMagicService.getRelativeRoute(this.activatedRoute);
+                this.parentMgSubformService.routesDict[currentActiveRoute.outlet] = "";
+                RouterContainerMagicComponent.lastRoute = this.router.url;
+            }
+        };
+        return RouterContainerMagicComponent;
+    }());
+    RouterContainerMagicComponent.lastRoute = "/";
+    RouterContainerMagicComponent.ɵfac = function RouterContainerMagicComponent_Factory(t) { return new (t || RouterContainerMagicComponent)(i0.ɵɵdirectiveInject(i2.ActivatedRoute), i0.ɵɵdirectiveInject(i2.Router), i0.ɵɵdirectiveInject(EngineMagicService), i0.ɵɵdirectiveInject(TaskMagicService), i0.ɵɵdirectiveInject(i0.ComponentFactoryResolver), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(ComponentListMagicService), i0.ɵɵdirectiveInject(CommandsCollectorMagicService), i0.ɵɵdirectiveInject(RouterCommandsMagicService)); };
+    RouterContainerMagicComponent.ɵcmp = i0.ɵɵdefineComponent({ type: RouterContainerMagicComponent, selectors: [["magic-route-outlet"]], decls: 0, vars: 0, template: function RouterContainerMagicComponent_Template(rf, ctx) { }, encapsulation: 2 });
+    (function () {
+        i0.ɵsetClassMetadata(RouterContainerMagicComponent, [{
+                type: i0.Component,
+                args: [{
+                        selector: 'magic-route-outlet',
+                        template: "\n  "
+                    }]
+            }], function () { return [{ type: i2.ActivatedRoute }, { type: i2.Router }, { type: EngineMagicService }, { type: TaskMagicService }, { type: i0.ComponentFactoryResolver }, { type: i0.ViewContainerRef }, { type: ComponentListMagicService }, { type: CommandsCollectorMagicService }, { type: RouterCommandsMagicService }]; }, null);
+    })();
+
     var GuiInteractiveExecutor = /** @class */ (function () {
         function GuiInteractiveExecutor() {
         }
@@ -699,6 +1042,9 @@
                     case gui.InteractiveCommandType.REFRESH_PAGE:
                         this.OnRefreshPage();
                         break;
+                    case gui.InteractiveCommandType.GET_LAST_ROUTE:
+                        this.OnGetLastRoute();
+                        break;
                 }
             }
             catch (ex) {
@@ -758,6 +1104,9 @@
             else
                 this.command._boolVal = this.task.Records.list[guiRowIndex].isEditing;
         };
+        GuiInteractiveExecutor.prototype.OnGetLastRoute = function () {
+            this.command.resultString = RouterContainerMagicComponent.LastRoute;
+        };
         return GuiInteractiveExecutor;
     }());
 
@@ -1853,6 +2202,7 @@
                                 control.setValidators([control.validator, this.customValidator(guiRowId.toString(), controlId)]);
                             else
                                 control.setValidators(this.customValidator(guiRowId.toString(), controlId));
+                            control.updateValueAndValidity();
                         }
                     }
                     break;
@@ -1865,7 +2215,7 @@
                     properties.setStyle(command.Operation, command.obj1);
                     break;
                 case gui.CommandType.SET_ATTRIBUTE:
-                    properties = this.Records.list[guiRowId].getControlMetadata(controlId);
+                    properties = this.Records.list[0].getControlMetadata(controlId);
                     properties.dataType = String.fromCharCode(command.number);
                     break;
                 case gui.CommandType.SET_VALUE:
@@ -2042,335 +2392,112 @@
             }
             else {
                 if (!util.isNullOrUndefined(event.target)) {
-                    var indexes = new Array(event.target.selectedOptions.length);
-                    for (var i = 0; i < event.target.selectedOptions.length; i++) {
-                        indexes[i] = event.target.selectedOptions[i].index;
-                    }
-                    guiEvent.Value = indexes.join(',');
-                }
-                else
-                    guiEvent.Value = event.value;
-            }
-            this.insertEvent(guiEvent);
-        };
-        TaskMagicService.prototype.onListBoxSelectionChanged = function (event, idx) {
-            var guiEvent = engine.getGuiEventObj('selectionchanged', idx, 0);
-            var selectedOptions;
-            if (!util.isNullOrUndefined(event.target))
-                selectedOptions = event.target.selectedOptions;
-            else
-                selectedOptions = event.source.selectedOptions.selected;
-            var length = selectedOptions.length;
-            var indexes = new Array(length);
-            for (var i = 0; i < length; i++) {
-                if (!util.isNullOrUndefined(event.target))
-                    indexes[i] = (selectedOptions[i]).index;
-                else
-                    indexes[i] = (selectedOptions[i]).value;
-            }
-            guiEvent.Value = indexes;
-            this.insertEvent(guiEvent);
-        };
-        TaskMagicService.prototype.onCheckChanged = function (event, idx, rowId) {
-            if (typeof rowId === 'undefined')
-                rowId = 0;
-            var guiEvent = engine.getGuiEventObj('selectionchanged', idx, rowId);
-            if (typeof (event) == 'boolean') {
-                guiEvent.Value = event;
-            }
-            else {
-                if (typeof event.target === 'undefined')
-                    guiEvent.Value = (event).checked;
-                else
-                    guiEvent.Value = (event.target).checked;
-            }
-            this.insertEvent(guiEvent);
-        };
-        TaskMagicService.prototype.mgOnTabSelectionChanged = function (idx, layer) {
-            var guiEvent = engine.getGuiEventObj('selectionchanged', idx, 0);
-            guiEvent.Value = layer.toString();
-            this.insertEvent(guiEvent);
-        };
-        TaskMagicService.prototype.mgOnRadioSelectionChanged = function (event, idx) {
-            var result = this.getFormControl('0', idx);
-            var guiEvent = engine.getGuiEventObj('selectionchanged', idx, 0);
-            if (typeof result.value !== 'string')
-                guiEvent.Value = result.value.index;
-            else
-                guiEvent.Value = result.value;
-            this.insertEvent(guiEvent);
-        };
-        TaskMagicService.prototype.close = function () {
-            this.insertEvent(engine.getGuiEventObj('close', null, 0));
-        };
-        TaskMagicService.prototype.IsStub = function () {
-            return this.magic.isStub;
-        };
-        TaskMagicService.prototype.saveData = function (data) {
-            this.magic.saveData(data);
-        };
-        TaskMagicService.prototype.createData = function () {
-            var myData = {
-                records: this.Records,
-                template: this.template
-            };
-            var text = 'loadData():any   {\n' +
-                '    let stubData = ' + JSON.stringify(myData) + ';\n' +
-                '    this.loadStubData(stubData);}';
-            console.log(text);
-            this.saveData(text);
-        };
-        TaskMagicService.prototype.loadStubData = function (stubData) {
-            this.Records = stubData.records;
-            this.settemplate(stubData.template);
-            this.taskId = '1';
-            for (var i = 0; i < this.Records.list.length; i++)
-                this.buildTableRowControls(i);
-        };
-        TaskMagicService.prototype.loadData = function () {
-            alert('Please, overwrite method loadData');
-        };
-        TaskMagicService.prototype.setStubValue = function (guiRowId, fc, name) {
-            if (this.IsStub()) {
-                try {
-                    var val = this.Records.list[guiRowId].values[name];
-                    fc.setValue(val);
-                }
-                catch (e) {
-                }
-            }
-        };
-        return TaskMagicService;
-    }());
-    TaskMagicService.ɵfac = function TaskMagicService_Factory(t) { return new (t || TaskMagicService)(i0.ɵɵinject(EngineMagicService), i0.ɵɵinject(OverlayWindowService)); };
-    TaskMagicService.ɵprov = i0.ɵɵdefineInjectable({ token: TaskMagicService, factory: TaskMagicService.ɵfac });
-    (function () {
-        i0.ɵsetClassMetadata(TaskMagicService, [{
-                type: i0.Injectable
-            }], function () { return [{ type: EngineMagicService }, { type: OverlayWindowService }]; }, null);
-    })();
-
-    var CommandsCollectorMagicService = /** @class */ (function () {
-        function CommandsCollectorMagicService(magic) {
-            this.magic = magic;
-            this.count = 0;
-            this.commands = new mscorelib.List();
-            this.subscription = null;
-        }
-        CommandsCollectorMagicService.prototype.startCollecting = function () {
-            var _this = this;
-            this.count++;
-            utils$1.Logger.Instance.WriteDevToLog("CommandsCollectorMagicService.startCollecting() --- " + this.count);
-            if (this.subscription === null) {
-                this.subscription = this.magic.refreshDom
-                    .subscribe(function (command) {
-                    _this.commands.push(command);
-                });
-            }
-        };
-        CommandsCollectorMagicService.prototype.stopCollecting = function () {
-            this.count--;
-            utils$1.Logger.Instance.WriteDevToLog("CommandsCollectorMagicService.stopCollecting() --- " + this.count);
-            if (this.count === 0) {
-                this.subscription.unsubscribe();
-                this.subscription = null;
-            }
-        };
-        CommandsCollectorMagicService.prototype.GetCommands = function (taskId) {
-            var _this = this;
-            var commands = this.commands.filter(function (command) { return command.TaskTag === taskId; });
-            commands.forEach(function (command) { _this.commands.Remove(command); });
-            return commands;
-        };
-        return CommandsCollectorMagicService;
-    }());
-    CommandsCollectorMagicService.ɵfac = function CommandsCollectorMagicService_Factory(t) { return new (t || CommandsCollectorMagicService)(i0.ɵɵinject(EngineMagicService)); };
-    CommandsCollectorMagicService.ɵprov = i0.ɵɵdefineInjectable({ token: CommandsCollectorMagicService, factory: CommandsCollectorMagicService.ɵfac });
-    (function () {
-        i0.ɵsetClassMetadata(CommandsCollectorMagicService, [{
-                type: i0.Injectable
-            }], function () { return [{ type: EngineMagicService }]; }, null);
-    })();
-
-    var RouteCommand = /** @class */ (function () {
-        function RouteCommand() {
-        }
-        return RouteCommand;
-    }());
-    var RouterCommandsMagicService = /** @class */ (function () {
-        function RouterCommandsMagicService() {
-            this.pendingRouteCommands = [];
-        }
-        RouterCommandsMagicService.prototype.AddRouteCommand = function (routeCommand) {
-            this.pendingRouteCommands.push(routeCommand);
-        };
-        RouterCommandsMagicService.prototype.ExecuteNextCommand = function () {
-            var pendingRouteCommand = this.pendingRouteCommands.shift();
-            if (!util.isNullOrUndefined(pendingRouteCommand)) {
-                pendingRouteCommand.callerMgSubformServiceRef.ExecuteRouteCommand(pendingRouteCommand);
-            }
-        };
-        return RouterCommandsMagicService;
-    }());
-    RouterCommandsMagicService.ɵfac = function RouterCommandsMagicService_Factory(t) { return new (t || RouterCommandsMagicService)(); };
-    RouterCommandsMagicService.ɵprov = i0.ɵɵdefineInjectable({ token: RouterCommandsMagicService, factory: RouterCommandsMagicService.ɵfac });
-    (function () {
-        i0.ɵsetClassMetadata(RouterCommandsMagicService, [{
-                type: i0.Injectable
-            }], null, null);
-    })();
-
-    var SubformMagicService = /** @class */ (function () {
-        function SubformMagicService(task, activatedRoute, componentList, pendingCommandsCollector, router, routerCommandsMagicService) {
-            this.task = task;
-            this.activatedRoute = activatedRoute;
-            this.componentList = componentList;
-            this.pendingCommandsCollector = pendingCommandsCollector;
-            this.router = router;
-            this.routerCommandsMagicService = routerCommandsMagicService;
-            this.subformsDict = {};
-            this.routesDict = {};
-            this.currentRouteDefinition = null;
-        }
-        SubformMagicService.prototype.mgGetComp = function (subformName) {
-            if (subformName in this.subformsDict) {
-                var formName = this.subformsDict[subformName].formName;
-                if (formName)
-                    return this.componentList.getComponent(formName);
-            }
-            return null;
-        };
-        SubformMagicService.prototype.mgGetParameters = function (subformName) {
-            if (subformName in this.subformsDict) {
-                return this.subformsDict[subformName].parameters;
-            }
-            else
-                return "";
-        };
-        SubformMagicService.prototype.deleteSubformComp = function (subformControlName, formName) {
-            if (Object.keys(this.subformsDict).indexOf(subformControlName) >= 0) {
-                if (this.subformsDict[subformControlName].formName === formName) {
-                    this.subformsDict[subformControlName] = {};
-                    this.task.refreshView();
-                }
-            }
-        };
-        SubformMagicService.prototype.addSubformComp = function (subformControlName, formName, taskId, taskDescription, routerPath, params, inDefaultOutlet) {
-            this.pendingCommandsCollector.startCollecting();
-            var refreshNeeded = false;
-            if (util.isNullOrUndefined(routerPath)) {
-                if (Object.keys(this.subformsDict).indexOf(subformControlName) >= 0) {
-                    if (this.subformsDict[subformControlName].formName === formName) {
-                        this.subformsDict[subformControlName] = {};
-                        this.task.refreshView();
-                    }
-                }
-                this.subformsDict[subformControlName] = {
-                    formName: formName,
-                    parameters: { taskIdParam: taskId, taskDescription: taskDescription }
-                };
-                refreshNeeded = true;
-            }
-            else {
-                if (inDefaultOutlet)
-                    subformControlName = "primary";
-                var routeParams = new mscorelib.List();
-                routeParams.push(routerPath);
-                if (params !== null) {
-                    routeParams = routeParams.concat(params);
+                    var indexes = new Array(event.target.selectedOptions.length);
+                    for (var i = 0; i < event.target.selectedOptions.length; i++) {
+                        indexes[i] = event.target.selectedOptions[i].index;
+                    }
+                    guiEvent.Value = indexes.join(',');
                 }
-                var routeCommand = {
-                    callerMgSubformServiceRef: this,
-                    routerOutletName: subformControlName,
-                    formName: formName,
-                    parameters: { taskIdParam: taskId, taskDescription: taskDescription },
-                    routeParams: routeParams
-                };
-                if (SubformMagicService.currentCallerMgSubformServiceRef === null)
-                    this.ExecuteRouteCommand(routeCommand);
                 else
-                    this.routerCommandsMagicService.AddRouteCommand(routeCommand);
+                    guiEvent.Value = event.value;
             }
-            if (refreshNeeded)
-                this.task.refreshView();
+            this.insertEvent(guiEvent);
         };
-        SubformMagicService.prototype.ExecuteRouteCommand = function (routeCommand) {
-            var _a;
-            var reusingComponent = false;
-            var currentSubformMagicService = routeCommand.callerMgSubformServiceRef;
-            var relativeRoute = SubformMagicService.getRelativeRoute(currentSubformMagicService.activatedRoute);
-            if (currentSubformMagicService.routesDict[routeCommand.routerOutletName] === routeCommand.routeParams[0]) {
-                currentSubformMagicService.router.navigate([{ outlets: (_a = {}, _a[routeCommand.routerOutletName] = null, _a) }], { relativeTo: relativeRoute })
-                    .then(function (result) {
-                    SubformMagicService.currentCallerMgSubformServiceRef = currentSubformMagicService;
-                    currentSubformMagicService.currentRouteDefinition = {
-                        formName: routeCommand.formName,
-                        parameters: routeCommand.parameters
-                    };
-                    currentSubformMagicService.PerformRouterNavigate(routeCommand.routerOutletName, routeCommand.routeParams);
-                });
+        TaskMagicService.prototype.onListBoxSelectionChanged = function (event, idx) {
+            var guiEvent = engine.getGuiEventObj('selectionchanged', idx, 0);
+            var selectedOptions;
+            if (!util.isNullOrUndefined(event.target))
+                selectedOptions = event.target.selectedOptions;
+            else
+                selectedOptions = event.source.selectedOptions.selected;
+            var length = selectedOptions.length;
+            var indexes = new Array(length);
+            for (var i = 0; i < length; i++) {
+                if (!util.isNullOrUndefined(event.target))
+                    indexes[i] = (selectedOptions[i]).index;
+                else
+                    indexes[i] = (selectedOptions[i]).value;
+            }
+            guiEvent.Value = indexes;
+            this.insertEvent(guiEvent);
+        };
+        TaskMagicService.prototype.onCheckChanged = function (event, idx, rowId) {
+            if (typeof rowId === 'undefined')
+                rowId = 0;
+            var guiEvent = engine.getGuiEventObj('selectionchanged', idx, rowId);
+            if (typeof (event) == 'boolean') {
+                guiEvent.Value = event;
             }
             else {
-                SubformMagicService.currentCallerMgSubformServiceRef = currentSubformMagicService;
-                currentSubformMagicService.currentRouteDefinition = {
-                    formName: routeCommand.formName,
-                    parameters: routeCommand.parameters
-                };
-                if (SubformMagicService.routerContainers.length > 0) {
-                    var routeContainer = SubformMagicService.routerContainers[0];
-                    SubformMagicService.routerContainers.shift();
-                    routeContainer.initializeComponent();
-                }
-                else {
-                    currentSubformMagicService.PerformRouterNavigate(routeCommand.routerOutletName, routeCommand.routeParams);
-                }
+                if (typeof event.target === 'undefined')
+                    guiEvent.Value = (event).checked;
+                else
+                    guiEvent.Value = (event.target).checked;
             }
+            this.insertEvent(guiEvent);
         };
-        SubformMagicService.prototype.PerformRouterNavigate = function (routerOutletName, routeParams) {
-            var _a;
-            var relativeRoute = SubformMagicService.getRelativeRoute(this.activatedRoute);
-            this.router.navigate([{ outlets: (_a = {}, _a[routerOutletName] = routeParams, _a) }], { relativeTo: relativeRoute })
-                .then(function (result) {
-                if (result !== null && !result) {
-                    var subformMagicService = SubformMagicService.currentCallerMgSubformServiceRef;
-                    subformMagicService.currentRouteDefinition = null;
-                    SubformMagicService.currentCallerMgSubformServiceRef = null;
-                    subformMagicService.pendingCommandsCollector.stopCollecting();
-                    subformMagicService.routerCommandsMagicService.ExecuteNextCommand();
-                }
-            });
+        TaskMagicService.prototype.mgOnTabSelectionChanged = function (idx, layer) {
+            var guiEvent = engine.getGuiEventObj('selectionchanged', idx, 0);
+            guiEvent.Value = layer.toString();
+            this.insertEvent(guiEvent);
         };
-        SubformMagicService.prototype.init = function () {
-            var _this = this;
-            var pendingCommands = this.pendingCommandsCollector.GetCommands(this.task.taskId);
-            if (pendingCommands.length > 0) {
-                pendingCommands.forEach(function (command) { _this.task.executeCommand(command); });
-                this.task.refreshView();
-            }
-            this.pendingCommandsCollector.stopCollecting();
+        TaskMagicService.prototype.mgOnRadioSelectionChanged = function (event, idx) {
+            var result = this.getFormControl('0', idx);
+            var guiEvent = engine.getGuiEventObj('selectionchanged', idx, 0);
+            if (typeof result.value !== 'string')
+                guiEvent.Value = result.value.index;
+            else
+                guiEvent.Value = result.value;
+            this.insertEvent(guiEvent);
         };
-        SubformMagicService.prototype.refreshView = function () {
-            this.task.refreshView();
+        TaskMagicService.prototype.close = function () {
+            this.insertEvent(engine.getGuiEventObj('close', null, 0));
         };
-        SubformMagicService.getRelativeRoute = function (sendActivatedRoute) {
-            var currentActiveRoute = sendActivatedRoute;
-            if (currentActiveRoute.snapshot.routeConfig !== null && currentActiveRoute.snapshot.routeConfig.path === '') {
-                currentActiveRoute = currentActiveRoute.parent;
-                if (!currentActiveRoute.snapshot.routeConfig.loadChildren)
-                    console.log("getRelativeRoute(): both path and currentActiveRoute.snapshot.routeConfig.loadChildren are empty.");
+        TaskMagicService.prototype.IsStub = function () {
+            return this.magic.isStub;
+        };
+        TaskMagicService.prototype.saveData = function (data) {
+            this.magic.saveData(data);
+        };
+        TaskMagicService.prototype.createData = function () {
+            var myData = {
+                records: this.Records,
+                template: this.template
+            };
+            var text = 'loadData():any   {\n' +
+                '    let stubData = ' + JSON.stringify(myData) + ';\n' +
+                '    this.loadStubData(stubData);}';
+            console.log(text);
+            this.saveData(text);
+        };
+        TaskMagicService.prototype.loadStubData = function (stubData) {
+            this.Records = stubData.records;
+            this.settemplate(stubData.template);
+            this.taskId = '1';
+            for (var i = 0; i < this.Records.list.length; i++)
+                this.buildTableRowControls(i);
+        };
+        TaskMagicService.prototype.loadData = function () {
+            alert('Please, overwrite method loadData');
+        };
+        TaskMagicService.prototype.setStubValue = function (guiRowId, fc, name) {
+            if (this.IsStub()) {
+                try {
+                    var val = this.Records.list[guiRowId].values[name];
+                    fc.setValue(val);
+                }
+                catch (e) {
+                }
             }
-            return currentActiveRoute;
         };
-        return SubformMagicService;
+        return TaskMagicService;
     }());
-    SubformMagicService.currentCallerMgSubformServiceRef = null;
-    SubformMagicService.routerContainers = new Array();
-    SubformMagicService.ɵfac = function SubformMagicService_Factory(t) { return new (t || SubformMagicService)(i0.ɵɵinject(TaskMagicService), i0.ɵɵinject(i2.ActivatedRoute), i0.ɵɵinject(ComponentListMagicService), i0.ɵɵinject(CommandsCollectorMagicService), i0.ɵɵinject(i2.Router), i0.ɵɵinject(RouterCommandsMagicService)); };
-    SubformMagicService.ɵprov = i0.ɵɵdefineInjectable({ token: SubformMagicService, factory: SubformMagicService.ɵfac });
+    TaskMagicService.ɵfac = function TaskMagicService_Factory(t) { return new (t || TaskMagicService)(i0.ɵɵinject(EngineMagicService), i0.ɵɵinject(OverlayWindowService)); };
+    TaskMagicService.ɵprov = i0.ɵɵdefineInjectable({ token: TaskMagicService, factory: TaskMagicService.ɵfac });
     (function () {
-        i0.ɵsetClassMetadata(SubformMagicService, [{
+        i0.ɵsetClassMetadata(TaskMagicService, [{
                 type: i0.Injectable
-            }], function () { return [{ type: TaskMagicService }, { type: i2.ActivatedRoute }, { type: ComponentListMagicService }, { type: CommandsCollectorMagicService }, { type: i2.Router }, { type: RouterCommandsMagicService }]; }, null);
+            }], function () { return [{ type: EngineMagicService }, { type: OverlayWindowService }]; }, null);
     })();
 
     var TableMagicService = /** @class */ (function () {
@@ -2607,6 +2734,18 @@
         AccessorMagicService.prototype.getItemListValues = function (id, rowId) {
             return this.getProperty(id, gui.HtmlProperties.ItemsList, rowId);
         };
+        AccessorMagicService.prototype.getFilteredList = function (controlId, rowId) {
+            if (util.isNullOrUndefined(rowId))
+                rowId = '0';
+            var items = this.getItemListValues(controlId, rowId);
+            var value = this.task.getFormControl(rowId, controlId).value;
+            if (value !== null && value !== "" && items instanceof Array) {
+                value = value.toLowerCase();
+                return items.filter(function (option) { return option.displayValue.toLowerCase().includes(value); });
+            }
+            else
+                return items;
+        };
         AccessorMagicService.prototype.getDisplayValue = function (id, rowId) {
             var displayValue = "";
             var o = this.getProperty(id, gui.HtmlProperties.ItemsList, rowId);
@@ -2921,7 +3060,8 @@
         RowMagicDirective.prototype.onClick = function ($event) {
             if (this.rowId != '') {
                 this._task.insertEvent(engine.getGuiEventObj('click', "magicRow", +this.rowId));
-                event.cancelBubble = true;
+                if (MagicDirective.noOfAutoCompleteBoxesOpened < 1)
+                    event.cancelBubble = true;
             }
         };
         return RowMagicDirective;
@@ -2998,7 +3138,8 @@
                     if (_this.htmlElement instanceof HTMLButtonElement)
                         fromButton = true;
                     _this.task.insertEvent(engine.getGuiEventObj(event, _this.id, +_this.rowId, fromButton));
-                    e.cancelBubble = true;
+                    if (MagicDirective.noOfAutoCompleteBoxesOpened < 1)
+                        e.cancelBubble = true;
                 });
             });
             this.renderer.listen(this.htmlElement, 'change', function (e) {
@@ -3038,7 +3179,7 @@
                     (e.keyCode >= gui.GuiConstants.KEY_F1 && e.keyCode <= gui.GuiConstants.KEY_F12);
                 if (guiEvent.modifiers !== gui.Modifiers.MODIFIER_NONE || supportedKey) {
                     guiEvent.keyCode = e.keyCode;
-                    if (e.keyCode !== gui.GuiConstants.KEY_ESC || e.keyCode === gui.GuiConstants.KEY_ESC && !MagicDirective.opened)
+                    if (e.keyCode !== gui.GuiConstants.KEY_ESC || e.keyCode === gui.GuiConstants.KEY_ESC && (!MagicDirective.opened && MagicDirective.noOfAutoCompleteBoxesOpened < 1))
                         e.cancelBubble = true;
                     _this.task.insertEvent(guiEvent);
                 }
@@ -3135,6 +3276,7 @@
         return MagicDirective;
     }());
     MagicDirective.opened = false;
+    MagicDirective.noOfAutoCompleteBoxesOpened = 0;
     MagicDirective.ɵfac = function MagicDirective_Factory(t) { return new (t || MagicDirective)(i0.ɵɵdirectiveInject(TaskMagicService), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(RowMagicDirective, 8)); };
     MagicDirective.ɵdir = i0.ɵɵdefineDirective({ type: MagicDirective, selectors: [["", "magic", ""]], inputs: { magic: "magic", eventsOnly: "eventsOnly", rowId: "rowId" } });
     (function () {
@@ -3361,93 +3503,6 @@
                 }] });
     })();
 
-    var RouterContainerMagicComponent = /** @class */ (function () {
-        function RouterContainerMagicComponent(activatedRoute, magic, containerTaskService, componentFactoryResolver, viewContainerRef, componentList, pendingCommandsCollector, routerCommandsMagicService) {
-            this.activatedRoute = activatedRoute;
-            this.magic = magic;
-            this.containerTaskService = containerTaskService;
-            this.componentFactoryResolver = componentFactoryResolver;
-            this.viewContainerRef = viewContainerRef;
-            this.componentList = componentList;
-            this.pendingCommandsCollector = pendingCommandsCollector;
-            this.routerCommandsMagicService = routerCommandsMagicService;
-            this.componentRef = null;
-            this.parentMgSubformService = null;
-        }
-        RouterContainerMagicComponent.prototype.ngOnInit = function () {
-            var outletname = this.activatedRoute.outlet;
-            var subformMagicService = SubformMagicService.currentCallerMgSubformServiceRef;
-            var currentActiveRoute = SubformMagicService.getRelativeRoute(this.activatedRoute);
-            if (subformMagicService == null || subformMagicService.currentRouteDefinition === null) {
-                this.insertRouteEvent(currentActiveRoute);
-                SubformMagicService.routerContainers.push(this);
-            }
-            else {
-                this.initializeComponent();
-            }
-        };
-        RouterContainerMagicComponent.prototype.insertRouteEvent = function (currentActiveRoute) {
-            var guiEvent = engine.getGuiEventObj('RouterNavigate', null, 0);
-            guiEvent.RouterPath = currentActiveRoute.snapshot.routeConfig.path;
-            if (currentActiveRoute.snapshot.outlet !== 'primary')
-                guiEvent.RouterOutletName = currentActiveRoute.snapshot.outlet;
-            var calcRouterPath = currentActiveRoute.routeConfig.path;
-            if (calcRouterPath.length > 0) {
-                var routerPath = calcRouterPath;
-                var tokens = utils$1.StrUtil.tokenize(routerPath, "/:");
-                guiEvent.RouterPath = tokens[0];
-                guiEvent.RouterParams = new mscorelib.List();
-                for (var i = 1; i < tokens.length; i++) {
-                    guiEvent.RouterParams.push(this.activatedRoute.snapshot.params[tokens[i]]);
-                }
-            }
-            this.containerTaskService.insertEvent(guiEvent);
-        };
-        RouterContainerMagicComponent.prototype.initializeComponent = function () {
-            var _this = this;
-            var subformMagicService = SubformMagicService.currentCallerMgSubformServiceRef;
-            if (subformMagicService.currentRouteDefinition !== null) {
-                var comp = this.componentList.getComponent(subformMagicService.currentRouteDefinition.formName);
-                var componentFactory = this.componentFactoryResolver.resolveComponentFactory(comp);
-                this.componentRef = this.viewContainerRef.createComponent(componentFactory);
-                Object.assign(this.componentRef.instance, subformMagicService.currentRouteDefinition.parameters);
-                var myActiveRoute_1 = SubformMagicService.getRelativeRoute(this.activatedRoute);
-                var routeParams = utils$1.StrUtil.tokenize(myActiveRoute_1.snapshot.routeConfig.path, "/:");
-                subformMagicService.routesDict[myActiveRoute_1.snapshot.outlet] = routeParams[0];
-                this.parentMgSubformService = subformMagicService;
-                subformMagicService.currentRouteDefinition = null;
-                SubformMagicService.currentCallerMgSubformServiceRef = null;
-                var ignoreParamChange_1 = true;
-                myActiveRoute_1.paramMap.subscribe(function (params) {
-                    if (!ignoreParamChange_1)
-                        _this.insertRouteEvent(myActiveRoute_1);
-                    ignoreParamChange_1 = false;
-                });
-                this.parentMgSubformService.refreshView();
-                this.routerCommandsMagicService.ExecuteNextCommand();
-            }
-        };
-        RouterContainerMagicComponent.prototype.ngOnDestroy = function () {
-            if (this.componentRef != null) {
-                this.componentRef.instance.task.close();
-                var currentActiveRoute = SubformMagicService.getRelativeRoute(this.activatedRoute);
-                this.parentMgSubformService.routesDict[currentActiveRoute.outlet] = "";
-            }
-        };
-        return RouterContainerMagicComponent;
-    }());
-    RouterContainerMagicComponent.ɵfac = function RouterContainerMagicComponent_Factory(t) { return new (t || RouterContainerMagicComponent)(i0.ɵɵdirectiveInject(i2.ActivatedRoute), i0.ɵɵdirectiveInject(EngineMagicService), i0.ɵɵdirectiveInject(TaskMagicService), i0.ɵɵdirectiveInject(i0.ComponentFactoryResolver), i0.ɵɵdirectiveInject(i0.ViewContainerRef), i0.ɵɵdirectiveInject(ComponentListMagicService), i0.ɵɵdirectiveInject(CommandsCollectorMagicService), i0.ɵɵdirectiveInject(RouterCommandsMagicService)); };
-    RouterContainerMagicComponent.ɵcmp = i0.ɵɵdefineComponent({ type: RouterContainerMagicComponent, selectors: [["magic-route-outlet"]], decls: 0, vars: 0, template: function RouterContainerMagicComponent_Template(rf, ctx) { }, encapsulation: 2 });
-    (function () {
-        i0.ɵsetClassMetadata(RouterContainerMagicComponent, [{
-                type: i0.Component,
-                args: [{
-                        selector: 'magic-route-outlet',
-                        template: "\n  "
-                    }]
-            }], function () { return [{ type: i2.ActivatedRoute }, { type: EngineMagicService }, { type: TaskMagicService }, { type: i0.ComponentFactoryResolver }, { type: i0.ViewContainerRef }, { type: ComponentListMagicService }, { type: CommandsCollectorMagicService }, { type: RouterCommandsMagicService }]; }, null);
-    })();
-
     var Constants = /** @class */ (function () {
         function Constants() {
         }