/**
 * Copyright 2009 Optaros, Inc.
 */

//Magento includes prototype and scriptaculous
jQuery.noConflict();

//global vars
var fangento_pin_open = false;
var fangento_friends = new Array();
var fangento_sliding = false;

/**
 * Case-insensitive "contains" extension
 * See: http://stackoverflow.com/questions/187537/is-there-a-case-insensitive-jquery-contains-selector
 *
 */
jQuery.expr[':'].contains_ci = function(a,i,m){ return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0; };


/**
 * Extracts a URL param.
 * See: http://stackoverflow.com/questions/979975/how-to-get-the-value-from-url-parameter
 *
 */
function fangento_urlParam(param) {
    var regex = '[?&]' + param + '=([^&#]*)';
    var results = (new RegExp(regex)).exec(window.location.href);
    if(results) return results[1];
    return '';
}


/**
 * Formats a date.
 *
 */
function fangento_date_format(date) {
    date = new Date(date * 1000);

    var month = date.getMonth() + 1;
    var day = date.getDate();
    var hour = date.getHours();
    var min = date.getMinutes();

    var hourStr = hour;
    var amPm = 'am';
    if (hour == 0) {
        hourStr = '12';
    }
    else if (hour > 12) {
        hourStr = (hour - 12);
        amPm = 'pm';
    }

    if (min < 10) {
        minStr = '0' + min;
    }
    else {
        minStr = min;
    }

    var returnStr = month + '/' + day + ' at ' + hourStr + ':' + minStr + ' ' + amPm;
    return returnStr;
}


/**
 * jQuery init.
 *
 */
jQuery(document).ready(function() {
    jQuery.growlStyleOverride({backgroundColor: '#FFFF66', opacity: 0.75});

    //grows should be centerized
    jQuery.growlCenter(true);

    //FIX: is there a way to unattach these selectors when they're not needed anymore?
    jQuery('#fangento-app').mouseenter(function() {
        if (!fangento_pin_open && !fangento_sliding) {
            fangento_sliding = true;
            jQuery('#fangento-appBody').slideDown('normal', function() {
                fangento_sliding = false;
            });
        }
    });
    jQuery('#fangento-app').mouseleave(function() {
        if (!fangento_pin_open && !fangento_sliding) {
            fangento_sliding = true;
            jQuery('#fangento-appBody').slideUp('normal', function() {
                fangento_sliding = false;
            });
        }
    });

    //reply-mode
    if (window.location.href.indexOf('fangento=') != -1) {

        jQuery('#fangento-app').slideUp();
        jQuery('#fangento-reply').slideDown();

        var fangento = fangento_urlParam('fangento');
        var fangento_arr = fangento.split('_');
        var sender = fangento_arr[2];

        var threadId = fangento_urlParam('threadId');

        //nbsp to fix spacing problem in IE
        jQuery('#fangento-replyHeader').html(
            '<div style="float:left; margin-right:10px;">' +
                '<fb:profile-pic size=square uid=' + sender + ' facebook-logo=true></fb:profile-pic>' +
            '</div>' +
            '<fb:name uid=' + sender + ' useyou=false></fb:name>&nbsp;' + fangento_messages['needs advice'] + ': <span id="fangento-replyComment" style="font-weight:bold"></span>' +
            '<div style="clear:both"></div>');

        //FIX: we could contruct the fangento string server-side from the threadId
        jQuery.ajax({
              type: 'POST',
              url: fangento_paths['ajax_threadComment'],
              data: ({threadId: threadId}),
              success: function(msg){
                jQuery('#fangento-replyComment').html(msg);
              }
           });

        //sometimes null?
        if (FB.XFBML.Host) FB.XFBML.Host.parseDomTree();

        jQuery.growlUI(fangento_messages['Share your thoughts on this product.'], null, null, function() {
            jQuery('#fangento').effect("highlight", {}, 1000);
            }, jQuery('#fangento'));
    }

    /* example of textarea helper text if needed in future...
        jQuery('#fangento-filter').focus(function () {
            var elem = jQuery(this);
            if (elem.hasClass('foo-default')) {
                elem.removeClass('foo-default');
                elem.val('');
            }
        });
        jQuery('#fangento-filter').blur(function () {
            var elem = jQuery(this);
            if (!elem.val().length) {
                elem.addClass('foo-default');
                elem.val('Search');
            }
        });
    */

    //thumbs-up and thumbs-down hovers
    jQuery('#fangento-thumbsUp').hover(
        function(){
            this.src = fangento_images['thumbs_up_on'];
        },
        function(){
            if (jQuery('#fangento-likeDislike').val() != 'like') {
                this.src = fangento_images['thumbs_up_off'];
            }
        }
    );

    jQuery('#fangento-thumbsDown').hover(
        function(){
            this.src = fangento_images['thumbs_down_on'];
        },
        function(){
            if (jQuery('#fangento-likeDislike').val() != 'dislike') {
                this.src = fangento_images['thumbs_down_off'];
            }
        }
    );

});


/**
 * Facebook callback when user is connected.
 *
 */
function fangento_start() {
    //user has just logged in
    if (jQuery('#fangento-appBody').is(':visible')) {
        jQuery('#fangento-appBodyAnon').slideUp();
    }
    //user has reloaded page
    else {
        jQuery('#fangento-appBodyAnon').hide();
        jQuery('#fangento-appBody').show();
        fangento_pin_open = true;
    }

    //footer
    jQuery('#fangento-appHeaderAnon').hide();
    jQuery('#fangento-appBodyFooterAuth').show();
    jQuery('#fangento-learnMore').hide();

    jQuery('#fangento-appBodyAuth').slideDown();

    //load friends
    var sql = 'select name, uid, pic_square_with_logo, online_presence from user where uid in (select uid2 from friend where uid1=' + FB.Facebook.apiClient.get_session().uid + ') order by name';
    FB.Facebook.apiClient.fql_query(sql, function(result, ex) {

        fangento_friends = result;

        jQuery("#fangento-recipients").autocomplete(fangento_friends,
            {
                minChars: 0,
                width: jQuery('#fangento-recipients').width(),
                multiple: true,
                mustMatch: true,
                autoFill: false,
                matchContains: true,
                highlightItem: true,
                formatItem: function(row, i, max, term) {
                    //fgoPresence class on these only so that they can be updated dynamically when dropdown is open (not overly necessary)
                    var presenceStr = '<img class="fgoPresence" id="fangento-presence2-' + row.uid + '" src="' + BLANK_IMG + '" width="8" height="8" title="" alt=""/>';
                    var presencePhrase = '';
                    if (row.online_presence == 'active') {
                        presenceStr = '<img class="fgoPresence" id="fangento-presence2-' + row.uid + '" src="' + fangento_images['active'] + '"  width="8" height="8" title="' + fangento_messages['Online'] + '" alt="' + fangento_messages['Online'] + '"/>';
                        presencePhrase = 'Online';
                    }
                    else if (row.online_presence == 'idle') {
                        presenceStr = '<img class="fgoPresence" id="fangento-presence2-' + row.uid + '" src="' + fangento_images['idle'] + '"  width="8" height="8" title="' + fangento_messages['Idle'] + '" alt="' + fangento_messages['Idle'] + '"/>';
                        presencePhrase = 'Idle';
                    }

                    var avatar;
                    if (!jQuery.trim(row.pic_square_with_logo).length) {
                        avatar = 'http://static.ak.connect.facebook.com/pics/q_silhouette_logo.gif';
                    }
                    else {
                        avatar = row.pic_square_with_logo;
                    }

                    return '<div style="text-align:left;">' +
                            '<img src="' + avatar + '" style="float:left; margin-right:2px;"/>' +
                            '<div style="height:50px; float:left; margin:0px 2px;">' + presenceStr + '</div>' + row.name + '<br/>' +
                            '<em class="fgoPresencePhrase" id="fangento-presencePhrase-' + row.uid +'">' + presencePhrase + '</em>' +
                        '</div>';
                },
                formatMatch: function(row) {
                    return row.name;
                },
                formatResult: function(row) {
                    return row.name;
                }
            }).result(function(event, item) {
                //callback not necessary currently
                });
    });

    //see if there are any replies
    fangento_ping_replies(1);

    //online presence already set above, wait 30 seconds to update it again
    setTimeout('fangento_ping_presence()', 30000);
}


/**
 * Callback for logout button in default(ask)-mode.
 *
 */
function fangento_logout() {
    //footer
    jQuery('#fangento-appBodyFooterAuth').hide();
    jQuery('#fangento-appHeaderAnon').show();
    jQuery('#fangento-learnMore').hide();

    jQuery('#fangento-appBodyAuth').hide();
    jQuery('#fangento-appBodyAnon').show();

    jQuery('#fangento-appBody').slideUp();
    fangento_pin_open = false;
}


/**
 * Callback for ask-your-friends button in default(ask)-mode.
 *
 */
function fangento_ask() {
    jQuery('#fangento-appBodyAuthAsk').slideUp();
    jQuery('#fangento-appBodyAuthSend').slideDown();
}


/**
 * Callback for cancel button in default(ask)-mode.
 *
 */
function fangento_cancel() {
    jQuery('#fangento-appBodyAuthSend').slideUp();
    jQuery('#fangento-appBodyAuthAsk').slideDown();
}


/**
 * Callback for send button in default(ask)-mode.
 *
 */
function fangento_send() {

    var recipientsStr = jQuery.trim( jQuery('#fangento-recipients').val() );

    if (!recipientsStr.length) {
        jQuery.growlUI(fangento_messages['Please choose at least one friend.']);
        return;
    }

    var recipients = recipientsStr.split(/,\s*/);

    var message = jQuery('#fangento-message').val();
    if (!message.length) {
        jQuery.growlUI(fangento_messages['Please enter a question.']);
        return;
    }
    var messageTxt = message;

    var storeId = fangento_store_id;
    var productId = fangento_product_id;
    var fbId = FB.Facebook.apiClient.get_session().uid;

    var ids = [];
    var base_fangento_str = storeId + '_' + productId + '_' + fbId;

    //note that this loop will remove dups
    for (var i = 0; i < fangento_friends.length; i++) {
        var name = fangento_friends[i].name;
        if (jQuery.inArray(fangento_friends[i].name, recipients) != -1) {
            ids.push(fangento_friends[i].uid);
        }
    }

    jQuery.ajax({
        type: 'POST',
        url: fangento_paths['ajax_thread'],
        data: ({fangento: base_fangento_str, 'ids[]': ids, message: messageTxt, url: window.location.href}),
        success: function(msg){
            var threadStr = '&threadId=' + msg;

            //FIX: send notifications server-side?
            for (var i = 0; i < ids.length; i++) {
                var id = ids[i];
                var fangento_str = base_fangento_str + '_' + id;
                var href = window.location.href;
                var url;
                if (href.indexOf('?') == -1) {
                    url = href + '?fangento=' + fangento_str + threadStr;
                }
                else {
                    url = href + '&fangento=' + fangento_str + threadStr;
                }

                var new_message = '<a href="' + url + '">' + message + '</a>';
                FB.Facebook.apiClient.notifications_send(id, new_message, function() {});
            }

            //alert('Your messages have been sent.');
            jQuery.growlUI(fangento_messages['Your messages have been sent.']);

            jQuery('#fangento-recipients').val('');
            jQuery('#fangento-message').val('');

            jQuery('#fangento-appBodyAuthSend').slideUp();
            jQuery('#fangento-appBodyAuthAsk').slideDown();

            fangento_ping_replies(1, true);
        }
    });
}


/**
 * Callback for send button in reply-mode.
 *
 */
function fangento_send_reply(btn) {
    var fangento = fangento_urlParam('fangento');
    var fangento_arr = fangento.split('_');
    var sender = fangento_arr[2];

    var threadId = fangento_urlParam('threadId');

    //app-to-user notif needs to be sent server-side
    var newUrl = window.location.href.replace(/[?|&]fangento=([^&#]*)/, '').replace(/[?|&]threadId=([^&#]*)/, '');

    var reply = jQuery('#fangento-replyMessage').val();
    var likeDislike = jQuery('#fangento-likeDislike').val();
    if (likeDislike.length == 0) {
        jQuery.growlUI(fangento_messages['Please select whether you like or dislike this product.']);
        return;
    }
    else if (reply.length == 0) {
        jQuery.growlUI(fangento_messages['Please type a reply.']);
        return;
    }

    /*sample code for using blockUI load spinner
        jQuery('#foo').block({
            // disable horz centering
            centerX: false,
            // disable vertical centering
            centerY: false,
            // apply css props as desired
            fadeOut: 0, //immediate change
            message: '<img src="' + fangento_images['ajax_loader'] + '"/>',
            css: { top: '33%', left: '0%', width: '100%', backgroundColor: '', border: '' },
            timeout: 1000,
            onUnblock: function() {
                jQuery('#foo').hide();
                jQuery('#fangento-compose').show();
            }
        });

        .unblock
    */

    jQuery.ajax({
        type: 'POST',
        url: fangento_paths['ajax_reply'],
        data: ({fangento: fangento, fangento_message: reply, like_dislike: likeDislike, newUrl: newUrl, threadId: threadId}),
        success: function(msg){
            //sent server-side
            //FB.Facebook.apiClient.notifications_send(sender, 'has provided advice on this <a href="' + newUrl + '">product</a>.', function() {});

            //alert('Your reply has been sent.');
            jQuery.growlUI(fangento_messages['Your reply has been sent.'], fangento_messages['Thanks for sharing!']);

            jQuery('#fangento-reply').slideUp();
            jQuery('#fangento-app').slideDown();
        }
    });
}


/**
 * Callback for like/dislike (thumbs-up/thumbs-down) toggles.
 *
 */
function fangento_like_dislike(likeDislike) {
    if (likeDislike == 'like') {
        jQuery('#fangento-likeDislike').val('like');
        jQuery('#fangento-thumbsDown').attr('src', fangento_images['thumbs_down_off']);
    }
    else if (likeDislike == 'dislike') {
        jQuery('#fangento-likeDislike').val('dislike');
        jQuery('#fangento-thumbsUp').attr('src', fangento_images['thumbs_up_off']);
    }
}


/**
 * Pings for threads/replies and populates them into UI.
 *
 */
function fangento_ping_replies(force, onlyOnce) {
    //in case user logs out
    if (FB.Facebook.apiClient.get_session() == null) return;

    //FIX: consolidate fangento_str into global convenience func
    var storeId = fangento_store_id;
    var productId = fangento_product_id;
    var fbId = FB.Facebook.apiClient.get_session().uid;

    var fangento_str = storeId + '_' + productId + '_' + fbId;

    jQuery.getJSON(
        fangento_paths['ajax_replies'],
        ({fangento: fangento_str, force: force}),
        function(data){

            //fields available:
            //content
            //date_modified
            //facebook_id
            //is_new

            if (data != null && data.length) {

                var html = '';
                var numNew = 0;

                for (var i = 0; i < data.length; i++) {

                    var currData = data[i];

                    html += '<div style=" border-top:1px solid #CCCCCC; padding:5px 10px 5px 10px; font-weight:bold; text-align:left; font-size:11px;">' + currData.content + '</div>';

                    if (currData.replies.length) {

                    jQuery.each(currData.replies, function(i) {

                        html += (

                        '<div style="border-top:1px solid #CCCCCC; padding:5px 10px 5px 10px; font-size:11px">' +
                        '   <fb:profile-pic size=square width=25 uid=' + this.facebook_id + ' facebook-logo=true></fb:profile-pic>' +
                        '   <img src="' + (this.like_dislike ? fangento_images['thumbs_up_on'] : fangento_images['thumbs_down_on']) + '"/>' +
                        '   <img class="fgoPresence" id="fangento-presence-' + this.facebook_id + '" src="' + BLANK_IMG + '" width="8" height="8"/>' +
                        '   <fb:name uid=' + this.facebook_id + ' useyou=false></fb:name>: ' +
                        '   ' + this.content + '<div style="text-align:right; color:#AAAAAA">' + fangento_date_format (this.date_modified) + '</div>' +
                        '</div>'

                        );

                        if (this.is_new == 1) {
                            numNew++;
                        }

                    });

                    }
                    else {
                        html += (
                            '<div style="border-top:1px solid #CCCCCC; padding:5px 10px 5px 10px; font-size:11px; font-style: italic; text-align:center;">' +
                            fangento_messages['Awaiting replies...'] +
                            '</div>'
                            );
                    }

                }

                jQuery('#fangento-appBodyAuthReplies').html(html);

                if (numNew) {
                    jQuery.growlUI(fangento_messages['You have'] + ' ' + (numNew == 1 ? fangento_messages['a new reply.'] : numNew + ' ' + fangento_messages['new replies.']));
                }

                //sometimes null?
                if (FB.XFBML.Host) FB.XFBML.Host.parseDomTree();
            }

            if (!onlyOnce)
                setTimeout('fangento_ping_replies(0)', 10000);
        }
    );
}


/**
 * Pings Facebook for presence and updates presence indicators.
 *
 */
function fangento_ping_presence() {
    //in case user logs out
    if (FB.Facebook.apiClient.get_session() == null) return;

    var sql = 'select uid, online_presence from user where uid in (select uid2 from friend where uid1=' + FB.Facebook.apiClient.get_session().uid + ') order by name';
    FB.Facebook.apiClient.fql_query(sql, function(result, ex) {

        var presenceMap = new Object();

        for (var i = 0; i < result.length; i++) {
            presenceMap[result[i].uid] = result[i].online_presence;
        }

        jQuery('.fgoPresence').each(function(i) {
            //the version in the autocomplete dropdown are called fangento-presence2-; FIX: come up with better naming scheme
            var facebookId = this.id.replace(/fangento-presence-/, '').replace(/fangento-presence2-/, '');

            if (facebookId == null || facebookId.length == 0 || presenceMap[facebookId] === undefined) {
                //debugging only
                //alert(facebookId + ' not found in presenceMap.');
            }
            else {
                var foo = presenceMap[facebookId];

                //FIX: need to set width and height of blank everywhere or use a blank that's already sized
                if (foo == 'idle') {
                    this.src = fangento_images['idle'];
                    this.alt = this.title = fangento_messages['Idle'];
                }
                else if (foo == 'active') {
                    this.src = fangento_images['active'];
                    this.alt = this.title = fangento_messages['Online'];
                }
                else {
                    this.src = BLANK_IMG;
                    this.alt = this.title = '';
                }
            }
        });

        jQuery('.fgoPresencePhrase').each(function(i) {
            //the version in the autocomplete dropdown are called fangento-presence2-; FIX: come up with better naming scheme
            var facebookId = this.id.replace(/fangento-presencePhrase-/, '');

            if (facebookId == null || facebookId.length == 0 || presenceMap[facebookId] === undefined) {
                //debugging only
                //alert(facebookId + ' not found in presenceMap.');
            }
            else {
                var foo = presenceMap[facebookId];

                if (foo == 'idle') {
                    this.innerHTML = fangento_messages['Idle'];
                }
                else if (foo == 'active') {
                    this.innerHTML = fangento_messages['Online'];
                }
                else {
                    this.innerHTML = '';
                }
            }
        });

        for (var i = 0; i < fangento_friends.length; i++) {
            var foo = presenceMap[ fangento_friends[i]['uid'] ];
            if (foo === undefined) {
                //debugging
                //alert(fangento_friends[i]['uid'] + ' not found in presenceMap.');
            }
            else {
                fangento_friends[i]['online_presence'] = foo;
            }
        }

        //ping status every 30 seconds
        setTimeout('fangento_ping_presence()', 30000);
    });
}