Merge branch 'develop/3.0' of github.com:thingsboard/thingsboard into develop/3.0

application/src/main/data/json/demo/dashboards/theromstats.json

@@ -119,9 +119,10 @@
                 "name": "Add",
                 "icon": "add",
                 "type": "customPretty",
-                "customHtml": "<md-dialog aria-label=\"Add entity\">\n    <form name=\"addEntityForm\" class=\"add-entity-form\" ng-submit=\"vm.save()\">\n        <md-toolbar>\n            <div class=\"md-toolbar-tools\">\n                <h2>Add thermostat</h2>\n                <span flex></span>\n                <md-button class=\"md-icon-button\" ng-click=\"vm.cancel()\">\n                    <ng-md-icon icon=\"close\" aria-label=\"Close\"></ng-md-icon>\n                </md-button>\n            </div>\n        </md-toolbar>\n        <md-dialog-content>\n            <div class=\"md-dialog-content\">\n                <md-input-container flex class=\"md-block\">\n                    <label>Thermostat name</label>\n                    <input ng-model=\"vm.entityName\" name=entityName required>\n                    <div ng-messages=\"addEntityForm.entityName.$error\">\n                        <div ng-message=\"required\">Thermostat name is required.</div>\n                    </div>\n                </md-input-container>\n                <md-switch ng-model=\"vm.attributes.alarmTemperature\">\n                    High temperature alarm\n                </md-switch>\n                <md-input-container flex class=\"md-block\">\n                    <label>High temperature threshold, °C</label>\n                    <input name=\"thresholdTemperature\" type=\"number\" step=\"any\" \n                            ng-model=\"vm.attributes.thresholdTemperature\"\n                            ng-disabled=\"!vm.attributes.alarmTemperature\"\n                            ng-required=\"vm.attributes.alarmTemperature\">\n                    <div ng-messages=\"addEntityForm.thresholdTemperature.$error\">\n                        <div ng-message=\"required\">High temperature threshold is required.</div>\n                    </div>\n                </md-input-container>\n                <md-switch ng-model=\"vm.attributes.alarmHumidity\">\n                    Low humidity alarm\n                </md-switch>\n                <md-input-container flex class=\"md-block\">\n                    <label>Low humidity threshold, %</label>\n                    <input name=\"thresholdHumidity\" type=\"number\" step=\"any\" \n                            ng-model=\"vm.attributes.thresholdHumidity\"\n                            ng-disabled=\"!vm.attributes.alarmHumidity\"\n                            ng-required=\"vm.attributes.alarmHumidity\">\n                    <div ng-messages=\"addEntityForm.thresholdHumidity.$error\">\n                        <div ng-message=\"required\">Low humidity threshold is required.</div>\n                    </div>\n                </md-input-container>\n            </div>\n        </md-dialog-content>\n        <md-dialog-actions>\n            <md-button type=\"submit\" ng-disabled=\"addEntityForm.$invalid || !addEntityForm.$dirty\" class=\"md-raised md-primary\">Create</md-button>\n            <md-button ng-click=\"vm.cancel()\" class=\"md-primary\">Cancel</md-button>\n        </md-dialog-actions>\n    </form>\n</md-dialog>",
+                "customHtml": "<form #addEntityForm=\"ngForm\" [formGroup]=\"addEntityFormGroup\"\n        (ngSubmit)=\"save()\" class=\"add-entity-form\">\n    <mat-toolbar color=\"primary\">\n        <h2>Add thermostat</h2>\n        <span fxFlex></span>\n        <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n            <mat-icon class=\"material-icons\">close</mat-icon>\n        </button>\n    </mat-toolbar>\n    <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n    </mat-progress-bar>\n    <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n    <div mat-dialog-content fxLayout=\"column\">\n        <mat-form-field fxFlex class=\"mat-block\">\n            <mat-label>Thermostat name</mat-label>\n            <input matInput formControlName=\"entityName\" required>\n            <mat-error *ngIf=\"addEntityFormGroup.get('entityName').hasError('required')\">\n                Thermostat name is required.\n            </mat-error>\n        </mat-form-field>\n        <div formGroupName=\"attributes\" fxLayout=\"column\">\n            <mat-slide-toggle formControlName=\"alarmTemperature\">\n                High temperature alarm\n            </mat-slide-toggle>\n            <mat-form-field fxFlex class=\"mat-block\">\n                <mat-label>High temperature threshold, °C</mat-label>\n                <input type=\"number\" step=\"any\" matInput\n                    [required] = \"addEntityFormGroup.get('attributes').get('alarmTemperature').value\"\n                    formControlName=\"thresholdTemperature\">\n                <mat-error *ngIf=\"addEntityFormGroup.get('attributes').get('thresholdTemperature').hasError('required')\">\n                    High temperature threshold is required.\n                </mat-error>\n            </mat-form-field>\n        \n            <mat-slide-toggle formControlName=\"alarmHumidity\">\n                Low humidity alarm\n            </mat-slide-toggle>\n                \n            <mat-form-field fxFlex class=\"mat-block\">\n                <mat-label>Low humidity threshold, %</mat-label>\n                <input type=\"number\" step=\"any\" matInput\n                    [required] = \"addEntityFormGroup.get('attributes').get('alarmHumidity').value\"\n                    formControlName=\"thresholdHumidity\">\n                <mat-error *ngIf=\"addEntityFormGroup.get('attributes').get('thresholdHumidity').hasError('required')\">\n                    Low humidity threshold is required.\n                </mat-error>\n            </mat-form-field>\n        </div>\n    </div>\n    <div mat-dialog-actions fxLayout=\"row\" fxLayoutAlign=\"end center\">\n        <button mat-button mat-raised-button color=\"primary\"\n                type=\"submit\"\n                [disabled]=\"(isLoading$ | async) || addEntityForm.invalid || !addEntityForm.dirty\">\n            Create\n        </button>\n        <button mat-button color=\"primary\"\n                type=\"button\"\n                [disabled]=\"(isLoading$ | async)\"\n                (click)=\"cancel()\" cdkFocusInitial>\n            Cancel\n        </button>\n    </div>\n</form>",
-                "customCss": ".add-entity-form md-input-container {\n    padding-right: 10px;\n}\n\n.add-entity-form .boolean-value-input {\n    padding-left: 5px;\n}\n\n.add-entity-form .boolean-value-input .checkbox-label {\n    margin-bottom: 8px;\n    color: rgba(0,0,0,0.54);\n    font-size: 12px;\n}\n\n",
+                "customCss": ".add-entity-form{\n    width: 300px;\n}\n",
-                "customFunction": "var $injector = widgetContext.$scope.$injector;\nvar $mdDialog = $injector.get('$mdDialog'),\n    $document = $injector.get('$document'),\n    $q = $injector.get('$q'),\n    $rootScope = $injector.get('$rootScope'),\n    deviceService = $injector.get('deviceService'),\n    attributeService = $injector.get('attributeService');\n\nopenAddEntityDialog();\n\nfunction openAddEntityDialog() {\n    $mdDialog.show({\n        controller: ['$scope','$mdDialog', AddEntityDialogController],\n        controllerAs: 'vm',\n        template: htmlTemplate,\n        locals: {\n            entityId: entityId\n        },\n        parent: angular.element($document[0].body),\n        targetEvent: $event,\n        multiple: true,\n        clickOutsideToClose: false\n    });\n}\n\nfunction AddEntityDialogController($scope, $mdDialog) {\n    var vm = this;\n    vm.attributes = {};\n\n    vm.save = function() {\n        $scope.addEntityForm.$setPristine();\n        saveEntityPromise().then(\n            function (entity) {\n                saveAttributes(entity.id);\n                updateAliasData();\n                $mdDialog.hide();\n            }\n        );\n    };\n    vm.cancel = function() {\n        $mdDialog.hide();\n    };\n    \n    \n    function saveEntityPromise() {\n        var entity = {\n            name: vm.entityName,\n            type: \"thermostat\"\n        };\n        return deviceService.saveDevice(entity);\n    }\n    \n    function saveAttributes(entityId) {\n        var attributesArray = [];\n        for (var key in vm.attributes) {\n            attributesArray.push({key: key, value: vm.attributes[key]});\n        }\n        if (attributesArray.length > 0) {\n            attributeService.saveEntityAttributes(entityId.entityType, entityId.id, \"SERVER_SCOPE\", attributesArray);\n        } \n    }\n    \n    function updateAliasData() {\n        var aliasIds = [];\n        for (var id in widgetContext.aliasController.resolvedAliases) {\n            aliasIds.push(id);\n        }\n        var tasks = [];\n        aliasIds.forEach(function(aliasId) {\n            widgetContext.aliasController.setAliasUnresolved(aliasId);\n            tasks.push(widgetContext.aliasController.getAliasInfo(aliasId));\n        });\n        $q.all(tasks).then(function() {\n            $rootScope.$broadcast('widgetForceReInit');\n        });\n    }\n}\n"
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\n\n\nopenAddEntityDialog();\n\nfunction openAddEntityDialog() {\n    customDialog.customDialog(htmlTemplate, AddEntityDialogController).subscribe();\n}\n\nfunction AddEntityDialogController(instance) {\n    let vm = instance;\n    \n    vm.addEntityFormGroup = vm.fb.group({\n        entityName: ['', [vm.validators.required]],\n        attributes: vm.fb.group({\n            alarmTemperature: [false],\n            thresholdTemperature: [{value: null, disabled: true}],\n            alarmHumidity: [false],\n            thresholdHumidity: [{value: null, disabled: true}]\n        })\n    });\n    \n    vm.addEntityFormGroup.get('attributes').get('alarmTemperature').valueChanges\n    .subscribe(activate => {\n        if (activate) {\n            vm.addEntityFormGroup.get('attributes').get('thresholdTemperature').enable();\n        } else {\n            vm.addEntityFormGroup.get('attributes').get('thresholdTemperature').disable();\n        }\n    });\n    \n    vm.addEntityFormGroup.get('attributes').get('alarmHumidity').valueChanges\n    .subscribe(activate => {\n        if (activate) {\n            vm.addEntityFormGroup.get('attributes').get('thresholdHumidity').enable();\n        } else {\n            vm.addEntityFormGroup.get('attributes').get('thresholdHumidity').disable();\n        }\n    });\n\n    vm.save = function() {\n        vm.addEntityFormGroup.markAsPristine();\n        saveEntityObservable().subscribe(\n            function (entity) {\n                widgetContext.rxjs.forkJoin([\n                    saveAttributes(entity.id),\n                    saveRelations(entity.id)\n                ]).subscribe(\n                    function () {\n                        widgetContext.updateAliases();\n                        vm.dialogRef.close(null);\n                    }\n                );\n            }\n        );\n    };\n    \n    vm.cancel = function() {\n        vm.dialogRef.close(null);\n    };\n    \n    function saveEntityObservable() {\n        const formValues = vm.addEntityFormGroup.value;\n        let entity = {\n            name: formValues.entityName,\n            type: \"thermostat\"\n        };\n        return deviceService.saveDevice(entity);\n    }\n    \n    function saveAttributes(entityId) {\n        let attributes = vm.addEntityFormGroup.get('attributes').value;\n        let attributesArray = [];\n        for (let key in attributes) {\n            if(attributes[key] !== null) {\n                attributesArray.push({key: key, value: attributes[key]});\n            }\n        }\n        if (attributesArray.length > 0) {\n            return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n        } else {\n            return widgetContext.rxjs.of([]);\n        }\n    }\n    \n    function addRelation() {\n        return [{\n            direction: 'FROM',\n            relationType: 'Contains',\n            relatedEntity: {\n                id: widgetContext.currentUser.tenantId,\n                entityType: 'TENANT'\n            }\n        }];\n    }\n    \n    function saveRelations(entityId) {\n        let relations = addRelation();\n        let tasks = [];\n        for(let i=0; i < relations.length; i++) {\n            let relation = {\n                type: relations[i].relationType,\n                typeGroup: 'COMMON'\n            };\n            if (relations[i].direction == 'FROM') {\n                relation.to = relations[i].relatedEntity;\n                relation.from = entityId;\n            } else {\n                relation.to = entityId;\n                relation.from = relations[i].relatedEntity;\n            }\n            tasks.push(entityRelationService.saveRelation(relation));\n        }\n        if (tasks.length > 0) {\n            return widgetContext.rxjs.forkJoin(tasks);\n        } else {\n            return widgetContext.rxjs.of([]);\n        }\n    }\n}",
+                "customResources": []
               }
             ],
             "actionCellButton": [
@@ -138,29 +139,20 @@
                 "name": "Edit",
                 "icon": "edit",
                 "type": "customPretty",
-                "customHtml": "<md-dialog aria-label=\"Edit entity\">\n    <form name=\"editEntityForm\" class=\"edit-entity-form\" ng-submit=\"vm.save()\">\n        <md-toolbar>\n            <div class=\"md-toolbar-tools\">\n                <h2>Edit thermostat {{vm.entityName}}</h2>\n                <span flex></span>\n                <md-button class=\"md-icon-button\" ng-click=\"vm.cancel()\">\n                    <ng-md-icon icon=\"close\" aria-label=\"Close\"></ng-md-icon>\n                </md-button>\n            </div>\n        </md-toolbar>\n        <md-dialog-content>\n            <div class=\"md-dialog-content\">\n                <md-input-container flex class=\"md-block\">\n                    <label>Thermostat name</label>\n                    <input ng-model=\"vm.entityName\" readonly>\n                </md-input-container>\n                <md-switch ng-model=\"vm.attributes.alarmTemperature\">\n                    High temperature alarm\n                </md-switch>\n                <md-input-container flex class=\"md-block\">\n                    <label>High temperature threshold, °C</label>\n                    <input name=\"thresholdTemperature\" type=\"number\" step=\"any\" \n                            ng-model=\"vm.attributes.thresholdTemperature\"\n                            ng-disabled=\"!vm.attributes.alarmTemperature\"\n                            ng-required=\"vm.attributes.alarmTemperature\">\n                    <div ng-messages=\"editEntityForm.thresholdTemperature.$error\">\n                        <div ng-message=\"required\">High temperature threshold is required.</div>\n                    </div>\n                </md-input-container>\n                <md-switch ng-model=\"vm.attributes.alarmHumidity\">\n                    Low humidity alarm\n                </md-switch>\n                <md-input-container flex class=\"md-block\">\n                    <label>Low humidity threshold, %</label>\n                    <input name=\"thresholdHumidity\" type=\"number\" step=\"any\" \n                            ng-model=\"vm.attributes.thresholdHumidity\"\n                            ng-disabled=\"!vm.attributes.alarmHumidity\"\n                            ng-required=\"vm.attributes.alarmHumidity\">\n                    <div ng-messages=\"editEntityForm.thresholdHumidity.$error\">\n                        <div ng-message=\"required\">Low humidity threshold is required.</div>\n                    </div>\n                </md-input-container>\n            </div>\n        </md-dialog-content>\n        <md-dialog-actions>\n            <md-button type=\"submit\" ng-disabled=\"editEntityForm.$invalid || !editEntityForm.$dirty\" class=\"md-raised md-primary\">Save</md-button>\n            <md-button ng-click=\"vm.cancel()\" class=\"md-primary\">Cancel</md-button>\n        </md-dialog-actions>\n    </form>\n</md-dialog>",
+                "customHtml": "<form #editEntityForm=\"ngForm\" [formGroup]=\"editEntityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"edit-entity-form\">\n    <mat-toolbar color=\"primary\">\n        <h2>Edit thermostat {{entityName}}</h2>\n        <span fxFlex></span>\n        <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n            <mat-icon class=\"material-icons\">close</mat-icon>\n        </button>\n    </mat-toolbar>\n    <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n    </mat-progress-bar>\n    <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n    <div mat-dialog-content fxLayout=\"column\">\n        <mat-form-field fxFlex class=\"mat-block\">\n            <mat-label>Thermostat name</mat-label>\n            <input matInput formControlName=\"entityName\" readonly>\n        </mat-form-field>\n        <div formGroupName=\"attributes\" fxLayout=\"column\">\n            <mat-slide-toggle formControlName=\"alarmTemperature\">\n                High temperature alarm\n            </mat-slide-toggle>\n            <mat-form-field fxFlex class=\"mat-block\">\n                <mat-label>High temperature threshold, °C</mat-label>\n                <input type=\"number\" step=\"any\" matInput\n                        [required] = \"editEntityFormGroup.get('attributes').get('alarmTemperature').value\"\n                        formControlName=\"thresholdTemperature\">\n                <mat-error *ngIf=\"editEntityFormGroup.get('attributes').get('thresholdTemperature').hasError('required')\">\n                    High temperature threshold is required.\n                </mat-error>\n            </mat-form-field>\n\n            <mat-slide-toggle formControlName=\"alarmHumidity\">\n                Low humidity alarm\n            </mat-slide-toggle>\n\n            <mat-form-field fxFlex class=\"mat-block\">\n                <mat-label>Low humidity threshold, %</mat-label>\n                <input type=\"number\" step=\"any\" matInput\n                       [required] = \"editEntityFormGroup.get('attributes').get('alarmHumidity').value\"\n                       formControlName=\"thresholdHumidity\">\n                <mat-error *ngIf=\"editEntityFormGroup.get('attributes').get('thresholdHumidity').hasError('required')\">\n                    Low humidity threshold is required.\n                </mat-error>\n            </mat-form-field>\n        </div>\n    </div>\n    <div mat-dialog-actions fxLayout=\"row\" fxLayoutAlign=\"end center\">\n        <button mat-raised-button color=\"primary\"\n                type=\"submit\"\n                [disabled]=\"(isLoading$ | async) || editEntityForm.invalid || !editEntityForm.dirty\">\n            Save\n        </button>\n        <button mat-button color=\"primary\"\n                type=\"button\"\n                [disabled]=\"(isLoading$ | async)\"\n                (click)=\"cancel()\" cdkFocusInitial>\n            Cancel\n        </button>\n    </div>\n</form>",
-                "customCss": ".edit-entity-form md-input-container {\n    padding-right: 10px;\n}\n\n.edit-entity-form .boolean-value-input {\n    padding-left: 5px;\n}\n\n.edit-entity-form .boolean-value-input .checkbox-label {\n    margin-bottom: 8px;\n    color: rgba(0,0,0,0.54);\n    font-size: 12px;\n}\n",
+                "customCss": ".edit-entity-form{\n    width: 300px;\n}",
-                "customFunction": "var $injector = widgetContext.$scope.$injector;\nvar $mdDialog = $injector.get('$mdDialog'),\n    $document = $injector.get('$document'),\n    attributeService = $injector.get('attributeService');\n\nopenEditEntityDialog();\n\nfunction openEditEntityDialog() {\n    $mdDialog.show({\n        controller: ['$scope','$mdDialog', EditEntityDialogController],\n        controllerAs: 'vm',\n        template: htmlTemplate,\n        locals: {\n            entityId: entityId\n        },\n        parent: angular.element($document[0].body),\n        targetEvent: $event,\n        multiple: true,\n        clickOutsideToClose: false\n    });\n}\n\nfunction EditEntityDialogController($scope,$mdDialog) {\n    var vm = this;\n    vm.entityId = entityId;\n    vm.entityName = entityName;\n    vm.entityType = entityId.entityType;\n    vm.attributes = {};\n    vm.serverAttributes = {};\n    getEntityInfo();\n    \n    vm.save = function() {\n        saveAttributes();\n        $mdDialog.hide();\n    };\n    vm.cancel = function() {\n        $mdDialog.hide();\n    };\n    \n    function getEntityAttributes(attributes) {\n        for (var i = 0; i < attributes.length; i++) {\n             vm.attributes[attributes[i].key] = attributes[i].value; \n        }\n        vm.serverAttributes = angular.copy(vm.attributes);\n    }\n    \n    function getEntityInfo() {\n        attributeService.getEntityAttributesValues(entityId.entityType, entityId.id, 'SERVER_SCOPE').then(\n            function(data){\n                if (data.length) {\n                    getEntityAttributes(data);\n                }\n            });\n    }\n    \n    function saveAttributes() {\n        var attributesArray = [];\n        for (var key in vm.attributes) {\n            if (vm.attributes[key] !== vm.serverAttributes[key]) {\n                attributesArray.push({key: key, value: vm.attributes[key]});\n            }\n        }\n        if (attributesArray.length > 0) {\n            attributeService.saveEntityAttributes(entityId.entityType, entityId.id, \"SERVER_SCOPE\", attributesArray);\n        } \n    }\n}"
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\n\nopenEditEntityDialog();\n\nfunction openEditEntityDialog() {\n    customDialog.customDialog(htmlTemplate, EditEntityDialogController).subscribe();\n}\n\nfunction EditEntityDialogController(instance) {\n    let vm = instance;\n    \n    vm.entityId = entityId;\n    vm.entityName = entityName;\n    vm.attributes = {};\n    \n    vm.editEntityFormGroup = vm.fb.group({\n        entityName: [''],\n        attributes: vm.fb.group({\n            alarmTemperature: [false],\n            thresholdTemperature: [{value: null, disabled: true}],\n            alarmHumidity: [false],\n            thresholdHumidity: [{value: null, disabled: true}]\n        })\n    });\n    \n    vm.editEntityFormGroup.get('attributes').get('alarmTemperature').valueChanges\n    .subscribe(activate => {\n        if (activate) {\n            vm.editEntityFormGroup.get('attributes').get('thresholdTemperature').enable();\n        } else {\n            vm.editEntityFormGroup.get('attributes').get('thresholdTemperature').disable();\n        }\n    });\n    \n    vm.editEntityFormGroup.get('attributes').get('alarmHumidity').valueChanges\n    .subscribe(activate => {\n        if (activate) {\n            vm.editEntityFormGroup.get('attributes').get('thresholdHumidity').enable();\n        } else {\n            vm.editEntityFormGroup.get('attributes').get('thresholdHumidity').disable();\n        }\n    });\n    \n    \n    getEntityInfo();\n    \n    \n    vm.save = function() {\n        vm.editEntityFormGroup.markAsPristine();\n        saveAttributes(entityId).subscribe(\n            function () {\n                vm.dialogRef.close(null);\n            }\n        );\n    };\n    \n    vm.cancel = function() {\n        vm.dialogRef.close(null);\n    };\n    \n    function getEntityAttributes(attributes) {\n        for (var i = 0; i < attributes.length; i++) {\n            vm.attributes[attributes[i].key] = attributes[i].value;\n        }\n    }\n    \n    function getEntityInfo() {\n        attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE').subscribe(\n            function (attributes) {\n                getEntityAttributes(attributes);\n                vm.editEntityFormGroup.patchValue({\n                    entityName: vm.entityName,\n                    attributes: vm.attributes\n                });\n                // if(vm.attributes.alarmTemperature) {\n                //     vm.editEntityFormGroup.get('attributes').get('thresholdTemperature').enable();\n                // }\n                // if(vm.attributes.alarmHumidity) {\n                //     vm.editEntityFormGroup.get('attributes').get('thresholdHumidity').enable();\n                // }\n            }\n        );\n    }\n    \n    function saveAttributes(entityId) {\n        let attributes = vm.editEntityFormGroup.get('attributes').value;\n        let attributesArray = [];\n        for (let key in attributes) {\n            if (attributes[key] !== vm.attributes[key]) {\n                attributesArray.push({key: key, value: attributes[key]});\n            }\n        }\n        if (attributesArray.length > 0) {\n            return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n        } else {\n            return widgetContext.rxjs.of([]);\n        }\n    }\n}",
+                "customResources": []
               },
               {
                 "id": "3488848b-e47d-6af6-659f-5d78369ece5e",
                 "name": "Delete",
                 "icon": "delete",
                 "type": "custom",
-                "customFunction": "var $injector = widgetContext.$scope.$injector;\nvar $mdDialog = $injector.get('$mdDialog'),\n    $document = $injector.get('$document'),\n    deviceService = $injector.get('deviceService')\n    $rootScope = $injector.get('$rootScope'),\n    $q = $injector.get('$q');\n\nopenDeleteEntityDialog();\n\nfunction openDeleteEntityDialog() {\n    var title = 'Delete thermostat \"' +  entityName + '\"';\n    var content = 'Are you sure you want to delete the thermostat \"' +\n        entityName + '\"?';\n    var confirm = $mdDialog.confirm()\n        .targetEvent($event)\n        .title(title)\n        .htmlContent(content)\n        .ariaLabel(title)\n        .cancel('Cancel')\n        .ok('Delete');\n    $mdDialog.show(confirm).then(function() {\n        deleteEntity();\n    })\n}\n\nfunction deleteEntity() {\n     deviceService.deleteDevice(entityId.id).then(\n        function success() {\n            updateAliasData();\n        },\n        function fail() {\n            showErrorDialog();\n        }\n    );\n}\n\nfunction updateAliasData() {\n    var aliasIds = [];\n    for (var id in widgetContext.aliasController.resolvedAliases) {\n        aliasIds.push(id);\n    }\n    var tasks = [];\n    aliasIds.forEach(function(aliasId) {\n        widgetContext.aliasController.setAliasUnresolved(aliasId);\n        tasks.push(widgetContext.aliasController.getAliasInfo(aliasId));\n    });\n    $q.all(tasks).then(function() {\n        $rootScope.$broadcast('entityAliasesChanged', aliasIds);\n    });\n}\n\nfunction showErrorDialog() {\n    var title = 'Error';\n    var content = 'An error occurred while deleting the thermostat. Please try again.';\n    var alert = $mdDialog.alert()\n        .title(title)\n        .htmlContent(content)\n        .ariaLabel(title)\n        .parent(angular.element($document[0].body))\n        .targetEvent($event)\n        .multiple(true)\n        .clickOutsideToClose(true)\n        .ok('CLOSE');\n    $mdDialog.show(alert);\n}"
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet dialogs = $injector.get(widgetContext.servicesMap.get('dialogs'));\nlet deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));\n\nopenDeleteEntityDialog();\n\nfunction openDeleteEntityDialog() {\n    let title = 'Delete thermostat \"' +  entityName + '\"';\n    let content = 'Are you sure you want to delete the thermostat \"' +\n        entityName + '\"?';\n    dialogs.confirm(title, content, 'Cancel', 'Delete').subscribe(\n        function(result) {\n            if (result) {\n                deleteEntity();\n            }\n        }\n    );\n}\n\nfunction deleteEntity() {\n    deviceService.deleteDevice(entityId.id).subscribe(\n        function success() {\n            widgetContext.updateAliases();\n        },\n        function fail() {\n            showErrorDialog();\n        }\n    );\n}\n\nfunction showErrorDialog() {\n    let title = 'Error';\n    let content = 'An error occurred while deleting the thermostat. Please try again.';\n    dialogs.alert(title, content, 'CLOSE').subscribe(\n        function(result) {}\n    );\n}"
               }
             ],
-            "rowClick": [
+            "rowClick": []
-              {
-                "id": "e3928f23-c135-0766-71d5-65ed61e0ce8d",
-                "name": "show alarm",
-                "icon": "more_horiz",
-                "type": "updateDashboardState",
-                "targetDashboardStateId": "default",
-                "setEntityId": true,
-                "stateEntityParamName": "alarm"
-              }
-            ]
           }
         },
         "id": "f33c746c-0dfc-c212-395b-b448c8a17209"
@@ -907,147 +899,11 @@
           "displayTimewindow": true
         },
         "id": "00fb2742-ba1f-7e43-673f-d6c08b72ed06"
-      },
-      "0a430429-9078-9ae6-2b67-e4a15a2bf8bf": {
-        "isSystemType": true,
-        "bundleAlias": "input_widgets",
-        "typeAlias": "markers_placement_openstreetmap",
-        "type": "latest",
-        "title": "New widget",
-        "sizeX": 6,
-        "sizeY": 6,
-        "config": {
-          "datasources": [
-            {
-              "type": "entity",
-              "dataKeys": [
-                {
-                  "name": "longitude",
-                  "type": "attribute",
-                  "label": "longitude",
-                  "color": "#2196f3",
-                  "settings": {},
-                  "_hash": 0.3640193654284214
-                },
-                {
-                  "name": "latitude",
-                  "type": "attribute",
-                  "label": "latitude",
-                  "color": "#4caf50",
-                  "settings": {},
-                  "_hash": 0.49020393887695923
-                },
-                {
-                  "name": "temperature",
-                  "type": "timeseries",
-                  "label": "temperature",
-                  "color": "#f44336",
-                  "settings": {},
-                  "_hash": 0.5885892766009955,
-                  "postFuncBody": "return value || \"\";"
-                },
-                {
-                  "name": "humidity",
-                  "type": "timeseries",
-                  "label": "humidity",
-                  "color": "#ffc107",
-                  "settings": {},
-                  "_hash": 0.21077893588180707,
-                  "postFuncBody": "return value || \"\";"
-                },
-                {
-                  "name": "active",
-                  "type": "attribute",
-                  "label": "active",
-                  "color": "#607d8b",
-                  "settings": {},
-                  "_hash": 0.34722983638504346
-                }
-              ],
-              "entityAliasId": "12ae98c7-1ea2-52cf-64d5-763e9d993547"
-            }
-          ],
-          "timewindow": {
-            "realtime": {
-              "timewindowMs": 60000
-            }
-          },
-          "showTitle": false,
-          "backgroundColor": "#fff",
-          "color": "rgba(0, 0, 0, 0.87)",
-          "padding": "8px",
-          "settings": {
-            "fitMapBounds": true,
-            "latKeyName": "latitude",
-            "lngKeyName": "longitude",
-            "showLabel": true,
-            "label": "${entityName}",
-            "tooltipPattern": "<b>${entityName}</b><br/><br/><b>Temperature:</b> ${temperature:1} °C<br/><b>Humidity:</b> ${humidity:0} %<br/><br/><link-act name='delete'>Delete</link-act>",
-            "markerImageSize": 34,
-            "useColorFunction": false,
-            "markerImages": [
-              "data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJzdmc0NDA4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHg9IjAiIHk9IjAiIHZpZXdCb3g9IjAgMCAxNTAgMTUwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGU+LnN0MntmaWxsOiNmNDQzMzZ9PC9zdHlsZT48ZyBpZD0ibGF5ZXIxIj48ZyBpZD0icGF0aDY4ODEtMy01LTUtMS04LTQtNC03LTgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xNDYuNDM4IC0yNzYuMDI4KSIgb3BhY2l0eT0iLjg5MiI+PHJhZGlhbEdyYWRpZW50IGlkPSJTVkdJRF8xXyIgY3g9IjMwODUuMjE1IiBjeT0iMzE3OC40NTgiIHI9IjQ5LjkwMSIgZ3JhZGllbnRUcmFuc2Zvcm09Im1hdHJpeCguNjc5MyAuMDA3NiAtLjUwOSAuNTYxMiAtMjMyLjYyOSAtMTQxMS43MjUpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHN0b3Agb2Zmc2V0PSIwIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLW9wYWNpdHk9Ii4xODgiLz48L3JhZGlhbEdyYWRpZW50PjxwYXRoIGQ9Ik0yODUuNiAzODguNWMxMC4zLTEyLjQgNC40LTIyLjQtMTQuNC0yMi40LTE4LjkgMC00Mi40IDEwLTUzLjkgMjIuNC0xNi44IDE4IC40IDIzLjUtLjIgMzUtLjEgMS44IDMuOSAxLjggNyAwIDE5LjgtMTEuNSA0Ni41LTE3IDYxLjUtMzUiIGZpbGw9InVybCgjU1ZHSURfMV8pIi8+PC9nPjxwYXRoIGlkPSJwYXRoNjg4MS0zLTUtNS0xLTgtNC00IiBjbGFzcz0ic3QyIiBkPSJNMTI0LjcgNjkuMWMtLjktMjcuNS0yMi4zLTQ5LjgtNDkuOC00OS44cy00OSAyMi4zLTQ5LjggNDkuOGMtMS4zIDQwLjEgMzAuNyA1Mi4yIDQ0LjcgNzggMi4yIDQgOCA0IDEwLjEgMCAxNC4xLTI1LjggNDYuMS0zNy45IDQ0LjgtNzgiLz48L2c+PGcgaWQ9Imc0OTI4Ij48Y2lyY2xlIGlkPSJwYXRoNDk3OCIgY2xhc3M9InN0MiIgY3g9Ijc0LjkiIGN5PSI2OS4xIiByPSI0OS45Ii8+PGcgaWQ9Imc0OTE1Ij48cGF0aCBpZD0icGF0aDY4ODMtMi0zLTUtMi00LTktNC05IiBkPSJNNzQuOCAxMDYuNGMtMjAuNiAwLTM3LjQtMTYuNy0zNy40LTM3LjQgMC0yMC42IDE2LjctMzcuNCAzNy40LTM3LjQgMjAuNiAwIDM3LjQgMTYuNyAzNy40IDM3LjRzLTE2LjcgMzcuNC0zNy40IDM3LjQiIGZpbGw9IiNmZmYiLz48L2c+PC9nPjxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik05NS45IDQ2LjZWNDloLTEwdi0yLjVsMTAgLjF6bS0yIDUuM2gtOHYyLjVoOHYtMi41em0tOCA3LjloNnYtMi41aC02djIuNXptNCAyLjloLTR2Mi41aDR2LTIuNXptLTQgNy44aDJWNjhoLTJ2Mi41em0xLjUgMTRjMCA2LjktNS41IDEyLjUtMTIuMyAxMi41cy0xMi4zLTUuNi0xMi4zLTEyLjVjMC00LjUgMi4zLTguNSA2LjEtMTAuN1Y0NS41YzAtMy41IDIuOC02LjMgNi4yLTYuM3M2LjIgMi44IDYuMiA2LjN2MjguM2MzLjggMi4yIDYuMSA2LjMgNi4xIDEwLjd6bS0yLjQgMGMwLTMuOC0yLjEtNy4yLTUuNC04LjlsLS43LS4zVjQ1LjVjMC0yLjEtMS43LTMuOC0zLjgtMy44LTIuMSAwLTMuOCAxLjctMy44IDMuOHYyOS44bC0uNy4zYy0zLjMgMS43LTUuNCA1LjEtNS40IDguOSAwIDUuNSA0LjQgMTAgOS45IDEwUzg1IDkwIDg1IDg0LjV6bS0yLjEgMGMwIDQuNC0zLjUgOC03LjggOHMtNy44LTMuNi03LjgtOGMwLTMuNiAyLjQtNi44IDUuOC03LjdsLjUtLjFWNjEuNWgzLjF2MTUuMmwuNS4xYzMuMyAxIDUuNyA0LjEgNS43IDcuN3ptLTcuNC01LjNjLS4yLS44LTEtMS40LTEuOS0xLjItMyAuNy01IDMuMy01IDYuNCAwIC45LjcgMS42IDEuNiAxLjZzMS42LS43IDEuNi0xLjZjMC0xLjYgMS4xLTMgMi42LTMuMy43LS4yIDEuMy0xIDEuMS0xLjl6Ii8+PC9zdmc+",
-              "data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJzdmc0NDA4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHg9IjAiIHk9IjAiIHZpZXdCb3g9IjAgMCAxNTAgMTUwIiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGU+LnN0MntmaWxsOiMyNzg2MjJ9PC9zdHlsZT48ZyBpZD0ibGF5ZXIxIj48ZyBpZD0icGF0aDY4ODEtMy01LTUtMS04LTQtNC03LTgiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xNDYuNDM4IC0yNzYuMDI4KSIgb3BhY2l0eT0iLjg5MiI+PHJhZGlhbEdyYWRpZW50IGlkPSJTVkdJRF8xXyIgY3g9IjMwODUuMjE1IiBjeT0iMzE3OC40NTgiIHI9IjQ5LjkwMSIgZ3JhZGllbnRUcmFuc2Zvcm09Im1hdHJpeCguNjc5MyAuMDA3NiAtLjUwOSAuNTYxMiAtMjMyLjYyOSAtMTQxMS43MjUpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHN0b3Agb2Zmc2V0PSIwIi8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLW9wYWNpdHk9Ii4xODgiLz48L3JhZGlhbEdyYWRpZW50PjxwYXRoIGQ9Ik0yODUuNiAzODguNWMxMC4zLTEyLjQgNC40LTIyLjQtMTQuNC0yMi40LTE4LjkgMC00Mi40IDEwLTUzLjkgMjIuNC0xNi44IDE4IC40IDIzLjUtLjIgMzUtLjEgMS44IDMuOSAxLjggNyAwIDE5LjgtMTEuNSA0Ni41LTE3IDYxLjUtMzUiIGZpbGw9InVybCgjU1ZHSURfMV8pIi8+PC9nPjxwYXRoIGlkPSJwYXRoNjg4MS0zLTUtNS0xLTgtNC00IiBjbGFzcz0ic3QyIiBkPSJNMTI0LjcgNjkuMWMtLjktMjcuNS0yMi4zLTQ5LjgtNDkuOC00OS44cy00OSAyMi4zLTQ5LjggNDkuOGMtMS4zIDQwLjEgMzAuNyA1Mi4yIDQ0LjcgNzggMi4yIDQgOCA0IDEwLjEgMCAxNC4xLTI1LjggNDYuMS0zNy45IDQ0LjgtNzgiLz48L2c+PGcgaWQ9Imc0OTI4Ij48Y2lyY2xlIGlkPSJwYXRoNDk3OCIgY2xhc3M9InN0MiIgY3g9Ijc0LjkiIGN5PSI2OS4xIiByPSI0OS45Ii8+PGcgaWQ9Imc0OTE1Ij48cGF0aCBpZD0icGF0aDY4ODMtMi0zLTUtMi00LTktNC05IiBkPSJNNzQuOCAxMDYuNGMtMjAuNiAwLTM3LjQtMTYuNy0zNy40LTM3LjQgMC0yMC42IDE2LjctMzcuNCAzNy40LTM3LjQgMjAuNiAwIDM3LjQgMTYuNyAzNy40IDM3LjRzLTE2LjcgMzcuNC0zNy40IDM3LjQiIGZpbGw9IiNmZmYiLz48L2c+PC9nPjxwYXRoIGNsYXNzPSJzdDIiIGQ9Ik05NS45IDQ2LjZWNDloLTEwdi0yLjVsMTAgLjF6bS0yIDUuM2gtOHYyLjVoOHYtMi41em0tOCA3LjloNnYtMi41aC02djIuNXptNCAyLjloLTR2Mi41aDR2LTIuNXptLTQgNy44aDJWNjhoLTJ2Mi41em0xLjUgMTRjMCA2LjktNS41IDEyLjUtMTIuMyAxMi41cy0xMi4zLTUuNi0xMi4zLTEyLjVjMC00LjUgMi4zLTguNSA2LjEtMTAuN1Y0NS41YzAtMy41IDIuOC02LjMgNi4yLTYuM3M2LjIgMi44IDYuMiA2LjN2MjguM2MzLjggMi4yIDYuMSA2LjMgNi4xIDEwLjd6bS0yLjQgMGMwLTMuOC0yLjEtNy4yLTUuNC04LjlsLS43LS4zVjQ1LjVjMC0yLjEtMS43LTMuOC0zLjgtMy44LTIuMSAwLTMuOCAxLjctMy44IDMuOHYyOS44bC0uNy4zYy0zLjMgMS43LTUuNCA1LjEtNS40IDguOSAwIDUuNSA0LjQgMTAgOS45IDEwUzg1IDkwIDg1IDg0LjV6bS0yLjEgMGMwIDQuNC0zLjUgOC03LjggOHMtNy44LTMuNi03LjgtOGMwLTMuNiAyLjQtNi44IDUuOC03LjdsLjUtLjFWNjEuNWgzLjF2MTUuMmwuNS4xYzMuMyAxIDUuNyA0LjEgNS43IDcuN3ptLTcuNC01LjNjLS4yLS44LTEtMS40LTEuOS0xLjItMyAuNy01IDMuMy01IDYuNCAwIC45LjcgMS42IDEuNiAxLjZzMS42LS43IDEuNi0xLjZjMC0xLjYgMS4xLTMgMi42LTMuMy43LS4yIDEuMy0xIDEuMS0xLjl6Ii8+PC9zdmc+Cg=="
-            ],
-            "useMarkerImageFunction": true,
-            "color": "#fe7569",
-            "mapProvider": "OpenStreetMap.HOT",
-            "showTooltip": true,
-            "autocloseTooltip": true,
-            "defaultCenterPosition": [
-              0,
-              0
-            ],
-            "customProviderTileUrl": "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
-            "showTooltipAction": "click",
-            "polygonKeyName": "coordinates",
-            "polygonOpacity": 0.5,
-            "polygonStrokeOpacity": 1,
-            "polygonStrokeWeight": 1,
-            "zoomOnClick": true,
-            "showCoverageOnHover": true,
-            "animate": true,
-            "maxClusterRadius": 80,
-            "removeOutsideVisibleBounds": true,
-            "defaultZoomLevel": 12,
-            "labelFunction": "var color;\nif(dsData[dsIndex].active !== \"true\"){\n    color = 'rgb(255, 0, 0)';\n} else {\n    color = 'rgb(39, 134, 34)';\n}\nreturn '<span style=\"border: solid ' + color + '; border-radius: 10px; color: ' + color + '; background-color: #fff; padding: 3px 5px; font-size: 14px\">' + \n           '${entityLabel}' + \n        '</span>'",
-            "markerImageFunction": "var res;\nif(dsData[dsIndex].active !== \"true\"){\n\tvar res = {\n\t    url: images[0],\n\t    size: 48\n\t}\n} else {\n    var res = {\n\t    url: images[1],\n\t    size: 48\n\t}\n}\nreturn res;",
-            "useLabelFunction": true
-          },
-          "title": "New Markers Placement - OpenStreetMap",
-          "dropShadow": true,
-          "enableFullscreen": false,
-          "titleStyle": {
-            "fontSize": "16px",
-            "fontWeight": 400
-          },
-          "useDashboardTimewindow": true,
-          "showLegend": false,
-          "widgetStyle": {},
-          "actions": {
-            "tooltipAction": [
-              {
-                "id": "54c293c4-9ca6-e34f-dc6a-0271944c1c66",
-                "name": "delete",
-                "icon": "more_horiz",
-                "type": "custom",
-                "customFunction": "var $rootScope = widgetContext.$scope.$injector.get('$rootScope');\nvar entityDatasource = widgetContext.map.subscription.datasources.filter(\n    function(entity) {\n        return entity.entityId === entityId.id\n    });\n\nwidgetContext.map.saveMarkerLocation(entityDatasource[0],\n    widgetContext.map.locations[0], {\n        \"lat\": null,\n        \"lng\": null\n    }).then(function succes() {\n        $rootScope.$broadcast('widgetForceReInit');\n    });"
-              }
-            ]
-          },
-          "showTitleIcon": false,
-          "titleIcon": null,
-          "iconColor": "rgba(0, 0, 0, 0.87)",
-          "iconSize": "24px",
-          "titleTooltip": "",
-          "displayTimewindow": true
-        },
-        "id": "0a430429-9078-9ae6-2b67-e4a15a2bf8bf"
       }
     },
     "states": {
       "default": {
-        "name": "Thermostat",
+        "name": "Thermostats",
         "root": true,
         "layouts": {
           "main": {
@@ -1075,14 +931,11 @@
               "backgroundColor": "#eeeeee",
               "color": "rgba(0,0,0,0.870588)",
               "columns": 24,
-              "margins": [
-                10,
-                10
-              ],
               "backgroundSizeMode": "100%",
               "autoFillHeight": true,
               "mobileAutoFillHeight": false,
-              "mobileRowHeight": 70
+              "mobileRowHeight": 70,
+              "margin": 10
             }
           }
         }
@@ -1104,14 +957,11 @@
               "backgroundColor": "#eeeeee",
               "color": "rgba(0,0,0,0.870588)",
               "columns": 24,
-              "margins": [
-                10,
-                10
-              ],
               "backgroundSizeMode": "100%",
               "autoFillHeight": true,
               "mobileAutoFillHeight": false,
-              "mobileRowHeight": 70
+              "mobileRowHeight": 70,
+              "margin": 10
             }
           }
         }
@@ -1141,26 +991,17 @@
                 "sizeY": 6,
                 "row": 0,
                 "col": 0
-              },
-              "0a430429-9078-9ae6-2b67-e4a15a2bf8bf": {
-                "sizeX": 6,
-                "sizeY": 6,
-                "row": 6,
-                "col": 0
               }
             },
             "gridSettings": {
               "backgroundColor": "#eeeeee",
               "color": "rgba(0,0,0,0.870588)",
               "columns": 24,
-              "margins": [
-                10,
-                10
-              ],
               "backgroundSizeMode": "100%",
               "autoFillHeight": true,
               "mobileAutoFillHeight": false,
-              "mobileRowHeight": 70
+              "mobileRowHeight": 70,
+              "margin": 10
             }
           }
         }
@@ -1191,10 +1032,12 @@
         "id": "ce27a9d0-93bf-b7a4-054d-d0369a8cf813",
         "alias": "Thermostat-alarm",
         "filter": {
-          "type": "stateEntity",
+          "type": "singleEntity",
           "resolveMultiple": false,
-          "stateEntityParamName": "alarm",
+          "singleEntity": {
-          "defaultStateEntity": null
+            "entityType": "CURRENT_TENANT",
+            "id": null
+          }
         }
       }
     },
@@ -1233,4 +1076,4 @@
     }
   },
   "name": "Thermostats"
-}
+}