Subscribe via RSS

Tagged textmate, ruby, wordpress, and syntax highlighting

Seeing as this is a blog about programming and other geeky things, there is one thing that will definitely appear: code. And when code is displayed, it is obligatory to have it displayed with colour, at least in my opinion.

And so began my hunt for some special plugin to install in Wordpress and that would make it easy as pie. Unfortunately, all the plugins that deal with syntax highlighting haven’t been tested with my version of Wordpress.

Who cares? I like to experiment with new things that possibly won’t work. What kind of a geek would I be if i didn’t?

I tried 3. The one didn’t work, and the others that did, I didn’t like. I wanted to be able to customize the syntax colouring, but to do that in those plugins wasn’t going to be an easy task. And I wanted easy.

Installing a plugin was out, so what does that leave me with? Converting the syntax highlighted code into html.

So I opened up my swiss-army knife of a text editor, Textmate, and I saw that in the Textmate Bundle it has a command to create html code from the entire document or from just the selected text. Great! What is even better is that the bundle has another command: “Create CSS from Current Theme”.

Sweet!

It was pretty simple, I just created the CSS file from the great Twilight theme and changed my blog’s template to include the css file in every page.

Now, for me to get the code to insert here, all I had to do was execute the “Create HTML from Document/Selection” command, which would then open up a new window with the html markup, do Ctrl-A then Ctrl-C, and voilá, ready to paste into a post.

Naah, that’s still too much work!

The computer is supposed to work for me, not the other way around. I wanted a shortcut that would add the converted html code to the clipboard, ready for me to paste.

To get this working, I had to add a new command to the Textmate bundle that I hacked together from the “Create HTML from Document” command, which resulted in the following:

	#!/usr/bin/env ruby -rjcode -Ku
	require "#{ENV['TM_BUNDLE_SUPPORT']}/lib/doctohtml.rb"
	require "#{ENV['TM_SUPPORT_PATH']}/lib/progress.rb"
	unit = ENV.has_key?('TM_SELECTED_TEXT') ? 'selection' : 'document'
	output = ""
	TextMate.call_with_progress(:message => "Creating HTML version of #{unit}...") do
	  output = document_to_html(
	    STDIN.read,
	    :include_css => !ENV.has_key?('TM_SELECTED_TEXT')
	  )
	end


	# Load TM preferences to discover the current theme and font settings
	textmate_pref_file = '~/Library/Preferences/com.macromates.textmate.plist'
	prefs = OSX::PropertyList.load(File.open(File.expand_path(textmate_pref_file)))
	theme_uuid = prefs['OakThemeManagerSelectedTheme']
	# Load the active theme. Unfortunately, this requires us to scan through
	# all discoverable theme files...
	unless theme_plist = find_theme(theme_uuid)
	  print "Could not locate your theme file!"
	  abort
	end
	theme_name = theme_plist['name'].downcase
	# When converting selected code the theme name isnt in the pre tag
	output.gsub!(
	  '<pre class="textmate-source">',
	  "<pre class=\"textmate-source #{theme_name}\">"
	) if unit == 'selection'

	IO.popen('pbcopy', 'w+') {|cb| cb.write(output)}

So all you have to do is add that code into a new command in Textmate (I called it “Copy HTML from Document/Selection”), assign a shourtcut to it (mine is set to Alt + Cmd + C) and you’re ready to go!

Happy code-posting!

(Possibly) Related Posts:

• The Road to Awesomeness
• Book: Ruby Best Practices
• Bruce Lee, Water, and Programming