/// <reference path="../API/Agility.js" />

Agility.RegisterNamespace("BNN.TopStories");

(function(TopStories) {

    TopStories.OnInit = function(clientID) {

        var client = $("#" + clientID);

        $.ajax({
            url: AjaxWebserviceSvcUrl + "/GetTopStories",
            contentType: "application/json",
            dataType: "json",
            success: function(jsonResponse) {
                
                if (jsonResponse != undefined && jsonResponse != null) {
                    //render top stories list
                    var html = "";
                    $.each(jsonResponse, function(i, story) {
                        html += "<a class='Story' href='" + story.Url + "' data-id='" + story.ContentID + "'><div class='Headline'>" + story.Headline + "</div>";
                        html += "<div class='Thumbnail'>" + GetStoryThumbnail(story) + "</div></a>";
                    });
                    client.html(html);
                }

                var stories = $("#TopStories .Story");
                stories.click(function(e) {
                    e.stopPropagation();
                    TopStories.Select(this, $(this).attr("data-id"));
                    return false;
                });

                if (stories.length > 0) stories.eq(0).click();

                $("#TopStories .Story").bind("mouseenter", function() {
                    $(this).addClass("Hover");
                });

                $("#TopStories .Story").bind("mouseleave", function() {
                    $(this).removeClass("Hover");
                });
            }
        });
    };

    function IsNullOrEmpty(str) {
        return str == undefined || str == null || str == "";
    };

    function GetStoryThumbnail(story) 
    {
        if (!IsNullOrEmpty(story.Video))
        {
            return "<img src='" + GetVideoThumbnailUrl(story.Video, 130, 68, 1) + "' alt='" + story.VideoDescription + "' title='" + story.VideoDescription + "'/>";
        }
        if (!IsNullOrEmpty(story.Image.URL))
        {
            return "<img src='" + GetS3ThumbnailUrl(story.Image.URL, 130, 68, 1) + "' alt='" + story.Image.Label + "' title='" + story.Image.Label + "'/>";
        }
        return "<img src='" + Agility.ResolveUrl("~/Images/spacer.gif") + "' alt='" + story.Headline + "' title='" + story.Headline + "'/>";
    };

    function GetS3ThumbnailUrl(attachmentURL, width, height, mode)
	{
		if (IsNullOrEmpty(attachmentURL))
		{
			return Agility.ResolveUrl("~/Images/spacer.gif");
		}
		return Agility.ResolveUrl("~/Handlers/ThumbS3.ashx") + "?img=" + escape(attachmentURL) + "," + width + "," + height + "," + mode;
	};

	function GetVideoThumbnailUrl(clipID, width, height, mode)
	{
		if (IsNullOrEmpty(clipID))
		{
			return Agility.ResolveUrl("~/Images/spacer.gif");
		}
		return Agility.ResolveUrl("~/Handlers/VideoThumb.ashx") + "?Clip=" + clipID + "," + width + "," + height + "," + mode;
	};

    TopStories.Select = function(sender, contentId) {
       
        $("#TopStories .Story").each(function(index) { $(this).removeClass("Selected"); });

        $(sender).addClass("Selected");

        var topStoryDetailHeadline = $("#TopStoryDetailHeadline a");
        var topStoryDetailMain = $("#TopStoryDetailMain");

        if (topStoryDetailHeadline.length > 0 && topStoryDetailMain.length > 0) {

            $.ajax({
                //type: "POST",
                url: AjaxWebserviceSvcUrl + '/GetStoryById?contentId=' + contentId,
                //data: "{'contentId':" + contentId + "}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(jsonResponse) {
                    var result = { d: jsonResponse };
                    if (result.d != undefined && result.d != null) {

                        topStoryDetailHeadline.html(result.d.Headline);
                        topStoryDetailHeadline.attr("href", result.d.Url);

                        topStoryDetailMain.find("div.Teaser").html(result.d.Teaser);
                        topStoryDetailMain.find("div.FullStoryLink a").attr("href", result.d.Url);

                        BNN.Controls.VideoPlayer.Load({ ClipId: result.d.Video, InstanceId: "TopStoryDetailVideo", Description: result.d.VideoDescription });

                        if (result.d.Video == undefined || result.d.Video == null || result.d.Video.length == 0)
                            if (result.d.Image != null && result.d.Image.URL != null) {
                            var img = "<img style=\"width:310px\" alt=\"" + result.d.Image.Label + "\" src=\"" + result.d.Image.URL + "\" />";
                            $("#TopStoryDetailVideo").html(img).show();
                        }

                        var container = $("#TopStoryDetailMain .ExtendedCoverage");
                        container.html("");

                        var extendedCoverageTitle = $("#TopStoryDetailMain .ExtendedCoverageTitle");

                        if (result.d.ExtendedCoverage != null && result.d.ExtendedCoverage.length > 0) {
                            if (!container.hasTemplate()) {
                                container.setTemplateURL(Agility.ResolveUrl("~/ClientTemplates/TopStoryExtendedCoverage.htm"));
                            }
                            container.processTemplate(result.d.ExtendedCoverage);

                            extendedCoverageTitle.show();
                            container.show();
                        }
                        else {
                            extendedCoverageTitle.hide();
                        }
                    }
                },
                complete: function(XMLHttpRequest, textStatus) {
                    //alert(XMLHttpRequest.status + ' ' + textStatus);
                    //alert(XMLHttpRequest.responseText);
                }
            });
        }
    };

    TopStories.GetItemHtml = function(item) {
        var div = $('<div></div>').html(item.ItemHtml);
        return div.text();
    };

})(BNN.TopStories);