/*      fdImageThumbs.

        A mashup of the Dunstan Diaz "sweet titles" and arc90's "Image Thumbs"
        
        http://www.dustindiaz.com/sweet-titles
        http://blog.arc90.com/2006/07/introducing_link_thumbnail.php
        
        Additionally, it uses the snapper service provided by webdesignbook
        
        http://webdesignbook.net
        
        Please Note, I coded this in my lunch hour and have only tested it in FireFox.
        It's an experiment and not in any way "production" code...
*/
var fdImageThumbs = {
        x:0,
        y:0,
        obj:{},
        img:null,
        lnk:null,
        timer:null,
        opacityTimer:null,
        init: function() {
                var lnks = document.getElementsByTagName('a');
                var i = lnks.length || 0;
                var cnt = 0;
                while(i--) {
                        if(lnks[i].className && lnks[i].className.search(/fdTmb/) != -1) {
                                fdImageThumbs.addEvent(lnks[i], ["focus", "mouseover"], fdImageThumbs.over);
                                fdImageThumbs.addEvent(lnks[i], ["blur",  "mouseout"],  fdImageThumbs.hideThumb);
                                cnt++;
                        }
                }
                if(cnt) {
                        fdImageThumbs.obj = document.createElement('div');
                        fdImageThumbs.img = document.createElement('img');
                        fdImageThumbs.img.alt = "preview";
                        fdImageThumbs.addEvent(fdImageThumbs.img, ["load"], fdImageThumbs.imageLoaded);
                        fdImageThumbs.addEvent(fdImageThumbs.img, ["error"], fdImageThumbs.imageError);
                        fdImageThumbs.obj.id = "fdImageThumb";
                        fdImageThumbs.obj.style.visibility = "hidden";
                        fdImageThumbs.obj.style.top = "0";
                        fdImageThumbs.obj.style.left = "0";
                        fdImageThumbs.addEvent(fdImageThumbs.img, ["mouseout"],  fdImageThumbs.hideThumb);
                        fdImageThumbs.obj.appendChild(fdImageThumbs.img);
                        document.getElementsByTagName('body')[0].appendChild(fdImageThumbs.obj);
                }
        },
        imageLoaded: function() {
                fdImageThumbs.img.style.visibility = "visible";
        },
        imageError: function() {
                fdImageThumbs.img.src = "./error.jpg";
        },
        over: function(e) {
                fdImageThumbs.lnk = this;
                fdImageThumbs.updateXY(e);
                fdImageThumbs.timer = window.setTimeout("fdImageThumbs.showThumb()",500);
        },
        showThumb: function(e) {
                fdImageThumbs.obj.style.visibility = 'visible';
                fdImageThumbs.obj.style.opacity = '.1';
                
                var scrX = Number(fdImageThumbs.x);
                var scrY = Number(fdImageThumbs.y);
                var tp = parseInt(scrY+(fdImageThumbs.lnk.offsetHeight || 0));
                var lt = parseInt(scrX);

                var addy = String(fdImageThumbs.lnk.href).replace(/[^:]*:\/\/([^:\/]*)(:{0,1}\/{1}.*)/, '$1');

                if ( parseInt(document.documentElement.clientWidth+document.documentElement.scrollLeft) < parseInt(fdImageThumbs.obj.offsetWidth+lt) ) {
                        fdImageThumbs.obj.style.left = parseInt(lt-(fdImageThumbs.obj.offsetWidth+10))+'px';
                } else {
                        fdImageThumbs.obj.style.left = lt+'px';
                }
                if ( parseInt(document.documentElement.clientHeight+document.documentElement.scrollTop) < parseInt(fdImageThumbs.obj.offsetHeight+tp) ) {
                        fdImageThumbs.obj.style.top = parseInt(tp-(fdImageThumbs.obj.offsetHeight+10))+'px';
                } else {
                        fdImageThumbs.obj.style.top = tp+'px';
                }
                fdImageThumbs.img.style.visibility = "hidden";
                //fdImageThumbs.img.src = 'http://msnsearch.srv.girafa.com/srv/i?s=MSNSEARCH&r='+ addy;
                fdImageThumbs.img.src = 'http://webdesignbook.net/snapper.php?url='+ encodeURI(addy) + '&w=160&h=120'
                fdImageThumbs.fade(10);
        },
        hideThumb: function(e) {
                if (!e) var e = window.event;
                var relTarg = e.relatedTarget || e.toElement;
                        
                if(relTarg.id && relTarg.id == "fdImageThumb") return false;
                
                if ( fdImageThumbs.timer ) { clearTimeout(fdImageThumbs.timer); }
                if ( fdImageThumbs.opacityTimer ) { clearTimeout(fdImageThumbs.opacityTimer); }
                fdImageThumbs.obj.style.visibility = 'hidden';
                fdImageThumbs.img.style.visibility = 'hidden';
        },
        updateXY : function(e) {
                if (document.captureEvents) {
                        fdImageThumbs.x = e.pageX;
                        fdImageThumbs.y = e.pageY;
                } else if ( window.event.clientX ) {
                        fdImageThumbs.x = window.event.clientX+document.documentElement.scrollLeft;
                        fdImageThumbs.y = window.event.clientY+document.documentElement.scrollTop;
                }
        },
        fade: function(opac) {
                var passed  = parseInt(opac);
                var newOpac = parseInt(passed+10);
                if ( newOpac < 90 ) {
                        fdImageThumbs.obj.style.opacity = '.'+newOpac;
                        fdImageThumbs.obj.style.filter = "alpha(opacity:"+newOpac+")";
                        fdImageThumbs.opacityTimer = window.setTimeout("fdImageThumbs.fade('"+newOpac+"')",20);
                } else {
                        fdImageThumbs.obj.style.opacity = '.99';
                        fdImageThumbs.obj.style.filter = "alpha(opacity:99)";
                        
                }
        },
        addEvent: function( obj, types, fn ) {
                var type;
                for(var i = 0; i < types.length; i++) {
                        type = types[i];
                        if ( obj.attachEvent ) {
                                obj['e'+type+fn] = fn;
                                obj[type+fn] = function(){obj['e'+type+fn]( window.event );}
                                obj.attachEvent( 'on'+type, obj[type+fn] );
                        } else obj.addEventListener( type, fn, false );
                }
        }
}

fdImageThumbs.addEvent(window, ['load'], fdImageThumbs.init);