File size: 5,386 Bytes
f631d90 eabcc39 2de43c6 eabcc39 f631d90 eabcc39 2de43c6 f631d90 2de43c6 eabcc39 f631d90 eabcc39 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 |
{% extends "base.html" %}
{% block title %}{{ thread.title }}{% endblock %}
{% block content %}
<h2 class="text-2xl font-semibold mb-2">{{ thread.title }}</h2> <!-- Titre du fil -->
<p class="text-gray-500 mb-4">Créé le {{ thread.timestamp.strftime('%d/%m/%Y %H:%M:%S') }}</p> <!-- Date de création -->
<div class="messages space-y-6"> <!-- Conteneur pour les messages, espacement vertical -->
{% for msg in messages %}
<div class="message {% if msg.removed %}bg-gray-200 text-gray-500{% else %}bg-white{% endif %} p-4 rounded-md shadow-sm"> <!-- Style du message, condition pour les messages supprimés -->
{% if not msg.removed %}
<p class="text-gray-800">{{ msg.content | safe }}</p> <!-- Contenu du message -->
<div class="text-sm text-gray-500 mt-1 mb-2"> <!-- Informations sur le message -->
Posté le {{ msg.timestamp.strftime('%d/%m/%Y %H:%M:%S') }} - Votes: {{ msg.vote_count }}
</div>
<div class="message-actions flex items-center space-x-4"> <!-- Actions sur le message -->
<form action="{{ url_for('vote', message_id=msg.id, action='up') }}" method="POST">
<button type="submit" aria-label="Upvote"
class="text-green-500 hover:text-green-700 transition-colors duration-200">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 19.5v-15m0 0l-6.75 6.75M12 4.5l6.75 6.75" />
</svg>
</button>
</form>
<form action="{{ url_for('vote', message_id=msg.id, action='down') }}" method="POST">
<button type="submit" aria-label="Downvote"
class="text-red-500 hover:text-red-700 transition-colors duration-200">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m0 0l6.75-6.75M12 19.5l-6.75-6.75" />
</svg>
</button>
</form>
<form action="{{ url_for('report', message_id=msg.id) }}" method="POST">
<button type="submit" aria-label="Report"
class="text-yellow-600 hover:text-yellow-800 transition-colors duration-200">
Signaler
</button>
</form>
<button onclick="quoteMessage('{{ msg.id }}', '{{ msg.content|escapejs }}')"
class="text-blue-500 hover:text-blue-700 transition-colors duration-200">
Citer
</button>
</div>
{% else %}
<p class="italic">Message supprimé par modération.</p> <!-- Message supprimé -->
{% endif %}
</div>
{% else %}
<p class="text-gray-600">Aucun message pour ce fil.</p> <!-- Aucun message -->
{% endfor %}
</div>
<div class="mt-6"> <!-- Marge en haut -->
<h3 class="text-xl font-semibold mb-3">Répondre</h3> <!-- Titre du formulaire -->
<form method="POST" action="{{ url_for('thread', thread_id=thread.id) }}" class="space-y-4"> <!-- Formulaire de réponse -->
<textarea name="content" id="reply-content" rows="5" placeholder="Votre réponse ici..." required
class="block w-full p-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"></textarea>
<div class="flex items-center space-x-4"> <!-- Boutons -->
<button type="button" onclick="previewMessage()"
class="bg-gray-200 hover:bg-gray-300 text-gray-800 font-bold py-2 px-4 rounded transition-colors duration-200">
Prévisualiser
</button>
<button type="submit"
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition-colors duration-200">
Poster
</button>
</div>
</form>
<div id="preview-area" class="mt-4"></div> <!-- Zone de prévisualisation -->
</div>
<script>
function previewMessage() {
const content = document.getElementById('reply-content').value;
fetch('{{ url_for('preview') }}', {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
body: 'content=' + encodeURIComponent(content)
}).then(response => response.json())
.then(data => {
document.getElementById('preview-area').innerHTML = data.preview;
});
}
function quoteMessage(messageId, content) {
const replyArea = document.getElementById('reply-content');
const quotedContent = `<div class="quoted-text"><p class="quoted-message-id">ID du message: ${messageId}</p>${content}</div>`;
replyArea.value = quotedContent + "\n\n" + replyArea.value;
replyArea.focus();
}
</script>
{% endblock %} |