@model ProductReviewsModel

@inject Nop.Services.Html.IHtmlFormatter htmlFormatter

@{
    Layout = "_ColumnsOne";

    //title
    NopHtml.AddTitleParts(Model.ProductName);
    NopHtml.AddTitleParts(T("PageTitle.ProductReviews").Text);
    //page class
    NopHtml.AppendPageCssClassParts("html-product-reviews-page");
}
<div class="page product-reviews-page">
    <div class="page-title">
        <h1>@T("Reviews.ProductReviewsFor") <a href="@Url.RouteUrl("Product", new { SeName = Model.ProductSeName })">@Model.ProductName</a></h1>
    </div>
    <div class="page-body">
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.ProductReviewsPageTop, additionalData = Model })
        @if (Model.AddProductReview.SuccessfullyAdded)
        {
            <div class="result">
                @Model.AddProductReview.Result
            </div>
        }
        else if (!Model.AddProductReview.CanAddNewReview)
        {
            <div class="result review-already-added">
                @T("Reviews.AlreadyAddedProductReviews")
            </div>
        }
        else
        {
            <div class="write-review" id="review-form">
                <div class="title">
                    <strong>@T("Reviews.Write")</strong>
                </div>
                <form asp-route="ProductReviews" method="post">
                    <div asp-validation-summary="ModelOnly" class="message-error"></div>
                    <div class="fieldset">
                        <div class="form-fields">
                            <div class="inputs">
                                <label asp-for="AddProductReview.Title" asp-postfix=":"></label>
                                <input asp-for="AddProductReview.Title" class="review-title" asp-disabled="@(!Model.AddProductReview.CanCurrentCustomerLeaveReview)" />
                                <nop-required />
                                <span asp-validation-for="AddProductReview.Title"></span>
                            </div>
                            <div class="inputs">
                                <label asp-for="AddProductReview.ReviewText" asp-postfix=":"></label>
                                <textarea asp-for="AddProductReview.ReviewText" class="review-text" asp-disabled="@(!Model.AddProductReview.CanCurrentCustomerLeaveReview)"></textarea>
                                <nop-required />
                                <span asp-validation-for="AddProductReview.ReviewText"></span>
                            </div>
                            <div class="review-rating">
                                <div class="name-description">
                                    <label asp-for="AddProductReview.Rating" asp-postfix=":"></label>
                                </div>
                                <div class="rating-wrapper">
                                    <div class="label first">@T("Reviews.Fields.Rating.Bad")</div>
                                    <div class="rating-options">
                                        <input asp-for="AddProductReview.Rating" value="0" type="radio" id="addproductrating_0" style="display: none;"/>
                                        <input asp-for="AddProductReview.Rating" value="1" type="radio" id="addproductrating_1" aria-label="@T("Reviews.Fields.Rating.Bad")" />
                                        <input asp-for="AddProductReview.Rating" value="2" type="radio" id="addproductrating_2" aria-label="@T("Reviews.Fields.Rating.NotGood")" />
                                        <input asp-for="AddProductReview.Rating" value="3" type="radio" id="addproductrating_3" aria-label="@T("Reviews.Fields.Rating.NotBadNotExcellent")" />
                                        <input asp-for="AddProductReview.Rating" value="4" type="radio" id="addproductrating_4" aria-label="@T("Reviews.Fields.Rating.Good")" />
                                        <input asp-for="AddProductReview.Rating" value="5" type="radio" id="addproductrating_5" aria-label="@T("Reviews.Fields.Rating.Excellent")" />
                                    </div>                                    
                                    <div class="label last">@T("Reviews.Fields.Rating.Excellent")</div>
                                </div>
                            </div>
                            @if (Model.ReviewTypeList.Count > 0)
                            {
                                foreach (var additionalReview in Model.AddAdditionalProductReviewList.OrderBy(ob => ob.DisplayOrder).ToList())
                                {
                                    var curAdditionalReview = Model.AddAdditionalProductReviewList.IndexOf(additionalReview);
                                    <div class="review-rating">
                                        <div class="name-description">
                                            <div class="tooltip">
                                                <label>@Html.Raw(additionalReview.Name):</label>
                                                <span class="tooltiptext">@Html.Raw(additionalReview.Description)</span>
                                            </div>
                                        </div>
                                        <div class="rating-wrapper">
                                            <div class="label first">@T("Reviews.Fields.Rating.Bad")</div>
                                            <div class="rating-options">
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].ReviewTypeId" value="@(additionalReview.ReviewTypeId)" type="hidden" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].Name" value="@(additionalReview.Name)" type="hidden" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].Description" value="@(additionalReview.Description)" type="hidden" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].DisplayOrder" value="@(additionalReview.DisplayOrder)" type="hidden" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].IsRequired" value="@(additionalReview.IsRequired)" type="hidden" />

                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].Rating" value="0" type="radio" id="addproductratingext_0_@(additionalReview.ReviewTypeId)" style="display: none;" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].Rating" value="1" type="radio" id="addproductratingext_1_@(additionalReview.ReviewTypeId)" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].Rating" value="2" type="radio" id="addproductratingext_2_@(additionalReview.ReviewTypeId)" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].Rating" value="3" type="radio" id="addproductratingext_3_@(additionalReview.ReviewTypeId)" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].Rating" value="4" type="radio" id="addproductratingext_4_@(additionalReview.ReviewTypeId)" />
                                                <input asp-for="@Model.AddAdditionalProductReviewList[curAdditionalReview].Rating" value="5" type="radio" id="addproductratingext_5_@(additionalReview.ReviewTypeId)" />
                                            </div>
                                            <div class="label last">@T("Reviews.Fields.Rating.Excellent")</div>
                                        </div>
                                    </div>
                                }
                            }

                            @if (Model.AddProductReview.DisplayCaptcha)
                            {
                                <nop-captcha />
                            }
                        </div>
                    </div>
                    <div class="buttons">
                        <button type="submit" name="add-review" class="button-1 write-product-review-button">@T("Reviews.SubmitButton")</button>
                    </div>
                </form>
            </div>
        }
        @if (Model.Items.Count > 0)
        {
            <div class="product-review-list">
                <div class="title">
                    <strong>@T("Reviews.ExistingReviews")</strong>
                </div>
                @foreach (var review in Model.Items)
                {
                    var ratingPercent = review.Rating * 20;
                    <div class="product-review-item">
                        <div class="review-item-head">
                            <div class="review-title">
                                <strong>@review.Title</strong>
                            </div>
                            <div class="product-review-box">
                                <div class="rating">
                                    <div style="width: @(ratingPercent)%">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="review-content">
                            <div class="review-text">
                                @if (!string.IsNullOrEmpty(review.CustomerAvatarUrl))
                                {
                                    <div class="avatar">
                                        @if (review.AllowViewingProfiles)
                                        {
                                            <a href="@Url.RouteUrl("CustomerProfile", new { id = review.CustomerId })" class="avatar-img-link">
                                                <img src="@(review.CustomerAvatarUrl)" class="avatar-img" alt="Avatar" />
                                            </a>
                                        }
                                        else
                                        {
                                            <img src="@(review.CustomerAvatarUrl)" class="avatar-img" alt="Avatar" />
                                        }
                                    </div>
                                }
                                <div class="text-body">
                                    @Html.Raw(htmlFormatter.FormatText(review.ReviewText, false, true, false, false, false, false))
                                </div>
                            </div>
                            @foreach (var reviewType in review.AdditionalProductReviewList.Where(x => x.Rating > 0 && x.VisibleToAllCustomers))
                            {
                                var ratingExtPercent = reviewType.Rating * 20;
                                <div class="review-type-rating-ext">
                                    <div class="review-title">
                                        <i>@reviewType.Name</i>
                                    </div>
                                    <div class="product-review-box">
                                        <div class="rating">
                                            <div style="width: @(ratingExtPercent)%">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            }
                            <div class="review-info">
                                <span class="user">
                                    <label>@T("Reviews.From"):</label>
                                    @if (review.AllowViewingProfiles)
                                    {
                                        <a href="@Url.RouteUrl("CustomerProfile", new { id = review.CustomerId })">@(review.CustomerName)</a>
                                    }
                                    else
                                    {
                                        <span>@review.CustomerName</span>
                                    }
                                </span>
                                <span class="separator">|</span>
                                <span class="date">
                                    <label>@T("Reviews.Date"):</label>
                                    <span>@review.WrittenOnStr</span>
                                </span>
                            </div>
                            @await Html.PartialAsync("_ProductReviewHelpfulness", review.Helpfulness)
                            @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.ProductReviewsPageInsideReview, additionalData = review })
                            @if (!string.IsNullOrEmpty(review.ReplyText))
                            {
                                <div class="reply">
                                    <div class="reply-header">
                                        @T("Reviews.Reply")
                                    </div>
                                    <div class="reply-text">
                                        @Html.Raw(htmlFormatter.FormatText(review.ReplyText, false, true, false, false, false, false))
                                    </div>
                                </div>
                            }
                        </div>
                    </div>
                }
            </div>
        }
        @await Component.InvokeAsync("Widget", new { widgetZone = PublicWidgetZones.ProductReviewsPageBottom, additionalData = Model })
    </div>
</div>
