aboutsummaryrefslogtreecommitdiffstats
path: root/plugins/LocalFilesEditor/codemirror/mode/css
diff options
context:
space:
mode:
authorpatdenice <patdenice@piwigo.org>2011-04-12 11:12:51 +0000
committerpatdenice <patdenice@piwigo.org>2011-04-12 11:12:51 +0000
commita740ef91e6689f86011b70c7bbe2589abf78ae6b (patch)
treebb4a6deb7395b0f545bb760cf34f093e910f1cff /plugins/LocalFilesEditor/codemirror/mode/css
parentbb7c28f86febddd376ee0400807507991a2d7b48 (diff)
feature:2262
Replace editarea by Codemirror: http://codemirror.net git-svn-id: http://piwigo.org/svn/trunk@10307 68402e56-0260-453c-a942-63ccdbb3a9ee
Diffstat (limited to 'plugins/LocalFilesEditor/codemirror/mode/css')
-rw-r--r--plugins/LocalFilesEditor/codemirror/mode/css/css.css9
-rw-r--r--plugins/LocalFilesEditor/codemirror/mode/css/css.js124
-rw-r--r--plugins/LocalFilesEditor/codemirror/mode/css/index.html56
3 files changed, 189 insertions, 0 deletions
diff --git a/plugins/LocalFilesEditor/codemirror/mode/css/css.css b/plugins/LocalFilesEditor/codemirror/mode/css/css.css
new file mode 100644
index 000000000..02d40ecb2
--- /dev/null
+++ b/plugins/LocalFilesEditor/codemirror/mode/css/css.css
@@ -0,0 +1,9 @@
+span.css-at {color: #708;}
+span.css-unit {color: #281;}
+span.css-value {color: #708;}
+span.css-identifier {color: black;}
+span.css-selector {color: #11B;}
+span.css-important {color: #00F;}
+span.css-colorcode {color: #299;}
+span.css-comment {color: #A70;}
+span.css-string {color: #A22;}
diff --git a/plugins/LocalFilesEditor/codemirror/mode/css/css.js b/plugins/LocalFilesEditor/codemirror/mode/css/css.js
new file mode 100644
index 000000000..5faad7b2f
--- /dev/null
+++ b/plugins/LocalFilesEditor/codemirror/mode/css/css.js
@@ -0,0 +1,124 @@
+CodeMirror.defineMode("css", function(config) {
+ var indentUnit = config.indentUnit, type;
+ function ret(style, tp) {type = tp; return style;}
+
+ function tokenBase(stream, state) {
+ var ch = stream.next();
+ if (ch == "@") {stream.eatWhile(/\w/); return ret("css-at", stream.current());}
+ else if (ch == "/" && stream.eat("*")) {
+ state.tokenize = tokenCComment;
+ return tokenCComment(stream, state);
+ }
+ else if (ch == "<" && stream.eat("!")) {
+ state.tokenize = tokenSGMLComment;
+ return tokenSGMLComment(stream, state);
+ }
+ else if (ch == "=") ret(null, "compare");
+ else if ((ch == "~" || ch == "|") && stream.eat("=")) return ret(null, "compare");
+ else if (ch == "\"" || ch == "'") {
+ state.tokenize = tokenString(ch);
+ return state.tokenize(stream, state);
+ }
+ else if (ch == "#") {
+ stream.eatWhile(/\w/);
+ return ret("css-selector", "hash");
+ }
+ else if (ch == "!") {
+ stream.match(/^\s*\w*/);
+ return ret("css-important", "important");
+ }
+ else if (/\d/.test(ch)) {
+ stream.eatWhile(/[\w.%]/);
+ return ret("css-unit", "unit");
+ }
+ else if (/[,.+>*\/]/.test(ch)) {
+ return ret(null, "select-op");
+ }
+ else if (/[;{}:\[\]]/.test(ch)) {
+ return ret(null, ch);
+ }
+ else {
+ stream.eatWhile(/[\w\\\-_]/);
+ return ret("css-identifier", "identifier");
+ }
+ }
+
+ function tokenCComment(stream, state) {
+ var maybeEnd = false, ch;
+ while ((ch = stream.next()) != null) {
+ if (maybeEnd && ch == "/") {
+ state.tokenize = tokenBase;
+ break;
+ }
+ maybeEnd = (ch == "*");
+ }
+ return ret("css-comment", "comment");
+ }
+
+ function tokenSGMLComment(stream, state) {
+ var dashes = 0, ch;
+ while ((ch = stream.next()) != null) {
+ if (dashes >= 2 && ch == ">") {
+ state.tokenize = tokenBase;
+ break;
+ }
+ dashes = (ch == "-") ? dashes + 1 : 0;
+ }
+ return ret("css-comment", "comment");
+ }
+
+ function tokenString(quote) {
+ return function(stream, state) {
+ var escaped = false, ch;
+ while ((ch = stream.next()) != null) {
+ if (ch == quote && !escaped)
+ break;
+ escaped = !escaped && ch == "\\";
+ }
+ if (!escaped) state.tokenize = tokenBase;
+ return ret("css-string", "string");
+ };
+ }
+
+ return {
+ startState: function(base) {
+ return {tokenize: tokenBase,
+ baseIndent: base || 0,
+ stack: []};
+ },
+
+ token: function(stream, state) {
+ if (stream.eatSpace()) return null;
+ var style = state.tokenize(stream, state);
+
+ var context = state.stack[state.stack.length-1];
+ if (type == "hash" && context == "rule") style = "css-colorcode";
+ else if (style == "css-identifier") {
+ if (context == "rule") style = "css-value";
+ else if (!context || context == "@media{") style = "css-selector";
+ }
+
+ if (context == "rule" && /^[\{\};]$/.test(type))
+ state.stack.pop();
+ if (type == "{") {
+ if (context == "@media") state.stack[state.stack.length-1] = "@media{";
+ else state.stack.push("{");
+ }
+ else if (type == "}") state.stack.pop();
+ else if (type == "@media") state.stack.push("@media");
+ else if (context != "rule" && context != "@media" && type != "comment") state.stack.push("rule");
+ return style;
+ },
+
+ indent: function(state, textAfter) {
+ var n = state.stack.length;
+ if (/^\}/.test(textAfter))
+ n -= state.stack[state.stack.length-1] == "rule" ? 2 : 1;
+ return state.baseIndent + n * indentUnit;
+ },
+
+ electricChars: "}"
+ };
+});
+
+CodeMirror.defineMIME("text/css", "css");
diff --git a/plugins/LocalFilesEditor/codemirror/mode/css/index.html b/plugins/LocalFilesEditor/codemirror/mode/css/index.html
new file mode 100644
index 000000000..ad895610f
--- /dev/null
+++ b/plugins/LocalFilesEditor/codemirror/mode/css/index.html
@@ -0,0 +1,56 @@
+<!doctype html>
+<html>
+ <head>
+ <title>CodeMirror 2: CSS mode</title>
+ <link rel="stylesheet" href="../../lib/codemirror.css">
+ <script src="../../lib/codemirror.js"></script>
+ <script src="css.js"></script>
+ <link rel="stylesheet" href="css.css">
+ <style>.CodeMirror {background: #f8f8f8;}</style>
+ <link rel="stylesheet" href="../../css/docs.css">
+ </head>
+ <body>
+ <h1>CodeMirror 2: CSS mode</h1>
+ <form><textarea id="code" name="code">
+/* Some example CSS */
+
+@import url("something.css");
+
+body {
+ margin: 0;
+ padding: 3em 6em;
+ font-family: tahoma, arial, sans-serif;
+ color: #000;
+}
+
+#navigation a {
+ font-weight: bold;
+ text-decoration: none !important;
+}
+
+h1 {
+ font-size: 2.5em;
+}
+
+h2 {
+ font-size: 1.7em;
+}
+
+h1:before, h2:before {
+ content: "::";
+}
+
+code {
+ font-family: courier, monospace;
+ font-size: 80%;
+ color: #418A8A;
+}
+</textarea></form>
+ <script>
+ var editor = CodeMirror.fromTextArea(document.getElementById("code"), {});
+ </script>
+
+ <p><strong>MIME types defined:</strong> <code>text/css</code>.</p>
+
+ </body>
+</html>