var __WinkWidgetHandle;

WinkWidget = function() { this.initialize.apply(this, arguments); }

WinkWidget.prototype = {
    popupWidth: 350,
    imgWidth: 19,
    imgHeight: 31,
    fudge: 1,
    imgDR: 'http://wink.com/_/image/widget/arrow_right_down.png',
    imgDL: 'http://wink.com/_/image/widget/arrow_left_down.png',
    imgUR: 'http://wink.com/_/image/widget/arrow_right_up.png',
    imgUL: 'http://wink.com/_/image/widget/arrow_left_up.png',
    defIcon: 'http://wink.com/_/image/widget/globe.png',

    bind: function() {
        var __method = this, args = arguments, object = args.shift();
        
        return function() { __method.apply(object, args); }
    },

    initialize: function(id) {
        this.searchFirst = true;
        this.data = null;
        this.feed = null;
        this.timeout = null;
        this.mouseX = 0;
        this.mouseY = 0;
        this.preview = true;

        this.setID(id);

        __WinkWidgetHandle = this;
    },

    setID: function(id) {
        this.id = id;
    },

    setFeedData: function(data) {
        // create the attachment for the feeds...
        var html;

        html  = '<img style="position: absolute; display: none;" id="wink_widget_fimg" src="'+this.imgDR+'"></div>';
        html += '<div style="overflow: hidden; display: none; text-align: left;" id="wink_widget_feed">';
        html +=  '<div class="wink_widget_body" id="wink_widget_feed_data"> </div>';
        html += '</div>';

        var body = document.getElementsByTagName('body')[0];

        var d = document.createElement('div');
        body.appendChild(d);

        d.innerHTML = html;

        this.feed = data;

        // update the icons...
        if (this.feed && this.feed.links) {
            var map = new Array();
            for (var i = 0; i < this.feed.links.length; i++) {
                if (this.feed.links[i].icon) {
                    map[this.feed.links[i].url] = this.feed.links[i].icon;
                }
            }

            for (var s = null, i = 0; (s = document.getElementById('wink_widget_href_'+i)) != null; i++) {
                var src = map[s.href];

                if (src) {
                    if ((s = document.getElementById('wink_widget_icon_'+i)) != null)
                        s.src = src;
                }
            }
        }

        var img0 = new Image(); img0.src = this.imgDR;
        var img1 = new Image(); img1.src = this.imgDL;
        var img2 = new Image(); img2.src = this.imgUR;
        var img3 = new Image(); img3.src = this.imgUL;
    },

    clearSearch: function(event) {
        if (this.searchFirst) {
            this.searchFirst = false;
            var e = document.getElementById('wink_widget_search');
            if (e != null) {
                e.value = '';
                e.style.color = 'black';
            }
        }
    },

    clearFeedTimer: function() {
        if (this.timeout != null) {
            clearTimeout(this.timeout);
            this.timeout = null;
        }
    },

    hideFeed: function(idx) {
        this.clearFeedTimer();

        if ((e = document.getElementById('wink_widget_feed')) != null)
            e.style.display = 'none';

        if ((e = document.getElementById('wink_widget_fimg')) != null)
            e.style.display = 'none';
    },

    isFirefox: (navigator.userAgent.match(/firefox/i)),
    isOpera:  (navigator.userAgent.match(/opera/i)),
    isSafari: (/Safari|Konqueror|KHTML/i).test(navigator.userAgent),
    isIE: (!this.isSafari && !navigator.userAgent.match(/opera/i) && navigator.userAgent.match(/msie/gi)),

    getOffset: function(e) {
        var vT = 0, vL = 0;

        // l = new Array();

        // l[l.length] = e.tagName + '[' + e.style.position + '](' + (e.offsetLeft||0) + ',' + (e.offsetTop||0) + ')';
        while (e != null) {

            vT += e.offsetTop || 0;
            vL += e.offsetLeft || 0;
            e   = e.offsetParent;

            // if (e) l[l.length] = e.tagName + '[' + e.style.position + '](' + (e.offsetLeft||0) + ',' + (e.offsetTop||0) + ')';

            if (e == null)
                break;
            var p = (e.style.position || '').toLowerCase();
            if (e.tagName == 'BODY' || p == 'absolute' || p == 'xrelative')
                break;
        }

        // alert(l);

        return [vT, vL];
    },

    showFeed: function() {
        var item = null, e, s;

        this.clearFeedTimer();

        if (this.feed == null || this.feed.links == null)
            return;
        if ((e = document.getElementById('wink_widget_feed')) == null)
            return;
        if ((d = document.getElementById('wink_widget_feed_data')) == null)
            return;
        if ((s = document.getElementById('wink_widget_site_'+this.feedItem)) == null)
            return;
        if ((l = document.getElementById('wink_widget_href_'+this.feedItem)) == null)
            return;

        for (var i = 0; i < this.feed.links.length; i++) {
            if (this.feed.links[i].url == l.href) {
                item = this.feed.links[i];
                break;
            }
        }
        if (item == null || item.html == null)
            return;

        d.innerHTML  = item.html;

        // cause it to be rendered...
        //
        e.style.position   = 'absolute';
        e.style.top        = 0;
        e.style.left       = 0;
        e.style.visibility = 'hidden';
        e.style.display    = 'inline';

        //
        var scrollLeft = (document.body.scrollLeft) ? document.body.scrollLeft : document.documentElement.scrollLeft;
        var scrollTop  = (document.body.scrollTop)  ? document.body.scrollTop  : document.documentElement.scrollTop;

        var targetW = e.offsetWidth;
        var targetH = e.offsetHeight;

        //get the size of the browser window
        var winHeight = (window.innerHeight) ? window.innerHeight 
                        : ((document.documentElement.clientHeight) ?  document.documentElement.clientHeight 
                           : document.body.clientHeight);
        var winWidth  = (window.innerWidth)  ? window.innerWidth 
                        : ((document.documentElement.clientWidth) ?  document.documentElement.clientWidth 
                           : document.body.clientWidth);

        //
        var top = this.mouseY, left = this.mouseX;

        /*
        alert('mX = ' + this.mouseX + '  mY = ' + this.mouseY + "\n" +
              'wW = ' + winWidth    + '  wH = ' + winHeight + "\n" +
              'tW = ' + targetW    + '  tH = ' + targetH + "\n" +
              'sL = ' + scrollLeft  + '  sT = ' + scrollTop + "\n");
        */

        var oe = this.getOffset(e);
        var o = this.getOffset(this.mouseE.parentNode || this.mouseE);

        top  = o[0] - oe[0] + (this.mouseE.offsetHeight / 2);
        left = o[1] - oe[1] + 16;

        if (this.mouseX < winWidth / 2) {
            left += this.mouseE.offsetWidth + this.imgWidth + this.fudge;
        } else {
            left -= targetW + this.imgWidth + this.fudge;
        }

        if (this.mouseY < winHeight / 2) {
            // top += targetH * .25;
        } else {
            var delta = targetH * .4;
            if (delta < this.imgHeight + 10)
                delta = this.imgHeight + 10;
            top -= delta;
        }

        //set the final position of the box
        e.style.top  = top + "px";
        e.style.left = left + "px";
        e.style.visibility= 'visible';

        if ((e = document.getElementById('wink_widget_fimg')) != null) {
            top  = o[0] - oe[0] + (this.mouseE.offsetHeight / 2);
            left = o[1] - oe[1] + 16;

            if (this.mouseX < winWidth / 2) {
                left += 1 + this.mouseE.offsetWidth + this.fudge;
                if (this.mouseY < winHeight / 2) {
                    e.src = this.imgUL;
                } else {
                    e.src = this.imgDL;
                }
            } else {
                left -= 2 + this.imgWidth + this.fudge;
                if (this.mouseY < winHeight / 2) {
                    e.src = this.imgUR;
                } else {
                    e.src = this.imgDR;
                }
            }

            if (this.mouseY < winHeight / 2) {
                top += this.fudge;
            } else {
                top -= this.fudge + this.imgHeight;
            }

            e.style.top     = top  + 'px';
            e.style.left    = left + 'px';
            e.style.position = 'absolute';
            e.style.border   = 0;
            e.style.padding   = 0;
            e.style.display = 'inline';
        }
    },

    showFeedTimer: function(idx, event) {
        if (!this.preview)
            return;

        this.clearFeedTimer();
        this.feedItem = idx;
        this.timeout  = setTimeout(function(o) { var obj = o; return function() { obj.showFeed(arguments); } }(this), 500);
        var evt = event || window.event;
        var e   = evt.target || evt.srcElement;

        this.mouseE = e;
        this.mouseX = evt.clientX;
        this.mouseY = evt.clientY;
    },

    render: function(id, data) {
        this.setID(id);

        if (!data)
            return;

        this.data = data;
        this.preview = data ? data.preview : false;
        this.renderImpl();

        if (this.data.feedsrc) {
            var s = document.createElement('script');
            s.setAttribute('type', 'text/javascript');
            s.setAttribute('src',  this.data.feedsrc);

            var h = document.getElementsByTagName('head')[0];
            var f = function () { h.appendChild(s); };

            if (window.addEventListener) {
                window.addEventListener('load', f, false);
            } else if (document.addEventListener) {
                document.addEventListener('load', f, false);
            } else if (window.attachEvent) {
                window.attachEvent('onload', f);
            }
        }
    },

    renderImpl: function() {
        var data = this.data;
        var html = '';

        if (data.image) {
            html += '<img style="padding-left: 4px; padding-bottom: 4px; float:left;" width="48" height="48" src="'+data.image+'">';
            html += '<div style="padding-left: 56px;" id="wink_widget_user">';
        } else {
            html += '<div style="padding-left: 5px; padding-bottom: 4px;" id="wink_widget_user">';
        }

        html += '<a class="snap_nopreview" href="'+data.url+'">' + data.name + '</a>';
        if (data.location)
            html += '<br/>' + data.location;
        html += '</div>';

        if (data.winkIcon) {
            html += '<div style="clear: both;" id="wink_widget_winkme">';
            html += '<div style="padding: 4px 5px 0px 0px; float:right;">';
            html += '<img style="vertical-align: middle; padding-right: 3px; border:0px;" src="'+data.winkIcon+'" alt="">';
            html += '</div>';
            html += '</div>';
        }

        if (!data.sites)
            data.sites = new Array();

        if (data.sites) {
            for (var i = 0; i < data.sites.length; i++) {
                var s = data.sites[i];

                html += '<div '+(i==0?'style="clear:both; border-top: 1px solid #ccc;"':'')+' id="wink_widget_site_'+i+'" class="wink_widget_site wink_widget_bbottom">';
                pd = 21;
                if (s.icon) {
                    html += '<img style="vertical-align: middle;" width="16" height="16" src="' + s.icon + '" alt="">';
                    pd -= 16;
                } else {
                    html += '<img style="vertical-align: middle;" width="16" height="16" id="wink_widget_icon_'+i+'" src="' + this.defIcon + '" alt="">';
                    pd -= 16;
                }

                html += '<a id="wink_widget_href_'+i+'" style="padding-left:'+pd+'px;'+(s.em? 'font-weight:bold;':'')+'" class="wink_widget_title snap_nopreview" href="'+s.url+'">' + s.title + '</a>';
                html += '</div>';
            }
        }

        if (data.tags) {
            html += '<div class="wink_widget_mytags wink_widget_bbottom">MyTags: ';

            for (var i = 0; i < data.tags.length; i++) {
                var t = data.tags[i];
                if (i != 0)
                    html += ', ';
                html += '<a class="snap_nopreview" href="'+t.url+'">' + t.title + '</a>';
            }

            html += '</div>';
        }

        
        html += '<form style="text-align:center; white-space: nowrap; margin-bottom: 0px;" method="POST" action="http://wink.com/people/">';
        html += '<input type="hidden" name="ctr" value="'+data.user+'"/>';
        html += '<input id="wink_widget_search" type="text" name="q" value="Search for people"/>';
        html += '<input id="wink_widget_submit" type="submit" value="search"/>';
        html += '</form>';

        //
        //
        //

        //
        //
        //
        var e = document.getElementById(this.id);
        if (e) 
            e.innerHTML = html;

        //
        //  Now tie some event handlers...
        //

        if ((e = document.getElementById('wink_widget_search')) != null) {
            e.onclick = function(o) { var obj = o; return function() { obj.clearSearch(arguments); } }(this);
        }

        if ((e = document.getElementById('wink_widget_footer')) != null) {
            e.onclick = function() { window.location = 'http://wink.com/'; };
        }

        if (data.sites && this.preview) {
            for (var i = 0; i < data.sites.length; i++) {
                if ((e = document.getElementById('wink_widget_site_'+i)) != null) {
                    e.onmouseover = function(o, idx) { var i = idx, obj = o; return function(e) { obj.showFeedTimer(i, e); } }(this, i);
                    e.onmouseout  = function(o, idx) { var i = idx, obj = o; return function() { obj.hideFeed(i); } }(this, i);
                }
            }
        }
    }
}

w = new WinkWidget();

w.render('wink_widget_body', {"winkIcon":null,"name":"Lesley G","user":"lesleyinnm","url":"http:\/\/wink.com\/p\/lesleyinnm","location":"albuquerque, new mexico United States","image":"http:\/\/image.wink.com\/_i\/a0f8f4dc_d2lua19wcm9maWxlOjg1MmY1M2NhY2EzOTVjZTk_48f48_ffffff00.jpg","winkCount":0,"feedsrc":"http:\/\/wink.com\/widget\/lesleyinnm\/data.js","preview":1,"sites":[{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/2\/2a\/2ad9c66d99c635d5e15bf5180e321e99.png","title":"The Debris Field Blog","url":"http:\/\/thedebrisfield.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/c\/ca\/cac43b2b66061cb0e3550f5c3eb36393.png","title":"Flickr: Photos from decogrl","url":"http:\/\/www.flickr.com\/photos\/lesleyinnewmexico"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/3\/3e\/3e0d5cc8590ca31ffce3c438f097954a.png","title":"Beyond the Dial @ Blogger","url":"http:\/\/beyondthedial.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/6\/69\/6966393318455433cbc8dd32831c76e6.png","title":"Beyond the Dial @ Wordpress","url":"http:\/\/beyondthedial.wordpress.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/3\/35\/355fe9ecd16a82809ffcf8688db276d7.png","title":"Lesley's podcast","url":"http:\/\/lesleyinnm.podomatic.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/8\/84\/847f6b5802e322dc6506ea85e3ce269c.png","title":"Lesley Land","url":"http:\/\/lesleyland.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/3\/36\/36e908159aab27f6333ab9260ae4c646.png","title":"The Wild Kingdom","url":"http:\/\/lesleyspets.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/b\/ba\/bae407036624ad09e4e1b91d17b2a52c.png","title":"lesleyinnm - MyBlogLog","url":"http:\/\/www.mybloglog.com\/buzz\/members\/lesleyinnm"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/4\/43\/43c901643e700901572fbd5610c96d5e.png","title":"The Debris Field Website","url":"http:\/\/www.thedebrisfield.net"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/0\/09\/09cea9926dead3acea00994c3de5c6ac.png","title":"My page @ BlogTalkRadio","url":"http:\/\/www.blogtalkradio.com\/beyondthedial"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/6\/63\/635b3b4c088f5d984775a2f0a8e09cae.png","title":"LesleyinNM on Technorati","url":"http:\/\/technorati.com\/people\/technorati\/lesleyinnm"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/6\/63\/63c51f5cbde702a7edd736f9948d5d5a.png","title":"Yahoo! 360\u00b0 - Lesley's Profile","url":"http:\/\/360.yahoo.com\/my_profile-hLecQik1fqWGpibmhJWN"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/9\/99\/9972d0042c36d8ad293dccfb41448616.png","title":"Facebook","url":"http:\/\/www.facebook.com\/profile.php?id=555743462"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/d\/d4\/d42324259b544b9f4b79708cf0c5ba59.png","title":"MySpace | Lesley","url":"http:\/\/www.myspace.com\/thedebrisfield"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/2\/2e\/2e325a271ccdef491a23a0334a43245f.png","title":"My Page @ Paranormal Meet","url":"http:\/\/www.paranormalmeet.com\/index.php?cmd=\/public\/user\/name_Lesley\/"},{"icon":null,"title":"Land of Enchantment","url":"http:\/\/newmexicoenchantment.blogspot.com\/"},{"icon":null,"title":"Machine Elf","url":"http:\/\/machine-elf.squarespace.com\/"},{"icon":null,"title":"Lesley's link-O-rama","url":"http:\/\/guest.portaportal.com\/lesleyinnm"},{"icon":null,"title":"The Totally Girlie Blog","url":"http:\/\/totallygirlieblog.blogspot.com\/"},{"icon":null,"title":"Twitter \/ lesleyinnm","url":"http:\/\/twitter.com\/lesleyinnm"},{"icon":null,"title":"UFO Magazine -  The Green Room","url":"http:\/\/ufomagazine.squarespace.com"}]});