better_errors 0.0.2 → 0.3.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.
@@ -0,0 +1,923 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title><%= exception.class %> at <%= request_path %></title>
5
+ <style>
6
+ /* Basic reset */
7
+ * {
8
+ margin: 0;
9
+ padding: 0;
10
+ }
11
+
12
+ table {
13
+ width: 100%;
14
+ border-collapse: collapse;
15
+ }
16
+
17
+ th, td {
18
+ vertical-align: top;
19
+ text-align: left;
20
+ }
21
+
22
+ textarea {
23
+ resize: none;
24
+ }
25
+
26
+ body {
27
+ font-size: 10pt;
28
+ }
29
+
30
+ body, td, input, textarea {
31
+ font-family: helvetica neue, lucida grande, sans-serif;
32
+ line-height: 1.5;
33
+ color: #333;
34
+ text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
35
+ }
36
+
37
+ html {
38
+ background: #f0f0f5;
39
+ }
40
+
41
+ /* ---------------------------------------------------------------------
42
+ * Basic layout
43
+ * --------------------------------------------------------------------- */
44
+
45
+ /* Small */
46
+ @media screen and (max-width: 1100px) {
47
+ html {
48
+ overflow-y: scroll;
49
+ }
50
+
51
+ body {
52
+ margin: 0 20px;
53
+ }
54
+
55
+ header.exception {
56
+ margin: 0 -20px;
57
+ }
58
+
59
+ nav.sidebar {
60
+ padding: 0;
61
+ margin: 20px 0;
62
+ }
63
+
64
+ ul.frames {
65
+ max-height: 200px;
66
+ overflow: auto;
67
+ }
68
+ }
69
+
70
+ /* Wide */
71
+ @media screen and (min-width: 1100px) {
72
+ header.exception {
73
+ position: fixed;
74
+ top: 0;
75
+ left: 0;
76
+ right: 0;
77
+ }
78
+
79
+ nav.sidebar,
80
+ .frame_info {
81
+ position: fixed;
82
+ top: 95px;
83
+ bottom: 0;
84
+
85
+ box-sizing: border-box;
86
+
87
+ overflow-y: auto;
88
+ overflow-x: hidden;
89
+ }
90
+
91
+ nav.sidebar {
92
+ width: 40%;
93
+ left: 20px;
94
+ top: 115px;
95
+ bottom: 20px;
96
+ }
97
+
98
+ .frame_info {
99
+ right: 0;
100
+ left: 40%;
101
+
102
+ padding: 20px;
103
+ padding-left: 10px;
104
+ margin-left: 30px;
105
+ }
106
+ }
107
+
108
+ nav.sidebar {
109
+ background: #d3d3da;
110
+ border-top: solid 3px #a33;
111
+ border-bottom: solid 3px #a33;
112
+ border-radius: 4px;
113
+ box-shadow: 0 0 6px rgba(0, 0, 0, 0.2), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
114
+ }
115
+
116
+ /* ---------------------------------------------------------------------
117
+ * Header
118
+ * --------------------------------------------------------------------- */
119
+
120
+ header.exception {
121
+ padding: 18px 20px;
122
+
123
+ height: 59px;
124
+ min-height: 59px;
125
+
126
+ overflow: hidden;
127
+
128
+ background-color: #20202a;
129
+ color: #aaa;
130
+ text-shadow: 0 1px 0 rgba(0, 0, 0, 0.3);
131
+ font-weight: 200;
132
+ box-shadow: inset 0 -5px 3px -3px rgba(0, 0, 0, 0.05), inset 0 -1px 0 rgba(0, 0, 0, 0.05);
133
+
134
+ -webkit-text-smoothing: antialiased;
135
+ }
136
+
137
+ /* Heading */
138
+ header.exception h2 {
139
+ font-weight: 200;
140
+ font-size: 11pt;
141
+ }
142
+
143
+ header.exception h2,
144
+ header.exception p {
145
+ line-height: 1.4em;
146
+ height: 1.4em;
147
+ overflow: hidden;
148
+ white-space: pre;
149
+ text-overflow: ellipsis;
150
+ }
151
+
152
+ header.exception h2 strong {
153
+ font-weight: 700;
154
+ color: #d55;
155
+ }
156
+
157
+ header.exception p {
158
+ font-weight: 200;
159
+ font-size: 20pt;
160
+ color: white;
161
+ }
162
+
163
+ header.exception:hover {
164
+ height: auto;
165
+ z-index: 2;
166
+ }
167
+
168
+ header.exception:hover h2,
169
+ header.exception:hover p {
170
+ padding-right: 20px;
171
+ overflow-y: auto;
172
+ word-wrap: break-word;
173
+ height: auto;
174
+ max-height: 7em;
175
+ }
176
+
177
+ @media screen and (max-width: 1100px) {
178
+ header.exception {
179
+ height: auto;
180
+ }
181
+
182
+ header.exception h2,
183
+ header.exception p {
184
+ padding-right: 20px;
185
+ overflow-y: auto;
186
+ word-wrap: break-word;
187
+ height: auto;
188
+ max-height: 7em;
189
+ }
190
+ }
191
+
192
+ <%#
193
+ /* Light theme */
194
+ header.exception {
195
+ text-shadow: 0 1px 0 rgba(250, 250, 250, 0.6);
196
+ background: rgba(200,100,50,0.10);
197
+ color: #977;
198
+ }
199
+ header.exception h2 strong {
200
+ color: #533;
201
+ }
202
+ header.exception p {
203
+ color: #744;
204
+ }
205
+ %>
206
+
207
+ /* ---------------------------------------------------------------------
208
+ * Navigation
209
+ * --------------------------------------------------------------------- */
210
+
211
+ nav.tabs {
212
+ border-bottom: solid 1px #ddd;
213
+
214
+ background-color: #eee;
215
+ text-align: center;
216
+
217
+ padding: 6px;
218
+
219
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
220
+ }
221
+
222
+ nav.tabs a {
223
+ display: inline-block;
224
+
225
+ height: 22px;
226
+ line-height: 22px;
227
+ padding: 0 10px;
228
+
229
+ text-decoration: none;
230
+ font-size: 8pt;
231
+ font-weight: bold;
232
+
233
+ color: #999;
234
+ text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
235
+ }
236
+
237
+ nav.tabs a.selected {
238
+ color: white;
239
+ background: rgba(0, 0, 0, 0.5);
240
+ border-radius: 16px;
241
+ box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.1);
242
+ text-shadow: 0 0 4px rgba(0, 0, 0, 0.4), 0 1px 0 rgba(0, 0, 0, 0.4);
243
+ }
244
+
245
+ /* ---------------------------------------------------------------------
246
+ * Sidebar
247
+ * --------------------------------------------------------------------- */
248
+
249
+ ul.frames {
250
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
251
+ }
252
+
253
+ /* Each item */
254
+ ul.frames li {
255
+ background-color: #f8f8f8;
256
+ background: -webkit-linear-gradient(top, #f8f8f8 80%, #f0f0f0);
257
+ background: -moz-linear-gradient(top, #f8f8f8 80%, #f0f0f0);
258
+ background: linear-gradient(top, #f8f8f8 80%, #f0f0f0);
259
+ box-shadow: inset 0 -1px 0 #e2e2e2;
260
+ padding: 7px 20px;
261
+
262
+ cursor: pointer;
263
+ overflow: hidden;
264
+ }
265
+
266
+ ul.frames .name,
267
+ ul.frames .location {
268
+ overflow: hidden;
269
+ height: 1.5em;
270
+
271
+ white-space: nowrap;
272
+ word-wrap: none;
273
+ text-overflow: ellipsis;
274
+ }
275
+
276
+ ul.frames .method {
277
+ color: #966;
278
+ }
279
+
280
+ ul.frames .location {
281
+ font-size: 0.85em;
282
+ font-weight: 400;
283
+ color: #999;
284
+ }
285
+
286
+ ul.frames .line {
287
+ font-weight: bold;
288
+ }
289
+
290
+ /* Selected frame */
291
+ ul.frames li.selected {
292
+ background: #38a;
293
+ box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.1), inset 0 2px 0 rgba(255, 255, 255, 0.01), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
294
+ }
295
+
296
+ ul.frames li.selected .name,
297
+ ul.frames li.selected .method,
298
+ ul.frames li.selected .location {
299
+ color: white;
300
+ text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
301
+ }
302
+
303
+ ul.frames li.selected .location {
304
+ opacity: 0.6;
305
+ }
306
+
307
+ /* Iconography */
308
+ ul.frames li {
309
+ padding-left: 60px;
310
+ position: relative;
311
+ }
312
+
313
+ ul.frames li .icon {
314
+ display: block;
315
+ width: 20px;
316
+ height: 20px;
317
+ line-height: 20px;
318
+ border-radius: 15px;
319
+
320
+ text-align: center;
321
+
322
+ background: white;
323
+ border: solid 2px #ccc;
324
+
325
+ font-size: 9pt;
326
+ font-weight: 200;
327
+ font-style: normal;
328
+
329
+ position: absolute;
330
+ top: 14px;
331
+ left: 20px;
332
+ }
333
+
334
+ ul.frames .icon.application {
335
+ background: #808090;
336
+ border-color: #555;
337
+ }
338
+
339
+ ul.frames .icon.application:before {
340
+ content: 'A';
341
+ color: white;
342
+ text-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
343
+ }
344
+
345
+ /* Responsiveness -- flow to single-line mode */
346
+ @media screen and (max-width: 1100px) {
347
+ ul.frames li {
348
+ padding-top: 6px;
349
+ padding-bottom: 6px;
350
+ padding-left: 36px;
351
+ line-height: 1.3;
352
+ }
353
+
354
+ ul.frames li .icon {
355
+ width: 11px;
356
+ height: 11px;
357
+ line-height: 11px;
358
+
359
+ top: 7px;
360
+ left: 10px;
361
+ font-size: 5pt;
362
+ }
363
+
364
+ ul.frames .name,
365
+ ul.frames .location {
366
+ display: inline-block;
367
+ line-height: 1.3;
368
+ height: 1.3em;
369
+ }
370
+
371
+ ul.frames .name {
372
+ margin-right: 10px;
373
+ }
374
+ }
375
+
376
+ /* ---------------------------------------------------------------------
377
+ * Monospace
378
+ * --------------------------------------------------------------------- */
379
+
380
+ pre, code, .repl input, .repl .prompt span, textarea {
381
+ font-family: menlo, lucida console, monospace;
382
+ font-size: 8pt;
383
+ }
384
+
385
+ /* ---------------------------------------------------------------------
386
+ * Display area
387
+ * --------------------------------------------------------------------- */
388
+
389
+ .trace_info {
390
+ background: #fff;
391
+ padding: 6px;
392
+ border-radius: 3px;
393
+ margin-bottom: 2px;
394
+ box-shadow: 0 0 10px rgba(0, 0, 0, 0.03), 1px 1px 0 rgba(0, 0, 0, 0.05), -1px 1px 0 rgba(0, 0, 0, 0.05), 0 0 0 4px rgba(0, 0, 0, 0.04);
395
+ }
396
+
397
+ /* Titlebar */
398
+ .trace_info .title {
399
+ background: #f1f1f1;
400
+
401
+ box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
402
+ overflow: hidden;
403
+ padding: 6px 10px;
404
+
405
+ border: solid 1px #ccc;
406
+ border-bottom: 0;
407
+
408
+ border-top-left-radius: 2px;
409
+ border-top-right-radius: 2px;
410
+ }
411
+
412
+ .trace_info .title .name,
413
+ .trace_info .title .location {
414
+ font-size: 9pt;
415
+ line-height: 26px;
416
+ height: 26px;
417
+ overflow: hidden;
418
+ }
419
+
420
+ .trace_info .title .location {
421
+ float: left;
422
+ font-weight: bold;
423
+ font-size: 10pt;
424
+ }
425
+
426
+ .trace_info .title .location a {
427
+ color:inherit;
428
+ text-decoration:none;
429
+ border-bottom:1px solid #aaaaaa;
430
+ }
431
+
432
+ .trace_info .title .location a:hover {
433
+ border-color:#666666;
434
+ }
435
+
436
+ .trace_info .title .name {
437
+ float: right;
438
+ font-weight: 200;
439
+ }
440
+
441
+ .code, .console, .unavailable {
442
+ background: #fff;
443
+ padding: 5px;
444
+
445
+ box-shadow: inset 3px 3px 3px rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
446
+ }
447
+
448
+ .code {
449
+ margin-bottom: -1px;
450
+ }
451
+
452
+ .code {
453
+ padding: 10px 0;
454
+ overflow: auto;
455
+ }
456
+
457
+ /* Source unavailable */
458
+ p.unavailable {
459
+ padding: 20px 0 40px 0;
460
+ text-align: center;
461
+ color: #b99;
462
+ font-weight: bold;
463
+ }
464
+
465
+ p.unavailable:before {
466
+ content: '\00d7';
467
+ display: block;
468
+
469
+ color: #daa;
470
+
471
+ text-align: center;
472
+ font-size: 40pt;
473
+ font-weight: normal;
474
+ margin-bottom: -10px;
475
+ }
476
+
477
+ @-webkit-keyframes highlight {
478
+ 0% { background: rgba(220, 30, 30, 0.3); }
479
+ 100% { background: rgba(220, 30, 30, 0.1); }
480
+ }
481
+ @-moz-keyframes highlight {
482
+ 0% { background: rgba(220, 30, 30, 0.3); }
483
+ 100% { background: rgba(220, 30, 30, 0.1); }
484
+ }
485
+ @keyframes highlight {
486
+ 0% { background: rgba(220, 30, 30, 0.3); }
487
+ 100% { background: rgba(220, 30, 30, 0.1); }
488
+ }
489
+
490
+ .code .highlight {
491
+ background: rgba(220, 30, 30, 0.1);
492
+ -webkit-animation: highlight 400ms linear 1;
493
+ -moz-animation: highlight 400ms linear 1;
494
+ animation: highlight 400ms linear 1;
495
+ }
496
+
497
+ /* REPL shell */
498
+ .console {
499
+ padding: 0 1px 10px 1px;
500
+ border-bottom-left-radius: 2px;
501
+ border-bottom-right-radius: 2px;
502
+ }
503
+
504
+ .console pre {
505
+ padding: 10px 10px 0 10px;
506
+ max-height: 400px;
507
+ overflow-x: none;
508
+ overflow-y: auto;
509
+ margin-bottom: -3px;
510
+ word-wrap: break-word;
511
+ white-space: pre-wrap;
512
+ }
513
+
514
+ /* .prompt > span + input */
515
+ .console .prompt {
516
+ display: table;
517
+ width: 100%;
518
+ }
519
+
520
+ .console .prompt span,
521
+ .console .prompt input {
522
+ display: table-cell;
523
+ }
524
+
525
+ .console .prompt span {
526
+ width: 1%;
527
+ padding-right: 5px;
528
+ padding-left: 10px;
529
+ }
530
+
531
+ .console .prompt input {
532
+ width: 99%;
533
+ }
534
+
535
+ /* Input box */
536
+ .console input,
537
+ .console input:focus {
538
+ outline: 0;
539
+ border: 0;
540
+ padding: 0;
541
+ background: transparent;
542
+ margin: 0;
543
+ }
544
+
545
+ /* Hint text */
546
+ .hint {
547
+ margin: 15px 0 20px 0;
548
+ font-size: 8pt;
549
+ color: #8080a0;
550
+ padding-left: 20px;
551
+ }
552
+
553
+ .hint:before {
554
+ content: '\25b2';
555
+ margin-right: 5px;
556
+ opacity: 0.5;
557
+ }
558
+
559
+ /* ---------------------------------------------------------------------
560
+ * Variable infos
561
+ * --------------------------------------------------------------------- */
562
+
563
+ .sub {
564
+ padding: 10px 0;
565
+ margin: 10px 0;
566
+ }
567
+
568
+ .sub:before {
569
+ content: '';
570
+ display: block;
571
+ width: 100%;
572
+ height: 4px;
573
+
574
+ border-radius: 2px;
575
+ background: rgba(0, 150, 200, 0.05);
576
+ box-shadow: 1px 1px 0 rgba(255, 255, 255, 0.7), inset 0 0 0 1px rgba(0, 0, 0, 0.04), inset 2px 2px 2px rgba(0, 0, 0, 0.07);
577
+ }
578
+
579
+ .sub h3 {
580
+ color: #39a;
581
+ font-size: 1.1em;
582
+ margin: 10px 0;
583
+ text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
584
+
585
+ -webkit-font-smoothing: antialiased;
586
+ }
587
+
588
+ .sub .inset {
589
+ overflow-y: auto;
590
+ }
591
+
592
+ .sub table {
593
+ table-layout: fixed;
594
+ }
595
+
596
+ .sub table td {
597
+ border-top: dotted 1px #ddd;
598
+ padding: 7px 1px;
599
+ }
600
+
601
+ .sub table td.name {
602
+ width: 150px;
603
+
604
+ font-weight: bold;
605
+ font-size: 0.8em;
606
+ padding-right: 20px;
607
+
608
+ word-wrap: break-word;
609
+ }
610
+
611
+ .sub table td pre {
612
+ max-height: 15em;
613
+ overflow-y: auto;
614
+ }
615
+
616
+ .sub table td pre {
617
+ width: 100%;
618
+
619
+ word-wrap: break-word;
620
+ white-space: normal;
621
+ }
622
+
623
+ /* "(object doesn't support inspect)" */
624
+ .sub .unsupported {
625
+ font-family: sans-serif;
626
+ color: #777;
627
+ }
628
+
629
+ /* ---------------------------------------------------------------------
630
+ * Scrollbar
631
+ * --------------------------------------------------------------------- */
632
+
633
+ nav.sidebar::-webkit-scrollbar,
634
+ .inset pre::-webkit-scrollbar,
635
+ .console pre::-webkit-scrollbar,
636
+ .code::-webkit-scrollbar {
637
+ width: 10px;
638
+ height: 10px;
639
+ }
640
+
641
+ .inset pre::-webkit-scrollbar-thumb,
642
+ .console pre::-webkit-scrollbar-thumb,
643
+ .code::-webkit-scrollbar-thumb {
644
+ background: #ccc;
645
+ border-radius: 5px;
646
+ }
647
+
648
+ nav.sidebar::-webkit-scrollbar-thumb {
649
+ background: rgba(0, 0, 0, 0.0);
650
+ border-radius: 5px;
651
+ }
652
+
653
+ nav.sidebar:hover::-webkit-scrollbar-thumb {
654
+ background-color: #999;
655
+ background: -webkit-linear-gradient(left, #aaa, #999);
656
+ }
657
+
658
+ .console pre:hover::-webkit-scrollbar-thumb,
659
+ .inset pre:hover::-webkit-scrollbar-thumb,
660
+ .code:hover::-webkit-scrollbar-thumb {
661
+ background: #888;
662
+ }
663
+
664
+
665
+ </style>
666
+ </head>
667
+ <body>
668
+ <div class='top'>
669
+ <header class="exception">
670
+ <h2><strong><%= exception.class %></strong> <span>at <%= request_path %></span></h2>
671
+ <p><%= exception_message %></p>
672
+ </header>
673
+ </div>
674
+
675
+ <section class="backtrace">
676
+ <nav class="sidebar">
677
+ <nav class="tabs">
678
+ <a href="#" id="application_frames">Application Frames</a>
679
+ <a href="#" id="all_frames">All Frames</a>
680
+ </nav>
681
+ <ul class="frames">
682
+ <% backtrace_frames.each_with_index do |frame, index| %>
683
+ <li class="<%= frame.context %>" style="display: none" data-context="<%= frame.context %>" data-index="<%= index %>">
684
+ <span class='stroke'></span>
685
+ <i class="icon <%= frame.context %>"></i>
686
+ <div class="info">
687
+ <div class="name">
688
+ <strong><%= frame.class_name %></strong><span class='method'><%= frame.method_name %></span>
689
+ </div>
690
+ <div class="location">
691
+ <span class="filename"><%= frame.pretty_path %></span>, line <span class="line"><%= frame.line %></span>
692
+ </div>
693
+ </div>
694
+ </li>
695
+ <% end %>
696
+ </ul>
697
+ </nav>
698
+
699
+ <% backtrace_frames.each_with_index do |frame, index| %>
700
+ <div class="frame_info" id="frame_info_<%= index %>" style="display:none;"></div>
701
+ <% end %>
702
+ </section>
703
+ </body>
704
+ <script>
705
+ (function() {
706
+ var OID = <%== object_id.to_s.inspect %>;
707
+
708
+ var previousFrame = null;
709
+ var previousFrameInfo = null;
710
+ var allFrames = document.querySelectorAll("ul.frames li");
711
+ var allFrameInfos = document.querySelectorAll(".frame_info");
712
+
713
+ function apiCall(method, opts, cb) {
714
+ var req = new XMLHttpRequest();
715
+ req.open("POST", <%== uri_prefix.gsub("<", "&lt;").inspect %> + "/__better_errors/" + OID + "/" + method, true);
716
+ req.setRequestHeader("Content-Type", "application/json");
717
+ req.send(JSON.stringify(opts));
718
+ req.onreadystatechange = function() {
719
+ if(req.readyState == 4) {
720
+ var res = JSON.parse(req.responseText);
721
+ cb(res);
722
+ }
723
+ };
724
+ }
725
+
726
+ function escapeHTML(html) {
727
+ return html.replace(/&/, "&amp;").replace(/</g, "&lt;");
728
+ }
729
+
730
+ function REPL(index) {
731
+ this.index = index;
732
+
733
+ this.previousCommands = [];
734
+ this.previousCommandOffset = 0;
735
+ }
736
+
737
+ REPL.all = [];
738
+
739
+ REPL.prototype.install = function(containerElement) {
740
+ this.container = containerElement;
741
+
742
+ this.promptElement = this.container.querySelector(".prompt span");
743
+ this.inputElement = this.container.querySelector("input");
744
+ this.outputElement = this.container.querySelector("pre");
745
+
746
+ this.inputElement.onkeydown = this.onKeyDown.bind(this);
747
+
748
+ this.setPrompt(">>");
749
+
750
+ REPL.all[this.index] = this;
751
+ }
752
+
753
+ REPL.prototype.focus = function() {
754
+ this.inputElement.focus();
755
+ };
756
+
757
+ REPL.prototype.setPrompt = function(prompt) {
758
+ this._prompt = prompt;
759
+ this.promptElement.innerHTML = escapeHTML(prompt);
760
+ };
761
+
762
+ REPL.prototype.getInput = function() {
763
+ return this.inputElement.value;
764
+ };
765
+
766
+ REPL.prototype.setInput = function(text) {
767
+ this.inputElement.value = text;
768
+
769
+ if(this.inputElement.setSelectionRange) {
770
+ // set cursor to end of input
771
+ this.inputElement.setSelectionRange(text.length, text.length);
772
+ }
773
+ };
774
+
775
+ REPL.prototype.writeRawOutput = function(output) {
776
+ this.outputElement.innerHTML += output;
777
+ this.outputElement.scrollTop = this.outputElement.scrollHeight;
778
+ };
779
+
780
+ REPL.prototype.writeOutput = function(output) {
781
+ this.writeRawOutput(escapeHTML(output));
782
+ };
783
+
784
+ REPL.prototype.sendInput = function(line) {
785
+ var self = this;
786
+ apiCall("eval", { "index": this.index, source: line }, function(response) {
787
+ if(response.error) {
788
+ self.writeOutput(response.error + "\n");
789
+ }
790
+ self.writeOutput(self._prompt + " ");
791
+ self.writeRawOutput(response.highlighted_input + "\n");
792
+ self.writeOutput(response.result);
793
+ self.setPrompt(response.prompt);
794
+ });
795
+ };
796
+
797
+ REPL.prototype.onEnterKey = function() {
798
+ var text = this.getInput();
799
+ if(text != "" && text !== undefined) {
800
+ this.previousCommandOffset = this.previousCommands.push(text);
801
+ }
802
+ this.setInput("");
803
+ this.sendInput(text);
804
+ };
805
+
806
+ REPL.prototype.onNavigateHistory = function(direction) {
807
+ this.previousCommandOffset += direction;
808
+
809
+ if(this.previousCommandOffset < 0) {
810
+ this.previousCommandOffset = -1;
811
+ this.setInput("");
812
+ return;
813
+ }
814
+
815
+ if(this.previousCommandOffset >= this.previousCommands.length) {
816
+ this.previousCommandOffset = this.previousCommands.length;
817
+ this.setInput("");
818
+ return;
819
+ }
820
+
821
+ this.setInput(this.previousCommands[this.previousCommandOffset]);
822
+ };
823
+
824
+ REPL.prototype.onKeyDown = function(ev) {
825
+ if(ev.keyCode == 13) {
826
+ this.onEnterKey();
827
+ } else if(ev.keyCode == 38) {
828
+ // the user pressed the up arrow.
829
+ this.onNavigateHistory(-1);
830
+ return false;
831
+ } else if(ev.keyCode == 40) {
832
+ // the user pressed the down arrow.
833
+ this.onNavigateHistory(1);
834
+ return false;
835
+ }
836
+ };
837
+
838
+ function switchTo(el) {
839
+ if(previousFrameInfo) previousFrameInfo.style.display = "none";
840
+ previousFrameInfo = el;
841
+
842
+ el.style.display = "block";
843
+
844
+ var replInput = el.querySelector('.console input');
845
+ if (replInput) replInput.focus();
846
+ }
847
+
848
+ function selectFrameInfo(index) {
849
+ var el = allFrameInfos[index];
850
+ if(el) {
851
+ if (el.loaded) {
852
+ return switchTo(el);
853
+ }
854
+
855
+ apiCall("variables", { "index": index }, function(response) {
856
+ el.loaded = true;
857
+ if(response.error) {
858
+ el.innerHTML = "<span class='error'>" + escapeHTML(response.error) + "</span>";
859
+ } else {
860
+ el.innerHTML = response.html;
861
+
862
+ var repl = el.querySelector(".repl .console");
863
+ if(repl) {
864
+ new REPL(index).install(repl);
865
+ }
866
+
867
+ switchTo(el);
868
+ }
869
+ });
870
+ }
871
+ }
872
+
873
+ for(var i = 0; i < allFrames.length; i++) {
874
+ (function(i, el) {
875
+ var el = allFrames[i];
876
+ el.onclick = function() {
877
+ if(previousFrame) {
878
+ previousFrame.className = "";
879
+ }
880
+ el.className = "selected";
881
+ previousFrame = el;
882
+
883
+ selectFrameInfo(el.attributes["data-index"].value);
884
+ };
885
+ })(i);
886
+ }
887
+
888
+ // Click the first application frame
889
+ (
890
+ document.querySelector(".frames li.application") ||
891
+ document.querySelector(".frames li")
892
+ ).onclick();
893
+
894
+ var applicationFramesButton = document.getElementById("application_frames");
895
+ var allFramesButton = document.getElementById("all_frames");
896
+
897
+ applicationFramesButton.onclick = function() {
898
+ allFramesButton.className = "";
899
+ applicationFramesButton.className = "selected";
900
+ for(var i = 0; i < allFrames.length; i++) {
901
+ if(allFrames[i].attributes["data-context"].value == "application") {
902
+ allFrames[i].style.display = "block";
903
+ } else {
904
+ allFrames[i].style.display = "none";
905
+ }
906
+ }
907
+ return false;
908
+ };
909
+
910
+ allFramesButton.onclick = function() {
911
+ applicationFramesButton.className = "";
912
+ allFramesButton.className = "selected";
913
+ for(var i = 0; i < allFrames.length; i++) {
914
+ allFrames[i].style.display = "block";
915
+ }
916
+ return false;
917
+ };
918
+
919
+ applicationFramesButton.onclick();
920
+ })();
921
+ </script>
922
+ </html>
923
+ <!-- generated by Better Errors in <%= Time.now.to_f - @start_time %> seconds -->