@model ProductReviewHelpfulnessModel
<div class="product-review-helpfulness">
    <span class="question">@T("Reviews.Helpfulness.WasHelpful?")</span>
    <span class="vote-options">
        <span id="vote-yes-@(Model.ProductReviewId)" class="vote">@T("Common.Yes")</span>
        <span id="vote-no-@(Model.ProductReviewId)" class="vote">@T("Common.No")</span>
    </span>
    <span class="vote-stats">
        (<span id="helpfulness-vote-yes-@(Model.ProductReviewId)">@(Model.HelpfulYesTotal)</span>/<span id="helpfulness-vote-no-@(Model.ProductReviewId)">@(Model.HelpfulNoTotal)</span>)
    </span>
    <span id="helpfulness-vote-result-@(Model.ProductReviewId)" class="result"></span>

    <script asp-location="Footer">
        $(function() {
            $('#vote-yes-@(Model.ProductReviewId)').on('click', function () {
                setProductReviewHelpfulness@(Model.ProductReviewId)('true');
            });
            $('#vote-no-@(Model.ProductReviewId)').on('click', function () {
                setProductReviewHelpfulness@(Model.ProductReviewId)('false');
            });
        });

        function setProductReviewHelpfulness@(Model.ProductReviewId)(wasHelpful) {
            var postData = {
                "productReviewId": @(Model.ProductReviewId),
                "washelpful": wasHelpful
            };
            addAntiForgeryToken(postData);
            $.ajax({
                cache: false,
                type: "POST",
                url: "@(Url.RouteUrl("SetProductReviewHelpfulness"))",
                data: postData,
                success: function (data, textStatus, jqXHR) {
                    $("#helpfulness-vote-yes-@(Model.ProductReviewId)").html(data.TotalYes);
                    $("#helpfulness-vote-no-@(Model.ProductReviewId)").html(data.TotalNo);
                    $("#helpfulness-vote-result-@(Model.ProductReviewId)").html(data.Result);
                                                  
                    $('#helpfulness-vote-result-@(Model.ProductReviewId)').fadeIn("slow").delay(1000).fadeOut("slow");
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    alert('Failed to vote. Please refresh the page and try one more time.');
                }  
            });
        }
    </script>
</div>