-
Notifications
You must be signed in to change notification settings - Fork 0
/
main.html
496 lines (399 loc) · 22.1 KB
/
main.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
<head>
<meta charset="utf-8">
<title>Observatory: Vega. Cloud Application Management and Monitoring for Meteor.</title>
<meta name="description" content="Cloud monitoring and application management for Meteor framework">
<meta name="author" content="Superstring Software">
<meta name="viewport" content="width=device-width">
<link href='http://fonts.googleapis.com/css?family=Raleway' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="/bootstrap.min.js"></script>
<script src="/highlight/highlight.pack.js"></script>
<link rel="stylesheet" href="/highlight/default.css">
</head>
<body>
</body>
<template name="layout">
<div class="navbar navbar-observatory navbar-fixed-top">
<div class="navbar-header">
<a href="{{pathFor 'home'}}" class="navbar-brand">observatory:</a>
</div>
<div class="collapse navbar-collapse">
<ul class="nav navbar-nav modules-navs">
<li class="{{active 'vega'}}">
<a href="/main/vega#top" class="vega">vega</a>
</li>
<li class="{{active 'jupiter'}}">
<a href="/main/jupiter#top" class="jupiter">jupiter</a>
</li>
<li class="{{active 'apollo'}}">
<a href="/main/apollo#top" class="apollo">apollo</a>
</li>
<li class="dropdown generic" style="border-left: dotted 1px #999;">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">documentation <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#docInstallation">Installation</a></li>
<li><a href="#docLogging">Manual Logging</a></li>
<li><a href="#docAutoLogging">Automagical Logging</a></li>
<li><a href="#docManagement">Management & Monitoring</a></li>
<li><a href="#docConfiguration">Advanced Configuration</a></li>
<li><a href="#docExtension">Extending Observatory</a></li>
</ul>
</li>
<li>
<a href="http://meteorology.io">blog</a>
</li>
</ul>
</div>
</div>
{{yield}}
<footer style="padding-top: 50px;">
<p>© Superstring Software, 2012-2013
</p>
</footer>
{{>google}}
</template>
<template name="main">
<div class="main-picture" style="position: fixed; top: 60px; left: 0; width: 583px; z-index: -100;">
<img src="{{activeImage}}" style="position: absolute; top: 0; left: 0;"/>
<a class="{{active 'apollo'}}" href="/main/apollo"><h3 class="apollo">apollo</h3></a>
<a class="{{active 'jupiter'}}" href="/main/jupiter"><h2 class="jupiter">jupiter</h2></a>
<a class="{{active 'vega'}}" href="/main/vega"><h1 class="vega">vega</h1></a>
<p class="{{activeModule}} module-banner">
{{{moduleBanner activeModule}}}
</p>
</div>
<div class="container">
<div class="row row-main" id="top">
<div class="col-md-7 col-md-offset-5 col-main-badge">
<div>
{{{mainBadge activeModule}}}
</div>
</div>
</div>
</div>
<div class="row row-jupiter-feature">
<div class="col-md-7">
<div style="margin-left: 20px; height: 760px;">
<h2>live logs stream</h2>
{{>logsTable }}
</div>
</div>
<div class="col-md-5">
<h2>templates & session introspection</h2>
<div class="row" style="height: 760px;">
{{>templateViewer}}
</div>
</div>
</div>
<div class="row row-jupiter-feature-2">
<div class="col-md-12 col-danube" id="docInstallation">
<div class="container">
<div class="row">
<div class="col-md-10 col-md-offset-1">
<h1>Installation and Usage <span class="label label-success pull-right">version 0.3.0</span></h1>
<p class="lead">Observatory is a <a href="https://atmosphere.meteor.com">meteorite package</a> so installation is as easy as
running <code>mrt add observatory</code> in your Meteor app's directory. To view the logs locally,
plug <code>{{>logs_bootstrap}}</code> somewhere in your templates, preferably before
the <code></body></code> tag. However, we encourage you to get an account
at <a href="http://vega.observatoryjs.com">Observatory: Vega</a> and enjoy <a href="http://vega.observatoryjs.com/demo">many more
application management features</a> than mere logging as well as complete control over Observatory
configuration, both for localhost development and production deployments of your Meteor applications.
</p>
<h2 id="docLogging">Logging</h2>
<p>
Normally, you need to use only two objects in your application to get access to all Observatory features:
<code>Observatory</code>, which handles settings and options, and <code>Toolbox</code> - swiss knife
of logging and profiling, accessible
via <code>Observatory.getToolbox()</code> both on the server and the client.
</p>
<h3>Manual Logging</h3>
<p>To log a message with specific severity call one of the following methods:</p>
<pre><code>
var tb = Observatory.getToolbox();
tb.fatal("application failed drastically", optional_json_object, "optional module name");
tb.error("some error occurred", optional_json_object, "optional module name");
tb.warn("a warning message", optional_json_object, "optional module name");
tb.info("just for your information", optional_json_object, "optional module name");
tb.verbose("logging every single detail", optional_json_object, "optional module name");
tb.debug("some debugging stuff", optional_json_object, "optional module name");
// tracing an error, useful in try-catch blocks
tb.trace(error,"additional message about error","optional module name");
</code></pre>
<p>
<span class="label label-success">new!</span> <code>Toolbox.exec()</code> -- powerful profiler-wrapper method
that you can pass any function
and it will (optionally) wrap it in a try-catch block and (optionally) time execution.
Extremely useful for wrapping key pieces of code in production so that errors and
bottlenecks are constantly monitored.
</p>
<div class="row">
<div class="col-md-6">
<h5>coffeescript</h5>
<pre><code>
# signature
exec = (f, options = errors: true, profile: true, profileLoglevel: "INFO", message: "exec() call" )=>
# example usage
tb = Observatory.getToolbox()
tb.exec ->
i = i*i for i in [0..100000]
, errors: true, profile: true, profileLoglevel: "INFO", message: "timing simple cycle"
</code></pre>
</div>
<div class="col-md-6">
<h5>javascript</h5>
<pre><code>
// signature
exec = function(f, options);
// example usage
tb = Observatory.getToolbox();
tb.exec(function() {
for (i = 0; i <= 100000; i++) {
i = i * i;
}
}, { errors: true, profile: true, profileLoglevel: "INFO", message: "timing simple cycle"}
);
</code></pre>
</div>
</div>
<h3 id="docAutoLogging"><span class="label label-success">new!</span> Automagical Logging</h3>
<p>
Currently, Observatory automagically logs HTTP and DDP requests via setting corresponding options.
There's more exciting stuff coming up soon: we are working on the ability to automagically log
key Meteor classes and methods <em>without the need to write a single line of code</em>.
</p>
<p>
First to be supported are Subscriptions (logging & profiling), Collection methods on the client
and Template lifecycle methods as well as events (extremely useful for logging user behavior).
Stay tuned!
</p>
<p>
<span class="label label-warning">alpha API</span> You can experiment with the below automagical methods
at your own risk. API will most likely change and we are still testing, but it gives you an idea
of what's possible. On the client, call one of <code>Observatory.logTemplates()</code>, <code>Observatory.logCollection()</code>, <code>Observatory.logMeteor()</code> to enable automagical logging of template lifecycle methods, Collection methods (only find is supported so far), and Subscriptions profiling. Appreciate
your feedback!
</p>
<h3 id="docUtility">Utility</h3>
<p>
<code>Toolbox.inspect(obj)</code> - convenience method for quickly inspecting an object:
</p>
<div class="row">
<div class="col-md-6">
<h5>coffeescript</h5>
<pre><code>
# returns object's functions, other objects and variables sorted into arrays in human-readable form
# every array item has 'key' and 'value' properties
inspect = (obj)->
ret =
functions: []
objects: []
vars: []
# ...
ret
</code></pre>
</div>
<div class="col-md-6">
<h5>javascript</h5>
<pre><code>
inspect = function(obj) {
var ret = {
functions: [],
objects: [],
vars: []
};
// ...
return ret;
};
</code></pre>
</div>
</div>
<h2 id="docManagement"><span class="label label-success">new!</span> Management and Monitoring</h2>
<p>
This part of Observatory is under heavy development, but basic API is simple and ready.
Just call <code>Observatory.emitters.Monitor.startMonitor(timePeriod)</code> on the server and
Observatory will record performance, health, users etc every <code>timePeriod</code> ms (default is 1 minute
- if you don't provide your timePeriod to override).
This information will be used by Vega to build charts, send out alerts, help you
analyze bottlenecks etc - the usual powerful application management and monitoring functionality for Meteor.
See it in action at <a href="http://vega.observatoryjs.com/demo">Observatory: Vega.</a>
</p>
<p>
Even though Vega is very early in development, you may still want to start running Monitors
in your apps, so that the statistics is being recorded and available for analysis when we roll out
management and monitoring features. If you do, we recommend running monitor every 10-15 minutes
to not overload the database.
</p>
<h2 id="docConfiguration">Configuration</h2>
<p>
Optionally provide settings to your app via <code>meteor --settings settings.json</code> or
<code>meteor deploy --settings deploy-settings.json <url></code> following the format:
</p>
<div class="row">
<div class="col-md-6">
<h5>in the settings file</h5>
<pre><code>
// These are also the defaults
{
"public": {
"observatorySettings": {
"maxSeverity": "INFO",
"printToConsole": true,
"logUser": true,
"logHttp": true,
"logDDP": false,
"prohibitAutoPublish": false
}
}
}
</code></pre>
</div>
<div class="col-md-6">
<h5>programmatically</h5>
<pre><code>
var settings = {
maxSeverity: "INFO",
printToConsole: false, // whether to also log to console
logUser: true, // log the user information?
logHttp: true, // log http requests automagically?
logDDP: false, // log DDP requests automagically?
};
Observatory.setSettings(settings);
</code></pre>
</div>
</div>
<p>
If you don't, defaults will be used.
Severity levels supported are: "FATAL", "ERROR", "WARNING", "INFO", "VERBOSE", "DEBUG", "MAX".
Only messages with severity lower or equal to <code>maxSeverity</code> option will be logged - so
in development it makes sense to use "DEBUG" and in production - "INFO" or "VERBOSE".
</p>
<p>
<span class="label label-warning">warning</span>
Be careful with DDP logging - it generates lots of messages, so only use during development.
</p>
<h4>Control publish, insert and remove</h4>
<p>
If you prohibit autopublish of the logs (only works via settings file!), you can configure who has access either via Observatory: Vega or programmatically: on the server, call
<code>Observatory.meteorServer.publish(func);</code> where
<code>func = function(userId);</code> is a function that takes a userId and returns 'true'
if you want to allow logs publishing for the given userId. For example, to publish logs only
for "admin" users:
</p>
<div class="row">
<div class="col-md-6">
<h5>coffeescript</h5>
<pre><code>
Observatory.meteorServer.publish (uid)->
if Meteor.users.findOne(_id: uid)?.role is 'admin' then true else false
</code></pre>
</div>
<div class="col-md-6">
<h5>javascript</h5>
<pre><code>
Observatory.meteorServer.publish(function(uid) {
var _ref;
if (((_ref = Meteor.users.findOne({
_id: uid
})) != null ? _ref.role : void 0) === 'admin') {
return true;
} else {
return false;
}
});
</code></pre>
</div>
</div>
<p>
If you prohibit autopublishing, you also need to explicitly subscribe on the client to view the logs:
<code>Observatory.subscribe(numOfRecords)</code>. <strong>This is only
relevant to Jupiter (local use), when using Vega you don't need to do any of this!</strong>
</p>
<p>
Same way, if you want to control which users you want to log from the client side (more granular control
is useful in production apps, where you may want to log only signed in users actions - to be able to
track offenders just in case), assign similar function <code>f(uid)</code> to the MeteorLogger instance:
<code>Observatory.getMeteorLogger().allowInsert = f</code>. Remove calls are controlled in the same
fashion: <code>Observatory.getMeteorLogger().allowRemove = f</code>, but it's much more practical
to use Observatory: Vega log management for this.
</p>
<h2 id="docExtension">Extending Observatory</h2>
<p>
Observatory has very modular architecture and as such is very easy to extend.
Detailed docs on how to do this are somewhere on the roadmap, in the meantime
feel free to browse the code of
<a href="https://github.com/superstringsoftware/observatory-galileo">Observatory: Galileo</a>
- foundational classes, implementing Meteor-independent
variant of event emitter - listeners approach in coffeescript and
<a href="https://github.com/superstringsoftware/observatory-apollo">Observatory: Apollo</a>
- Meteor-specific classes building up on the Galileo foundation.
</p>
<p>
There's also some decscription of how Galileo is structured, along with annotated code,
<a href="http://superstringsoftware.github.io/observatory-galileo/">available here.</a>
</p>
<p>
If you'd like to contribute to the development or submit an issue / feature request,
please do so at <a href="https://github.com/superstringsoftware/observatory-apollo/issues">Apollo's github.</a>.
</p>
</div>
</div>
</div>
</div>
<!-- <div class="col-md-2" style="background-color: #ff9900; height: 100%;">
</div> -->
</div>
</template>
<template name="notFound">
<div class="hero-unit">
<div class="logo"></div>
<h2>Page Not Found :(</h2>
<!-- <p>Don't know what Meteor or Meteorite is? <a href="#">Read this tutorial</a> to get you started.
</p>-->
</div>
</template>
<template name="loading">
<h1>Wait For It...</h1>
</template>
<template name="vega_badge">
<div style="background: #000; padding: 12px; opacity: 0.95;">
<h3 class="vega">Observatory: Vega</h3>
<p>
Full-featured cloud application management and monitoring for your Meteor apps.
<a href="http://vega.observatoryjs.com/demo">See live demo</a> or
<a href="http://vega.observatoryjs.com">start using today</a> in your apps.
</p>
<h4>Feature highlights</h4>
<ul class="list-group">
<li class="list-group-item"><span class="glyphicon glyphicon-hand-right"></span> Advanced on-the-fly log management and analysis
<span class="label label-success pull-right">done</span></li>
<li class="list-group-item"><span class="glyphicon glyphicon-hand-right"></span> Performance monitoring, including live sessions and subscriptions
<span class="label label-success pull-right">some</span></li>
<li class="list-group-item"><span class="glyphicon glyphicon-hand-right"></span> Collections and Users administration
<span class="label label-warning pull-right">in the works</span></li>
<li class="list-group-item"><span class="glyphicon glyphicon-hand-right"></span> Remote debugging and troubleshooting
<span class="label label-danger pull-right">coming up</span></li>
</ul>
<p>
<a href="http://vega.observatoryjs.com"><button type="button" class="btn btn-info pull-right">Sign Up Now!</button></a>
</p>
</div>
</template>
<template name="apollo_badge">
<h3 class="apollo">Observatory: Apollo</h3>
<div class="well">
<p>
Foundation of the <strong>Observatory Suite</strong>- carefully designed logging & monitoring
framework for <strong>Meteor</strong> as well as standalone <strong>node js</strong>, written in <strong>coffeescript</strong>.
</p>
<p>
Normally, you wouldn't use it standalone, unless you'd like to understand the internal mechanics of Observatory or
extend the framework.
</p>
<pre><code>
class MyEmitter extends Observatory.MessageEmitter
emitMessage: (msg)->
"Only emit 1 message that will be recorded by all subscribed Loggers"
</code></pre>
<p>
<a href="#docInstallation">Read API docs</a> or learn <a href="#docExtension">how to extend Observatory...</a>
</p>
</div>
</template>