riemann-dash 0.1.1 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,201 +0,0 @@
1
- <!doctype html>
2
- <html>
3
- <head>
4
- <meta charset="UTF-8" />
5
- <title>Riemann</title>
6
- <link rel="stylesheet" href="/css" type="text/css" />
7
-
8
- </head>
9
- <body>
10
- <div id="toolbar"></div>
11
- <div id="view"></div>
12
-
13
- <script type="text/javascript" src="/underscore-min.js"></script>
14
- <script type="text/javascript" src="/jquery-1.7.2.min.js"></script>
15
- <script type="text/javascript" src="/jquery-ui-1.9.0.custom.min.js"></script>
16
- <script type="text/javascript" src="/jquery.json-2.2.min.js"></script>
17
- <script type="text/javascript" src="/jquery.simplemodal.1.4.3.min.js"></script>
18
- <script type="text/javascript" src="/jquery.quickfit.js"></script>
19
- <script type="text/javascript" src="/util.js"></script>
20
- <script type="text/javascript" src="/mustache.js"></script>
21
- <script src="http://d3js.org/d3.v2.js"></script>
22
- <script type="text/javascript" src="/profile.js"></script>
23
- <script type="text/javascript" src="/clock.js"></script>
24
- <script type="text/javascript" src="/persistence.js"></script>
25
- <script type="text/javascript" src="/keys.js"></script>
26
- <script type="text/javascript" src="/subs.js"></script>
27
- <script type="text/javascript" src="/format.js"></script>
28
- <script type="text/javascript" src="/toolbar.js"></script>
29
- <script type="text/javascript" src="/view.js"></script>
30
- <script type="text/javascript" src="/views/title.js"></script>
31
- <script type="text/javascript" src="/views/help.js"></script>
32
- <script type="text/javascript" src="/views/gauge.js"></script>
33
- <script type="text/javascript" src="/views/grid.js"></script>
34
- <script type="text/javascript" src="/dash.js"></script>
35
-
36
- <script type="text/javascript">
37
- function logTable(container, query) {
38
- var $container = $(container);
39
- $container.addClass("log-table");
40
- $container.append('<input type="text" class="query"></input>');
41
- var prompt = $container.find('input');
42
- $container.append('<div class="scroll"><table><thead><tr>' +
43
- '<th>host</th>' +
44
- '<th>service</th>' +
45
- '<th>state</th>' +
46
- '<th>metric</th>' +
47
- '<th>description</th>' +
48
- '</tr></thead><tbody></tbody></table></div>');
49
- var scroll = $container.find('.scroll');
50
- var log = $container.find('tbody');
51
- var sub = null;
52
- var tracking = true;
53
-
54
- var template = "<tr><td>{{host}}</td><td>{{service}}</td><td>{{state}}</td><td>{{{metric}}}</td><td>{{description}}</td></tr>";
55
-
56
- // Are we following the bottom of the log?
57
- scroll.scroll(function(e) {
58
- if (scroll.scrollTop() > (log.height() - scroll.height())) {
59
- tracking = true;
60
- } else {
61
- tracking = false;
62
- }
63
- });
64
-
65
- var scrollToBottom = function() {
66
- scroll.stop().animate({
67
- scrollTop: (log.height() - scroll.height() + 20)
68
- }, 1000, "swing");
69
- }
70
-
71
- var atBottom = function() {
72
- console.log(scroll.scrollTop());
73
- console.log(log.height() - scroll.height());
74
- return (scroll.scrollTop() > (log.height() - scroll.height()));
75
- }
76
-
77
- // Add an event
78
- var append = function(e) {
79
- $.extend(e, {
80
- metric: format.metric(e)
81
- });
82
- log.append(Mustache.render(template, e));
83
- if (tracking) { scrollToBottom() };
84
- }
85
-
86
- // Set up our query
87
- var startQuery = function(query) {
88
- // Cancel existing sub
89
- if (sub != null) { sub.close(); }
90
-
91
- // Subscribe
92
- sub = subs.subscribe(query, function(e) {
93
- e.time = d3.time.format.iso.parse(e.time);
94
- clock.advance(e.time);
95
- append(e);
96
- });
97
- }
98
-
99
- // Initial subscription
100
- if (query) { prompt[0].value = query; startQuery(query); }
101
-
102
- // Prompt entry
103
- prompt.change(function() { startQuery(this.value) });
104
- }
105
-
106
-
107
- function timeSeries(container) {
108
- // Container
109
- var $container = $(container);
110
- var container = d3.select(container);
111
- $container.append('<input type=\"text\" style="display: block"></input>');
112
- var prompt = $container.children().last();
113
-
114
- // Data structures
115
- var data = [];
116
- var n = 60;
117
- var sub = null;
118
-
119
- // Scale
120
- var w = 20;
121
- var h = 80;
122
-
123
- var x = d3.time.scale()
124
- .domain([0,1])
125
- .range([0, w * n]);
126
- var y = d3.scale.linear()
127
- .domain([0,100])
128
- .rangeRound([0,h]);
129
-
130
- var updateTime = function(max) {
131
- var min = d3.time.minute.offset(max, -1);
132
- x.domain([min, max]);
133
- }
134
- updateTime(new Date());
135
-
136
- // Chart itself
137
- var chart = container.append("svg")
138
- .attr("class", "timeSeries")
139
- .attr("width", w * (n - 1))
140
- .attr("height", h);
141
-
142
- // Baseline
143
- chart.append("line")
144
- .attr("x1", 0)
145
- .attr("x2", w * n)
146
- .attr("y1", h - .5)
147
- .attr("y2", h - .5)
148
- .style("stroke", "#000");
149
-
150
- // Subscribe
151
- prompt.change(function() {
152
- if (sub != null) { sub.close(); }
153
-
154
- sub = subscribe(this.value, function(e) {
155
- // Move time
156
- e.time = d3.time.format.iso.parse(e.time);
157
- clock.advance(e.time);
158
-
159
- // Append to window
160
- if (data.length >= n) {
161
- data.shift();
162
- }
163
- data.push(e);
164
-
165
- console.log(e.time, "maps to", x(e.time), "in", x.domain(), x.range());
166
- });
167
- });
168
-
169
- var clockSub = clock.register(function(t) {
170
- updateTime(t);
171
-
172
- // Move events
173
- var rect = chart.selectAll("rect")
174
- .data(data, function(e) { if (e) { return e.time } });
175
-
176
- rect.enter().insert("rect", "line")
177
- .attr("x", function(e, i) {
178
- return x(e.time) - .5; })
179
- .attr("y", function(e) { return h - y(e.metric) - .5 })
180
- .attr("width", w)
181
- .attr("height", function(e) { return y(e.metric); })
182
- .transition()
183
- .duration(1000)
184
- .attr("x", function(e, i) { return x(e.time) - .5 });
185
-
186
- rect.transition()
187
- .duration(1000)
188
- .attr("x", function(e) { return x(e.time) - .5; });
189
-
190
- rect.exit().transition()
191
- .duration(1000)
192
- .attr("x", function(e) { return x(e.time) - .5 })
193
- .remove();
194
- });
195
-
196
- }
197
-
198
- dash.reload();
199
- </script>
200
- </body>
201
- </html>