Skip to content

add delete post functionality and setup project #23

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
mudassir-jmi wants to merge 1 commit into
base: master
Choose a base branch
from
Open

add delete post functionality and setup project #23

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
103 changes: 65 additions & 38 deletions chat/templates/chat/add_post.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,48 +2,75 @@
{% load widget_tweaks %}

{% block title %}
New Post
New Post
{% endblock %}

{% block content %}
<div class="container-fluid row">
<div class="col-md-8">
<h1 class="py-3 px-2 bg-dark text-light d-flex justify-content-between">New Post </h1>
<div class=" bg-grey container mx-auto py-3">

{% if form.non_field_errors %}
<div class="alert alert-warning alert-dismissible fade show" style="font-size: 11px" role="alert">
{{ form.non_field_errors }}
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
{% endif %}

<form method="POST" enctype="multipart/form-data">
{% csrf_token %}
{% for field in form %}
<div class="form-group">
{% if field.errors %}
<div class="alert alert-warningalert-dismissible fade show" role='alert'>
{{ field.errors }}
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
{% endif %}

{{ field.label_tag }}
{{ field|add_class:'form-control' }}
</div>
{% endfor %}
<input type='submit' class="btn btn-primary btn-block" value='submit'>
</form>
<div class="container-fluid row">
<div class="col-md-8">
<h1 class="py-3 px-2 bg-dark text-light d-flex justify-content-between">New Post </h1>
<div class="bg-grey container mx-auto py-3">

{% if form.non_field_errors %}
<div class="alert alert-warning alert-dismissible fade show" style="font-size: 11px" role="alert">
{{ form.non_field_errors }}
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
{% endif %}

<form method="POST" enctype="multipart/form-data" id="postForm">
{% csrf_token %}
{% for field in form %}
<div class="form-group">
{% if field.errors %}
<div class="alert alert-warning alert-dismissible fade show" role="alert">
{{ field.errors }}
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
{% endif %}

{{ field.label_tag }}
{{ field|add_class:'form-control' }}
</div>
{% endfor %}
<input type="submit" class="btn btn-primary btn-block" value="Add Post">
</form>
</div>
<div class="col-md-4">
<h3 class="py-3 px-2 bg-dark text-light text-right">Me</h3>
{% include 'accounts/profile.html' %}
</div>
</div>
<div class="col-md-4">
<h3 class="py-3 px-2 bg-dark text-light text-right">Me</h3>
{% include 'accounts/profile.html' %}
</div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function () {
const form = document.getElementById('postForm');
form.addEventListener('submit', function (event) {
const pictureInput = form.querySelector('input[name="picture"]');
const textArea = form.querySelector('textarea[name="text"]');
let isValid = true;
let errorMessage = '';

if (!pictureInput.value.trim()) {
isValid = false;
errorMessage += 'Picture is required. ';
}

if (!textArea.value.trim()) {
isValid = false;
errorMessage += 'Text is required.';
}

if (!isValid) {
event.preventDefault();
alert(errorMessage);
}
});
});
</script>
{% endblock %}
191 changes: 117 additions & 74 deletions chat/templates/chat/home.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,90 +1,133 @@
{% extends 'base.html' %}

{% load widget_tweaks %}


{% block title %}
Feeds
Feeds
{% endblock %}

{% block content %}
<div class="row">
<div class="col-md-8 col-sm-12">
<h1 class="py-3 px-2 bg-dark text-light d-flex justify-content-between">News Feed <a href="{% url 'chat:add_post' %}"><i class="fas fa-plus text-light"></i></a></h1>
<div class="container bg-grey">
{% for post in posts %}
<div class=" my-4 card" style="box-shadow: #484646 0px 4px 1px">
{% if post.picture %}
<div class="card-img-top text-center">
<img style="max-width: 99%; height: auto;" src="{{ post.picture.url }}">
</div>
<div class="row">
<div class="col-md-8 col-sm-12">
<h1 class="py-3 px-2 bg-dark text-light d-flex justify-content-between">
News Feed
<a href="{% url 'chat:add_post' %}">
<i class="fas fa-plus text-light"></i>
</a>
</h1>

<!-- Search Bar -->
<div class="my-3">
<input type="text" id="searchBar" class="form-control" placeholder="Search posts...">
</div>

<div class="container bg-grey" id="postsContainer">
{% for post in posts %}
<div class="my-4 card" style="box-shadow: #484646 0px 4px 1px" data-post-id="{{ post.id }}">
{% if post.picture %}
<div class="card-img-top text-center">
<img style="max-width: 99%; height: auto;" src="{{ post.picture.url }}">
</div>
{% endif %}
<div class="card-body">
<div class="card-title text-right">
{% if post.user == request.user %}
<strong>Me</strong>
{% else %}
<strong>
<a class='text-dark' href="{% url 'accounts:view-profile' post.user.username %}">
{{ post.user.first_name }} {{ post.user.last_name }}
</a>
</strong>
{% endif %}
</div>
<div class="card-text">
{{ post.text }}
</div>
</div>
<div class="card-footer">
<div class="d-flex justify-content-between">
<i>{{ post.posted_date }}</i>
{% if post.user == request.user %}
<a class="btn btn-outline-dark" data-toggle='collapse' href="#comments{{ post.id }}"
role="button" aria-expanded="false" aria-controls="comments{{ post.id }}">
<i class="fas fa-2x fa-comment"></i> <span class="badge badge-danger"></span>
</a>
{% endif %}
<div class="card-body">
<div class="card-title text-right">
{% if post.user == request.user %}
<strong>Me</strong>
{% else %}
<strong>
<a class='text-dark' href="{% url 'accounts:view-profile' post.user.username %}">{{ post.user.first_name }} {{ post.user.last_name }}</a>
</strong>
{% endif %}
</div>
<div class="card-text">
{{ post.text }}
</div>
</div>
<div class="card-footer">
<div class="d-flex justify-content-between">
<i>{{ post.posted_date }}</i>
<a class="btn btn-outline-dark" data-toggle='collapse' href="#comments{{ post.id }}" role="button" aria-expanded="false" aria-controls="comments{{ post.id }}">
<i class="fas fa-2x fa-comment"></i> <span class="badge badge-danger">{{ post.comments.count }}</span>
</a>
</div>
<div class="collapse" id="comments{{ post.id }}">
<div class="mt-2 card card-body">
{% for comment in post.comments.all %}
<code class="blockquote text-center border-bottom" style="font-size: 0.8rem">
{{ comment.text }}

<footer class="blockquote-footer">
{% if comment.user == user %}
Me
{% else %}
{{ comment.user.first_name }} {{ comment.user.last_name }}
{% endif %}
{{ comment.comment_date}}
</footer>
</code>
{% endfor %}
<form method="POST" action="{% url 'chat:add_comment' post.id %}">
{% csrf_token %}
{% for field in comment_form %}
<div class="form-group">
{% if field.errors %}
<div class="alert alert-warningalert-dismissible fade show" role='alert'>
{{ field.errors }}
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
{% endif %}

{{ field.label_tag }}
{{ field|add_class:'form-control' }}
</div>
{% endfor %}
<input type="submit" value="post" class="btn btn-outline-primary">
</form>
<a href="{% url 'chat:delete_post' post.id %}" class="btn btn-outline-danger"
onclick="return confirm('Are you sure you want to delete this post?')">
<i class="fas fa-trash"></i> Delete
</a>
</div>
<div class="collapse" id="comments{{ post.id }}">
<div class="mt-2 card card-body">
{% for comment in post.comments.all %}
<code class="blockquote text-center border-bottom" style="font-size: 0.8rem">
{{ comment.text }}
<footer class="blockquote-footer">
{% if comment.user == user %}
Me
{% else %}
{{ comment.user.first_name }} {{ comment.user.last_name }}
{% endif %}
{{ comment.comment_date }}
</footer>
</code>
{% endfor %}
<form method="POST" enctype="multipart/form-data">
{% csrf_token %}
{% for field in form %}
<div class="form-group">
{% if field.errors %}
<div class="alert alert-warning alert-dismissible fade show" role='alert'>
{{ field.errors }}
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
{% endif %}
{{ field.label_tag }}
{{ field|add_class:'form-control' }}
{% if field.field.required %}
<small class="form-text text-muted">This field is required.</small>
{% endif %}
</div>
</div>
{% endfor %}
<input type="submit" value="Submit" class="btn btn-primary btn-block">
</form>

</div>
</div>
{% endfor %}
</div>
</div>
</div>
<div class="col-md-4">
<h3 class="py-3 px-2 bg-dark text-light text-right">Me</h3>
{% include 'accounts/profile.html' %}
{% endfor %}
</div>
</div>
<div class="col-md-4">
<h3 class="py-3 px-2 bg-dark text-light text-right">Me</h3>
{% include 'accounts/profile.html' %}
</div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function () {
const searchBar = document.getElementById('searchBar');
const postsContainer = document.getElementById('postsContainer');

searchBar.addEventListener('input', function () {
const query = searchBar.value.toLowerCase();
console.log('Search query:', query); // Debugging log

document.querySelectorAll('#postsContainer .card').forEach(function (card) {
const text = card.querySelector('.card-text').textContent.toLowerCase();
console.log('Post text:', text); // Debugging log
if (text.includes(query)) {
card.style.display = ''; // Show post
} else {
card.style.display = 'none'; // Hide post
}
});
});
});
</script>
{% endblock %}
6 changes: 3 additions & 3 deletions chat/urls.py
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
""" soMedia URL Configuration """

from django.urls import path
from . import views

app_name = 'chat'
urlpatterns = [
path('', views.home, name='home'),
path('posts/add', views.add_post, name='add_post'),
path('comments/add/<post_id>', views.add_comment, name='add_comment')
path('comments/add/<int:post_id>', views.add_comment, name='add_comment'),
path('posts/delete/<int:post_id>/', views.delete_post, name='delete_post'),
path('posts/search', views.search_posts, name='search_posts'), # New URL pattern for search
]
Loading