muonlab

Annoyed to death that Twitter have swapped the column order round on their site so the content is on the right, I’ve made an extension for Chrome that fixes it.

Here’s how to do it.

Make a folder somewhere, and inside it create a file called “manifest.json”. Put this inside it:

{
	"name": "Fix Twitter Columns Order"
	, "version": "0.1"
	, "description": "Switches the Twitter columns around so content is on the left"
	, "content_scripts": [
		{
			"matches": ["https://twitter.com/*", "http://twitter.com/*"]
			, "css": ["style.css"]
		}
	]
}

Then create a file called “style.css” and put this inside it:

.content-main
{
	float: left !important;
}

.dashboard
{
	float: right !important;
}

And there we go!

Goto Chrome -> Tools -> Extensions.

Tick “Developer Mode”, then click “Load unpacked extension” and navigate to the folder you created the json and css in.

Done! You can download the source here.

Here is a simple jQuery plugin to allow users to filter table rows through dropdowns in the header rows.

Read more…

It seems IE doesn’t print canvas elements which are absolutely positioned in the correct place. What a surprise.

This problem came about when i tried to print some of my jqPlot graphs, as it uses absolutely positioned canvas tags for the data and axes.

There’s probably a much easier solution to this, but i couldn’t find it.

Heres some mega-hax that makes things work:

Update: This requires jQuery 1.4.2+

(function($) {
	$.fn.CanvasHack = function() {
		var canvases = this.find('canvas').filter(function() {
			return $(this).css('position') == 'absolute';
		});

		canvases.wrap(function() {
			var canvas = $(this);
			var div = $('<div />').css({
				position: 'absolute',
				top: canvas.css('top'),
				left: canvas.css('left')
			});
			canvas.css({
				top: '0',
				left: '0'
			});
			return div;
		});

		return this;
	};
})(jQuery);

Call it after your graph setup code, like this:

$('body').CanvasHack();

jqPlot is an awesome javascript graphing library, supporting loads of cool features. Except clickable bar charts.

Here is a plugin which allows you to capture click events for bar charts.

Use it like this:

$.jqplot('Graph', data, {
	barClickable: {
		onClick: function(i, j, data){
			alert("Clicked series: " + i + ", data point: " + j + ", data: " + data);
		}
	}
});

This won’t work on horizontal or stacked graphs without modification, but it would be a fairly trivial change.

The code is available on github.