Commit | Line | Data |
---|---|---|
ba83908c | 1 | ;;; css-mode.el --- Major mode to edit CSS files -*- lexical-binding: t -*- |
d500a092 | 2 | |
ba318903 | 3 | ;; Copyright (C) 2006-2014 Free Software Foundation, Inc. |
d500a092 SM |
4 | |
5 | ;; Author: Stefan Monnier <monnier@iro.umontreal.ca> | |
6 | ;; Keywords: hypermedia | |
7 | ||
1fecc8fe GM |
8 | ;; This file is part of GNU Emacs. |
9 | ||
10 | ;; GNU Emacs is free software: you can redistribute it and/or modify | |
d500a092 | 11 | ;; it under the terms of the GNU General Public License as published by |
1fecc8fe GM |
12 | ;; the Free Software Foundation, either version 3 of the License, or |
13 | ;; (at your option) any later version. | |
d500a092 | 14 | |
1fecc8fe | 15 | ;; GNU Emacs is distributed in the hope that it will be useful, |
d500a092 SM |
16 | ;; but WITHOUT ANY WARRANTY; without even the implied warranty of |
17 | ;; MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | |
18 | ;; GNU General Public License for more details. | |
19 | ||
20 | ;; You should have received a copy of the GNU General Public License | |
1fecc8fe | 21 | ;; along with GNU Emacs. If not, see <http://www.gnu.org/licenses/>. |
d500a092 SM |
22 | |
23 | ;;; Commentary: | |
24 | ||
25 | ;; Yet another CSS mode. | |
26 | ||
27 | ;;; Todo: | |
28 | ||
29 | ;; - electric ; and } | |
30 | ;; - filling code with auto-fill-mode | |
31 | ;; - completion | |
32 | ;; - fix font-lock errors with multi-line selectors | |
33 | ||
34 | ;;; Code: | |
35 | ||
96736d92 GM |
36 | (defgroup css nil |
37 | "Cascading Style Sheets (CSS) editing mode." | |
38 | :group 'languages) | |
39 | ||
088d6743 | 40 | |
d500a092 SM |
41 | (defun css-extract-keyword-list (res) |
42 | (with-temp-buffer | |
43 | (url-insert-file-contents "http://www.w3.org/TR/REC-CSS2/css2.txt") | |
44 | (goto-char (point-max)) | |
45 | (search-backward "Appendix H. Index") | |
46 | (forward-line) | |
47 | (delete-region (point-min) (point)) | |
48 | (let ((result nil) | |
49 | keys) | |
50 | (dolist (re res) | |
51 | (goto-char (point-min)) | |
52 | (setq keys nil) | |
53 | (while (re-search-forward (cdr re) nil t) | |
54 | (push (match-string 1) keys)) | |
55 | (push (cons (car re) (sort keys 'string-lessp)) result)) | |
56 | (nreverse result)))) | |
57 | ||
58 | (defun css-extract-parse-val-grammar (string env) | |
59 | (let ((start 0) | |
60 | (elems ()) | |
61 | name) | |
62 | (while (string-match | |
63 | (concat "\\(?:" | |
64 | (concat "<a [^>]+><span [^>]+>\\(?:" | |
65 | "<\\([^&]+\\)>\\|'\\([^']+\\)'" | |
66 | "\\)</span></a>") | |
67 | "\\|" "\\(\\[\\)" | |
68 | "\\|" "\\(]\\)" | |
69 | "\\|" "\\(||\\)" | |
70 | "\\|" "\\(|\\)" | |
71 | "\\|" "\\([*+?]\\)" | |
72 | "\\|" "\\({[^}]+}\\)" | |
73 | "\\|" "\\(\\w+\\(?:-\\w+\\)*\\)" | |
74 | "\\)[ \t\n]*") | |
75 | string start) | |
76 | ;; (assert (eq start (match-beginning 0))) | |
77 | (setq start (match-end 0)) | |
78 | (cond | |
79 | ;; Reference to a type of value. | |
80 | ((setq name (match-string-no-properties 1 string)) | |
81 | (push (intern name) elems)) | |
82 | ;; Reference to another property's values. | |
83 | ((setq name (match-string-no-properties 2 string)) | |
84 | (setq elems (delete-dups (append (cdr (assoc name env)) elems)))) | |
85 | ;; A literal | |
86 | ((setq name (match-string-no-properties 9 string)) | |
87 | (push name elems)) | |
88 | ;; We just ignore the rest. I.e. we ignore the structure because | |
89 | ;; it's too difficult to exploit anyway (it would allow us to only | |
90 | ;; complete top/center/bottom after one of left/center/right and | |
91 | ;; vice-versa). | |
92 | (t nil))) | |
93 | elems)) | |
9e3fd593 | 94 | |
d500a092 SM |
95 | |
96 | (defun css-extract-props-and-vals () | |
97 | (with-temp-buffer | |
98 | (url-insert-file-contents "http://www.w3.org/TR/CSS21/propidx.html") | |
99 | (goto-char (point-min)) | |
100 | (let ((props ())) | |
101 | (while (re-search-forward "#propdef-\\([^\"]+\\)\"><span class=\"propinst-\\1 xref\">'\\1'</span></a>" nil t) | |
102 | (let ((prop (match-string-no-properties 1))) | |
103 | (save-excursion | |
104 | (goto-char (match-end 0)) | |
105 | (search-forward "<td>") | |
106 | (let ((vals-string (buffer-substring (point) | |
107 | (progn | |
108 | (re-search-forward "[ \t\n]+|[ \t\n]+<a href=\"cascade.html#value-def-inherit\" class=\"noxref\"><span class=\"value-inst-inherit\">inherit</span></a>") | |
109 | (match-beginning 0))))) | |
9e3fd593 | 110 | ;; |
d500a092 SM |
111 | (push (cons prop (css-extract-parse-val-grammar vals-string props)) |
112 | props))))) | |
113 | props))) | |
114 | ||
115 | ;; Extraction was done with: | |
116 | ;; (css-extract-keyword-list | |
117 | ;; '((pseudo . "^ +\\* :\\([^ \n,]+\\)") | |
118 | ;; (at . "^ +\\* @\\([^ \n,]+\\)") | |
119 | ;; (descriptor . "^ +\\* '\\([^ '\n]+\\)' (descriptor)") | |
120 | ;; (media . "^ +\\* '\\([^ '\n]+\\)' media group") | |
121 | ;; (property . "^ +\\* '\\([^ '\n]+\\)',"))) | |
122 | ||
123 | (defconst css-pseudo-ids | |
124 | '("active" "after" "before" "first" "first-child" "first-letter" "first-line" | |
125 | "focus" "hover" "lang" "left" "link" "right" "visited") | |
126 | "Identifiers for pseudo-elements and pseudo-classes.") | |
127 | ||
128 | (defconst css-at-ids | |
129 | '("charset" "font-face" "import" "media" "page") | |
130 | "Identifiers that appear in the form @foo.") | |
131 | ||
132 | (defconst css-descriptor-ids | |
133 | '("ascent" "baseline" "bbox" "cap-height" "centerline" "definition-src" | |
134 | "descent" "font-family" "font-size" "font-stretch" "font-style" | |
135 | "font-variant" "font-weight" "mathline" "panose-1" "slope" "src" "stemh" | |
136 | "stemv" "topline" "unicode-range" "units-per-em" "widths" "x-height") | |
137 | "Identifiers for font descriptors.") | |
138 | ||
139 | (defconst css-media-ids | |
140 | '("all" "aural" "bitmap" "continuous" "grid" "paged" "static" "tactile" | |
141 | "visual") | |
142 | "Identifiers for types of media.") | |
143 | ||
144 | (defconst css-property-ids | |
145 | '("azimuth" "background" "background-attachment" "background-color" | |
146 | "background-image" "background-position" "background-repeat" "block" | |
147 | "border" "border-bottom" "border-bottom-color" "border-bottom-style" | |
148 | "border-bottom-width" "border-collapse" "border-color" "border-left" | |
149 | "border-left-color" "border-left-style" "border-left-width" "border-right" | |
150 | "border-right-color" "border-right-style" "border-right-width" | |
151 | "border-spacing" "border-style" "border-top" "border-top-color" | |
152 | "border-top-style" "border-top-width" "border-width" "bottom" | |
153 | "caption-side" "clear" "clip" "color" "compact" "content" | |
154 | "counter-increment" "counter-reset" "cue" "cue-after" "cue-before" | |
155 | "cursor" "dashed" "direction" "display" "dotted" "double" "elevation" | |
156 | "empty-cells" "float" "font" "font-family" "font-size" "font-size-adjust" | |
157 | "font-stretch" "font-style" "font-variant" "font-weight" "groove" "height" | |
158 | "hidden" "inline" "inline-table" "inset" "left" "letter-spacing" | |
159 | "line-height" "list-item" "list-style" "list-style-image" | |
160 | "list-style-position" "list-style-type" "margin" "margin-bottom" | |
161 | "margin-left" "margin-right" "margin-top" "marker-offset" "marks" | |
162 | "max-height" "max-width" "min-height" "min-width" "orphans" "outline" | |
163 | "outline-color" "outline-style" "outline-width" "outset" "overflow" | |
164 | "padding" "padding-bottom" "padding-left" "padding-right" "padding-top" | |
165 | "page" "page-break-after" "page-break-before" "page-break-inside" "pause" | |
166 | "pause-after" "pause-before" "pitch" "pitch-range" "play-during" "position" | |
167 | "quotes" "richness" "ridge" "right" "run-in" "size" "solid" "speak" | |
168 | "speak-header" "speak-numeral" "speak-punctuation" "speech-rate" "stress" | |
169 | "table" "table-caption" "table-cell" "table-column" "table-column-group" | |
170 | "table-footer-group" "table-header-group" "table-layout" "table-row" | |
171 | "table-row-group" "text-align" "text-decoration" "text-indent" | |
172 | "text-shadow" "text-transform" "top" "unicode-bidi" "vertical-align" | |
173 | "visibility" "voice-family" "volume" "white-space" "widows" "width" | |
174 | "word-spacing" "z-index") | |
175 | "Identifiers for properties.") | |
176 | ||
fb7d9275 | 177 | (defcustom css-electric-keys '(?\} ?\;) ;; '() |
d500a092 | 178 | "Self inserting keys which should trigger re-indentation." |
8e788369 | 179 | :version "22.2" |
d500a092 | 180 | :type '(repeat character) |
96736d92 GM |
181 | :options '((?\} ?\;)) |
182 | :group 'css) | |
d500a092 SM |
183 | |
184 | (defvar css-mode-syntax-table | |
185 | (let ((st (make-syntax-table))) | |
186 | ;; C-style comments. | |
187 | (modify-syntax-entry ?/ ". 14" st) | |
188 | (modify-syntax-entry ?* ". 23" st) | |
189 | ;; Strings. | |
190 | (modify-syntax-entry ?\" "\"" st) | |
191 | (modify-syntax-entry ?\' "\"" st) | |
192 | ;; Blocks. | |
193 | (modify-syntax-entry ?\{ "(}" st) | |
194 | (modify-syntax-entry ?\} "){" st) | |
195 | ;; Args in url(...) thingies and other "function calls". | |
196 | (modify-syntax-entry ?\( "()" st) | |
197 | (modify-syntax-entry ?\) ")(" st) | |
198 | ;; To match attributes in selectors. | |
199 | (modify-syntax-entry ?\[ "(]" st) | |
200 | (modify-syntax-entry ?\] ")[" st) | |
201 | ;; Special chars that sometimes come at the beginning of words. | |
202 | (modify-syntax-entry ?@ "'" st) | |
203 | ;; (modify-syntax-entry ?: "'" st) | |
204 | (modify-syntax-entry ?# "'" st) | |
205 | ;; Distinction between words and symbols. | |
206 | (modify-syntax-entry ?- "_" st) | |
207 | st)) | |
208 | ||
209 | (defconst css-escapes-re | |
210 | "\\\\\\(?:[^\000-\037\177]\\|[0-9a-fA-F]+[ \n\t\r\f]?\\)") | |
211 | (defconst css-nmchar-re (concat "\\(?:[-[:alnum:]]\\|" css-escapes-re "\\)")) | |
212 | (defconst css-nmstart-re (concat "\\(?:[[:alpha:]]\\|" css-escapes-re "\\)")) | |
213 | (defconst css-ident-re (concat css-nmstart-re css-nmchar-re "*")) | |
5b3a105e | 214 | (defconst css-proprietary-nmstart-re ;; Vendor-specific properties. |
ec49bd31 | 215 | (concat "[-_]" (regexp-opt '("ms" "moz" "o" "khtml" "webkit")) "-")) |
d500a092 SM |
216 | (defconst css-name-re (concat css-nmchar-re "+")) |
217 | ||
218 | (defface css-selector '((t :inherit font-lock-function-name-face)) | |
96736d92 GM |
219 | "Face to use for selectors." |
220 | :group 'css) | |
d500a092 | 221 | (defface css-property '((t :inherit font-lock-variable-name-face)) |
96736d92 GM |
222 | "Face to use for properties." |
223 | :group 'css) | |
5b3a105e SM |
224 | (defface css-proprietary-property '((t :inherit (css-property italic))) |
225 | "Face to use for vendor-specific properties.") | |
d500a092 SM |
226 | |
227 | (defvar css-font-lock-keywords | |
228 | `(("!\\s-*important" . font-lock-builtin-face) | |
229 | ;; Atrules keywords. IDs not in css-at-ids are valid (ignored). | |
230 | ;; In fact the regexp should probably be | |
231 | ;; (,(concat "\\(@" css-ident-re "\\)\\([ \t\n][^;{]*\\)[;{]") | |
232 | ;; (1 font-lock-builtin-face)) | |
233 | ;; Since "An at-rule consists of everything up to and including the next | |
234 | ;; semicolon (;) or the next block, whichever comes first." | |
235 | (,(concat "@" css-ident-re) . font-lock-builtin-face) | |
236 | ;; Selectors. | |
237 | ;; FIXME: attribute selectors don't work well because they may contain | |
238 | ;; strings which have already been highlighted as f-l-string-face and | |
239 | ;; thus prevent this highlighting from being applied (actually now that | |
d939cbea | 240 | ;; I use `append' this should work better). But really the part of the |
d500a092 | 241 | ;; selector between [...] should simply not be highlighted. |
ad85fe1f | 242 | (,(concat "^\\([ \t]*[^@:{}\n][^:{}]+\\(?::" (regexp-opt css-pseudo-ids t) |
d500a092 SM |
243 | "\\(?:([^)]+)\\)?[^:{\n]*\\)*\\)\\(?:\n[ \t]*\\)*{") |
244 | (1 'css-selector append)) | |
245 | ;; In the above rule, we allow the open-brace to be on some subsequent | |
246 | ;; line. This will only work if we properly mark the intervening text | |
247 | ;; as being part of a multiline element (and even then, this only | |
248 | ;; ensures proper refontification, but not proper discovery). | |
249 | ("^[ \t]*{" (0 (save-excursion | |
250 | (goto-char (match-beginning 0)) | |
251 | (skip-chars-backward " \n\t") | |
252 | (put-text-property (point) (match-end 0) | |
253 | 'font-lock-multiline t) | |
254 | ;; No face. | |
255 | nil))) | |
256 | ;; Properties. Again, we don't limit ourselves to css-property-ids. | |
5b3a105e SM |
257 | (,(concat "\\(?:[{;]\\|^\\)[ \t]*\\(" |
258 | "\\(?:\\(" css-proprietary-nmstart-re "\\)\\|" | |
259 | css-nmstart-re "\\)" css-nmchar-re "*" | |
260 | "\\)\\s-*:") | |
261 | (1 (if (match-end 2) 'css-proprietary-property 'css-property))))) | |
d500a092 SM |
262 | |
263 | (defvar css-font-lock-defaults | |
264 | '(css-font-lock-keywords nil t)) | |
265 | ||
112798c1 SM |
266 | (defcustom css-indent-offset 4 |
267 | "Basic size of one indentation step." | |
268 | :version "22.2" | |
269 | :type 'integer) | |
270 | ||
271 | (require 'smie) | |
272 | ||
273 | (defconst css-smie-grammar | |
274 | (smie-prec2->grammar | |
275 | (smie-precs->prec2 '((assoc ";") (assoc ",") (left ":"))))) | |
276 | ||
277 | (defun css-smie--forward-token () | |
278 | (cond | |
279 | ((and (eq (char-before) ?\}) | |
280 | ;; FIXME: If the next char is not whitespace, what should we do? | |
281 | (or (memq (char-after) '(?\s ?\t ?\n)) | |
282 | (looking-at comment-start-skip))) | |
283 | (if (memq (char-after) '(?\s ?\t ?\n)) | |
284 | (forward-char 1) (forward-comment 1)) | |
285 | ";") | |
286 | ((progn (forward-comment (point-max)) | |
287 | (looking-at "[;,:]")) | |
288 | (forward-char 1) (match-string 0)) | |
289 | (t (smie-default-forward-token)))) | |
290 | ||
291 | (defun css-smie--backward-token () | |
292 | (let ((pos (point))) | |
293 | (forward-comment (- (point))) | |
294 | (cond | |
295 | ;; FIXME: If the next char is not whitespace, what should we do? | |
296 | ((and (eq (char-before) ?\}) (> pos (point))) ";") | |
297 | ((memq (char-before) '(?\; ?\, ?\:)) | |
298 | (forward-char -1) (string (char-after))) | |
299 | (t (smie-default-backward-token))))) | |
300 | ||
301 | (defun css-smie-rules (kind token) | |
302 | (pcase (cons kind token) | |
303 | (`(:elem . basic) css-indent-offset) | |
304 | (`(:elem . arg) 0) | |
bdc6b4c8 | 305 | (`(:list-intro . ,(or `";" `"")) t) ;"" stands for BOB (bug#15467). |
112798c1 SM |
306 | (`(:before . "{") (if (smie-rule-hanging-p) |
307 | (smie-rule-parent 0))))) | |
308 | ||
d500a092 | 309 | ;;;###autoload |
5f6d8331 | 310 | (define-derived-mode css-mode fundamental-mode "CSS" |
d500a092 | 311 | "Major mode to edit Cascading Style Sheets." |
92eadba5 CY |
312 | (setq-local font-lock-defaults css-font-lock-defaults) |
313 | (setq-local comment-start "/*") | |
314 | (setq-local comment-start-skip "/\\*+[ \t]*") | |
315 | (setq-local comment-end "*/") | |
316 | (setq-local comment-end-skip "[ \t]*\\*+/") | |
92eadba5 CY |
317 | (setq-local parse-sexp-ignore-comments t) |
318 | (setq-local indent-line-function 'css-indent-line) | |
319 | (setq-local fill-paragraph-function 'css-fill-paragraph) | |
f38cd76e | 320 | (setq-local add-log-current-defun-function #'css-current-defun-name) |
112798c1 SM |
321 | (smie-setup css-smie-grammar #'css-smie-rules |
322 | :forward-token #'css-smie--forward-token | |
323 | :backward-token #'css-smie--backward-token) | |
bdc6b4c8 SM |
324 | (setq-local electric-indent-chars |
325 | (append css-electric-keys electric-indent-chars))) | |
d500a092 | 326 | |
3fe5c37a DN |
327 | (defvar comment-continue) |
328 | ||
d500a092 SM |
329 | (defun css-fill-paragraph (&optional justify) |
330 | (save-excursion | |
331 | (let ((ppss (syntax-ppss)) | |
332 | (eol (line-end-position))) | |
333 | (cond | |
334 | ((and (nth 4 ppss) | |
335 | (save-excursion | |
336 | (goto-char (nth 8 ppss)) | |
337 | (forward-comment 1) | |
338 | (prog1 (not (bolp)) | |
339 | (setq eol (point))))) | |
340 | ;; Filling inside a comment whose comment-end marker is not \n. | |
341 | ;; This code is meant to be generic, so that it works not only for | |
342 | ;; css-mode but for all modes. | |
343 | (save-restriction | |
344 | (narrow-to-region (nth 8 ppss) eol) | |
088d6743 | 345 | (comment-normalize-vars) ;Will define comment-continue. |
d500a092 SM |
346 | (let ((fill-paragraph-function nil) |
347 | (paragraph-separate | |
348 | (if (and comment-continue | |
349 | (string-match "[^ \t]" comment-continue)) | |
350 | (concat "\\(?:[ \t]*" (regexp-quote comment-continue) | |
351 | "\\)?\\(?:" paragraph-separate "\\)") | |
352 | paragraph-separate)) | |
353 | (paragraph-start | |
354 | (if (and comment-continue | |
355 | (string-match "[^ \t]" comment-continue)) | |
356 | (concat "\\(?:[ \t]*" (regexp-quote comment-continue) | |
357 | "\\)?\\(?:" paragraph-start "\\)") | |
358 | paragraph-start))) | |
359 | (fill-paragraph justify) | |
360 | ;; Don't try filling again. | |
361 | t))) | |
9e3fd593 | 362 | |
d500a092 SM |
363 | ((and (null (nth 8 ppss)) |
364 | (or (nth 1 ppss) | |
365 | (and (ignore-errors | |
366 | (down-list 1) | |
367 | (when (<= (point) eol) | |
368 | (setq ppss (syntax-ppss))))))) | |
369 | (goto-char (nth 1 ppss)) | |
370 | (let ((end (save-excursion | |
371 | (ignore-errors (forward-sexp 1) (copy-marker (point) t))))) | |
372 | (when end | |
373 | (while (re-search-forward "[{;}]" end t) | |
374 | (cond | |
375 | ;; This is a false positive inside a string or comment. | |
376 | ((nth 8 (syntax-ppss)) nil) | |
377 | ((eq (char-before) ?\}) | |
378 | (save-excursion | |
379 | (forward-char -1) | |
380 | (skip-chars-backward " \t") | |
381 | (unless (bolp) (newline)))) | |
382 | (t | |
383 | (while | |
384 | (progn | |
385 | (setq eol (line-end-position)) | |
386 | (and (forward-comment 1) | |
387 | (> (point) eol) | |
388 | ;; A multi-line comment should be on its own line. | |
389 | (save-excursion (forward-comment -1) | |
390 | (when (< (point) eol) | |
391 | (newline) | |
392 | t))))) | |
393 | (if (< (point) eol) (newline))))) | |
394 | (goto-char (nth 1 ppss)) | |
395 | (indent-region (line-beginning-position 2) end) | |
396 | ;; Don't use the default filling code. | |
397 | t))))))) | |
398 | ||
f38cd76e JA |
399 | (defun css-current-defun-name () |
400 | "Return the name of the CSS section at point, or nil." | |
401 | (save-excursion | |
402 | (let ((max (max (point-min) (- (point) 1600)))) ; approx 20 lines back | |
403 | (when (search-backward "{" max t) | |
404 | (skip-chars-backward " \t\r\n") | |
405 | (beginning-of-line) | |
406 | (if (looking-at "^[ \t]*\\([^{\r\n]*[^ {\t\r\n]\\)") | |
407 | (match-string-no-properties 1)))))) | |
408 | ||
d500a092 | 409 | (provide 'css-mode) |
d500a092 | 410 | ;;; css-mode.el ends here |