{% extends 'base.html.twig' %}
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('css/detail-forum.css') }}">
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1"/>
{% endblock %}
{% block body %}
<div class="section-about" id="section-about">
{% for message in app.flashes('success') %}
<div class="alert alert-success alert-dismissible fade show col-md-6" role="alert">{{ message }}</div>
{% endfor %}
<div class="section-gallery">
<div class="container">
<div class="row justify-content-center pb-5">
<div class="row justify-content-center pb-5 {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<h5>{% trans %} forum.details.forum {% endtrans %}</h5>
<h2 class="pb-0">Lorem ipsum dolor</h2>
</div>
</div>
<div class="box"></div>
<div class="row justify-content-center pb-5">
<div class="row justify-content-center pb-5">
<div class="card-body {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<h6 class="card-title">
<strong>{{ sujetForum.sujet }}
</strong>
</h6>
<hr>
<p class="card-text">{{ sujetForum.description }}</p>
<h6 class="card-title">
<span id="date">
{{ app.request.locale == 'ar_TN' ? sujetForum.getDatePublic | date('Y/m/d') : sujetForum.getDatePublic | date('d/m/Y') }} </p></span>
</h6>
</div>
</div>
</div>
<div class="row justify-content-center pb-5">
<div class="row justify-content-center pb-5">
<form class="{{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" method="post" action="{{ path('make_forum_response', { id: sujetForum.id }) }}" id="form-envoyer">
<input type="hidden" name="_token" value="{{ csrf_token('forum') }}">
<div
class="input-group">
<textarea name="message" class="form-control col-md-4" aria-label="With textarea" placeholder="{{ 'Réponse'|trans }}"></textarea>
</div>
<input id="sujetForumId" type="hidden" value="{{ sujetForum.id }}"/>
{% if app.user != null %}
<button type="submit" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
{% endif %}
{% if app.user == null %}
<a href="/login">
<button type="button" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
</a>
{% endif %}
</form>
</div>
</div>
<div class="row justify-content-center pb-5" id="ReponseSujet">
<div class="row justify-content-center pb-5" style="">
<div class="accordion-content">
{% for reponse in reponsesForums %}
<div
class="accordion-item" id="accordion-item">
{% if app.user != null and reponse.user.id == app.user.id and reponse.etat == false %}
<header class="item-header answer">
<h4 id="item-quest-user" class="item-question answer">{{ reponse.user }}</h4>
<h4 id="item-quest-date" class="item-question">
{{ app.request.locale == 'ar_TN' ? reponse.date | date('Y/m/d') : reponse.date | date('d/m/Y') }} </p></span></h4>
<form class="" method="post" action="{{ path('update_forum_response', { id: reponse.id }) }}" id="form-reponse">
<input type="hidden" name="_token" value="{{ csrf_token('forum') }}">
<div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<textarea name="message" class="form-control form-control-lg " aria-lab-el="With textarea" required>{{ reponse.reponse }}</textarea>
</div>
<button type="submit" class="btn-slider-text modif">
<i id="update-commentaire" class="fa-solid fa-pen-to-square"></i>
</button>
<a class="col-md-10" style="margin:10px;">
<i id="drop-commentaire" onclick="supprimerReponse({{ reponse.id }})" class="fa-sharp fa-solid fa-trash"></i>
</a>
</form>
</header>
{% else %}
<header class=" item-header container">
<div class="row {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<div class="col-md-2">
<h4 id="item-quest-user" class="item-question">{{ reponse.user }}</h4>
<div class="col-md-2">
<h4 id="item-quest-date" class="item-question">
{{ app.request.locale == 'ar_TN' ? reponse.date | date('Y/m/d') : reponse.date | date('d/m/Y') }} </p></span></h4></h4>
</div>
</div>
<div class="col-md-12 description">
{{ reponse.reponse }}
</div>
</div>
</header>
{% endif %}
</div>
<form method="post" action="{{ path('make_forum_comment', { id: sujetForum.id, repid: reponse.id }) }}" id="reponse-form">
<input type="hidden" name="_token" value="{{ csrf_token('forum') }}">
<div class="input-group ">
<div class="{{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" style="width:100%">
<div
class="input-group">
<textarea name="message" class="form-control" aria-label="With textarea" placeholder="{{ 'Commenter_la_réponse'|trans }}"></textarea>
</div>
<input
type="hidden" value="{{ sujetForum.id }}"/>
{% if app.user != null %}
<button type="submit" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
{% endif %}
{% if app.user == null %}
<a href="/login">
<button type="button" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
</a>
{% endif %}
</div>
</form>
{% for child in reponse.children %}
{% if app.user != null and child.user.id == app.user.id and child.etat == false %}
<div class="accordion-content mx-5">
<div class="accordion-item">
<header class="item-header" id="Rps-child">
<h4 id="item-quest-user" class="item-question">{{ child.user }}
</h4>
<h4 id="item-quest-date" class="item-question">
{{ app.request.locale == 'ar_TN' ? child.date | date('Y/m/d') : child.date | date('d/m/Y') }} </p></span></h4>
</h4>
<form method="post" action="{{ path('update_forum_response', { id: child.id }) }}" style="margin-right: 30px">
<input type="hidden" name="_token" value="{{ csrf_token('forum') }}">
<div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<textarea name="message" class="form-control col-md-4" aria-label="With textarea" required>{{ child.reponse }}</textarea>
</div>
<button type="submit" class="btn-slider-text modif">
<i id="update-commentaire" class="fa-solid fa-pen-to-square"></i>
</button>
<i id="drop-commentaire" onclick="supprimerReponse({{ child.id }})" class="fa-sharp fa-solid fa-trash"></i>
</form>
</header>
</div>
</div>
{% elseif child.etat != false %}
<div class="accordion-content mx-5" id="Rps-child">
<div class="accordion-item">
<header class=" item-header container">
<div class="row {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<div class="col-md-2">
<h4 id="item-quest-user" class="item-question">{{ child.user }}</h4>
<div class="col-md-2">
<h4 id="item-quest-date" class="item-question">
{{ app.request.locale == 'ar_TN' ? child.date | date('Y/m/d') : child.date | date('d/m/Y') }} </p></span></h4></h4>
</div>
</div>
<div class="col-md-12 description">
{{ child.reponse }}
</div>
</div>
</header>
</div>
</div>
{% endif %}
{% endfor %}
{% endfor %}
</div>
</div>
</div>
<div class="container showMore">
<div class="row justify-content-center">
<div class="col-md-12">
<div class="row justify-content-center pb-5">
<a>
<input type="hidden" value="{{ sujetForum.id }}" id="idSujetForum">
<button class="btn-slider-text mt-5" id="addMore">
{% trans %} forum.details.show {% endtrans %}</button>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
var csrfForumToken = '{{ csrf_token('forum') }}';
function supprimerReponse(a) {
console.log('supprimer')
event.preventDefault();
Swal.fire({
title: 'Êtes-vous sûr?',
text: 'Vous ne pourrez pas revenir en arrière !',
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Oui, supprimez-le!'
}).then((result) => {
if (result.isConfirmed) {
$.ajax({
type: 'POST',
url: '/delete/forum/reponse/' + a,
data: { _token: csrfForumToken },
// data: JSON.stringify(item),
dataType: 'json',
success: function (response) {
console.log(response)
location.reload()
}
})
// window.location.href = "/make/command/delete/"+a;
}
})
}
// Get the modal
var modal = document.getElementById('myModal')
// Get the image and insert it inside the modal - use its "alt" text as a caption
var img = document.getElementById('dream-img')
{# var modalImg = document.getElementById('img01') {
var pathImg = document.getElementById('path-img').value
function showImg(img) {
var img = pathImg + img
modalImg.style.backgroundImage = 'url(' + img + ')'
modal.style.display = 'block'
}
} #}
// Get the <span> element that closes the modal
var span = document.getElementsByClassName('close')[0]
// When the user clicks on <span> (x), close the modal
$(document).ready(function () {});
let offset = 1;
$('#addMore').on('click', function () {
console.log(offset)
sujetForumId = $('#idSujetForum').val()
var url = '/ajax/get/ReponseForum/' + sujetForumId;
console.log('/ajax/get/ReponseForum/' + sujetForumId)
console.log("offset " + offset)
div = ` test one div`
$(div).insertBefore(".showMore");
$.ajax({
type: "GET",
url: url,
data: {
'offset': offset
},
success: function (response) {
console.log(JSON.stringify(response))
div = ``
$(div).insertBefore(".showMore");
response.result.map((value, index) => {
forumDate = value.date
console.log(forumDate)
console.log(typeof(forumDate))
div = `<div class="accordion-item" id="accordion-item">`
$(div).insertBefore(".showMore")
appUser = "{{ app.user }}"
if (appUser != null && value.etat === false) {
div = `
<div class="row justify-content-center pb-5" id="ReponseSujet">
<div class="row justify-content-center pb-5" style="">
<div class="accordion-content">
<div class="accordion-item" id="accordion-item">
<header class="item-header answer">
<h4 id="item-quest-user" class="item-question answer">${escapeHtml(value.userName)}</h4>
<h4 id="item-quest-date" class="item-question">
{% if app.request.locale == 'ar_TN' %}
${forumDate.split('/').reverse().join('/')}
{% else %}
${forumDate}
{% endif %}
</h4>
<form method="post" action="/update/forum/response/${
value.id
}" id="form-reponse">
<input type="hidden" name="_token" value="${csrfForumToken}">
<div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<textarea name="message" class="form-control form-control-lg " aria-label="With textarea" required>${escapeHtml(value.reponse)}</textarea>
</div>
<button type="submit" class="btn-slider-text modif"> <i id="update-commentaire" class="fa-solid fa-pen-to-square"></i>
</button>
<a class="col-md-10" style="0:10px;">
<i id="drop-commentaire" onclick="supprimerReponse(${value.id})" class="fa-sharp fa-solid fa-trash"></i>
</a>
</form>
</header>
</div>
</div>
`;
$(div).insertBefore(".showMore");
} else {
div = `
<div class="row justify-content-center pb-5" id="ReponseSujet">
<div class="row justify-content-center pb-5" style="">
<div class="accordion-content">
<div class="accordion-item" id="accordion-item">
<header class="item-header {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<h4 id="item-quest-user" class="item-question">${escapeHtml(value.userName)}</h4>
<h4 id="item-quest-date" class="item-question">
{% if app.request.locale == 'ar_TN' %}
${forumDate.split('/').reverse().join('/')}
{% else %}
${forumDate}
{% endif %}
</h4>
${escapeHtml(value.reponse)}
</header>
</div>
<form method="post" action="/make/forum/comment/${sujetForumId}/${
value.id
}" id="reponse-form">
<input type="hidden" name="_token" value="${csrfForumToken}">
<div class="input-group">
<div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" >
<textarea name="message" class="form-control" aria-label="With textarea" placeholder="{{ 'Commenter_la_réponse'|trans }}"></textarea>
</div>
<input type="hidden" value="${sujetForumId}" />
<div class="{{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}" style="width:100%;"> {% if app.user != null %}
<button type="submit" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
{% endif %}
{% if app.user == null %}
<a href="/login"><button type="button" class="btn-slider-text-forum-dtls">{% trans %} forum.details.send {% endtrans %}</button>
</a>
</div>
{% endif %}
</div>
</form>
</div>
</div>
</div>
`;
$(div).insertBefore(".showMore");
}
value.childs.forEach(child => {
console.log("childs " + child)
var forumDate = child.date // Assurez-vous de remplacer cela par la valeur réelle en JavaScript
var date = new Date(forumDate);
var formattedDate = (date.getDate() < 10 ? '0' : '') + date.getDate() + '/' + (
(date.getMonth() + 1) < 10 ? '0' : ''
) + (date.getMonth() + 1) + '/' + date.getFullYear();
if (appUser && child.userName == appUser && child.etat == false) {
div = `
<div class="row justify-content-center pb-5" id="ReponseSujet">
<div class="row justify-content-center pb-5" style="">
<div class="accordion-content">
<div class="accordion-content mx-5">
<div class="accordion-item">
<header class="item-header" id="Rps-child">
<h4 id="item-quest-user" class="item-question">${escapeHtml(child.userName)} </h4>
<h4 id="item-quest-date" class="item-question">
{% if app.request.locale == 'ar_TN' %}
${child.date.split('/').reverse().join('/')}
{% else %}
${child.date}
{% endif %}
</h4>
<form method="post" action="/update/forum/response/${
child.id
}" style="margin-right: 30px">
<input type="hidden" name="_token" value="${csrfForumToken}">
<div class="input-group {{ app.request.locale == 'ar_TN' ? 'form_direction_rtl' : 'form_direction_ltr' }}">
<textarea name="message" class="form-control col-md-4" aria-label="With textarea" required> ${escapeHtml(child.reponse)}</textarea>
</div>
<button type="submit" class="btn-slider-text modif"> <i id="update-commentaire" class="fa-solid fa-pen-to-square"></i> </button>
<i id="drop-commentaire" onclick="supprimerReponse(${
child.id
})" class="fa-sharp fa-solid fa-trash"></i>
</form>
</header>
</div>
</div>
</div>
</div>
`
$(div).insertBefore(".showMore");
}
});
offset = offset + 1;
});
}
});
});
</script>
{% endblock %}