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":"Thanate Tan","user":"thanate191","url":"http:\/\/wink.com\/p\/thanate191","location":"","image":"http:\/\/image.wink.com\/_i\/8a3ee7ec_d2lua19wcm9maWxlOmQ2OGJlOTRjMzMwZDI3MGM2ZjRjMTUzMDA3Yjk0ZTFk_48f48_ffffff00.jpg","winkCount":0,"feedsrc":"http:\/\/wink.com\/widget\/thanate191\/data.js","preview":1,"sites":[{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/2\/29\/29fa21e88679013e59c83505546bc8a1.png","title":"Top Celebrities and Sports Talent","url":"http:\/\/celebrities.blogsome.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/0\/00\/004604cdcc9042e8043e38d390613026.png","title":"Mourn for YeYe","url":"http:\/\/yeye-burial.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/c\/c9\/c969e9ec412f2e0230e3f83964f7450b.png","title":"Hydroponics - Soil-less gardening.","url":"http:\/\/hydroponics-fine.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/a\/aa\/aac8f9dbc932c23ae0d560c2d1e51a07.png","title":"StumbleUpon \u00bb thanate191's web site reviews and blog","url":"http:\/\/thanate191.stumbleupon.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/6\/6a\/6a9b2d9d4e948b358e3bf4de9ca8c7ca.png","title":"Doggy Doggie Dog","url":"http:\/\/doggy.blogsome.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/0\/03\/03dcb09645bb1455b97e6b52ba602df5.png","title":"Mesothelioma : A form of cancer caused by previous exposure to asbestos.","url":"http:\/\/mesothelioma.everything-fine.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/9\/98\/987d0891ef9e67a3182c9328660b16c4.png","title":"Personal loan Information : Auto loan, Home loan, Internet bank, Mortgage","url":"http:\/\/fine-personal-loan.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/e\/e2\/e2d95f723c070e10668fc09adfd817df.png","title":"Phonics - The Resource for teaching children to read.","url":"http:\/\/fine-phonics.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/4\/40\/401e5be0857ace80d0516a6974625017.png","title":"Alternative Energy, Alternative Fuels; Natural Gas, LPG, NGV","url":"http:\/\/alternative-energy.everything-fine.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/e\/e8\/e8531a2825cbe3d2a864842adc741eb9.png","title":"Medical treatment by baths and mineral waters : SPA","url":"http:\/\/hydropathy.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/b\/b0\/b01a8310f9a4a5ad9d8e0001dbfe7281.png","title":"Herbal Healthcare","url":"http:\/\/herbal-healthcare.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/f\/f0\/f0ecab592f6ee8724ea8b05fc01001bf.png","title":"how to \u2026..","url":"http:\/\/e-book.everything-fine.com"},{"icon":null,"title":"All Underwater","url":"http:\/\/all-underwater.blogspot.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/0\/04\/04268c83ee985e8dd762928927001a5c.png","title":"Blogaholic blogging blog everyday","url":"http:\/\/www.blogaholic.everything-fine.info\/"},{"icon":null,"title":"Healthy Cook Recipes","url":"http:\/\/healthy-cook-recipes.blogspot.com\/"},{"icon":null,"title":"Gaming Zone Blog","url":"http:\/\/gaming-zone-blog.blogspot.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/f\/f1\/f1e03d46f810428ee51643ba164be060.png","title":"Women's Interests for Womenfolk","url":"http:\/\/www.women-interests.info"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/d\/d3\/d33be8cfa1cf03bf72f7e74b846d387d.png","title":"Van Insurance - Protection against losses to your van","url":"http:\/\/www.van-insurance.co.cc\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/a\/a0\/a03280b6ff4f599b90f02b182cc493f9.png","title":"Pattaya Rural","url":"http:\/\/pattaya.kittipattaya.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/8\/80\/8070c35f36b1faf10e21ff836e25777b.png","title":"Bioplastic Product and Biodegradable","url":"http:\/\/www.bioplastic-product.com\/"},{"icon":null,"title":"Anti Eating Dogs \u2022 Index page","url":"http:\/\/www.antieatingdogs.com\/"},{"icon":null,"title":"Sailing Cruise: Sailor blog for Sailors with Sailing information","url":"http:\/\/www.sailing-cruise.net\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/e\/ed\/edb7cdd68de42b237508ee863313da28.png","title":"Green Living Home - Save Our Earth By Living Green.","url":"http:\/\/greenliving.nicehomelive.com\/"},{"icon":null,"title":"Money Games Information","url":"http:\/\/moneygame.blogsome.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/4\/42\/4219b94f1312c95d6e6111d610be25a9.png","title":"Super Ghost Blogger: The solutions for maintain your blog.","url":"http:\/\/www.superghostblogger.com"},{"icon":null,"title":"Update Your Life with new gadget","url":"http:\/\/nokhathai.blogspot.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/1\/17\/1737067fc310e8f0ca4d3cb3070df852.png","title":"All Vacation Travel: Your Destination Advice for Happy Journey","url":"http:\/\/www.all-vacation-travel.com"},{"icon":null,"title":"Everything Directory for Blogs","url":"http:\/\/directory.everything-fine.info\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/f\/f6\/f6790a8115104c047fd64ba9fda98158.png","title":"Fine Directory for every web site submission","url":"http:\/\/www.fine-directory.com"},{"icon":null,"title":"Web site Promotion Service with manual work for best advertisement.","url":"http:\/\/www.everything-fine.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/4\/4d\/4d92fe6699361be296db496d24db9d92.png","title":"Nice Home Live - Home Improvement Resource","url":"http:\/\/www.nicehomelive.com"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/d\/d3\/d3c5102c0285bd386ac4468946ab1f32.png","title":"Your Band Tube","url":"http:\/\/www.yourbandtube.com\/"},{"icon":"http:\/\/wink.com\/-\/images\/wink\/fav\/c\/cb\/cbf8d12ab8f626653e4d7f1bbe827459.png","title":"Cheap Price Products for pay lower to buy","url":"http:\/\/www.cheap-price-products.com\/"},{"icon":null,"title":"Free Articles Directory Submission","url":"http:\/\/www.free-articles-directory-submission.co.cc"}]});
