|
106
|
1 'use strict';
|
|
|
2
|
|
|
3 (function() {
|
|
108
|
4 var Console = {
|
|
|
5 holder: [],
|
|
|
6 invertedScroll: true,
|
|
|
7 log: function(aLog) {
|
|
|
8 if (document.readyState !== 'complete') {
|
|
|
9 this.holder.push(aLog);
|
|
|
10 return;
|
|
|
11 }
|
|
|
12 //beautify
|
|
|
13 var stanza = vkbeautify.xml(aLog.data, 2, ' ');
|
|
|
14 var entry = document.createElement('div');
|
|
|
15 entry.classList.add('entry');
|
|
|
16 entry.classList.add(aLog.dir);
|
|
|
17 var header = document.createElement('header');
|
|
|
18 var date = new Date();
|
|
|
19 var hours = (date.getHours() < 10 ? '0' : '') + date.getHours();
|
|
|
20 var minutes = (date.getMinutes() < 10 ? '0' : '') + date.getMinutes();
|
|
|
21 var seconds = (date.getSeconds() < 10 ? '0' : '') + date.getSeconds();
|
|
|
22 var timestamp = hours + ':' + minutes + ':' + seconds + '.' + date.getMilliseconds();
|
|
|
23 header.textContent = aLog.dir + ': ' + timestamp;
|
|
|
24 entry.appendChild(header)
|
|
|
25 var pre = document.createElement('pre');
|
|
|
26 pre.textContent = stanza;
|
|
|
27 entry.appendChild(pre);
|
|
|
28 //highlight
|
|
|
29 hljs.highlightBlock(entry.children[1], null, false);
|
|
|
30 var entriesEl = document.querySelector('#entries')
|
|
106
|
31
|
|
108
|
32 var child = entriesEl.firstChild;
|
|
|
33 if(child)
|
|
|
34 entriesEl.insertBefore(entry, child);
|
|
|
35 else
|
|
|
36 entriesEl.appendChild(entry)
|
|
|
37 },
|
|
|
38 filter: function(aFilter) {
|
|
|
39 var entries = document.querySelectorAll('.entry pre');
|
|
|
40 for (var i = 0, length = entries.length; i < length; i++) {
|
|
|
41 var entry = entries[i];
|
|
|
42 if (!entry.textContent.match(aFilter))
|
|
|
43 entry.parentNode.hidden = true;
|
|
|
44 else
|
|
|
45 entry.parentNode.hidden = false;
|
|
|
46 }
|
|
|
47 },
|
|
|
48 send: function(aData) {
|
|
|
49 //C'mon you can do better
|
|
|
50 Lightstring.connections[0].send(aData)
|
|
|
51 },
|
|
|
52 init: function() {
|
|
|
53 if (Lightstring.Connection) {
|
|
|
54 Lightstring.Connection.prototype.on('stanza', function(stanza) {
|
|
|
55 Lightstring.console.log({dir: 'in', data: stanza.toString()});
|
|
|
56 });
|
|
|
57 Lightstring.Connection.prototype.on('out', function(stanza) {
|
|
|
58 Lightstring.console.log({dir: 'out', data: stanza.toString()});
|
|
|
59 });
|
|
|
60 }
|
|
|
61 if (document.readyState === 'complete')
|
|
|
62 return this.initView();
|
|
|
63
|
|
|
64 document.addEventListener('DOMContentLoaded', this.initView);
|
|
|
65 },
|
|
|
66 initView: function() {
|
|
|
67 Lightstring.console.holder.forEach(function(log) {
|
|
|
68 Lightstring.console.log(log);
|
|
|
69 });
|
|
106
|
70
|
|
108
|
71
|
|
|
72 var entriesEl = document.getElementById('entries');
|
|
|
73 Console.entriesEl = entriesEl;
|
|
|
74
|
|
|
75 document.getElementById('input').addEventListener('submit', function(e) {
|
|
|
76 e.preventDefault();
|
|
|
77 Lightstring.console.send(this.elements['field'].value)
|
|
|
78 });
|
|
|
79 document.getElementById('clear').addEventListener('click', function(e) {
|
|
|
80 Lightstring.console.entriesEl.innerHTML = '';
|
|
|
81 });
|
|
|
82 //FIXME allow xpath, xquery, E4X, whatever XML query syntax
|
|
|
83 document.getElementById('filter').addEventListener('input', function(e) {
|
|
|
84 Lightstring.console.filter(this.value);
|
|
|
85 });
|
|
|
86 document.getElementById('input').addEventListener('keypress', function(e) {
|
|
|
87 if (e.keyCode === 13) {
|
|
|
88 if (e.shiftKey) {
|
|
|
89 e.preventDefault();
|
|
|
90 var event = document.createEvent('Event');
|
|
|
91 event.initEvent('submit', true, true);
|
|
|
92 this.dispatchEvent(event);
|
|
|
93 }
|
|
106
|
94 }
|
|
108
|
95 });
|
|
|
96 }
|
|
|
97 };
|
|
|
98
|
|
|
99 //Lightstring is defined in the parent window context
|
|
|
100 if (window.frameElement && window.parent.Lightstring) {
|
|
|
101 window.Lightstring = window.parent.Lightstring;
|
|
|
102 Lightstring.console = Console;
|
|
|
103 Lightstring.console.init();
|
|
|
104 }
|
|
|
105 else {
|
|
|
106 //TODO: link to a doc?
|
|
|
107 console.error('You must embed this in a iframe.');
|
|
|
108 }
|
|
106
|
109 })(); |
