Siobhan Tully | e18b344 | 2014-02-23 14:23:34 -0500 | [diff] [blame] | 1 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
| 2 | <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
|
| 3 | <head>
|
| 4 | <title>log4javascript</title>
|
| 5 | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
| 6 | <!-- Make IE8 behave like IE7, having gone to all the trouble of making IE work -->
|
| 7 | <meta http-equiv="X-UA-Compatible" content="IE=7" />
|
| 8 | <script type="text/javascript">
|
| 9 | //<![CDATA[
|
| 10 | var loggingEnabled = true;
|
| 11 | var messagesBeforeDocLoaded = [];
|
| 12 |
|
| 13 | function toggleLoggingEnabled() {
|
| 14 | setLoggingEnabled($("enableLogging").checked);
|
| 15 | }
|
| 16 |
|
| 17 | function setLoggingEnabled(enable) {
|
| 18 | loggingEnabled = enable;
|
| 19 | }
|
| 20 |
|
| 21 | function scrollToLatestEntry() {
|
| 22 | var l = getLogContainer();
|
| 23 | if (typeof l.scrollTop != "undefined") {
|
| 24 | var latestLogEntry = l.lastChild;
|
| 25 | if (latestLogEntry) {
|
| 26 | l.scrollTop = l.scrollHeight;
|
| 27 | }
|
| 28 | }
|
| 29 | }
|
| 30 |
|
| 31 | function log(logLevel, formattedMessage) {
|
| 32 | if (loggingEnabled) {
|
| 33 | if (loaded) {
|
| 34 | doLog(logLevel, formattedMessage);
|
| 35 | } else {
|
| 36 | messagesBeforeDocLoaded.push([logLevel, formattedMessage]);
|
| 37 | }
|
| 38 | }
|
| 39 | }
|
| 40 |
|
| 41 | function doLog(logLevel, formattedMessage) {
|
| 42 | var logEntry = document.createElement("div");
|
| 43 | logEntry.appendChild(document.createTextNode(formattedMessage));
|
| 44 | logEntry.className = "logentry " + logLevel.name;
|
| 45 | getLogContainer().appendChild(logEntry);
|
| 46 | scrollToLatestEntry();
|
| 47 | }
|
| 48 |
|
| 49 | function mainPageReloaded() {
|
| 50 | var separator = document.createElement("div");
|
| 51 | separator.className = "separator";
|
| 52 | separator.innerHTML = " ";
|
| 53 | getLogContainer().appendChild(separator);
|
| 54 | }
|
| 55 |
|
| 56 | var loaded = false;
|
| 57 | var logLevels = ["DEBUG", "INFO", "WARN", "ERROR", "FATAL"];
|
| 58 |
|
| 59 | window.onload = function() {
|
| 60 | setLogContainerHeight();
|
| 61 | toggleLoggingEnabled();
|
| 62 | for (var i = 0; i < messagesBeforeDocLoaded.length; i++) {
|
| 63 | doLog(messagesBeforeDocLoaded[i][0], messagesBeforeDocLoaded[i][1]);
|
| 64 | }
|
| 65 | messagesBeforeDocLoaded = [];
|
| 66 | loaded = true;
|
| 67 |
|
| 68 | // Workaround to make sure log div starts at the correct size
|
| 69 | setTimeout(setLogContainerHeight, 20);
|
| 70 | };
|
| 71 |
|
| 72 | function getLogContainer() {
|
| 73 | return $("log");
|
| 74 | }
|
| 75 |
|
| 76 | function clearLog() {
|
| 77 | getLogContainer().innerHTML = "";
|
| 78 | }
|
| 79 |
|
| 80 | /* ------------------------------------------------------------------------- */
|
| 81 |
|
| 82 | // Other utility functions
|
| 83 |
|
| 84 | // Syntax borrowed from Prototype library
|
| 85 | function $(id) {
|
| 86 | return document.getElementById(id);
|
| 87 | }
|
| 88 |
|
| 89 | function getWindowHeight() {
|
| 90 | if (window.innerHeight) {
|
| 91 | return window.innerHeight;
|
| 92 | } else if (document.documentElement && document.documentElement.clientHeight) {
|
| 93 | return document.documentElement.clientHeight;
|
| 94 | } else if (document.body) {
|
| 95 | return document.body.clientHeight;
|
| 96 | }
|
| 97 | return 0;
|
| 98 | }
|
| 99 |
|
| 100 | function getChromeHeight() {
|
| 101 | return $("toolbar").offsetHeight;
|
| 102 | }
|
| 103 |
|
| 104 | function setLogContainerHeight() {
|
| 105 | var windowHeight = getWindowHeight();
|
| 106 | $("body").style.height = getWindowHeight() + "px";
|
| 107 | getLogContainer().style.height = "" +
|
| 108 | Math.max(0, windowHeight - getChromeHeight()) + "px";
|
| 109 | }
|
| 110 |
|
| 111 | window.onresize = function() {
|
| 112 | setLogContainerHeight();
|
| 113 | };
|
| 114 |
|
| 115 | //]]>
|
| 116 | </script>
|
| 117 | <style type="text/css">
|
| 118 | body {
|
| 119 | background-color: white;
|
| 120 | color: black;
|
| 121 | padding: 0;
|
| 122 | margin: 0;
|
| 123 | font-family: tahoma, verdana, arial, helvetica, sans-serif;
|
| 124 | overflow: hidden;
|
| 125 | }
|
| 126 |
|
| 127 | div#toolbar {
|
| 128 | border-top: solid #ffffff 1px;
|
| 129 | border-bottom: solid #aca899 1px;
|
| 130 | background-color: #f1efe7;
|
| 131 | padding: 3px 5px;
|
| 132 | font-size: 68.75%;
|
| 133 | }
|
| 134 |
|
| 135 | div#toolbar input.button {
|
| 136 | padding: 0 5px;
|
| 137 | font-size: 100%;
|
| 138 | }
|
| 139 |
|
| 140 | div#log {
|
| 141 | font-family: Courier New, Courier;
|
| 142 | font-size: 75%;
|
| 143 | width: 100%;
|
| 144 | overflow: auto;
|
| 145 | clear: both;
|
| 146 | }
|
| 147 |
|
| 148 | *.logentry {
|
| 149 | overflow: visible;
|
| 150 | white-space: pre;
|
| 151 | }
|
| 152 |
|
| 153 | *.TRACE {
|
| 154 | color: #666666;
|
| 155 | }
|
| 156 |
|
| 157 | *.DEBUG {
|
| 158 | color: green;
|
| 159 | }
|
| 160 |
|
| 161 | *.INFO {
|
| 162 | color: #000099;
|
| 163 | }
|
| 164 |
|
| 165 | *.WARN {
|
| 166 | color: #999900;
|
| 167 | }
|
| 168 |
|
| 169 | *.ERROR {
|
| 170 | color: red;
|
| 171 | }
|
| 172 |
|
| 173 | *.FATAL {
|
| 174 | color: #660066;
|
| 175 | }
|
| 176 |
|
| 177 | div#log div.separator {
|
| 178 | background-color: #cccccc;
|
| 179 | margin: 5px 0;
|
| 180 | line-height: 1px;
|
| 181 | }
|
| 182 | </style>
|
| 183 | </head>
|
| 184 |
|
| 185 | <body id="body">
|
| 186 | <div id="toolbar">
|
| 187 | Options:
|
| 188 | <input type="checkbox" id="enableLogging" onclick="toggleLoggingEnabled()" class="stateful" checked="checked" title="Enable/disable logging" /><label for="enableLogging" id="enableLoggingLabel">Enable logging</label>
|
| 189 | <input type="button" id="clearButton" value="Clear" onclick="clearLog()" class="stateful button" title="Clear all log messages" />
|
| 190 | <input type="button" id="closeButton" value="Close" onclick="window.close()" class="stateful button" title="Close the window" />
|
| 191 | </div>
|
| 192 | <div id="log" class="TRACE DEBUG INFO WARN ERROR FATAL"></div>
|
| 193 | </body>
|
| 194 | </html> |