|
1 | 1 | <!DOCTYPE html> |
2 | 2 | <html> |
3 | 3 | <head> |
| 4 | + <meta charset="utf-8"> |
4 | 5 | <title>CSSLint Demo</title> |
5 | | - <script type="text/javascript" src="../release/csslint.js"></script> |
6 | | - <style type="text/css"> |
| 6 | + <style> |
7 | 7 | .error { color: red; } |
8 | 8 | </style> |
| 9 | + <script src="../release/csslint.js"></script> |
9 | 10 | </head> |
10 | 11 | <body> |
11 | 12 | <h1>CSSLint Demo</h1> |
@@ -72,34 +73,32 @@ <h1>CSSLint Demo</h1> |
72 | 73 | </textarea> |
73 | 74 | <input type="button" id="lint-btn" value="Run CSSLint"> |
74 | 75 | <p>(You may want to keep the CSS kinda small, this could take a while.)</p> |
75 | | - <div id="output"> |
76 | | - |
77 | | - </div> |
| 76 | + <div id="output"></div> |
78 | 77 | <script> |
79 | | - (function(){ |
| 78 | + (function() { |
| 79 | + |
| 80 | + document.body.onclick = function(event) { |
| 81 | + event = event || window.event; |
| 82 | + var target = event.target || event.srcElement, |
| 83 | + results, messages, i, len; |
80 | 84 |
|
81 | | - document.body.onclick = function(event) { |
82 | | - event = event || window.event; |
83 | | - var target = event.target || event.srcElement, |
84 | | - results, messages, i, len; |
85 | 85 |
|
| 86 | + if (target.id == "lint-btn") { |
| 87 | + document.getElementById("output").innerHTML = ""; |
| 88 | + results = CSSLint.verify(document.getElementById("input").value); |
| 89 | + messages = results.messages; |
| 90 | + for (i=0, len=messages.length; i < len; i++) { |
| 91 | + log(messages[i].message + " (line " + messages[i].line + ", col " + messages[i].col + ")", messages[i].type); |
| 92 | + } |
86 | 93 |
|
87 | | - if (target.id == "lint-btn") { |
88 | | - document.getElementById("output").innerHTML = ""; |
89 | | - results = CSSLint.verify(document.getElementById("input").value); |
90 | | - messages = results.messages; |
91 | | - for (i=0, len=messages.length; i < len; i++) { |
92 | | - log(messages[i].message + " (line " + messages[i].line + ", col " + messages[i].col + ")", messages[i].type); |
93 | 94 | } |
| 95 | + }; |
94 | 96 |
|
| 97 | + function log(value, level) { |
| 98 | + var output = document.getElementById("output"); |
| 99 | + output.innerHTML += "<span class=\"" + level + "\">" + value.replace(/ /g, " ") + "</span><br>"; |
95 | 100 | } |
96 | | - }; |
97 | | - |
98 | | - function log(value, level){ |
99 | | - var output = document.getElementById("output"); |
100 | | - output.innerHTML += "<span class=\"" + level + "\">" + value.replace(/ /g, " ") + "</span><br>"; |
101 | | - } |
102 | | - })(); |
| 101 | + })(); |
103 | 102 | </script> |
104 | 103 | </body> |
105 | 104 | </html> |
0 commit comments