sublime code

Well, we are offi­cially mak­ing the tran­si­tion to sub­lime as a team. I for one am happy, as this will make it much eas­ier for us to share and ver­sion con­trol many of the short cut ben­e­fits of this pow­er­ful cod­ing tool. Its also an appli­ca­tion that is very sin­gu­lar in how cus­tomiz­able it is, through pref­er­ence files in JSON format.

One of said pref­er­ence files is the tmTheme file, which is used for cre­at­ing a color scheme for the code­base in sub­lime. It, as well as all files in this post, are located in ~/Library/Application Support/Sublime Text 2. Now, there are quite a num­ber of good theme files out there, how­ever none seem to play well with JSPs, at least not well enough for myself. I for one can­not have my JSTL tags the same color as my html. Blasphemy!

So, I pro­ceeded to edit the theme to my lik­ing, start­ing with a theme called “Tomor­row Night.” This started off well, how­ever I came upon a stum­bling block: the lan­guage file for JSP just wasn’t gran­u­lar enough to color what I wanted. I could make JSP tags pur­ple, but had no con­trol over their child attrib­utes or oper­a­tors. This would not do. Enter the tmLan­guage file:

XML

<!-- Targeting all of the JSP tags/attributes separately; This should let us color them however we want -->
<dict>
	<!-- Start by targeting all alphanumeric tags with colons in them -->
	<key>begin</key>
	<string>(</?)([a-zA-Z0-9]++(:)[a-zA-Z0-9]+)</string>
	<key>beginCaptures</key>
	<dict>
		<key>1</key>
		<dict>
			<key>name</key>
			<string>punctuation.section.embedded.dsp</string>
		</dict>
		<key>2</key>
		<dict>
			<key>name</key>
			<string>meta.tag.block.dsp</string>
		</dict>
	</dict>
	<!-- then target the closers purple -->
	<key>end</key>
	<string>(>)</string>
	<key>endCaptures</key>
	<dict>
		<key>1</key>
		<dict>
			<key>name</key>
			<string>punctuation.section.embedded.dsp</string>
		</dict>
		<key>2</key>
		<dict>
			<key>name</key>
			<string>meta.tag.block.dsp</string>
		</dict>
	</dict>
	<key>patterns</key>
	<array>
		<!-- target the substrings separately -->
		<dict>
			<key>match</key>
			<string>([""'])(?:(?=(\?))2.)*?1</string>
			<key>name</key>
			<string>string</string>
		</dict>
		<!-- target the equals separately -->
		<dict>
			<key>match</key>
			<string>([=])</string>
			<key>name</key>
			<string>constant.other.color</string>
		</dict>
	</array>
</dict>

This guy let me add more gran­u­lar­ity to the lan­guage tar­get­ing, such as look­ing for tags with the colon char­ac­ter in them, sur­rounded by any­thing alphanu­meric. This is a very com­mon struc­ture in JSTL.

Once I set this up, I was able to tar­get spe­cific pieces in my JSP tags in order to color them. The spe­cific string names that I setup are in red below, point­ing to the spe­cific part of the code that is tar­geted to color:

code pieces

Any­who, I’ve placed the code on Github for your use. You will need to clone two sep­a­rate repos, as I have one for both the theme and lan­guage file:

Day After Tomor­row Night Theme
Updated Sub­lime Jave bundle

Any ques­tions, just let me know.
Enjoy!