$(document).ready(function() {
    var readyToRate = true;

    $.ajaxSetup({
        cache: false,
        type: "GET",
        timeout: 30000
    });

    function ShowRate(item, data, action) {
        switch (data) {
            case "yes":
                item.qtip("api").updateContent("شما قبلاً رای مثبت داده اید", false);
                item.qtip("api").updateWidth(150);
                item.qtip("show");
                if (data == action) {
                    item.children("span").remove();
                    item.append("<span>[شما]</span>");
                }
                break;
            case "no":
                item.qtip("api").updateContent("شما قبلاً رای منفی داده اید", false);
                item.qtip("api").updateWidth(150);
                item.qtip("show");
                if (data == action) {
                    item.children("span").remove();
                    item.append("<span>[شما]</span>");
                }
                break;
            case "d":
                item.qtip("api").updateContent("شما قبلاً رای داده اید", false);
                item.qtip("api").updateWidth(120);
                item.qtip("show");
                break;
            default:
                if (data != "") {
                    item.html(data);
                    item.qtip("api").updateContent("رای شما ثبت شد", false);
                    item.qtip("api").updateWidth(100);
                    item.children("span").remove();
                    item.append("<span>[شما] </span>");
                    item.qtip("show");
                }
                break;
        }

        item.parent().eq(0).children(".waiting").remove();
        item.unbind("ajaxStart");
        item.show("fast");

        readyToRate = true;

    }

    function SetRate(item, action) {

        readyToRate = false;

        var commentId = item.parents("div.info").eq(0).children("span.commentId").eq(0).text();

        item.ajaxStart(function() {
            item.hide();
            item.parent().eq(0).append("<div class='waiting'>&nbsp;</div>");
        });

        $("div#holder").load(
                    "/CommentRate.aspx?action=" + action + "&id=" + commentId,
                    function(data) {
                        ShowRate(item, data, action);
                    }
                );

    }

    $(".yes").click(function() {
        if (readyToRate) {
            SetRate($(this), "yes");
        }
    });

    $(".no").click(function() {
        if (readyToRate) {
            SetRate($(this), "no");
        }
    });

    $("div.no[title]").qtip({
        show: {
            delay: 0,
            solo: true,
            when: {
                target: false,
                event: 'mouseover'
            },
            effect: function() {
                $(this).stop(true, true).show();
            }
        },
        hide: {
            fixed: true,
            delay: 0,
            when: {
                target: false,
                event: 'mouseout'
            },
            effect: function() {
                $(this).stop(true, true).hide();
            }
        },
        position: {
            adjust: { x: -8, y: -1, mouse: true },
            corner: {
                target: "topRight",
                tooltip: "bottomLeft"
            }
        },
        style: {
            border: { width: 2, radius: 3, color: "#F75223" },
            padding: "2px",
            margin: "0px",
            color: "#fff",
            "background-color": "#F75223",
            tip: { corner: "bottomLeft", color: false, size: { x: 4, y: 4} }
        }
    });

    $("div.yes[title]").qtip({
        show: {
            delay: 0,
            solo: true,
            when: {
                target: false,
                event: 'mouseover'
            },
            effect: function() {
                $(this).stop(true, true).show();
            }
        },
        hide: {
            fixed: true,
            delay: 0,
            when: {
                target: false,
                event: 'mouseout'
            },
            effect: function() {
                $(this).stop(true, true).hide();
            }
        },
        position: {
            adjust: { x: -8, y: -1, mouse: true },
            corner: {
                target: "topRight",
                tooltip: "bottomLeft"
            }
        },
        style: {
            border: { width: 2, radius: 3, color: "#5DC815" },
            padding: "2px",
            margin: "0px",
            color: "#fff",
            "background-color": "#5DC815",
            tip: { corner: "bottomLeft", color: false, size: { x: 4, y: 4} }
        }
    });

});