Skip to content

Commit

Permalink
Complet Comment Reply System
Browse files Browse the repository at this point in the history
  • Loading branch information
@subhadipghorui
subhadipghorui committed Oct 13, 2020
1 parent 955d55a commit a04d1cc
Show file tree
Hide file tree
Showing 9 changed files with 281 additions and 155 deletions.
3 changes: 3 additions & 0 deletions app/Comment.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,4 +14,7 @@ public function user()
{
return $this->belongsTo('App\User');
}
public function replies(){
return $this->hasMany('App\CommentReply');
}
}
3 changes: 3 additions & 0 deletions app/Http/Controllers/Admin/CommentController.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
namespace App\Http\Controllers\Admin;

use App\Comment;
use App\CommentReply;
use App\Http\Controllers\Controller;
use Brian2694\Toastr\Facades\Toastr;
use Illuminate\Http\Request;
Expand All @@ -17,6 +18,8 @@ public function index()
public function destroy($id)
{
$comment = Comment::findOrFail($id);
// Delete all replies
$replies = CommentReply::where('comment_id', $id)->delete();
$comment->delete();
Toastr::success('Comment successfully deleted :)');
return redirect()->back();
Expand Down
3 changes: 3 additions & 0 deletions app/Http/Controllers/User/CommentController.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
namespace App\Http\Controllers\User;

use App\Comment;
use App\CommentReply;
use App\Http\Controllers\Controller;
use Brian2694\Toastr\Facades\Toastr;
use Illuminate\Http\Request;
Expand All @@ -19,6 +20,8 @@ public function destroy($id)
{
$comment = Comment::findOrFail($id);
if ($comment->user_id == Auth::id()) {
// Delete replies
$replies = CommentReply::where('comment_id', $id)->delete();
$comment->delete();
Toastr::success('Comment successfully deleted :)');
return redirect()->back();
Expand Down
3 changes: 3 additions & 0 deletions app/User.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,4 +51,7 @@ public function comments()
{
return $this->hasMany('App\Comment');
}
public function replies(){
return $this->hasMany('App\CommentReply');
}
}
250 changes: 157 additions & 93 deletions frontend/single.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -302,118 +302,167 @@ <h4 class="text-uppercase">
<div class="row flex-column">
<h5 class="text-uppercase pb-80">05 Comments</h5>
<br />
<div class="comment-list">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c1.jpg" alt="" />
<!-- Frist Comment -->
<div class="comment">
<div class="comment-list">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c1.jpg" alt="" />
</div>
<div class="desc">
<h5><a href="#">Emilly Blunt</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
Never say goodbye till the end comes!
</p>
</div>
</div>
<div class="desc">
<h5><a href="#">Emilly Blunt</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
Never say goodbye till the end comes!
</p>
<div class="">
<button class="btn-reply text-uppercase" id="reply-btn"
onclick="showReplyForm('1','Emilly Blunt')">reply 1</button
>
</div>
</div>
<div class="reply-btn">
<a href="" class="btn-reply text-uppercase"
>reply</a
>
</div>
</div>
</div>
<div class="comment-list left-padding">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c2.jpg" alt="" />
<div class="comment-list left-padding">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c3.jpg" alt="" />
</div>
<div class="desc">
<h5><a href="#">Sally Sally</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
@Emilly Blunt Never say goodbye till the end comes!
</p>
</div>
</div>
<div class="desc">
<h5><a href="#">Emilly Blunt</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
Never say goodbye till the end comes!
</p>
<div class="">
<button class="btn-reply text-uppercase" id="reply-btn"
onclick="showReplyForm('1','Sally Sally')">reply 1</button
>
</div>
</div>
<div class="reply-btn">
<a href="" class="btn-reply text-uppercase"
>reply</a
>
</div>
</div>
</div>
<div class="comment-list left-padding">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c3.jpg" alt="" />
<div class="comment-list left-padding" id="reply-form-1" style="display: none">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c2.jpg" alt="" />
</div>
<div class="desc">
<h5><a href="#">Goerge Stepphen</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<div class="row flex-row d-flex">
<form action="#" method="POST">
<div class="col-lg-12">
<textarea
id="reply-form-1-text"
cols="60"
rows="2"
class="form-control mb-10"
name="message"
placeholder="Messege"
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'Messege'"
required=""
></textarea>
</div>
<button type="submit" class="btn-reply text-uppercase ml-3">Reply</button>
</form>
</div>
</div>
</div>
<div class="desc">
<h5><a href="#">Emilly Blunt</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
Never say goodbye till the end comes!
</p>
</div>
</div>
<div class="reply-btn">
<a href="" class="btn-reply text-uppercase"
>reply</a
>
</div>
</div>
</div>
<div class="comment-list">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c4.jpg" alt="" />
<!-- 2nd Comment -->
<div class="comment">
<div class="comment-list">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c1.jpg" alt="" />
</div>
<div class="desc">
<h5><a href="#">Emilly Blunt</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
Never say goodbye till the end comes!
</p>
</div>
</div>
<div class="desc">
<h5><a href="#">Emilly Blunt</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
Never say goodbye till the end comes!
</p>
<div class="">
<button class="btn-reply text-uppercase" id="reply-btn"
onclick="showReplyForm('2','Emilly Blunt')">reply 2</button
>
</div>
</div>
<div class="reply-btn">
<a href="" class="btn-reply text-uppercase"
>reply</a
>
</div>
</div>
</div>
<div class="comment-list">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c5.jpg" alt="" />
<div class="comment-list left-padding">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c3.jpg" alt="" />
</div>
<div class="desc">
<h5><a href="#">Sally Sally</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
@Emilly Blunt Never say goodbye till the end comes!
</p>
</div>
</div>
<div class="desc">
<h5><a href="#">Emilly Blunt</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<p class="comment">
Never say goodbye till the end comes!
</p>
<div class="">
<button class="btn-reply text-uppercase" id="reply-btn"
onclick="showReplyForm('2','Sally Sally')">reply 2</button
>
</div>
</div>
<div class="reply-btn">
<a href="" class="btn-reply text-uppercase"
>reply</a
>
</div>
<div class="comment-list left-padding" id="reply-form-2" style="display: none">
<div
class="single-comment justify-content-between d-flex"
>
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="img/asset/c2.jpg" alt="" />
</div>
<div class="desc">
<h5><a href="#">Goerge Stepphen</a></h5>
<p class="date">December 4, 2017 at 3:12 pm</p>
<div class="row flex-row d-flex">
<form action="#" method="POST">
<div class="col-lg-12">
<textarea
id="reply-form-2-text"
cols="60"
rows="2"
class="form-control mb-10"
name="message"
placeholder="Messege"
onfocus="this.placeholder = ''"
onblur="this.placeholder = 'Messege'"
required=""
></textarea>
</div>
<button type="submit" class="btn-reply text-uppercase ml-3">Reply</button>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
Expand Down Expand Up @@ -721,5 +770,20 @@ <h6 class="mb-20">Instragram Feed</h6>
<script src="js/jquery.magnific-popup.min.js"></script>
<script src="js/jquery.sticky.js"></script>
<script src="js/main.js"></script>
<script type="text/javascript">
function showReplyForm(commentId,user) {
var x = document.getElementById(`reply-form-${commentId}`);
var input = document.getElementById(`reply-form-${commentId}-text`);

if (x.style.display === "none") {
x.style.display = "block";
input.innerText=`@${user} `;

} else {
x.style.display = "none";
}
}

</script>
</body>
</html>
10 changes: 10 additions & 0 deletions resources/views/layouts/backend/partials/navbar.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,11 @@ class="navbar-toggler"
<i class="menu-icon fa fa-file"></i>Comments
</a>
</li>
<li class="active">
<a href="{{route('admin.reply-comment.index')}}">
<i class="menu-icon fa fa-file"></i>Replied Comments
</a>
</li>
</ul>
@else
<ul class="nav navbar-nav">
Expand All @@ -67,6 +72,11 @@ class="navbar-toggler"
<i class="menu-icon fa fa-file"></i>Comments
</a>
</li>
<li class="active">
<a href="{{route('user.reply-comment.index')}}">
<i class="menu-icon fa fa-file"></i>Replied Comments
</a>
</li>
</ul>
@endif
</div>
Expand Down
1 change: 1 addition & 0 deletions resources/views/layouts/frontend/app.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -172,5 +172,6 @@ class="form-inline"
<script src="{{asset('frontend/js/jquery.magnific-popup.min.js')}}"></script>
<script src="{{asset('frontend/js/jquery.sticky.js')}}"></script>
<script src="{{asset('frontend/js/main.js')}}"></script>
@stack('footer')
</body>
</html>
Loading

0 comments on commit a04d1cc

Please sign in to comment.