@(
    post:(models.Post,models.User,Seq[models.Comment]),
    pagination:(Option[models.Post],Option[models.Post]),
    randomID:String
)(
    implicit 
    params:play.mvc.Scope.Params,
    flash:play.mvc.Scope.Flash,
    errors:Map[String,play.data.validation.Error]
)

@main(title = post._1.title) {
    
    <ul id="pagination">
        @pagination._1.map { post =>
            <li id="previous">
                <a href="@action(controllers.Application.show(post.id()))">
                    @post.title
                </a>
            </li>
        }
        @pagination._2.map { post =>
            <li id="next">
                <a href="@action(controllers.Application.show(post.id()))">
                    @post.title
                </a>
            </li>
        }
    </ul>
    
    @if(flash.get("success")) {
        <p class="success">@flash.get("success")</p>
    }
    
    @display(post, mode = "full")
    
    <h3>Post a comment</h3>
    
    @form(controllers.Application.postComment(post._1.id())) {
        
        @if(errors) {
            <p class="error">
                @errors.head._2
            </p>
        }
        
        <p>
            <label for="author">Your name: </label>
            <input type="text" name="author" value="@params.get("author")">
        </p>
        <p>
            <label for="content">Your message: </label>
            <textarea name="content">@params.get("content")</textarea>
        </p>
        <p>
            <label for="code">Please type the code below: </label>
            <img src="@action(controllers.Application.captcha(randomID))">
            <br>
            <input type="text" name="code" id="code" size="18" value="">
            <input type="hidden" name="randomID" value="@randomID">
        </p>
        <p>
            <input type="submit" value="Submit your comment" />
        </p>
    }
    
    <script type="text/javascript" charset="utf-8">
        $(function() {         
            // Expose the form 
            $('form').click(function() { 
                $('form').expose({api: true}).load(); 
            }); 

            // If there is an error, focus to form
            if($('form .error').size()) {
                $('form').expose({api: true, loadSpeed: 0}).load(); 
                $('form input[type=text]').get(0).focus();
            }
        });
    </script>
    
}

