A notch above a monkey

Marela widgets I

It’s the beginning of August, heat is temporarily gone and I wish it took work with it. But no, it’s still lying there and there’s enough of it that I have some problems deciding what to do first.

So how do you solve a problem like that?

Personally, I goof off by writing something fun (still more useful than reading blogs). For example a simple javascript file based on my Marela library that allows me (or you) to insert a single random image from your chosen Marela photostream like this:

If you don’t believe me just reload this page and look at its source.

See? Told you.

If you want to do the same, but don’t want to show my images on your page, just insert


<script type="text/javascript" src="http://markos.gaivo.net/marela/singlerandom.js?username=markos&tag=moja-izbira&size=2"></script>

in your page and replace markos with your Marela username (contact me, if you need an account) and moja-izbira with your chosen tag. You can specify the size of an image with a number from 1 to 3 (2 being default if attribute is missing).

I’ll write some more widgets like this through August, if I don’t change my mind. Hence the title of this post.

Also I’ll write Javascript for first 5 souls who need it as long as it’s a problem that won’t take too much of my time. This offer expires at the end of this month.

Auto-grow TEXTAREA

Update 6.8.2009: This post is old and somewhat obsolete, but has been kept alive by commentators. Hence I posted an updated version of the script in comments.

Fry recently mentioned a TEXTAREA improvement he found. As you type your text in the box, it grows in length as needed to avoid having to deal with scroll bars.

I liked the idea and went to create my own version. Making it work in Internet Explorer and Firefox was literally a matter of seconds. All you really need to do is compare elements clientHeight with its scrollHeight on key presses and increment rows attribute when former is smaller than later.

But supporting Opera and Safari has proven to be an insurmountable task for now. They simply don’t seem to update any property that could reliably be used for measuring the height of the text (but would love to be proven wrong).

You can try a demo , which also doubles as a test environment for reading interesting attributes on the fly (updates are done with mouse over input box).

Random bits of observation:

  • scrollHeight is always bigger than clientHeight in Opera. Hence the need to ignore it using its unique fingerprint.
  • I didn’t try to work out the length of the text by trying to count the number of lines (using \n ) and the length of each of them. Proportional fonts prevent any such reasonable guess.
  • I didn’t try to limit the growth of the box to the boundaries of the screen. I find page scroll bars the least annoying when scroll bars can’t be avoided. It’s a personal choice though.

Accessible DHTML and other bits

I’ve been neglecting my blog recently. There was no shortage of news, but somehow I didn’t feel like writing. My mind is preoccupied with other things and where the hell is the cold and wet summer everyone promised?

Google announced accessible web search for the visually impaired. I see it as a great step in creating an accessible web search for everyone.

Najdi.si is testing a slovenian version of Google maps, which obviously can’t be more accurate than its source data, but works very well nevertheless.

But I’ve been most pleased to discover something else. I gave a talk recently and we spent quite some time discussing AJAX and Javascript accessibility issues. I wish I knew back then about this .

Not only is there a draft of a specification for making widgets accessible, we even got a test environment with Firefox 1.5. I’ve only had the time to scan through specification, so my view should be taken with a big pinch of salt, but my first impression is definitely positive. We’ll see how it develops after I had time to digest it and make a few tests.