Archive for November, 2008

ImgAreaSelect 0.6

Monday, November 17th, 2008

Hello, my fellow web developers, it’s time for a new release of your favorite image-area-selecting jQuery plugin — here’s imgAreaSelect 0.6.

This version introduces two new features: keyboard support, which makes it possible to manipulate the selection using arrow keys, and the persistent option, which prevents the user from starting a new selection (so the user can only resize and move the pre-selected area).

The plugin now responds differently to clicking outside the selection area — the current selection is discarded, but a new one is not started until the user begins moving the mouse pointer. This way it’s possible to cancel the selection by clicking in the outer area and not end up with a 0×0 border, as it happened with the previous versions.

Update:
Drat, I just noticed a leftover debugging statement (which displayed keyboard codes in window.status) in the newly released version. I removed it and released the updated code as version 0.6.1.

Posted in imgAreaSelect, jQuery | 3 Comments »

ImgFx New Effects

Tuesday, November 11th, 2008

Here’s a quick update on the imgFx jQuery plugin — I just added two new effects: flip and invert.

This is what flip does:

And here’s invert:

You can play with all the effects on the demo page, as usual.

Posted in jQuery | No Comments »

BrightenUp Greasemonkey Script

Thursday, November 6th, 2008

In my last post, I got somewhat excited about the idea of making a Greasemonkey script that would allow you to adjust the brightness of images on websites. One afternoon a few days ago, having nothing better to do, I wrote the script — and it sort of works. More precisely, it works only on some websites.

The script, like the imgFx plugin, makes use of the canvas HTML element. Among other things, canvas lets us retrieve the image’s pixel data as RGB values. To make an image brighter, we need to read all the pixels, increase their RGB values, and use the new pixel data to redraw the image. Sounds rather simple, but there is one fundamental problem. Due to security restrictions, Firefox will let us read the pixel data only if the image originates at the exact same domain as the website itself. Even if it’s just the sub-domain that is different, it won’t be allowed. So, if you have a website at somedomain.com, but your images come from images.somedomain.com, the script won’t work with it.

Anyway, in case you’d like to try out the script, here it is: brightenup.user.js

I’ve checked the most popular image hosting websites, and it seems only ImageShack meets the requirement of images originating at the exact same domain as the page on which they appear. Thus, the script is set to execute on *.imageshack.us. Here’s a sample image that you can test it on (no goatse, and safe for work, I promise):

http://img479.imageshack.us/my.php?image=letescaupeje0.jpg

Move the mouse cursor over the image, and two buttons will pop up in the top left corner. Press “+” and “-” to make the image more or less bright.

Update (Nov 8):
I’ve uploaded the script to Userscripts.org for the world to see — there it is.

Posted in Greasemonkey | No Comments »