/**
 * wumii/RelatedItems.js: A module that handles RelatedItems pages related
 * functionalities.
 * 
 * This module defines the constructor function wumii.RelatedItems(). This
 * module depends on JQuery.
 */

var wumii;
if (!wumii) {
    wumii = {};
} else if (typeof wumii != "object") {
    throw new Error("wumii already exists and is not an object");
}

if (!wumii.widget) {
    wumii.widget = {};
} else if (typeof wumii.widget != "object") {
    throw new Error("wumii.widget already exists and is not an object");
}

if (wumii.widget.RelatedItems) {
    throw new Error("wumii.widget.RelatedItems already exists");
}

wumii.widget.RelatedItems = function() {
    var timeOut, left;
    
    this.registerListener = function() {
        registerSwtichTab();
        registerSlide();
    };
    
    function registerSwtichTab() {
        $(".tab-nav a").unbind("click");
        $(".tab-nav a").click(function() {
            $(".tab-nav a").removeClass("on");
            $(this).addClass("on");
            var wid = $(this).attr("wid");
            $(".right-side .content").hide().each(function() {
                if ($(this).attr("wid") == wid) {
                    $(this).show();
                }
            });
            
        });
    }
    
    function registerSlide() {
        $("#slide .buttons a").bind({
            "mousedown": function() {
                left = parseInt($("#slide .content").css("left"));
                slide(left, $(this).attr("wid"));
            },
            "mouseup": function() {
                left = parseInt($("#slide .content").css("left"));
                $("#slide .content").css("left", left + "px");
                timeOut && clearTimeout(timeOut);
            }
        });
    }
    
    function slide(left, direction) {
        var max = $("#slide .content").width() - $("#slide .main").width();
        if (direction === "left") {
            left += 2;
        } else {
            left -= 2;
        }
        if (left > 0 || left <= -max) {
            return;
        }
        timeOut = setTimeout(function() {
            $("#slide .content").css("left", left + "px");
            slide(left, direction);
        }, 1);
    }
};

function focusTextInput(func) {
    $(".text-input").bind({
        focus: function() {
            $(this).addClass("text-input-focus");
        },
        blur: function() {
            $(this).removeClass("text-input-focus");
            func && func($(this));
        }
    });
    
    $(".text-area").bind({
        focus: function() {
            $(this).parent().addClass("text-area-focus");
        },
        blur: function() {
            $(this).parent().removeClass("text-area-focus");
        }
    });
}

if (wumii.widget.GetWidget) {
    throw new Error("wumii.widget.GetWidget already exists");
}

wumii.widget.GetWidget = function () {
    var loadingImg = "<img src=\"/images/widget/loading.gif\" class=\"loading\"/>";
    
    this.registerListener = function() {
        showAllPlatform(".platform-selected");
        initCheckBox("createUser");
        initPlatform();
        toggleTipsBox(".tips-icon");
        toggleRegForm("[wid=checkBox]");
        focusTextInput(validateRegForm);
        refreshCaptchaImage(".refresh-btn");
    };
    
    function initPlatform() {
        var platform = $("#platform").val();
        if (platform != "") {
            var initPlatform = $("#othersPlatform").find("#" + platform).text();
            $(".platform-selected").find("p").text(initPlatform);
        }
    }
    
    function registerHidePlatform(platform) {
        $("body").unbind("click");
        $("body").click(function(e) {
            e = e || window.event;
            if (!e.target) {
                e.target = e.srcElement;
            }
            if (platform.hasClass("platform-on") && e.target.parentNode.className.indexOf("platform-selected") == -1) {
                platform.removeClass("platform-on");
                $("#othersPlatform").hide();
            }
        });
    }
    
    function showAllPlatform(selector) {
        $(selector).unbind("click");
        $(selector).click(function() {
            if ($(this).hasClass("platform-on")) {
                $(this).removeClass("platform-on");
                $("#othersPlatform").hide();
            } else {
                $(this).addClass("platform-on");
                $("#othersPlatform").show();
                hoverPlatform("#othersPlatform li");
                selectPlatform("#othersPlatform li");
                registerHidePlatform($(this));
            }
        });
    }
    
    function hoverPlatform(selector) {
        $(selector).unbind("hover");
        $(selector).hover(function() {
            $(this).addClass("hover");
        }, function() {
            $(this).removeClass("hover");
        });
    }
    
    function selectPlatform(selector) {
        $(selector).unbind("click");
        $(selector).click(function() {
            var platformValue = $(this).html();
            var platform = $(this).parents(".platform");
            platform.find(".platform-selected p").html(platformValue);
            platform.find(".platform-selected span").removeClass("platform-on");
            $("#platform").val($(this).attr("id"));
            $("#othersPlatform").hide();
        });
    }
    
    function initCheckBox(target) {
        var isCreateUser = $("[wid=" + target + "]").attr("checked");
        var checkbox = $("[wid=checkBox]");
        if (isCreateUser) {
            checkbox.addClass("checked");
            $("#regForm").show();
        } else {
            checkbox.removeClass("checked");
            $("#regForm").hide();
        }
    }
    
    function toggleTipsBox(selector) {
        $(selector).unbind("hover");
        $(selector).hover(function() {
            $(this).parent().find(".tips-box").show();
        }, function() {
            $(this).parent().find(".tips-box").hide();
        });
    }
    
    function toggleRegForm(selector) {
        $(selector).unbind("click");
        $(selector).click(function() {
            if ($(this).attr("class").indexOf("checked") > -1) {
                $(this).removeClass("checked");
                $("[wid=createUser]").attr("checked", "");
                $("#regForm").hide();
            } else {
                $(this).addClass("checked");
                $("[wid=createUser]").attr("checked", "checked");
                $("#regForm").show();
            }
        });
    }
    
    function validateRegForm(input) {
        if (input.attr("wid") == "reg") {
            var fieldId = input.attr("id");
            var value = input.val();
            
            input.next(".validation-tips").html(loadingImg);
            
            $.post("/reg/validate.htm", {
                tag : fieldId,
                value : value
            }, function(errMsg) {
                var target = input.parents(".item").find(".validation-tips");
                target.hide();
                if(errMsg == "") {
                    target.addClass("validation-success").html("").show();
                } else{
                    target.addClass("validation-error").html("" + errMsg).css("display", "block");
                }
            });
        }
    }
    
    function refreshCaptchaImage(selector) {
        $(selector).unbind("click");
        $(selector).click(function() {
            $("[wid=captchaImage]").attr("src", "/captchaImage.htm?" + Math.floor(Math.random()*100));
        });
    }
};

if (wumii.widget.Feedback) {
    throw new Error("wumii.widget.Feedback already exists");
}

wumii.widget.Feedback = function() {
    this.registerListener = function() {
        focusTextInput();
    };
};