bosun.org@v0.0.0-20210513094433-e25bc3e69a1f/cmd/bosun/web/static/js/expr.ts (about) 1 /// <reference path="0-bosun.ts" /> 2 interface IExprScope extends IBosunScope { 3 expr: string; 4 error: string; 5 running: string; 6 result: any; 7 queries: any; 8 result_type: string; 9 set: () => void; 10 tab: string; 11 graph: any; 12 bar: any; 13 svg_url: string; 14 date: string; 15 time: string; 16 keydown: ($event: any) => void; 17 animate: () => any; 18 stop: () => any; 19 aceLoaded: (editor: any) => void; 20 editor: any; 21 aceTheme: string; 22 aceMode: string; 23 } 24 25 bosunControllers.controller('ExprCtrl', ['$scope', '$http', '$location', '$route', function($scope: IExprScope, $http: ng.IHttpService, $location: ng.ILocationService, $route: ng.route.IRouteService) { 26 var search = $location.search(); 27 var current: string = ''; 28 try { 29 current = atob(search.expr); 30 } 31 catch (e) { 32 current = ''; 33 } 34 if (!current && $scope.exampleExpression) { 35 $location.search('expr', btoa($scope.exampleExpression)); 36 return; 37 } 38 $scope.date = search.date || ''; 39 $scope.time = search.time || ''; 40 $scope.expr = current; 41 42 $scope.aceMode = 'bosun'; 43 $scope.aceTheme = 'chrome'; 44 $scope.aceLoaded = function (editor) { 45 $scope.editor = editor; 46 editor.focus(); 47 editor.getSession().setUseWrapMode(true); 48 editor.getSession().setMode({ 49 path: 'ace/mode/' + $scope.aceMode, 50 v: Date.now() 51 }); 52 editor.$blockScrolling = Infinity; 53 }; 54 $scope.$on('$viewContentLoaded', () => { 55 setTimeout(() => { 56 var editor = $scope.editor; 57 var row = editor.session.getLength() - 1; 58 var column = editor.session.getLine(row).length; 59 editor.selection.moveTo(row, column); 60 }); 61 }); 62 63 $scope.tab = search.tab || 'results'; 64 65 if ($scope.expr) { 66 67 $scope.running = $scope.expr; 68 $scope.animate(); 69 70 $http.post('/api/expr?' + 71 'date=' + encodeURIComponent($scope.date) + 72 '&time=' + encodeURIComponent($scope.time),current) 73 .success((data: any) => { 74 $scope.result = data.Results; 75 $scope.queries = data.Queries; 76 $scope.result_type = data.Type; 77 if (data.Type == 'series') { 78 $scope.svg_url = '/api/egraph/' + btoa(current) + '.svg?now=' + Math.floor(Date.now() / 1000); 79 $scope.graph = toChart(data.Results); 80 } 81 if (data.Type == 'number') { 82 angular.forEach(data.Results, (d) => { 83 var name = '{'; 84 angular.forEach(d.Group, (tagv, tagk) => { 85 if (name.length > 1) { 86 name += ','; 87 } 88 name += tagk + '=' + tagv; 89 }); 90 name += '}'; 91 d.name = name; 92 }); 93 $scope.bar = data.Results; 94 } 95 $scope.running = ''; 96 }) 97 .error((error) => { 98 $scope.error = error; 99 $scope.running = ''; 100 }) 101 .finally(() => { 102 $scope.stop(); 103 }); 104 } 105 106 $scope.set = () => { 107 108 $location.search('date', $scope.date || null); 109 $location.search('time', $scope.time || null); 110 111 if ($scope.expr) { 112 $location.search('expr', btoa($scope.expr)); 113 $route.reload(); 114 } else { 115 $scope.error = "expr: empty"; 116 $scope.result = null; 117 $scope.queries = null; 118 } 119 }; 120 function toChart(res: any) { 121 var graph: any = []; 122 angular.forEach(res, (d, idx) => { 123 var data: any = []; 124 angular.forEach(d.Value, (val, ts) => { 125 data.push([+ts, val]); 126 }); 127 if (data.length == 0) { 128 return; 129 } 130 var name = '{'; 131 angular.forEach(d.Group, (tagv, tagk) => { 132 if (name.length > 1) { 133 name += ','; 134 } 135 name += tagk + '=' + tagv; 136 }); 137 name += '}'; 138 var series = { 139 Data: data, 140 Name: name, 141 }; 142 graph[idx] = series; 143 }); 144 return graph; 145 } 146 $scope.keydown = function($event: any) { 147 if ($event.shiftKey && $event.keyCode == 13) { 148 $scope.set(); 149 $event.preventDefault(); 150 } 151 }; 152 153 }]);