]> code.delx.au - gnu-emacs-elpa/blob - README.md
Add themes. Prepare for ELPA. Version 3.1.0.
[gnu-emacs-elpa] / README.md
1 # Context Coloring [![Build Status](https://travis-ci.org/jacksonrayhamilton/context-coloring.png?branch=develop)](https://travis-ci.org/jacksonrayhamilton/context-coloring)
2
3 <p align="center">
4 <img alt="Screenshot of JavaScript code highlighted by context." src="screenshot.png" title="Screenshot">
5 </p>
6
7 Highlights code according to function context.
8
9 - Code in the global scope is one color. Code in functions within the global
10 scope is a different color, and code within such functions is another color,
11 and so on.
12 - Identifiers retain the color of the scope in which they are declared.
13
14 Lexical scope information at-a-glance can assist a programmer in understanding
15 the overall structure of a program. It can help to curb nasty bugs like name
16 shadowing. A rainbow can indicate excessive complexity. State change within a
17 closure is easily monitored.
18
19 By default, Context Coloring still highlights comments and strings
20 syntactically. It is still easy to differentiate code from non-code, and strings
21 cannot be confused for variables.
22
23 This coloring strategy is probably more useful than conventional syntax
24 highlighting. Highlighting keywords can help one to detect spelling errors, but
25 a [linter][] could also spot those errors, and if integrated with [flycheck][],
26 an extra spot opens up in your editing toolbelt.
27
28 Give context coloring a try; you may find that it *changes the way you write
29 code*.
30
31 ## Features
32
33 - Supported languages: JavaScript
34 - Light and dark (customizable) color schemes.
35 - Very fast for files under 1000 lines.
36
37 ## Installation
38
39 Requires Emacs 24+.
40
41 JavaScript language support requires either [js2-mode][] or
42 [Node.js 0.10+][node], respectively.
43
44 ### ELPA
45
46 - `M-x package-refresh-contents RET`
47 - `M-x package-install RET context-coloring RET`
48
49 ### Git
50
51 - Clone this repository.
52
53 ```bash
54 cd ~/.emacs.d/
55 git clone https://github.com/jacksonrayhamilton/context-coloring.git
56 ```
57
58 - Byte-compile the package for improved speed.
59
60 ```bash
61 cd context-coloring/
62 make compile
63 ```
64
65 - Add the following to your `~/.emacs` file:
66
67 ```lisp
68 (add-to-list 'load-path "~/.emacs.d/context-coloring")
69 (require 'context-coloring)
70 (add-hook 'js-mode-hook 'context-coloring-mode)
71 ```
72
73 ## Customizing
74
75 Built-in themes are accessible via `context-coloring-load-theme`. Available
76 themes are: `monokai`, `solarized`, `tango` and `zenburn`.
77
78 ```lisp
79 (require 'context-coloring)
80 (context-coloring-load-theme 'zenburn)
81 ```
82
83 You can define your own themes, too:
84
85 ```lisp
86 (context-coloring-define-theme
87 'zenburn
88 :colors '("#DCDCCC"
89 "#93E0E3"
90 "#BFEBBF"
91 "#F0DFAF"
92 "#DFAF8F"
93 "#CC9393"
94 "#DC8CC3"
95 "#94BFF3"
96 "#9FC59F"
97 "#D0BF8F"
98 "#DCA3A3"))
99 ```
100
101 ## Extending
102
103 To add support for a new language, write a "scopifier" for it, and define a new
104 coloring dispatch strategy with `context-coloring-define-dispatch`. Then the
105 plugin should handle the rest.
106
107 A "scopifier" is a CLI program that reads a buffer's contents from stdin and
108 writes a JSON array of numbers to stdout. Every three numbers in the array
109 represent a range of color. For instance, if I fed the following string of
110 JavaScript code to a scopifier,
111
112 ```js
113 var a = function () {};
114 ```
115
116 then the scopifier would produce the following array:
117
118 ```js
119 [1,24,0,9,23,1]
120 ```
121
122 Where, for every three numbers, the first number is a 1-indexed start [point][],
123 the second number is an exclusive end point, and the third number is a scope
124 level. The result of applying level 0 coloring to the range &#91;1, 24) and then
125 applying level 1 coloring to the range &#91;9, 23) would result in the following
126 coloring:
127
128 <p align="center">
129 <img alt="Screenshot of ranges &#91;1, 24) and &#91;9, 23)." src="scopifier.png" title="Screenshot">
130 </p>
131
132 If there is an abstract syntax tree generator for your language, you can walk
133 the syntax tree, find variables and scopes, and build their positions and levels
134 into an array like the one above.
135
136 For example, a Ruby scopifier might be defined and implemented like this:
137
138 ```lisp
139 (context-coloring-define-dispatch
140 'ruby
141 :modes '(ruby-mode)
142 :executable "ruby"
143 :command "/home/username/scopifier")
144 ```
145
146 ```ruby
147 #!/usr/bin/env ruby
148 def scopifier(code)
149 # Parse code.
150 # Return an array.
151 end
152 print scopifier ARGF.read
153 ```
154
155 [linter]: http://jshint.com/about/
156 [flycheck]: http://www.flycheck.org/
157 [zenburn]: http://github.com/bbatsov/zenburn-emacs
158 [point]: http://www.gnu.org/software/emacs/manual/html_node/elisp/Point.html
159 [js2-mode]: https://github.com/mooz/js2-mode
160 [node]: http://nodejs.org/download/
161 [load path]: https://www.gnu.org/software/emacs/manual/html_node/emacs/Lisp-Libraries.html