Su4sView = function (children) {
    this.children = children;

    this.bioContainer = $("div.homecomponent div.bio-container");
    this.videoContainer = $("div.homecomponent div.video-container");
    this.overlay = $("div.homecomponent div.overlay");

    this.bioContainer.find("a.close").click(this.bind(this.onCloseBioClick));
    this.videoContainer.find("a.close").click(this.bind(this.onCloseVideoClick));

    this.videoContainer.appendTo("body");
    this.overlay.appendTo("body");
    if ($.browser.msie && $.browser.version.substring(0, 1) == "6") {
        this.videoContainer.css("position", "absolute");
        this.overlay.css("position", "absolute");
    }


    $("div.homecomponent a.item").hover(this.bind(this.onImgMouseOver), this.bind(this.onImgMouseOut))
        .click(this.bind(this.onImgClick));

    this.videoContainer.find("iframe").load(function (event) { $("#loading-img").css("display", "none"); $(this).css("display", "block"); });


}

Su4sView.prototype.bind = function (func) {
    var _this = this;
    return function () {
        func.apply(_this, arguments)
    };
}

Su4sView.prototype.getChildByID = function (id) {
    for (var i = 0, n = this.children.length; i < n; i++)
        if (this.children[i].id == id)
            return this.children[i];

}

Su4sView.prototype.onImgMouseOver = function (event) {
    var sender = $(event.currentTarget);
    var child = this.getChildByID(sender.attr("childid"));
    //if (child.infoType == "bio") {
    //    sender.find("img.standby").attr("src", child.photoAltUrl);
    //} else {
        var position = sender.find("img.standby").position();
        var imgHover = sender.find("img.hover");
        imgHover.css("top", position.top);
        imgHover.css("left", position.left);
        imgHover.css("display", "block");
    //}
}

Su4sView.prototype.onImgMouseOut = function (event) {
    var sender = $(event.currentTarget);
    var child = this.getChildByID(sender.attr("childid"));
    //if (child.infoType == "bio") {
    //    sender.find("img.standby").attr("src", child.photoUrl);
    //} else {
        var imgHover = sender.find("img.hover");
        imgHover.css("display", "none");
    //}
}

Su4sView.prototype.onImgClick = function (event) {
    event.preventDefault();
    var sender = $(event.currentTarget);
    sender.trigger("mouseout");
    var child = this.getChildByID(sender.attr("childid"));
    if (child.infoType == "bio") {
        this.bioContainer.find("h2.title").text(child.name);
        this.bioContainer.find("img.student").attr("src", child.photoUrl);
        this.bioContainer.find("div.bio").remove();
		this.bioContainer.append("<div class='bio'></div>")
		this.bioContainer.find("div.bio").html(child.bio);
        this.bioContainer.css("display", "block");
		$('div.bio').jScrollPane({maintainPosition: false});
    } else {
        //jwplayer("video-holder").onReady(function () { jwplayer("video-holder").load(child.videoUrl); });
        $("body").css("overflow", "hidden");
        var w = $(window);
        var iframe = this.videoContainer.find("iframe");
        var loadingImg = this.videoContainer.find("#loading-img");

        this.overlay.width(w.width());
        this.overlay.height(w.height());
        this.overlay.css("display", "block");
        this.videoContainer.css("display", "block");
        this.videoContainer.find("h2.title").text(child.name);

        iframe.css("display", "none");
        loadingImg.css("display", "block");

        iframe.attr("src", "http://www.youtube.com/embed/" + child.videoUrl + "?rel=0");

    }
}

Su4sView.prototype.onCloseBioClick = function (event) {
    event.preventDefault();
    this.bioContainer.css("display", "none");
}

Su4sView.prototype.onCloseVideoClick = function (event) {
    //jwplayer("video-holder").stop();
    this.videoContainer.find("iframe").attr("src", "");
    this.videoContainer.css("display", "none");
    this.overlay.css("display", "none");
    $("body").css("overflow", "visible");
    event.preventDefault();
}