Wii-wease Wodger!
I'd just like to chime in with the Monty Python reference.
Honestly, this and Mac Book Pro, where did all the good product names go this year?
Update
I'd just like to add Core Duo 2 Extreme to the list of this year's silly product names. Which will probably be followed by Core Duo 2000 Extreme Hyper Ultra Edition For Gamers and Core Duo 2 Grey and Inoffensive for the budget desktop version. I mean, really...
Popularity: 8% [?]
Winamp at OldVersion.com
I just thought I'd share this:
OldVersion.com - Because newer is not necessarily better.
Too bloody right.
(I'm writing a bit on Winamp and Geiss in particular for my dissertation, and am harking back to the halcyon days of WinAmp 2. Ah, yes... You can also get the Geiss screensaver from here. I'd long thought it unavailable. It's good to be wrong).
Popularity: 12% [?]
JSThing – fun with JavaScript
I've just posted JSThing on the stuff page. It's a bit of JavaScript in the form of a favelet that allows you to edit the window object of a given web page and interact with your changes. It works well with Firefox but is a bit too long for IE.
JavaScript is a wonderful little language. When you load a page with some JavaScript in it, the objects and functions that are created exist for the duration of the page in your browser. Some of the data may have been used, some may not. JSThing allows you to examine and change that data.
Here's a little example. If you add JSThing to your links bar (get it from the link above), then head over to http://www.google.co.uk and activate JSThing, you'll see that the fourth item in the window object is a function called qs(). It looks like this:
function qs(el) {
if (window.RegExp && window.encodeURIComponent) {
var ue = el.href;
var qe = encodeURIComponent(document.f.q.value);
if (ue.indexOf("q=") != -1) {
el.href = ue.replace(new RegExp("q=[^&$]*"), "q=" + qe);
} else {
el.href = ue + "&q=" + qe;
}
}
return 1;
}
Examining the source of Google's home page reveals that this function gets called when you click the Images, Groups, etc links above the search box. In JSThing, hit the little red hat next to the the name and type of the item (qs function) and it will appear in the boxes at the top. Change the function to read:
function qs(el) {
window.opener.alert(el);
return false;
}
and hit 'Go'. Some text should appear saying 'Value changed, hit refresh'. Click the 'Refresh tree' link above where the text appears and the list of properties should update to reflect your changes.
Now go back to the Google window and click one of the Item, Groups, etc links. An alert box should appear with a URL in it.
This sort of behaviour should be possible on pretty much any page. AJAX applications in particular should be quite fun to play with.
Also, inspecting code to debug your own programs should be much easier with this - for example, ensuring proper namespacing (as proper as you can get with a language where everything is global by default) is a doddle.
Try it out and let me know how you get on.
Update - It now treats arrays slightly differently from other objects in order to parse them properly.
Update - Slightly better error handling when trying to access properties it shouldn't.
Update - Human readable source now available.
Popularity: 8% [?]
Peekaboo!
Ladies and gentlemen, the peekaboo bug*.
Quite a compelling reason as to why Internet Explorer is teh_stupiderer.
What is it? Position something absolutely, float something inside it and poof, seemingly random chunks of your content are belong to the void until you click, select or otherwise massage the seemingly blank area, or one nearby.
The fix? Give the absolutely positioned thing a line height value. Any line height value. line-height: 1; if you want.
Doesn't it just make you want to stab yourself in the eye with a fork?
* = No, it's not new. I just needed to vent some steam, okay?
Popularity: 8% [?]
Detecting Opera
A.K.A. - You can run, but you can't hide
Mmh, object detection. Assuming JavaScript is turned on (a rather large caveat, granted), it seems to be a pretty reliable method of figuring out which browser your user is, uh, using.
Much like you can code CSS for certain browsers by exploiting holes in their support for various bits any bobs, different browsers support different bits of the ECMAScript standard, and other add their own extensions into the mix.
There's a wonderful page on object detection over at dhtmlnirvana.com (don't be afraid of the name), but there is one problem. If you are piddling about with AJAX, you'll need some way of distinguishing between Opera >= 8 (which supports xmlhttprequest) and Opera < 8 (which doesn't).
The dhtmlnirvana page has the following:
//Opera 7
opera7 = window.opera && document.createComment
//Opera 6 and below
oldopera= window.opera && !document.createComment
Which presents a problem:
if(window.opera && (document.createComment || !document.createComment))
{
// Opera <= 7
}
else
{
// !(Opera <= 7)
}
which boils down to:
if(window.opera)
{
}
neatly ghettoising all those poor Opera users.
Thankfully, some helpful chap (or chapess, it doesn't specify) has put a page up on the window.opera object (an object provided by Opera for fun things like JavaScript debugging), and first on the list?
# opera.addEventListener(string: type,function: handler,bool: phase)
* Opera 5&6&7-7.6: No support
* Opera 8+: Registers an event listener for a User JavaScript event. This method only has any effect in User JavaScript files.
Genius. Now we can use:
if((window.opera && !window.opera.addEventListener))
{
// Opera < 8
}
else
{
// !(Opera < 8)
}
Throw in some other bits and bobs and you have:
function checkAJAXCapable()
{
if( // non dom browsers
(!document.getElementsByTagName || !document.getElementById)
// ie 5/mac
|| (document.all && !document.mimeType && !window.opera)
// opera < 8
|| (window.opera && !window.opera.addEventListener)
)
{
// put something here to deal with non-supported browsers
}
}
Popularity: 8% [?]
CSS Naked Day
It's CSS Naked Day, time to bare the nether regions of your markup, flop it onto the table and feel the air running through it.
That rather disturbing metaphor aside, I initially thought that this was a rather silly idea as all it's going to do is confuse people (god forbid anyone would actually read what's on the page, which seems to explain what's going on on all the sites participating), but on reflection it's really a bit clever. At least, it's getting me to take a good, long look (the kind of good, long look you can only take when you've got far more pressing things to attend to like, oh, revision) at how even though I try my best to use only valid structural markup and keep all the presentation stuff in CSS, a few decisions are made purely based on layout. For example, occasionally, just occasionally, I'll do the following (minus all those point obscuring tag attributes):
<label>
<input /> text:</label>
Define a height and width for the label, make it display: block, give the input a width and float: right and bang, beautifully aligned forms with minimal code. However this is very lazy and the method used on this site is much better (even though it looks a bit silly today with no styling, but hey - that's the point, eh?) and will be all I use from now on I'm very naughty sorry sorry sorry.
Popularity: 7% [?]