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":"Jos\u00e9 Per\u00e9z Bonilla","user":"perezpzz","url":"http:\/\/wink.com\/p\/perezpzz","location":"Barcelona, Catalu\u00f1a Spain","image":"http:\/\/image.wink.com\/_i\/fd82d69d_d2lua19wcm9maWxlOjFkY2JhNDE4MzQ2NzUxZDgwMDc3OTZiNjQyNDRiNTIw_48f48_ffffff00.jpg","winkCount":0,"feedsrc":"http:\/\/wink.com\/widget\/perezpzz\/data.js","preview":1,"sites":[{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/b\/b3\/b3655794b279ef8436ba5b807e9e77d3.png","title":"ARAGON19BARCELONA en Catalan","url":"http:\/\/aragon19barcelona.obolog.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/4\/49\/49055f68288d590ed806d08de620caba.png","title":"El blog de perezpzz","url":"http:\/\/blog.iespana.es\/perezpzz"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/9\/92\/920e6f7237aefac58283ecce1a90e7ed.png","title":"Tiburones","url":"http:\/\/blogs.ya.com\/perezpzz\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/5\/57\/573143c8a5fb5304966dc2c34f09978c.png","title":"MSN espaces ARAGON19BARCELONA","url":"http:\/\/19aragonbarcelona.spaces.msn.com\/personalspace"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/1\/10\/108446d0f897725803d3bd6a5c675329.png","title":"Comunidad de Propietarios","url":"http:\/\/comunidad-de-propietarios.tublog.es\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/c\/c7\/c758e80eb393c1b338f7f7b00af30d12.png","title":"\" PARTICULAR PRIVADO \"","url":"http:\/\/blog.iespana.es\/jaleo.real"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/0\/06\/063caa9efec9dfc73c3136f1e4a31879.png","title":"Comunidad de Propietarios","url":"http:\/\/aziroet.com\/perezpzz\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/3\/39\/396d9274d5f0eae7ce4a556e33634690.png","title":"Comunidad de Propietarios - BlogTematicos.com","url":"http:\/\/www.blogtematicos.com\/perezpzz\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/d\/d1\/d1d49137056079fcd1b04820da487e1f.png","title":"\u00c1lbumes web de Picasa - jaleoreal - miniaturas mias","url":"http:\/\/picasaweb.google.es\/aragon19barcelona\/MiniaturasMias"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/8\/8d\/8d96bfe55c606136186f1e639360b1f6.png","title":"aragon19barcelana \/ estructurales,ambientales,mentales","url":"http:\/\/www.geoscopio.net\/escaparate\/portada.cgi?idempresa=11705"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/6\/61\/6177a57cbc46575d42b3011b8750200b.png","title":"Comunidad de Propietarios en Internet","url":"http:\/\/blogs.ideal.es\/index.php\/perezpzz"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/4\/41\/417715a0633ad36073acee753eb254e0.png","title":"jaleo.real  Web Research eSnips Folder","url":"http:\/\/www.esnips.com\/web\/jaleorealsWebResearch"},{"icon":null,"title":"Tu Comindad de Propietarios en Internet","url":"http:\/\/perezpzz.lynksee.com\/blog\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/1\/1a\/1ac2e7e83664c45df4294c39ccfc99f9.png","title":"MIO conchas grande","url":"http:\/\/perezpzz.blogdiario.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/e\/e5\/e5eb1ebab2667b81f71bcb1c57666fd5.png","title":"Cangrejos Ermita\u00f1os","url":"http:\/\/perezpzz.nireblog.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/5\/57\/573862d4b26faefc3eabfb984711354a.png","title":"LA DERRAMA","url":"http:\/\/www.selectablog.com\/derrama\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/5\/59\/594ca03c9596434497de78f1da4e122a.png","title":"Lycos Planet","url":"http:\/\/planet.lycos.com\/3653845997"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/b\/b9\/b9be9942b883454e374c18d5b36ded0d.png","title":"Sr. Castellvell i Diez","url":"http:\/\/www.bublegun.net\/ermitanos"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/d\/d6\/d6b4e26ef96996c59d34e3187f297186.png","title":"Comunidad de Propietarios","url":"http:\/\/perezpzz.soy.es\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/d\/d9\/d97624b2b451ca1d1192d28b28cc52ad.png","title":"perezpzz.wordpress.","url":"http:\/\/perezpzz.wordpress.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/b\/b4\/b4236b0e34f8b9b77ad0b30acb8646a2.png","title":"Los Pochos","url":"http:\/\/perso.wanadoo.es\/jaleoreal\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/f\/fb\/fb7ca2f70ef47d484eb1f79f26fbd38f.png","title":"Yahoo! 360","url":"http:\/\/fr.blog.360.yahoo.com\/blog-HzVaeTI7eqpMSSNGeaamy.iP%3B_ylt=ArTQMh1vZ1E7_TkaqULNIKe8J.J3"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/0\/0e\/0e187aef3e93e4f505b8406d8559ad38.png","title":"Comunidad de Propietarios el control controlado con Abogado","url":"http:\/\/www.moonble.com\/perezpzz\/note\/41\/comunidad-de-propietarios-el-control-controlado.html"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/3\/37\/3772b57cc89c6829c8064d164b6007ff.png","title":"aragon19barcelona jaleoreal","url":"http:\/\/jaleoreal.wordpress.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/4\/47\/47ac9ffda0e0eacf2082e496b59b76a0.png","title":"LOS CANGREJOS ERMITA\u00d1OS","url":"http:\/\/jaleoreal.blogspot.es\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/a\/ac\/ace4dae034e4f6c2751db952753c8765.png","title":"Comunidad de Propietarios","url":"http:\/\/perezpzz.blog.dada.net\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/8\/81\/81b0d3ff15abf3c9885ebbc0112c7a31.png","title":"Comunidad de Propietarios","url":"http:\/\/www.cqblog.com.ar\/perezpzz"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/9\/99\/99ad265ca6e686d515fd609ea0426910.png","title":"Vecinos Catalana de Gas","url":"http:\/\/www.vecinos.com\/perezpzz"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/3\/3e\/3ef479c270fd8b9ef22ea89dceacf748.png","title":"ARAGON19BARCELONA | ESTRUCTURALES","url":"http:\/\/www.freewebs.com\/perezpzz\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/1\/1d\/1d628eaa39d6e5a3a81b24eb87448090.png","title":"Aragon 19 Barcelona ::: MiChat.cl  : Crea tu blog gratis!","url":"http:\/\/blog.michat.cl\/perezpzz\/596\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/b\/b2\/b2398a431196b1f4df0a38887de536a7.png","title":"Comunidad de Propietarios","url":"http:\/\/blog.occhiettineri.it\/index.php?blogId=338"}]});
