CodeSushi

I decided to add syntaxhighlighter to this blog's theme, so it's always available when I feel like pooping some code into a post. It's a pretty cool little deal that does a great job on fairly short code chunks. You can specify that you want the code to start out collapsed when the page loads so your readers have to click to expand the code.. I think this is a cool way to roll… sometimes I want to read about the idea before I start ogling the code. However I find it pretty annoying that once you expand the code, there is no way to collapse it again short of reloading the page… so I hacked in some code to shCore.js.



my changes only effect lines 10-18 and 27-45 in the following code fragment:

//
// Toolbar functions
//
dp.sh.Toolbar.Commands = {
	ExpandSource: {
		label: '+ expand source',
		check: function(highlighter) { return highlighter.collapse; },
		func: function(sender, highlighter)
		{
            // dan's hack for expand collapse toggle.
            var a = document.createElement("a");
            a.setAttribute('href', '#');
            a.onclick = function() {
                dp.sh.Toolbar.Command('CollapseSource',this);
                return false;
            }
            a.appendChild(document.createTextNode("- collapse source"));
            // end hack section

            sender.parentNode.insertBefore(a, sender);
			sender.parentNode.removeChild(sender);

            highlighter.div.className = highlighter.div.className.replace('collapsed', '');
		}
	},

    // dan's hack for expand collapse toggle.
    CollapseSource: {
		label: '- collapse source',
		check: function(highlighter) { return false; },
		func: function(sender, highlighter)
		{
            var a = document.createElement("a");
            a.setAttribute('href', '#');
            a.onclick = function() {
                dp.sh.Toolbar.Command('ExpandSource',this);
                return false;
            }
            a.appendChild(document.createTextNode("+ expand source"));
            sender.parentNode.insertBefore(a, sender);
			sender.parentNode.removeChild(sender);
			highlighter.div.className = highlighter.div.className + ' collapsed';
		}
	},
    // end dan's hack

there might be a better way to do this.. but I didn't see one after a brief look at the tool bar stuff… and this change suited my needs perfectly.

I also added a couple key words (def, it) to the Java “brush” so I could use it more effectively for Groovy code, which I'll be needing for my next post.

admin javascript, syntaxhighlighter