triggers panel: fix options tab

dist/panel-triggers/options_tab.js

@@ -3,7 +3,7 @@
 System.register(['lodash', './datasource-selector.directive', '../datasource-zabbix/css/query-editor.css!'], function (_export, _context) {
   "use strict";
 
-  var _, _createClass, TriggerPanelOptionsCtrl;
+  var _, TriggerPanelOptionsCtrl;
 
   function _classCallCheck(instance, Constructor) {
     if (!(instance instanceof Constructor)) {
@@ -27,59 +27,21 @@ System.register(['lodash', './datasource-selector.directive', '../datasource-zab
       _ = _lodash.default;
     }, function (_datasourceSelectorDirective) {}, function (_datasourceZabbixCssQueryEditorCss) {}],
     execute: function () {
-      _createClass = function () {
+      TriggerPanelOptionsCtrl =
-        function defineProperties(target, props) {
-          for (var i = 0; i < props.length; i++) {
-            var descriptor = props[i];
-            descriptor.enumerable = descriptor.enumerable || false;
-            descriptor.configurable = true;
-            if ("value" in descriptor) descriptor.writable = true;
-            Object.defineProperty(target, descriptor.key, descriptor);
-          }
-        }
 
-        return function (Constructor, protoProps, staticProps) {
+      /** @ngInject */
-          if (protoProps) defineProperties(Constructor.prototype, protoProps);
+      function TriggerPanelOptionsCtrl($scope) {
-          if (staticProps) defineProperties(Constructor, staticProps);
+        _classCallCheck(this, TriggerPanelOptionsCtrl);
-          return Constructor;
-        };
-      }();
 
-      TriggerPanelOptionsCtrl = function () {
+        $scope.editor = this;
+        this.panelCtrl = $scope.ctrl;
+        this.panel = this.panelCtrl.panel;
 
-        /** @ngInject */
+        this.fontSizes = ['80%', '90%', '100%', '110%', '120%', '130%', '150%', '160%', '180%', '200%', '220%', '250%'];
-        function TriggerPanelOptionsCtrl($scope) {
+        this.ackFilters = ['all triggers', 'unacknowledged', 'acknowledged'];
-          _classCallCheck(this, TriggerPanelOptionsCtrl);
+        this.sortByFields = [{ text: 'last change', value: 'lastchange' }, { text: 'severity', value: 'priority' }];
-
+        this.showEventsFields = [{ text: 'All', value: [0, 1] }, { text: 'OK', value: [0] }, { text: 'Problems', value: 1 }];
-          $scope.editor = this;
+      };
-          this.panelCtrl = $scope.ctrl;
-          this.panel = this.panelCtrl.panel;
-
-          this.fontSizes = ['80%', '90%', '100%', '110%', '120%', '130%', '150%', '160%', '180%', '200%', '220%', '250%'];
-          this.ackFilters = ['all triggers', 'unacknowledged', 'acknowledged'];
-          this.sortByFields = [{ text: 'last change', value: 'lastchange' }, { text: 'severity', value: 'priority' }];
-          this.showEventsFields = [{ text: 'All', value: [0, 1] }, { text: 'OK', value: [0] }, { text: 'Problems', value: 1 }];
-        }
-
-        _createClass(TriggerPanelOptionsCtrl, [{
-          key: 'refreshTriggerSeverity',
-          value: function refreshTriggerSeverity() {
-            _.each(this.triggerList, function (trigger) {
-              trigger.color = this.panel.triggerSeverity[trigger.priority].color;
-              trigger.severity = this.panel.triggerSeverity[trigger.priority].severity;
-            });
-            this.panelCtrl.refresh();
-          }
-        }, {
-          key: 'changeTriggerSeverityColor',
-          value: function changeTriggerSeverityColor(trigger, color) {
-            this.panel.triggerSeverity[trigger.priority].color = color;
-            this.refreshTriggerSeverity();
-          }
-        }]);
-
-        return TriggerPanelOptionsCtrl;
-      }();
     }
   };
 });

dist/panel-triggers/options_tab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/panel-triggers/options_tab.js"],"names":["triggerPanelOptionsTab","restrict","scope","templateUrl","controller","TriggerPanelOptionsCtrl","_","$scope","editor","panelCtrl","ctrl","panel","fontSizes","ackFilters","sortByFields","text","value","showEventsFields","each","triggerList","trigger","color","triggerSeverity","priority","severity","refresh","refreshTriggerSeverity"],"mappings":";;;;;;;;;;;;;AAyDO,WAASA,sBAAT,GAAkC;AACvC,WAAO;AACLC,gBAAU,GADL;AAELC,aAAO,IAFF;AAGLC,mBAAa,oFAHR;AAILC,kBAAYC;AAJP,KAAP;AAMD;;oCAPeL,sB;;;;AA5CTM,O;;;;;;;;;;;;;;;;;;;;;AAKDD,6B;;AAEJ;AACA,yCAAYE,MAAZ,EAAoB;AAAA;;AAClBA,iBAAOC,MAAP,GAAgB,IAAhB;AACA,eAAKC,SAAL,GAAiBF,OAAOG,IAAxB;AACA,eAAKC,KAAL,GAAa,KAAKF,SAAL,CAAeE,KAA5B;;AAEA,eAAKC,SAAL,GAAiB,CAAC,KAAD,EAAQ,KAAR,EAAe,MAAf,EAAuB,MAAvB,EAA+B,MAA/B,EAAuC,MAAvC,EAA+C,MAA/C,EAAuD,MAAvD,EAA+D,MAA/D,EAAuE,MAAvE,EAA+E,MAA/E,EAAuF,MAAvF,CAAjB;AACA,eAAKC,UAAL,GAAkB,CAChB,cADgB,EAEhB,gBAFgB,EAGhB,cAHgB,CAAlB;AAKA,eAAKC,YAAL,GAAoB,CAClB,EAAEC,MAAM,aAAR,EAAwBC,OAAO,YAA/B,EADkB,EAElB,EAAED,MAAM,UAAR,EAAwBC,OAAO,UAA/B,EAFkB,CAApB;AAIA,eAAKC,gBAAL,GAAwB,CACtB,EAAEF,MAAM,KAAR,EAAmBC,OAAO,CAAC,CAAD,EAAG,CAAH,CAA1B,EADsB,EAEtB,EAAED,MAAM,IAAR,EAAmBC,OAAO,CAAC,CAAD,CAA1B,EAFsB,EAGtB,EAAED,MAAM,UAAR,EAAoBC,OAAO,CAA3B,EAHsB,CAAxB;AAKD;;;;mDAEwB;AACvBV,cAAEY,IAAF,CAAO,KAAKC,WAAZ,EAAyB,UAASC,OAAT,EAAkB;AACzCA,sBAAQC,KAAR,GAAgB,KAAKV,KAAL,CAAWW,eAAX,CAA2BF,QAAQG,QAAnC,EAA6CF,KAA7D;AACAD,sBAAQI,QAAR,GAAmB,KAAKb,KAAL,CAAWW,eAAX,CAA2BF,QAAQG,QAAnC,EAA6CC,QAAhE;AACD,aAHD;AAIA,iBAAKf,SAAL,CAAegB,OAAf;AACD;;;qDAE0BL,O,EAASC,K,EAAO;AACzC,iBAAKV,KAAL,CAAWW,eAAX,CAA2BF,QAAQG,QAAnC,EAA6CF,KAA7C,GAAqDA,KAArD;AACA,iBAAKK,sBAAL;AACD","file":"options_tab.js","sourcesContent":["/**\n * Grafana-Zabbix\n * Zabbix plugin for Grafana.\n * http://github.com/alexanderzobnin/grafana-zabbix\n *\n * Trigger panel.\n * This feature sponsored by CORE IT\n * http://www.coreit.fr\n *\n * Copyright 2015 Alexander Zobnin alexanderzobnin@gmail.com\n * Licensed under the Apache License, Version 2.0\n */\n\nimport _ from 'lodash';\nimport './datasource-selector.directive';\n\nimport '../datasource-zabbix/css/query-editor.css!';\n\nclass TriggerPanelOptionsCtrl {\n\n  /** @ngInject */\n  constructor($scope) {\n    $scope.editor = this;\n    this.panelCtrl = $scope.ctrl;\n    this.panel = this.panelCtrl.panel;\n\n    this.fontSizes = ['80%', '90%', '100%', '110%', '120%', '130%', '150%', '160%', '180%', '200%', '220%', '250%'];\n    this.ackFilters = [\n      'all triggers',\n      'unacknowledged',\n      'acknowledged'\n    ];\n    this.sortByFields = [\n      { text: 'last change',  value: 'lastchange' },\n      { text: 'severity',     value: 'priority' }\n    ];\n    this.showEventsFields = [\n      { text: 'All',     value: [0,1] },\n      { text: 'OK',      value: [0] },\n      { text: 'Problems', value: 1 }\n    ];\n  }\n\n  refreshTriggerSeverity() {\n    _.each(this.triggerList, function(trigger) {\n      trigger.color = this.panel.triggerSeverity[trigger.priority].color;\n      trigger.severity = this.panel.triggerSeverity[trigger.priority].severity;\n    });\n    this.panelCtrl.refresh();\n  }\n\n  changeTriggerSeverityColor(trigger, color) {\n    this.panel.triggerSeverity[trigger.priority].color = color;\n    this.refreshTriggerSeverity();\n  }\n}\n\nexport function triggerPanelOptionsTab() {\n  return {\n    restrict: 'E',\n    scope: true,\n    templateUrl: 'public/plugins/alexanderzobnin-zabbix-app/panel-triggers/partials/options_tab.html',\n    controller: TriggerPanelOptionsCtrl,\n  };\n}\n"]}
+{"version":3,"sources":["../../src/panel-triggers/options_tab.js"],"names":["triggerPanelOptionsTab","restrict","scope","templateUrl","controller","TriggerPanelOptionsCtrl","_","$scope","editor","panelCtrl","ctrl","panel","fontSizes","ackFilters","sortByFields","text","value","showEventsFields"],"mappings":";;;;;;;;;;;;;AA4CO,WAASA,sBAAT,GAAkC;AACvC,WAAO;AACLC,gBAAU,GADL;AAELC,aAAO,IAFF;AAGLC,mBAAa,oFAHR;AAILC,kBAAYC;AAJP,KAAP;AAMD;;oCAPeL,sB;;;;AA/BTM,O;;;AAKDD,6B;;AAEJ;AACA,uCAAYE,MAAZ,EAAoB;AAAA;;AAClBA,eAAOC,MAAP,GAAgB,IAAhB;AACA,aAAKC,SAAL,GAAiBF,OAAOG,IAAxB;AACA,aAAKC,KAAL,GAAa,KAAKF,SAAL,CAAeE,KAA5B;;AAEA,aAAKC,SAAL,GAAiB,CAAC,KAAD,EAAQ,KAAR,EAAe,MAAf,EAAuB,MAAvB,EAA+B,MAA/B,EAAuC,MAAvC,EAA+C,MAA/C,EAAuD,MAAvD,EAA+D,MAA/D,EAAuE,MAAvE,EAA+E,MAA/E,EAAuF,MAAvF,CAAjB;AACA,aAAKC,UAAL,GAAkB,CAChB,cADgB,EAEhB,gBAFgB,EAGhB,cAHgB,CAAlB;AAKA,aAAKC,YAAL,GAAoB,CAClB,EAAEC,MAAM,aAAR,EAAwBC,OAAO,YAA/B,EADkB,EAElB,EAAED,MAAM,UAAR,EAAwBC,OAAO,UAA/B,EAFkB,CAApB;AAIA,aAAKC,gBAAL,GAAwB,CACtB,EAAEF,MAAM,KAAR,EAAmBC,OAAO,CAAC,CAAD,EAAG,CAAH,CAA1B,EADsB,EAEtB,EAAED,MAAM,IAAR,EAAmBC,OAAO,CAAC,CAAD,CAA1B,EAFsB,EAGtB,EAAED,MAAM,UAAR,EAAoBC,OAAO,CAA3B,EAHsB,CAAxB;AAKD,O","file":"options_tab.js","sourcesContent":["/**\n * Grafana-Zabbix\n * Zabbix plugin for Grafana.\n * http://github.com/alexanderzobnin/grafana-zabbix\n *\n * Trigger panel.\n * This feature sponsored by CORE IT\n * http://www.coreit.fr\n *\n * Copyright 2015 Alexander Zobnin alexanderzobnin@gmail.com\n * Licensed under the Apache License, Version 2.0\n */\n\nimport _ from 'lodash';\nimport './datasource-selector.directive';\n\nimport '../datasource-zabbix/css/query-editor.css!';\n\nclass TriggerPanelOptionsCtrl {\n\n  /** @ngInject */\n  constructor($scope) {\n    $scope.editor = this;\n    this.panelCtrl = $scope.ctrl;\n    this.panel = this.panelCtrl.panel;\n\n    this.fontSizes = ['80%', '90%', '100%', '110%', '120%', '130%', '150%', '160%', '180%', '200%', '220%', '250%'];\n    this.ackFilters = [\n      'all triggers',\n      'unacknowledged',\n      'acknowledged'\n    ];\n    this.sortByFields = [\n      { text: 'last change',  value: 'lastchange' },\n      { text: 'severity',     value: 'priority' }\n    ];\n    this.showEventsFields = [\n      { text: 'All',     value: [0,1] },\n      { text: 'OK',      value: [0] },\n      { text: 'Problems', value: 1 }\n    ];\n  }\n}\n\nexport function triggerPanelOptionsTab() {\n  return {\n    restrict: 'E',\n    scope: true,\n    templateUrl: 'public/plugins/alexanderzobnin-zabbix-app/panel-triggers/partials/options_tab.html',\n    controller: TriggerPanelOptionsCtrl,\n  };\n}\n"]}

dist/panel-triggers/partials/options_tab.html

@@ -4,31 +4,31 @@
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Host name"
-      checked="editor.panel.hostField"
+      checked="ctrl.panel.hostField"
       on-change="ctrl.render()">
     </gf-form-switch>
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Technical name"
-      checked="editor.panel.hostTechNameField"
+      checked="ctrl.panel.hostTechNameField"
       on-change="ctrl.render()">
     </gf-form-switch>
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Status"
-      checked="editor.panel.statusField"
+      checked="ctrl.panel.statusField"
       on-change="ctrl.render()">
     </gf-form-switch>
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Severity"
-      checked="editor.panel.severityField"
+      checked="ctrl.panel.severityField"
       on-change="ctrl.render()">
     </gf-form-switch>
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Description"
-      checked="editor.panel.descriptionField"
+      checked="ctrl.panel.descriptionField"
       on-change="ctrl.render()">
     </gf-form-switch>
   </div>
@@ -38,14 +38,14 @@
     <gf-form-switch class="gf-form"
       label-class="width-15"
       label="Hide hosts in maintenance"
-      checked="editor.panel.hideHostsInMaintenance"
+      checked="ctrl.panel.hideHostsInMaintenance"
       on-change="ctrl.refresh()">
     </gf-form-switch>
     <div class="gf-form">
       <label class="gf-form-label width-8">Acknowledged</label>
       <div class="gf-form-select-wrapper width-12">
         <select class="gf-form-input"
-          ng-model="editor.panel.showTriggers"
+          ng-model="ctrl.panel.showTriggers"
           ng-options="f for f in editor.ackFilters"
           ng-change="ctrl.refresh()">
         </select>
@@ -55,7 +55,7 @@
       <label class="gf-form-label width-8">Sort by</label>
       <div class="gf-form-select-wrapper width-12">
         <select class="gf-form-input"
-          ng-model="editor.panel.sortTriggersBy"
+          ng-model="ctrl.panel.sortTriggersBy"
           ng-options="f.text for f in editor.sortByFields track by f.value"
           ng-change="ctrl.render()">
         </select>
@@ -65,7 +65,7 @@
       <label class="gf-form-label width-8">Show events</label>
       <div class="gf-form-select-wrapper width-12">
         <select class="gf-form-input"
-          ng-model="editor.panel.showEvents"
+          ng-model="ctrl.panel.showEvents"
           ng-options="f.text for f in editor.showEventsFields track by f.value"
           ng-change="ctrl.refresh()">
         </select>
@@ -75,7 +75,7 @@
       <label class="gf-form-label width-8">Limit triggers</label>
       <input class="gf-form-input width-5"
         type="number"
-        ng-model="editor.panel.limit"
+        ng-model="ctrl.panel.limit"
         ng-model-onblur
         ng-change="ctrl.refresh()">
     </div>
@@ -87,7 +87,7 @@
       <label class="gf-form-label width-10">Font size</label>
       <div class="gf-form-select-wrapper max-width-8">
         <select class="gf-form-input"
-            ng-model="editor.panel.fontSize"
+            ng-model="ctrl.panel.fontSize"
             ng-options="f for f in editor.fontSizes"
             ng-change="ctrl.render()"></select>
       </div>
@@ -96,7 +96,7 @@
       <label class="gf-form-label width-10">Page size</label>
       <input class="gf-form-input width-8"
         type="number"
-        ng-model="editor.panel.pageSize"
+        ng-model="ctrl.panel.pageSize"
         ng-model-onblur
         ng-change="ctrl.render()">
     </div>
@@ -109,17 +109,17 @@
     <div class="gf-form">
       <label class="gf-form-label width-10">Newer than</label>
       <input class="gf-form-input width-8"
-        ng-model="editor.panel.highlightNewerThan"
+        ng-model="ctrl.panel.highlightNewerThan"
         ng-model-onblur
         ng-change="ctrl.render()">
     </div>
     <gf-form-switch class="gf-form"
       label-class="width-16"
       label="Custom Last change format"
-      checked="editor.panel.customLastChangeFormat"
+      checked="ctrl.panel.customLastChangeFormat"
       on-change="ctrl.render()">
     </gf-form-switch>
-    <div class="gf-form" ng-if="editor.panel.customLastChangeFormat">
+    <div class="gf-form" ng-if="ctrl.panel.customLastChangeFormat">
       <label class="gf-form-label width-3">
         <a href="http://momentjs.com/docs/#/displaying/format/" target="_blank">
           <tip>See moment.js dosc for time format.</tip>
@@ -130,19 +130,19 @@
         placeholder="dddd, MMMM Do YYYY, h:mm:ss a"
         empty-to-null
         ng-model-onblur
-        ng-model="editor.panel.lastChangeFormat"
+        ng-model="ctrl.panel.lastChangeFormat"
         ng-change="ctrl.render()">
     </div>
   </div>
 
   <div class="section gf-form-group">
     <h5 class="section-heading">Triggers severity and colors</h5>
-    <div class="gf-form-inline" ng-repeat="trigger in editor.panel.triggerSeverity">
+    <div class="gf-form-inline" ng-repeat="trigger in ctrl.panel.triggerSeverity">
       <div class="gf-form">
         <label class="gf-form-label width-3">{{ trigger.priority }}</label>
         <label class="gf-form-label triggers-severity-config"
           ng-style="{color: trigger.color}">
-          <i class="icon-gf" ng-class="ctrl.getAlertStateIcon(trigger)"></i>
+          <i class="icon-gf" ng-class="ctrl.getAlertIconClass(trigger)"></i>
         </label>
         <input type="text"
           class="gf-form-input width-12"
@@ -160,32 +160,26 @@
         checked="trigger.show"
         on-change="ctrl.refresh()">
       </gf-form-switch>
-      <gf-form-switch class="gf-form"
-        label-class="width-0"
-        label="Blink"
-        checked="trigger.blink"
-        on-change="ctrl.refresh()">
-      </gf-form-switch>
     </div>
 
     <div class="gf-form-inline">
       <div class="gf-form">
         <label class="gf-form-label width-3">&nbsp;</label>
         <label class="gf-form-label triggers-severity-config"
-          ng-style="{color: editor.panel.ackEventColor}">
+          ng-style="{color: ctrl.panel.ackEventColor}">
           <i class="icon-gf icon-gf-online"></i>
         </label>
         <label class="gf-form-label width-12">
           Acknowledged color
         </label>
         <span class="gf-form-label">
-          <spectrum-picker ng-model="editor.panel.ackEventColor" ng-change="ctrl.render()"></spectrum-picker>
+          <spectrum-picker ng-model="ctrl.panel.ackEventColor" ng-change="ctrl.render()"></spectrum-picker>
         </span>
       </div>
       <gf-form-switch class="gf-form"
         label-class="width-0"
         label="Show"
-        checked="editor.panel.markAckEvents"
+        checked="ctrl.panel.markAckEvents"
         on-change="ctrl.refresh()">
       </gf-form-switch>
     </div>
@@ -193,14 +187,14 @@
       <div class="gf-form">
         <label class="gf-form-label width-3">&nbsp;</label>
         <label class="gf-form-label triggers-severity-config"
-          ng-style="{color: editor.panel.okEventColor}">
+          ng-style="{color: ctrl.panel.okEventColor}">
           <i class="icon-gf icon-gf-online"></i>
         </label>
         <label class="gf-form-label width-12">
           OK event color
         </label>
         <span class="gf-form-label">
-          <spectrum-picker ng-model="editor.panel.okEventColor" ng-change="ctrl.render()"></spectrum-picker>
+          <spectrum-picker ng-model="ctrl.panel.okEventColor" ng-change="ctrl.render()"></spectrum-picker>
         </span>
       </div>
     </div>

src/panel-triggers/options_tab.js

@@ -40,19 +40,6 @@ class TriggerPanelOptionsCtrl {
       { text: 'Problems', value: 1 }
     ];
   }
-
-  refreshTriggerSeverity() {
-    _.each(this.triggerList, function(trigger) {
-      trigger.color = this.panel.triggerSeverity[trigger.priority].color;
-      trigger.severity = this.panel.triggerSeverity[trigger.priority].severity;
-    });
-    this.panelCtrl.refresh();
-  }
-
-  changeTriggerSeverityColor(trigger, color) {
-    this.panel.triggerSeverity[trigger.priority].color = color;
-    this.refreshTriggerSeverity();
-  }
 }
 
 export function triggerPanelOptionsTab() {

src/panel-triggers/partials/options_tab.html

@@ -4,31 +4,31 @@
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Host name"
-      checked="editor.panel.hostField"
+      checked="ctrl.panel.hostField"
       on-change="ctrl.render()">
     </gf-form-switch>
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Technical name"
-      checked="editor.panel.hostTechNameField"
+      checked="ctrl.panel.hostTechNameField"
       on-change="ctrl.render()">
     </gf-form-switch>
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Status"
-      checked="editor.panel.statusField"
+      checked="ctrl.panel.statusField"
       on-change="ctrl.render()">
     </gf-form-switch>
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Severity"
-      checked="editor.panel.severityField"
+      checked="ctrl.panel.severityField"
       on-change="ctrl.render()">
     </gf-form-switch>
     <gf-form-switch class="gf-form"
       label-class="width-9"
       label="Description"
-      checked="editor.panel.descriptionField"
+      checked="ctrl.panel.descriptionField"
       on-change="ctrl.render()">
     </gf-form-switch>
   </div>
@@ -38,14 +38,14 @@
     <gf-form-switch class="gf-form"
       label-class="width-15"
       label="Hide hosts in maintenance"
-      checked="editor.panel.hideHostsInMaintenance"
+      checked="ctrl.panel.hideHostsInMaintenance"
       on-change="ctrl.refresh()">
     </gf-form-switch>
     <div class="gf-form">
       <label class="gf-form-label width-8">Acknowledged</label>
       <div class="gf-form-select-wrapper width-12">
         <select class="gf-form-input"
-          ng-model="editor.panel.showTriggers"
+          ng-model="ctrl.panel.showTriggers"
           ng-options="f for f in editor.ackFilters"
           ng-change="ctrl.refresh()">
         </select>
@@ -55,7 +55,7 @@
       <label class="gf-form-label width-8">Sort by</label>
       <div class="gf-form-select-wrapper width-12">
         <select class="gf-form-input"
-          ng-model="editor.panel.sortTriggersBy"
+          ng-model="ctrl.panel.sortTriggersBy"
           ng-options="f.text for f in editor.sortByFields track by f.value"
           ng-change="ctrl.render()">
         </select>
@@ -65,7 +65,7 @@
       <label class="gf-form-label width-8">Show events</label>
       <div class="gf-form-select-wrapper width-12">
         <select class="gf-form-input"
-          ng-model="editor.panel.showEvents"
+          ng-model="ctrl.panel.showEvents"
           ng-options="f.text for f in editor.showEventsFields track by f.value"
           ng-change="ctrl.refresh()">
         </select>
@@ -75,7 +75,7 @@
       <label class="gf-form-label width-8">Limit triggers</label>
       <input class="gf-form-input width-5"
         type="number"
-        ng-model="editor.panel.limit"
+        ng-model="ctrl.panel.limit"
         ng-model-onblur
         ng-change="ctrl.refresh()">
     </div>
@@ -87,7 +87,7 @@
       <label class="gf-form-label width-10">Font size</label>
       <div class="gf-form-select-wrapper max-width-8">
         <select class="gf-form-input"
-            ng-model="editor.panel.fontSize"
+            ng-model="ctrl.panel.fontSize"
             ng-options="f for f in editor.fontSizes"
             ng-change="ctrl.render()"></select>
       </div>
@@ -96,7 +96,7 @@
       <label class="gf-form-label width-10">Page size</label>
       <input class="gf-form-input width-8"
         type="number"
-        ng-model="editor.panel.pageSize"
+        ng-model="ctrl.panel.pageSize"
         ng-model-onblur
         ng-change="ctrl.render()">
     </div>
@@ -109,17 +109,17 @@
     <div class="gf-form">
       <label class="gf-form-label width-10">Newer than</label>
       <input class="gf-form-input width-8"
-        ng-model="editor.panel.highlightNewerThan"
+        ng-model="ctrl.panel.highlightNewerThan"
         ng-model-onblur
         ng-change="ctrl.render()">
     </div>
     <gf-form-switch class="gf-form"
       label-class="width-16"
       label="Custom Last change format"
-      checked="editor.panel.customLastChangeFormat"
+      checked="ctrl.panel.customLastChangeFormat"
       on-change="ctrl.render()">
     </gf-form-switch>
-    <div class="gf-form" ng-if="editor.panel.customLastChangeFormat">
+    <div class="gf-form" ng-if="ctrl.panel.customLastChangeFormat">
       <label class="gf-form-label width-3">
         <a href="http://momentjs.com/docs/#/displaying/format/" target="_blank">
           <tip>See moment.js dosc for time format.</tip>
@@ -130,19 +130,19 @@
         placeholder="dddd, MMMM Do YYYY, h:mm:ss a"
         empty-to-null
         ng-model-onblur
-        ng-model="editor.panel.lastChangeFormat"
+        ng-model="ctrl.panel.lastChangeFormat"
         ng-change="ctrl.render()">
     </div>
   </div>
 
   <div class="section gf-form-group">
     <h5 class="section-heading">Triggers severity and colors</h5>
-    <div class="gf-form-inline" ng-repeat="trigger in editor.panel.triggerSeverity">
+    <div class="gf-form-inline" ng-repeat="trigger in ctrl.panel.triggerSeverity">
       <div class="gf-form">
         <label class="gf-form-label width-3">{{ trigger.priority }}</label>
         <label class="gf-form-label triggers-severity-config"
           ng-style="{color: trigger.color}">
-          <i class="icon-gf" ng-class="ctrl.getAlertStateIcon(trigger)"></i>
+          <i class="icon-gf" ng-class="ctrl.getAlertIconClass(trigger)"></i>
         </label>
         <input type="text"
           class="gf-form-input width-12"
@@ -160,32 +160,26 @@
         checked="trigger.show"
         on-change="ctrl.refresh()">
       </gf-form-switch>
-      <gf-form-switch class="gf-form"
-        label-class="width-0"
-        label="Blink"
-        checked="trigger.blink"
-        on-change="ctrl.refresh()">
-      </gf-form-switch>
     </div>
 
     <div class="gf-form-inline">
       <div class="gf-form">
         <label class="gf-form-label width-3">&nbsp;</label>
         <label class="gf-form-label triggers-severity-config"
-          ng-style="{color: editor.panel.ackEventColor}">
+          ng-style="{color: ctrl.panel.ackEventColor}">
           <i class="icon-gf icon-gf-online"></i>
         </label>
         <label class="gf-form-label width-12">
           Acknowledged color
         </label>
         <span class="gf-form-label">
-          <spectrum-picker ng-model="editor.panel.ackEventColor" ng-change="ctrl.render()"></spectrum-picker>
+          <spectrum-picker ng-model="ctrl.panel.ackEventColor" ng-change="ctrl.render()"></spectrum-picker>
         </span>
       </div>
       <gf-form-switch class="gf-form"
         label-class="width-0"
         label="Show"
-        checked="editor.panel.markAckEvents"
+        checked="ctrl.panel.markAckEvents"
         on-change="ctrl.refresh()">
       </gf-form-switch>
     </div>
@@ -193,14 +187,14 @@
       <div class="gf-form">
         <label class="gf-form-label width-3">&nbsp;</label>
         <label class="gf-form-label triggers-severity-config"
-          ng-style="{color: editor.panel.okEventColor}">
+          ng-style="{color: ctrl.panel.okEventColor}">
           <i class="icon-gf icon-gf-online"></i>
         </label>
         <label class="gf-form-label width-12">
           OK event color
         </label>
         <span class="gf-form-label">
-          <spectrum-picker ng-model="editor.panel.okEventColor" ng-change="ctrl.render()"></spectrum-picker>
+          <spectrum-picker ng-model="ctrl.panel.okEventColor" ng-change="ctrl.render()"></spectrum-picker>
         </span>
       </div>
     </div>