/
ng2-html.el
101 lines (82 loc) · 3.4 KB
/
ng2-html.el
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
;;; ng2-html.el --- Major mode for editing Angular 2 templates
;; Copyright 2016-2019 Adam Niederer
;; Author: Adam Niederer <adam.niederer@gmail.com>
;; URL: http://github.com/AdamNiederer/ng2-mode
;; Version: 0.2.3
;; Keywords: typescript angular angular2
;; Package-Requires: ()
;; This program is free software: you can redistribute it and/or modify
;; it under the terms of the GNU General Public License as published by
;; the Free Software Foundation, either version 3 of the License, or
;; (at your option) any later version.
;;
;; This program is distributed in the hope that it will be useful,
;; but WITHOUT ANY WARRANTY; without even the implied warranty of
;; MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
;; GNU General Public License for more details.
;;
;; You should have received a copy of the GNU General Public License
;; along with this program. If not, see <http://www.gnu.org/licenses/>.
;;; Commentary:
;; The main features of this mode are syntax highlighting (enabled with
;; `font-lock-mode' or `global-font-lock-mode'), and html-mode
;; integration
;;
;; Exported names start with "ng2-html-"; private names start with
;; "ng2-html--".
;;; Code:
(require 'ng2-shared)
(defconst ng2-html-var-regex
"\\(#\\)\\(\\w+\\)")
(defconst ng2-html-interp-regex
(concat
"\\({{\\)" ; Opening brackets
"\\s-*[^{].+?" ; The expression being interpolated
"\\(}}\\)")) ; Closing brackets
;; Colors pipes within ng2-html-interp-regex
;; TODO: Prevent false positives like "~x | 2"
(defconst ng2-html-pipe-regex
(concat
"|\\s-*" ; Pipe symbol
"\\([A-Za-z0-9]+\\)")) ; Name of the pipe function
(defconst ng2-html-directive-regex
"\\([*]\\)\\(.*?\\)[\"= ]")
(defconst ng2-html-binding-regex
"\\(\\[(?\\)\\(.*?\\)\\()?\\]\\)=\\(\".*?\"\\)")
(defconst ng2-html-event-regex
"\\((\\)\\(.*?\\)\\()\\)=\".*?\"")
(defun ng2-html-goto-binding ()
"Opens the corresponding component TypeScript file, then places the cursor at the function corresponding to the binding."
(interactive)
(let ((name (symbol-at-point)))
(ng2-open-counterpart)
(ng2-ts-goto-name name)))
(defvar ng2-html-font-lock-keywords
`((,ng2-html-var-regex (1 font-lock-builtin-face))
(,ng2-html-var-regex (2 font-lock-variable-name-face))
(,ng2-html-interp-regex . (1 font-lock-variable-name-face))
(,ng2-html-interp-regex . (2 font-lock-variable-name-face))
(,ng2-html-pipe-regex . (1 font-lock-function-name-face))
(,ng2-html-directive-regex . (1 font-lock-builtin-face t))
(,ng2-html-directive-regex . (2 font-lock-keyword-face t))
(,ng2-html-binding-regex . (1 font-lock-builtin-face t))
(,ng2-html-binding-regex . (2 font-lock-builtin-face t))
(,ng2-html-binding-regex . (3 font-lock-builtin-face t))
(,ng2-html-event-regex . (1 font-lock-builtin-face t))
(,ng2-html-event-regex . (2 font-lock-builtin-face t))
(,ng2-html-event-regex . (3 font-lock-builtin-face t))))
(defvar ng2-html-mode-map
(let ((map (make-keymap)))
(define-key map (kbd "C-c C-.") 'ng2-html-goto-binding)
(define-key map (kbd "C-c C-o") 'ng2-open-counterpart)
map)
"Keymap for ng2-html-mode.")
;;;###autoload
(define-derived-mode ng2-html-mode
html-mode "ng2-html"
"Major mode for Angular 2 templates"
(font-lock-add-keywords nil ng2-html-font-lock-keywords))
;;;###autoload
(add-to-list 'auto-mode-alist '("\\.component.html\\'" . ng2-html-mode))
(provide 'ng2-html)
;;; ng2-html.el ends here