Commit 39d23204a8ff8045576e3fe68e69ecabdcf9478e

Authored by Igor Kulikov
2 parents d94907c1 a20808dc

Merge branch 'master' of github.com:thingsboard/thingsboard

@@ -71,10 +71,10 @@ @@ -71,10 +71,10 @@
71 "resources": [], 71 "resources": [],
72 "templateHtml": "", 72 "templateHtml": "",
73 "templateCss": ".legend {\n font-size: 13px;\n line-height: 10px;\n}\n\n.legend table { \n border-spacing: 0px;\n border-collapse: separate;\n}\n\n.pie-label {\n font-size: 12px;\n font-family: 'Roboto';\n font-weight: bold;\n text-align: center;\n padding: 2px;\n color: white;\n}\n", 73 "templateCss": ".legend {\n font-size: 13px;\n line-height: 10px;\n}\n\n.legend table { \n border-spacing: 0px;\n border-collapse: separate;\n}\n\n.pie-label {\n font-size: 12px;\n font-family: 'Roboto';\n font-weight: bold;\n text-align: center;\n padding: 2px;\n color: white;\n}\n",
74 - "controllerScript": "self.onInit = function() {\n self.ctx.flot = new TbFlot(self.ctx, 'pie'); \n}\n\nself.onDataUpdated = function() {\n self.ctx.flot.update();\n}\n\nself.onResize = function() {\n self.ctx.flot.resize();\n}\n\nself.onEditModeChanged = function() {\n self.ctx.flot.checkMouseEvents();\n}\n\nself.onMobileModeChanged = function() {\n self.ctx.flot.checkMouseEvents();\n}\n\nself.getSettingsSchema = function() {\n return TbFlot.pieSettingsSchema;\n}\n\nself.getDataKeySettingsSchema = function() {\n return TbFlot.pieDatakeySettingsSchema;\n}\n\nself.onDestroy = function() {\n self.ctx.flot.destroy();\n}\n", 74 + "controllerScript": "self.onInit = function() {\n self.ctx.flot = new TbFlot(self.ctx, 'pie'); \n}\n\nself.onDataUpdated = function() {\n self.ctx.flot.update();\n}\n\nself.onResize = function() {\n self.ctx.flot.resize();\n}\n\nself.onEditModeChanged = function() {\n self.ctx.flot.checkMouseEvents();\n}\n\nself.onMobileModeChanged = function() {\n self.ctx.flot.checkMouseEvents();\n}\n\nself.getSettingsSchema = function() {\n return TbFlot.pieSettingsSchema;\n}\n\nself.getDataKeySettingsSchema = function() {\n return TbFlot.pieDatakeySettingsSchema;\n}\n\nself.onDestroy = function() {\n self.ctx.flot.destroy();\n}\nself.actionSources = function() {\n return {\n 'sliceClick': {\n name: 'widget-action.pie-slice-click',\n multiple: false\n }\n };\n}\n",
75 "settingsSchema": "{}\n", 75 "settingsSchema": "{}\n",
76 "dataKeySettingsSchema": "{}\n", 76 "dataKeySettingsSchema": "{}\n",
77 - "defaultConfig": "{\"datasources\":[{\"type\":\"function\",\"name\":\"function\",\"dataKeys\":[{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"First\",\"color\":\"#2196f3\",\"settings\":{},\"_hash\":0.15479322438769105,\"funcBody\":\"var value = (prevValue-50) + Math.random() * 2 - 1;\\nif (value < 0) {\\n\\tvalue = 0;\\n} else if (value > 100) {\\n\\tvalue = 100;\\n}\\nreturn value+50;\"},{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Second\",\"color\":\"#4caf50\",\"settings\":{},\"_hash\":0.6114638304362894,\"funcBody\":\"var value = (prevValue-20) + Math.random() * 2 - 1;\\nif (value < 0) {\\n\\tvalue = 0;\\n} else if (value > 100) {\\n\\tvalue = 100;\\n}\\nreturn value+20;\"},{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Third\",\"color\":\"#f44336\",\"settings\":{},\"_hash\":0.9955906536344441,\"funcBody\":\"var value = (prevValue-40) + Math.random() * 2 - 1;\\nif (value < 0) {\\n\\tvalue = 0;\\n} else if (value > 100) {\\n\\tvalue = 100;\\n}\\nreturn value+40;\"},{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Fourth\",\"color\":\"#ffc107\",\"settings\":{},\"_hash\":0.9430835931647599,\"funcBody\":\"var value = (prevValue-50) + Math.random() * 2 - 1;\\nif (value < 0) {\\n\\tvalue = 0;\\n} else if (value > 100) {\\n\\tvalue = 100;\\n}\\nreturn value+50;\"}]}],\"timewindow\":{\"realtime\":{\"timewindowMs\":60000}},\"showTitle\":true,\"backgroundColor\":\"#fff\",\"color\":\"rgba(0, 0, 0, 0.87)\",\"padding\":\"8px\",\"settings\":{\"radius\":1,\"fontColor\":\"#545454\",\"fontSize\":10,\"decimals\":1,\"legend\":{\"show\":true,\"position\":\"nw\",\"labelBoxBorderColor\":\"#CCCCCC\",\"backgroundColor\":\"#F0F0F0\",\"backgroundOpacity\":0.85},\"innerRadius\":0,\"showLabels\":true,\"stroke\":{\"width\":5},\"tilt\":1,\"animatedPie\":false},\"title\":\"Pie - Flot\",\"dropShadow\":true,\"enableFullscreen\":true,\"titleStyle\":{\"fontSize\":\"16px\",\"fontWeight\":400}}" 77 + "defaultConfig": "{\"datasources\":[{\"type\":\"function\",\"name\":\"function\",\"dataKeys\":[{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"First\",\"color\":\"#2196f3\",\"settings\":{},\"_hash\":0.15479322438769105,\"funcBody\":\"var value = (prevValue-50) + Math.random() * 2 - 1;\\nif (value < 0) {\\n\\tvalue = 0;\\n} else if (value > 100) {\\n\\tvalue = 100;\\n}\\nreturn value+50;\"},{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Second\",\"color\":\"#4caf50\",\"settings\":{},\"_hash\":0.6114638304362894,\"funcBody\":\"var value = (prevValue-20) + Math.random() * 2 - 1;\\nif (value < 0) {\\n\\tvalue = 0;\\n} else if (value > 100) {\\n\\tvalue = 100;\\n}\\nreturn value+20;\"},{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Third\",\"color\":\"#f44336\",\"settings\":{},\"_hash\":0.9955906536344441,\"funcBody\":\"var value = (prevValue-40) + Math.random() * 2 - 1;\\nif (value < 0) {\\n\\tvalue = 0;\\n} else if (value > 100) {\\n\\tvalue = 100;\\n}\\nreturn value+40;\"},{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Fourth\",\"color\":\"#ffc107\",\"settings\":{},\"_hash\":0.9430835931647599,\"funcBody\":\"var value = (prevValue-50) + Math.random() * 2 - 1;\\nif (value < 0) {\\n\\tvalue = 0;\\n} else if (value > 100) {\\n\\tvalue = 100;\\n}\\nreturn value+50;\"}]}],\"timewindow\":{\"realtime\":{\"timewindowMs\":60000}},\"showTitle\":true,\"backgroundColor\":\"#fff\",\"color\":\"rgba(0, 0, 0, 0.87)\",\"padding\":\"8px\",\"settings\":{\"radius\":1,\"fontColor\":\"#545454\",\"fontSize\":10,\"decimals\":1,\"legend\":{\"show\":true,\"position\":\"nw\",\"labelBoxBorderColor\":\"#CCCCCC\",\"backgroundColor\":\"#F0F0F0\",\"backgroundOpacity\":0.85},\"innerRadius\":0,\"showLabels\":true,\"showPercentages\":true,\"stroke\":{\"width\":5},\"tilt\":1,\"animatedPie\":false},\"title\":\"Pie - Flot\",\"dropShadow\":true,\"enableFullscreen\":true,\"titleStyle\":{\"fontSize\":\"16px\",\"fontWeight\":400}}"
78 } 78 }
79 }, 79 },
80 { 80 {
@@ -170,4 +170,4 @@ @@ -170,4 +170,4 @@
170 } 170 }
171 } 171 }
172 ] 172 ]
173 -}  
  173 +}
@@ -292,6 +292,7 @@ export default class Subscription { @@ -292,6 +292,7 @@ export default class Subscription {
292 deferred.resolve(); 292 deferred.resolve();
293 }, 293 },
294 function fail() { 294 function fail() {
  295 + subscription.notifyDataLoaded();
295 deferred.reject(); 296 deferred.reject();
296 } 297 }
297 ); 298 );
@@ -132,7 +132,8 @@ export default function WidgetController($scope, $state, $timeout, $window, $ocL @@ -132,7 +132,8 @@ export default function WidgetController($scope, $state, $timeout, $window, $ocL
132 actionDescriptorsBySourceId: actionDescriptorsBySourceId, 132 actionDescriptorsBySourceId: actionDescriptorsBySourceId,
133 getActionDescriptors: getActionDescriptors, 133 getActionDescriptors: getActionDescriptors,
134 handleWidgetAction: handleWidgetAction, 134 handleWidgetAction: handleWidgetAction,
135 - elementClick: elementClick 135 + elementClick: elementClick,
  136 + getActiveEntityInfo: getActiveEntityInfo
136 }, 137 },
137 stateController: stateController, 138 stateController: stateController,
138 aliasController: aliasController 139 aliasController: aliasController
@@ -1700,7 +1700,8 @@ @@ -1700,7 +1700,8 @@
1700 "marker-click": "On marker click", 1700 "marker-click": "On marker click",
1701 "tooltip-tag-action": "Tooltip tag action", 1701 "tooltip-tag-action": "Tooltip tag action",
1702 "node-selected": "On node selected", 1702 "node-selected": "On node selected",
1703 - "element-click": "On HTML element click" 1703 + "element-click": "On HTML element click",
  1704 + "pie-slice-click": "On slice click"
1704 } 1705 }
1705 }, 1706 },
1706 "language": { 1707 "language": {
@@ -1699,7 +1699,8 @@ @@ -1699,7 +1699,8 @@
1699 "marker-click": "Clic en el polígono", 1699 "marker-click": "Clic en el polígono",
1700 "tooltip-tag-action": "Acción de etiqueta para globo de ayuda", 1700 "tooltip-tag-action": "Acción de etiqueta para globo de ayuda",
1701 "node-selected": "Clic en el nodo seleccionado", 1701 "node-selected": "Clic en el nodo seleccionado",
1702 - "element-click": "Clic en el elemento HTML" 1702 + "element-click": "Clic en el elemento HTML",
  1703 + "pie-slice-click": "Clic en la rebanada"
1703 } 1704 }
1704 }, 1705 },
1705 "language": { 1706 "language": {
@@ -340,7 +340,8 @@ @@ -340,7 +340,8 @@
340 "polygon-click": "On polygon click", 340 "polygon-click": "On polygon click",
341 "tooltip-tag-action": "Tooltip tag action", 341 "tooltip-tag-action": "Tooltip tag action",
342 "node-selected": "On node selected", 342 "node-selected": "On node selected",
343 - "element-click": "On HTML element click" 343 + "element-click": "On HTML element click",
  344 + "pie-slice-click": "On slice click"
344 } 345 }
345 }, 346 },
346 "customer": { 347 "customer": {
@@ -1639,7 +1639,8 @@ @@ -1639,7 +1639,8 @@
1639 "marker-click": "Click sul marker", 1639 "marker-click": "Click sul marker",
1640 "tooltip-tag-action": "Azione tooltip", 1640 "tooltip-tag-action": "Azione tooltip",
1641 "node-selected": "Click su nodo selezionato", 1641 "node-selected": "Click su nodo selezionato",
1642 - "element-click": "Click su elemento HTML" 1642 + "element-click": "Click su elemento HTML",
  1643 + "pie-slice-click": "Click sulla fetta"
1643 } 1644 }
1644 }, 1645 },
1645 "language": { 1646 "language": {
@@ -350,7 +350,7 @@ export default class TbFlot { @@ -350,7 +350,7 @@ export default class TbFlot {
350 pie: { 350 pie: {
351 show: true, 351 show: true,
352 label: { 352 label: {
353 - show: settings.showLabels === true 353 + show: settings.showLabels || settings.showPercentages
354 }, 354 },
355 radius: settings.radius || 1, 355 radius: settings.radius || 1,
356 innerRadius: settings.innerRadius || 0, 356 innerRadius: settings.innerRadius || 0,
@@ -366,6 +366,8 @@ export default class TbFlot { @@ -366,6 +366,8 @@ export default class TbFlot {
366 } 366 }
367 } 367 }
368 } 368 }
  369 + options.grid.clickable = true;
  370 +
369 if (settings.stroke) { 371 if (settings.stroke) {
370 options.series.pie.stroke.color = settings.stroke.color || '#fff'; 372 options.series.pie.stroke.color = settings.stroke.color || '#fff';
371 options.series.pie.stroke.width = settings.stroke.width || 0; 373 options.series.pie.stroke.width = settings.stroke.width || 0;
@@ -373,7 +375,11 @@ export default class TbFlot { @@ -373,7 +375,11 @@ export default class TbFlot {
373 375
374 if (options.series.pie.label.show) { 376 if (options.series.pie.label.show) {
375 options.series.pie.label.formatter = function (label, series) { 377 options.series.pie.label.formatter = function (label, series) {
376 - return "<div class='pie-label'>" + series.dataKey.label + "<br/>" + Math.round(series.percent) + "%</div>"; 378 + return "<div class='pie-label'>" +
  379 + (settings.showLabels ? series.dataKey.label : "") +
  380 + (settings.showLabels && settings.showPercentages ? "<br/>" : "") +
  381 + (settings.showPercentages ? Math.round(series.percent) + "%" : "") +
  382 + "</div>";
377 } 383 }
378 options.series.pie.label.radius = 3/4; 384 options.series.pie.label.radius = 3/4;
379 options.series.pie.label.background = { 385 options.series.pie.label.background = {
@@ -791,6 +797,11 @@ export default class TbFlot { @@ -791,6 +797,11 @@ export default class TbFlot {
791 "type": "boolean", 797 "type": "boolean",
792 "default": false 798 "default": false
793 }, 799 },
  800 + "showPercentages": {
  801 + "title": "Show percentages",
  802 + "type": "boolean",
  803 + "default": false
  804 + },
794 "fontColor": { 805 "fontColor": {
795 "title": "Font color", 806 "title": "Font color",
796 "type": "string", 807 "type": "string",
@@ -820,6 +831,7 @@ export default class TbFlot { @@ -820,6 +831,7 @@ export default class TbFlot {
820 ] 831 ]
821 }, 832 },
822 "showLabels", 833 "showLabels",
  834 + "showPercentages",
823 { 835 {
824 "key": "fontColor", 836 "key": "fontColor",
825 "type": "color" 837 "type": "color"
@@ -1296,6 +1308,17 @@ export default class TbFlot { @@ -1296,6 +1308,17 @@ export default class TbFlot {
1296 }; 1308 };
1297 this.$element.bind('mouseleave', this.mouseleaveHandler); 1309 this.$element.bind('mouseleave', this.mouseleaveHandler);
1298 } 1310 }
  1311 +
  1312 + if (!this.flotClickHandler) {
  1313 + this.flotClickHandler = function (event, pos, item) {
  1314 + if (!tbFlot.ctx.plot) {
  1315 + return;
  1316 + }
  1317 + tbFlot.onPieSliceClick(event, item);
  1318 + };
  1319 + this.$element.bind('plotclick', this.flotClickHandler);
  1320 + }
  1321 +
1299 } 1322 }
1300 1323
1301 disableMouseEvents() { 1324 disableMouseEvents() {
@@ -1328,6 +1351,10 @@ export default class TbFlot { @@ -1328,6 +1351,10 @@ export default class TbFlot {
1328 this.$element.unbind('mouseleave', this.mouseleaveHandler); 1351 this.$element.unbind('mouseleave', this.mouseleaveHandler);
1329 this.mouseleaveHandler = null; 1352 this.mouseleaveHandler = null;
1330 } 1353 }
  1354 + if (this.flotClickHandler) {
  1355 + this.$element.unbind('plotclick', this.flotClickHandler);
  1356 + this.flotClickHandler = null;
  1357 + }
1331 } 1358 }
1332 1359
1333 1360
@@ -1478,6 +1505,17 @@ export default class TbFlot { @@ -1478,6 +1505,17 @@ export default class TbFlot {
1478 this.ctx.plot.setData(this.pieData); 1505 this.ctx.plot.setData(this.pieData);
1479 this.ctx.plot.draw(); 1506 this.ctx.plot.draw();
1480 } 1507 }
  1508 +
  1509 + onPieSliceClick($event, item) {
  1510 + var descriptors = this.ctx.actionsApi.getActionDescriptors('sliceClick');
  1511 + if ($event && descriptors.length) {
  1512 + $event.stopPropagation();
  1513 + var entityInfo = this.ctx.actionsApi.getActiveEntityInfo();
  1514 + var entityId = entityInfo ? entityInfo.entityId : null;
  1515 + var entityName = entityInfo ? entityInfo.entityName : null;
  1516 + this.ctx.actionsApi.handleWidgetAction($event, descriptors[0], entityId, entityName, item);
  1517 + }
  1518 + }
1481 } 1519 }
1482 1520
1483 /* eslint-enable angular/angularelement */ 1521 /* eslint-enable angular/angularelement */