# HG changeset patch # User Sonny Piers # Date 1340704934 -7200 # Node ID c06ec02217ee6e905e07f9d084409f51e3dab18b # Parent fb50311997b5290fc5aa808b1b6898bd56ffe5fa many changes diff --git a/README b/README old mode 100644 new mode 100755 diff --git a/console/console.css b/console/console.css new file mode 100755 --- /dev/null +++ b/console/console.css @@ -0,0 +1,44 @@ +html, body { + width: 100%; + height: 100%; +} +body { + margin: 0; + /*FIXME: delete me*/ + overflow: hidden; +} +.entry { + width: 100%; + margin-bottom: 15px; +} +.entry pre { + margin: 0; +} +#entries { + overflow: auto; + height: -webkit-calc(100% - (30px + 100px)); + height: -moz-calc(100% - (30px + 100px)); +} +#toolbar { + width: 100%; + height: 30px; +} +#input { + height: 100px; + width: 100%; +} +#input textarea { + /*border: none;*/ + padding: 0; + resize: none; + width: -webkit-calc(100% - 80px); + width: -moz-calc(100% - 80px); +} +#input input { + width: 65px; +} +#input > * { + display: inline-block; + height: 100%; + vertical-align: top; +} \ No newline at end of file diff --git a/console/console.js b/console/console.js new file mode 100755 --- /dev/null +++ b/console/console.js @@ -0,0 +1,100 @@ +'use strict'; + +var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver; + +if(!Lightstring) + var Lightstring = {}; + +Lightstring.console = { + invertedScroll: true, + log: function(aLog) { + var stanza = vkbeautify.xml(aLog.data, 2, ' '); + var entry = document.createElement('div'); + entry.classList.add('entry'); + entry.classList.add(aLog.dir); + var header = document.createElement('header'); + //FIXME date? should come from the origin? + header.textContent = aLog.dir + ': '; + entry.appendChild(header) + var pre = document.createElement('pre'); + pre.textContent = stanza; + entry.appendChild(pre); + var entriesEl = document.querySelector('#entries') + entriesEl.appendChild(entry); + }, + filter: function(aFilter) { + var entries = document.querySelectorAll('.entry pre'); + for (var i = 0, length = entries.length; i < length; i++) { + var entry = entries[i]; + if (!entry.textContent.match(aFilter)) + entry.parentNode.hidden = true; + else + entry.parentNode.hidden = false; + + //FIXME use the Mutation Observer? get back to the previous scroll state? + this.scrollToBottom(); + } + }, + send: function(aData) { + Lightstring.console.source.postMessage({ + 'send': aData}, document.location.protocol + '//' + document.location.host); + }, + scrollToBottom: function() { + this.entriesEl.scrollTop = (this.entriesEl.scrollHeight - this.entriesEl.clientHeight); + } +}; + +(function() { + document.addEventListener('DOMContentLoaded', function() { + + var entriesEl = document.getElementById('entries'); + entriesEl.addEventListener('scroll', function(e) { + if (entriesEl.scrollTop === (entriesEl.scrollHeight - entriesEl.clientHeight)) + Lightstring.console.invertedScroll = true; + else + Lightstring.console.invertedScroll = false; + }) + + new MutationObserver(function(mutations) { + if(Lightstring.console.invertedScroll === true) + Lightstring.console.scrollToBottom(); + }).observe(entriesEl, { + childList: true, + // attributes: false, + // characterData: false + }); + + Lightstring.console.entriesEl = entriesEl; + if (Lightstring.console.invertedScroll) + Lightstring.console.scrollToBottom(); + + window.addEventListener("message", function(e) { + if(!Lightstring.console.source) + Lightstring.console.source = e.source; + + Lightstring.console.log(e.data); + }, false); + + document.getElementById('input').addEventListener('submit', function(e) { + e.preventDefault(); + Lightstring.console.send(this.elements['field'].value) + }); + document.getElementById('clear').addEventListener('click', function(e) { + Lightstring.console.entriesEl.innerHTML = ''; + }); + //FIXME allow xpath, xquery, E4X, whatever XML query syntax + document.getElementById('filter').addEventListener('input', function(e) { + Lightstring.console.filter(this.value); + }); + document.getElementById('input').addEventListener('keypress', function(e) { + if (e.keyCode === 13) { + if (e.shiftKey) { + e.preventDefault(); + var event = document.createEvent('Event'); + event.initEvent('submit', true, true); + this.dispatchEvent(event); + } + } + }); + }); +})(); \ No newline at end of file diff --git a/console/console.xhtml b/console/console.xhtml new file mode 100755 --- /dev/null +++ b/console/console.xhtml @@ -0,0 +1,21 @@ + + + + Lightstring Console + +