how to use FOSCommentBundle - symfony

Question

Im new to symfony3 and I need a bit of help,I have a timeline page that contains posts and every post has a comment field so in order to do that I've installed the FOSCommentBundle following all the steps in this documentation https://github.com/FriendsOfSymfony/FOSCommentBundle/blob/master/Resources/doc/index.md and then I integrated it with the FOSUserBundle, and I did the following changes in the async.html.twig file :
<div id="fos_comment_thread">#comments</div>
<script type="text/javascript">
// thread id
var fos_comment_thread_id = 'pub';
// api base url to use for initial requests
var fos_comment_thread_api_base_url = 'localhost/Outdoors5/web/app_dev.php/threads';
// Snippet for asynchronously loading the comments
(function() {
var fos_comment_script = document.createElement('script');
fos_comment_script.async = true;
fos_comment_script.src = '{{ asset('bundles/foscomment/js/comments.js') }}';
fos_comment_script.type = 'text/javascript';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(fos_comment_script);
})();
</script>
but in the end I got very confused on how I use this ,I passed hours trying to understand and searching for tuto, but no luck.
this is my view
<section id="timeline">
{% for publication in publications %}
<div id="result"></div>
<div class="page-content page-app page-profil " >
<div class="profil-content">
<div class="row">
<div class="row">
<div class="item item-comment">
<div class="user">
<h5 class="name">{{ publication.idProfil.nom }}</h5>
<div class="clearfix">
<p class="time">{% if publication.dateCreation %}{{ publication.dateCreation|date('Y-m-d') }}{% endif %}</p>
</div>
<div class="comment">
<p class="c-primary m-b-0"><strong>{{ publication.texte }}</strong></p>
</div>
</div>
<div class="more">
<div class="row">
<div class="col-sm-4 like">
<i class="fa fa-heart"></i> Like
</div>
<div class="col-sm-4 more-comments">
<div class="comment-number">
<i class="icon-bubble"></i> Comments<span class="pull-right badge badge-dark">3</span>
</div>
</div>
<div class="col-sm-4 more-share">
<i class="icon-share"></i> Share
</div>
</div>
<div class="row comments">
<div class="col-sm-12">
<ul>
<li class="clearfix">
<div class="clearfix">
<div class="info">
<div class="name"><strong class="primary-font"></strong></div>
<div class="date"></div>
</div>
<p>
comment 1
</p>
</div>
</li>
<li></li>
</ul>
</div>
</div>
<div class="row share">
<div class="share-facebook">
<i class="fa fa-facebook"></i>
</div>
<div class="share-twitter">
<i class="fa fa-twitter"></i>
</div>
<div class="share-google">
<i class="fa fa-google-plus"></i>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{% endfor %}
</section>
Could you point me to the right direction?
thank you

Answer 1

There is no need to modify async.html.twig. You just need to add the following code in your twig view:
{% include 'FOSCommentBundle:Thread:async.html.twig' with {'id': 'foo'} %}
To sum up, after doing the following steps:
Step 1: Setting up the bundle
Step 2: Create your Comment and Thread classes
Step 3: Import FOSCommentBundle routing
Step 4: Enable comments on a page
For the FOSUserBundle integration you just have to extend the Comment class as explained in Step 6: Integration with FOSUserBundle