this is a blog by Jeff Perrin, a software developer based in calgary alberta

Javascript Syntax Highlighting

A few months ago I toyed with the idea of doing syntax highlighting with javascript. I'm sure there's several published solutions out there that do the same thing, but I figured I'd give it a go myself, mainly to practice up on my meagre javascript skills. I set out with the following goals:

  1. Highlight the code in a completely unobtrusive manner.
  2. Use absolutely no inline markup.

Basically, I wanted to be able to paste in the following markup...

<code class="csharp">
	private void Page_Load(object sender, System.EventArgs e)
	{
		 LoadEntity();
	}

	private void LoadEntity()
	{
		 User user = new User();

		 /*
			  Get the id of the entity from the request
		 */
		 if( this.RequestedEntityID > 0 )
		 {
			   user.ID = this.RequestedEntityID;
			   BrokerFactory.Fill( user );
		 }

		 //Load the appropriate view
		 EntityControl cont =
			(EntityControl)LoadControl( "EditStaff.ascx" );

		 cont.BoundEntity = user;
		 this.phEntity.Controls.Add( cont );
	}
</code>

...and have the syntax highlighting just work. I currently have some test code that is partly working (although not in IE, there seems to be a problem with setting the text to be pre-formatted). View the source to see what I'm up to. It should be easy to extend it to check for the type of highlighting that's required based on the class of the code tag.

In closing, my main reason for posting this is that I'd like to see this working, but just don't have the time or energy to finish it off in the near future. So if anyone knows of an existing solution that works in the same way, or wants to continue on with this implementation, feel free to let me know.

Estimating Tasks in Software Development

Rock Invoices with Blinksale