@model BlogPost
@{
    ViewData["Title"]=Model.Title;
}
@section header {  
    <script src="~/js/comment.js" asp-append-version="true"></script>
    <script>
        $.psc.blogcomment.prototype.options.lang = '@System.Globalization.CultureInfo.CurrentUICulture.Name';
        $.psc.blogcomment.prototype.options.apictrlr = '@ViewData["apicmtctlr"]';
        $.psc.blogcomment.prototype.options.authorId = '@User.GetUserId()';
        $.psc.blogcomment.prototype.options.authorName = '@User.GetUserName()';
        $(document).ready(function() {
            $('#cmtBtn').click(function() {
                var receiverid = $(this).data('receiverid');
                var comment = $('#Comment').val();
                var data = { 
                    Id:0,
                    Content: comment, 
                    PostId: receiverid,
                    AuthorId: '@User.GetUserId()',
                    Visible:true 
                };

                $.ajax({
                    async: true,
                    cache: false,
                    type: 'POST',
                    method: 'POST',
                    contentType:  "application/json",
                    data: JSON.stringify(data),
                    error: function(xhr,data) {
                        if (xhr.status=400)
                        {
                            $('span.field-validation-valid[data-valmsg-for="Content"]').html(
                                xhr.responseJSON.Content);
                        } else {
$('span.field-validation-valid[data-valmsg-for="Content"]').html(
                            "Une erreur est survenue : "+xhr.status+"<br/>"+
                            "<code><pre>"+xhr.responseText+"</pre></code>"
                        )
                        }
                        
                    },
                    success: function (data) {
                        var comment = $('#Comment').val();
                        $('#Comment').val('');
                        $('span.field-validation-valid[data-valmsg-for="Content"]').empty();
                        var htmlcmt = htmlize(comment);
                        var nnode = '<div data-type="blogcomment" data-id="'+data.Id+'" data-allow-edit="True" data-allow-moderate="@ViewData["moderatoFlag"]" data-date="'+data.DateCreated+'" data-username="@User.GetUserName()">'+htmlcmt+'</div>';
                        
                        $('#comments').append($(nnode).blogcomment())
                    },
                    url:'@ViewData["apicmtctlr"]'
                    });
            });
        })
    </script>
    <style>
        .avatar, .commentmeta, .blogcomment p ,  .subcomments {
            display: inline-block;
        }
        .blogcomment {
            display: inline-block;
            margin:.3em;
        }
    </style>
}
<div class="container">
<h1 class="blogtitle" ismarkdown>@Model.Title</h1>
<img class="blogphoto" alt="" src="@Model.Photo" >
<div class="blogpost">
   
    <div markdown="@Model.Content" class="blog"></div>
   <hr/>

<div class="meta"> 
    @Html.DisplayFor(model => model.Author) 
       
    @Html.DisplayNameFor(model => model.DateModified) :

    @Html.DisplayFor(model => model.DateModified) 

    @Html.DisplayNameFor(model => model.DateCreated) :

    @Html.DisplayFor(model => model.DateCreated) 

    @Component.Invoke("Tagger",Model)
</div>

<div id="comments">
    @if (Model.Comments!=null) {
        foreach (var comment in Model.Comments.Where(c=>c.ParentId==null)) {
            @Html.DisplayFor(model=>comment,"Comment","Comment")
        }
    }
</div>
@if (User.GetUserId()!=null) {
    <div class="form-horizontal">
        <div class="input-group" >
            <input id="Comment" class="form-control" placeholder="@SR["DoCommentPlaceHolder"]"/>
            <span class="input-group-btn">
                <input type="button" value="@SR["DoComment"]" class="btn btn-secondary"
                data-receiverid="@Model.Id" id="cmtBtn"
                 />
            </span> 
        </div>
        <span asp-validation-for="Content" class="text-danger" ></span>
    </div>
    }
    else {
        <p><i>Vous devez être identifié pour commenter.</i> </p>
    }
    
</div>
@if (await AuthorizationService.AuthorizeAsync(User, Model, new EditRequirement())) {
<a asp-action="Edit" asp-route-id="@Model.Id" class="btn btn-link">@SR["Edit"]</a>
}
<a asp-action="Index" class="btn btn-link">@SR["Back to List"]</a>
</div>