var Facebook = {
    Init: function (appId) {
        FB.init({ appId: appId, cookie: true, status: true, xfbml: true, oauth: true });
    },
    GetCompany: function (friend) {
        if (typeof friend.work == "undefined") return null;
        if (friend.work.length <= 0) return null;
        if (typeof friend.work[0].employer === "undefined") return null;
        if (friend.work[0].employer.name === "") return null;

        return friend.work[0].employer.name;
    },
    GetCompanies: function (data) {
        var companies = new Array();

        $.each(data, function (i, friend) {
            var company = Facebook.GetCompany(friend);

            if (company === null) return true;

            if (typeof companies[company] === 'undefined') {
                companies[company] = new Array();
            }

            companies[company][friend.id] = friend;
        });

        return companies;
    },
    OnClickHandler: function (selector) {
        $(selector).click(function () {
            var link = $(this);
            var company = link.attr("title");
            var keywords = company.replace(" ", ",");
            var url = 'handlers/CheckSearchResult.ashx?keywords=' + keywords;

            $.get(url, function (count) {
                if (parseInt(count) > 0) {
                    window.location.href = "vacatures/?keywords=" + keywords;
                } else {
                    alert("Er zijn momenteel geen banen gevonden bij " + company);
                }
            });

            return false;
        });
    },
    Page: {
        Data: null,
        Init: function () {
            FB.getLoginStatus(function (response) {
                if (response.authResponse) {
                    $("#fb-login").hide();
                    $("#fb-user").show();
                    $("#fb-view").show();

                    Facebook.Page.ShowUser();
                    Facebook.Page.ShowCompanies();
                } else {
                    $("#fb-login").show();
                    $("#fb-user").hide();
                    $("#fb-view").hide();
                }
            });
        },
        Logout: function () {
            $("#fb-login").show();
            $("#fb-user").hide();
            $("#fb-view").hide();
            $("#fb-container").empty();

            FB.logout();
        },
        ShowUser: function () {
            FB.api('/me', function (response) {
                $("#fb-user").html("<div>" + response.name + " (<a href='#' onclick='Facebook.Page.Logout(); return false;'>Logout</a>)</div>");
            });
        },

        ShowCompanies: function () {
            if (Facebook.Page.Data !== null) {
                Facebook.Page.RenderCompanies(Facebook.Page.Data);
                return;
            }

            FB.api('/me/friends?fields=id,name,first_name,last_name,work', function (response) {
                Facebook.Page.Data = response.data;
                Facebook.Page.RenderCompanies(Facebook.Page.Data);
            });
        },

        RenderCompanies: function (data) {
            $("#fb-container").hide();
            $("#fb-container").empty();
            var companies = Facebook.GetCompanies(data);

            var buffer = [];
            for (company in companies) {
                buffer.push("<div class='company-item'>");
                buffer.push("<div class='company'><a class='fb-company-link' href='#' title='" + company + "'>" + company + " &raquo;</a></div>");

                for (id in companies[company]) {
                    var friend = companies[company][id];
                    buffer.push("<div class='friend-item'>");
                    buffer.push("<img src='//graph.facebook.com/" + friend.id + "/picture' alt='" + friend.name + "' />");
                    buffer.push("<span class='name'>" + friend.first_name + "</span>");
                    buffer.push("<span class='name'>" + friend.last_name + "</span>");
                    buffer.push("</div>");
                }

                buffer.push("</div><br clear='all'>");
            }

            $("#fb-container").append(buffer.join(""));
            Facebook.OnClickHandler("#fb-container a");
            $("#fb-container").show(1000);
        },

        ShowFriends: function () {
            if (Facebook.Page.Data !== null) {
                Facebook.Page.RenderFriends(Facebook.Page.Data);
                return;
            }

            FB.api('/me/friends?fields=id,name,first_name,last_name,work', function (response) {
                Facebook.Page.Data = response.data;
                Facebook.Page.RenderFriends(Facebook.Page.Data);
            });
        },
        RenderFriends: function (data) {
            $("#fb-container").empty();

            var buffer = [];
            var abcBuf = [];

            abcBuf.push("<ul class='abc'>");
            for (var i = 65; i <= 90; i++) {
                var c = String.fromCharCode(i);

                buffer.push("<div id='item_" + c + "'>");
                buffer.push("<div class='letter'>" + c + "</div>");
                buffer.push("</div>");


                abcBuf.push("<li><a onclick=\"window.location.hash = '#item_" + c + "'; return false;\" href='#'>" + c + "</a></li>");
            }
            abcBuf.push("<li><a onclick=\"window.location.hash = '#item_other'; return false;\" href='#'>Other</a></li>");
            abcBuf.push("</ul>");


            buffer.push("<div id='item_other'>");
            buffer.push("<div class='letter'>Other</div>");
            buffer.push("</div>");

            $("#fb-container").append("<div class='by-friends'>" + abcBuf.join("") + buffer.join("") + "</div>");


            $("#fb-container div").hide();

            $.each(data, function (i, friend) {
                buffer = [];

                var firstChar = friend.name.toUpperCase().charAt(0);
                var firstCharCode = firstChar.charCodeAt();

                buffer.push("<div class='friend'>");
                buffer.push("<div class='pic'><img src='//graph.facebook.com/" + friend.id + "/picture' alt='" + friend.name + "' /></div>");
                buffer.push("<div class='info'>");
                buffer.push("<span class='first-name'>" + friend.first_name + "</span>");
                buffer.push("<span class='last-name'>" + friend.last_name + "</span>");

                var company = Facebook.GetCompany(friend);

                if (company !== null) {
                    buffer.push("<span class='company'><a href='#' title='" + company + "'>" + company + " &raquo;</a></span>");
                }

                buffer.push("</div></div>");

                var element = (firstCharCode >= 65 && firstCharCode <= 90) ? $("#item_" + firstChar) : $("#item_other");
                element.append(buffer.join(""));
            });

            Facebook.OnClickHandler("#fb-container .info a");

            $("#fb-container div").show();
        }
    },


    Widget: {
        FriendsLimit: 8,
        Init: function () {
            FB.getLoginStatus(function (response) {
                if (!response.authResponse) return;

                $("#fb-login").hide();
                Facebook.Widget.ShowFriends();
            });
        },
        ShowFriends: function () {
            FB.api('/me/friends?fields=id,name,first_name,last_name, work', function (response) {
                var companies = Facebook.GetCompanies(response.data);
                var buffer = [];
                var i = 1;

                buffer.push("<div class='company-item'>");

                for (company in companies) {
                    for (id in companies[company]) {
                        var friend = companies[company][id];
                        buffer.push("<div class='friend-item'>");
                        buffer.push("<a href='#' title='" + company + "'><span class='company name'>" + company + "</span></a>");
                        buffer.push("<a href='#' title='" + company + "'><img src='//graph.facebook.com/" + friend.id + "/picture' alt='" + friend.name + "' /></a>");
                        buffer.push("<a href='#' title='" + company + "'><span class='name'>" + friend.first_name + "</span></a>");
                        buffer.push("<a href='#' title='" + company + "'><span class='name'>" + friend.last_name + "</span></a>");
                        buffer.push("</div>");
                        break; // only 1st friend needed here
                    }

                    if (Facebook.Widget.FriendsLimit < ++i) break;
                }
                buffer.push("</div><br clear='all'>");
                $("#fb-container").append(buffer.join(""));

                Facebook.OnClickHandler("#fb-container a");

                $("#fb-container").append("<div class='fb-footer'><a class='fb-all' href='facebook.htm'>See all &raquo;</a>");              
            });
        }
    }
}