Skip to content

Commit 3ae46a0

Browse files
committed
Add next and previous trick navigation to single trick page.
1 parent 37c2537 commit 3ae46a0

File tree

4 files changed

+184
-117
lines changed

4 files changed

+184
-117
lines changed

app/Controllers/TricksController.php

+4-1
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,10 @@ public function getShow($slug = null)
5151

5252
Event::fire('trick.view', $trick);
5353

54-
$this->view('tricks.single', compact('trick'));
54+
$next = $this->tricks->findNextTrick($trick);
55+
$prev = $this->tricks->findPreviousTrick($trick);
56+
57+
$this->view('tricks.single', compact('trick', 'next', 'prev'));
5558
}
5659

5760
/**

app/Tricks/Repositories/Eloquent/TrickRepository.php

+32
Original file line numberDiff line numberDiff line change
@@ -311,6 +311,38 @@ public function findByTag($slug, $perPage = 9)
311311
return [ $tag, $tricks ];
312312
}
313313

314+
/**
315+
* Find the next trick that was added after the given trick.
316+
*
317+
* @param \Tricks\Trick $trick
318+
* @return \Tricks\Trick|null
319+
*/
320+
public function findNextTrick(Trick $trick)
321+
{
322+
$next = $this->model->where('created_at', '>=', $trick->created_at)
323+
->where('id', '<>', $trick->id)
324+
->orderBy('created_at', 'asc')
325+
->first([ 'slug', 'title' ]);
326+
327+
return $next;
328+
}
329+
330+
/**
331+
* Find the previous trick added before the given trick.
332+
*
333+
* @param \Tricks\Trick $trick
334+
* @return \Tricks\Trick|null
335+
*/
336+
public function findPreviousTrick(Trick $trick)
337+
{
338+
$prev = $this->model->where('created_at', '<=', $trick->created_at)
339+
->where('id', '<>', $trick->id)
340+
->orderBy('created_at', 'desc')
341+
->first([ 'slug', 'title' ]);
342+
343+
return $prev;
344+
}
345+
314346
/**
315347
* Get the trick creation form service.
316348
*

app/Tricks/Repositories/TrickRepositoryInterface.php

+16
Original file line numberDiff line numberDiff line change
@@ -146,4 +146,20 @@ public function incrementViews(Trick $trick);
146146
* @return array
147147
*/
148148
public function findByTag($slug, $perPage = 9);
149+
150+
/**
151+
* Find the next trick that was added after the given trick.
152+
*
153+
* @param \Tricks\Trick $trick
154+
* @return \Tricks\Trick|null
155+
*/
156+
public function findNextTrick(Trick $trick);
157+
158+
/**
159+
* Find the previous trick added before the given trick.
160+
*
161+
* @param \Tricks\Trick $trick
162+
* @return \Tricks\Trick|null
163+
*/
164+
public function findPreviousTrick(Trick $trick);
149165
}

app/views/tricks/single.blade.php

+132-116
Original file line numberDiff line numberDiff line change
@@ -2,130 +2,146 @@
22
@section('description', $trick->pageDescription)
33

44
@section('scripts')
5-
<script src="{{ url('js/vendor/highlight.pack.1.js')}}"></script>
6-
<script type="text/javascript">
7-
(function($) {
8-
hljs.tabReplace = ' ';
9-
hljs.initHighlightingOnLoad();
10-
})(jQuery);
11-
</script>
12-
@if(Auth::check())
13-
<script>
14-
(function(e){e(".js-like-trick").click(function(t){t.preventDefault();var n=e(this).data("liked")=="0";var r={_token:"{{ csrf_token() }}"};e.post('{{ route("tricks.like", $trick->slug) }}',r,function(t){if(t!="error"){if(!n){e(".js-like-trick .fa").removeClass("text-primary");e(".js-like-trick").data("liked","0");e(".js-like-status").html("Like this?")}else{e(".js-like-trick .fa").addClass("text-primary");e(".js-like-trick").data("liked","1");e(".js-like-status").html("You like this")}e(".js-like-count").html(t+" likes")}})})})(jQuery)
5+
<script src="{{ url('js/vendor/highlight.pack.1.js')}}"></script>
6+
<script type="text/javascript">
7+
(function($) {
8+
hljs.tabReplace = ' ';
9+
hljs.initHighlightingOnLoad();
10+
})(jQuery);
1511
</script>
16-
@endif
12+
@if(Auth::check())
13+
<script>
14+
(function(e){e("[data-toggle=tooltip]").tooltip();e(".js-like-trick").click(function(t){t.preventDefault();var n=e(this).data("liked")=="0";var r={_token:"{{ csrf_token() }}"};e.post('{{ route("tricks.like", $trick->slug) }}',r,function(t){if(t!="error"){if(!n){e(".js-like-trick .fa").removeClass("text-primary");e(".js-like-trick").data("liked","0");e(".js-like-status").html("Like this?")}else{e(".js-like-trick .fa").addClass("text-primary");e(".js-like-trick").data("liked","1");e(".js-like-status").html("You like this")}e(".js-like-count").html(t+" likes")}})})})(jQuery)
15+
</script>
16+
@endif
1717
@stop
1818

1919
@section('content')
20-
<div class="container">
21-
<div class="row">
22-
<div class="col-lg-9 col-md-8">
23-
<div class="content-box">
24-
@if(Auth::check() && (Auth::user()->id == $trick->user_id))
25-
<div class="text-right">
26-
<a data-toggle="modal" href="#deleteModal">Delete</a> |
27-
<a href="{{$trick->editLink}}">Edit</a>
28-
@include('tricks.delete',['link'=>$trick->deleteLink])
29-
</div>
30-
@endif
31-
<div class="trick-user">
32-
<div class="trick-user-image">
33-
<img src="{{ $trick->user->photocss }}" class="user-avatar">
34-
</div>
35-
<div class="trick-user-data">
36-
<h1 class="page-title">
37-
{{ $trick->title }}
38-
</h1>
39-
<div>
40-
Submitted by <b><a href="{{ route('user.profile', $trick->user->username) }}">{{ $trick->user->username }}</a></b> - {{ $trick->timeago }}
41-
</div>
42-
</div>
43-
</div>
44-
<p>{{{ $trick->description }}}</p>
45-
<pre><code class="php">{{{ $trick->code }}}</code></pre>
46-
</div>
47-
</div>
48-
<div class="col-lg-3 col-md-4">
49-
<div class="content-box">
50-
<b>Stats</b>
51-
<ul class="list-group trick-stats">
52-
<a href="#" class="list-group-item js-like-trick" data-liked="{{ $trick->likedByUser(Auth::user()) ? '1' : '0'}}">
20+
<div class="container">
21+
<div class="row">
22+
<div class="col-lg-9 col-md-8">
23+
<div class="content-box">
24+
@if(Auth::check() && (Auth::user()->id == $trick->user_id))
25+
<div class="text-right">
26+
<a data-toggle="modal" href="#deleteModal">Delete</a> |
27+
<a href="{{$trick->editLink}}">Edit</a>
28+
@include('tricks.delete',['link'=>$trick->deleteLink])
29+
</div>
30+
@endif
31+
<div class="trick-user">
32+
<div class="trick-user-image">
33+
<img src="{{ $trick->user->photocss }}" class="user-avatar">
34+
</div>
35+
<div class="trick-user-data">
36+
<h1 class="page-title">
37+
{{ $trick->title }}
38+
</h1>
39+
<div>
40+
Submitted by <b><a href="{{ route('user.profile', $trick->user->username) }}">{{ $trick->user->username }}</a></b> - {{ $trick->timeago }}
41+
</div>
42+
</div>
43+
</div>
44+
<p>{{{ $trick->description }}}</p>
45+
<pre><code class="php">{{{ $trick->code }}}</code></pre>
46+
</div>
47+
</div>
48+
<div class="col-lg-3 col-md-4">
49+
<div class="content-box">
50+
<b>Stats</b>
51+
<ul class="list-group trick-stats">
52+
<a href="#" class="list-group-item js-like-trick" data-liked="{{ $trick->likedByUser(Auth::user()) ? '1' : '0'}}">
5353

54-
<span class="fa fa-heart @if($trick->likedByUser(Auth::user())) text-primary @endif"></span>
55-
@if(Auth::check())
56-
<span class="js-like-status">
57-
@if($trick->likedByUser(Auth::user()))
58-
You like this
59-
@else
60-
Like this?
61-
@endif
62-
</span>
63-
<span class="pull-right js-like-count">
64-
@endif
65-
{{ $trick->vote_cache }} {{ Str::plural('like', $trick->vote_cache) }}
66-
@if(Auth::check())</span>@endif
67-
</a>
68-
<li class="list-group-item">
69-
<span class="fa fa-eye"></span> {{ $trick->view_cache }} views
70-
</li>
71-
</ul>
72-
@if(count($trick->allCategories))
73-
<b>Categories</b>
74-
<ul class="nav nav-list">
75-
@foreach($trick->allCategories as $category)
76-
<li>
77-
<a href="{{ route('tricks.browse.category', $category->slug) }}">
78-
{{ $category->name }}
79-
</a>
80-
</li>
81-
@endforeach
82-
</ul>
83-
@endif
84-
@if(count($trick->tags))
85-
<b>Tags</b>
86-
<ul class="nav nav-list">
87-
@foreach($trick->tags as $tag)
88-
<li>
89-
<a href="{{ route('tricks.browse.tag', $tag->slug) }}">
90-
{{ $tag->name }}
91-
</a>
92-
</li>
93-
@endforeach
94-
</ul>
95-
@endif
96-
</div>
97-
</div>
54+
<span class="fa fa-heart @if($trick->likedByUser(Auth::user())) text-primary @endif"></span>
55+
@if(Auth::check())
56+
<span class="js-like-status">
57+
@if($trick->likedByUser(Auth::user()))
58+
You like this
59+
@else
60+
Like this?
61+
@endif
62+
</span>
63+
<span class="pull-right js-like-count">
64+
@endif
65+
{{ $trick->vote_cache }} {{ Str::plural('like', $trick->vote_cache) }}
66+
@if(Auth::check())</span>@endif
67+
</a>
68+
<li class="list-group-item">
69+
<span class="fa fa-eye"></span> {{ $trick->view_cache }} views
70+
</li>
71+
</ul>
72+
@if(count($trick->allCategories))
73+
<b>Categories</b>
74+
<ul class="nav nav-list push-down">
75+
@foreach($trick->allCategories as $category)
76+
<li>
77+
<a href="{{ route('tricks.browse.category', $category->slug) }}">
78+
{{ $category->name }}
79+
</a>
80+
</li>
81+
@endforeach
82+
</ul>
83+
@endif
84+
@if(count($trick->tags))
85+
<b>Tags</b>
86+
<ul class="nav nav-list push-down">
87+
@foreach($trick->tags as $tag)
88+
<li>
89+
<a href="{{ route('tricks.browse.tag', $tag->slug) }}">
90+
{{ $tag->name }}
91+
</a>
92+
</li>
93+
@endforeach
94+
</ul>
95+
@endif
96+
<div class="clearfix">
97+
@if($prev)
98+
<a href="{{ route('tricks.show', $prev->slug) }}"
99+
title="{{ $prev->title }}" data-toggle="tooltip"
100+
class="btn btn-sm btn-primary">
101+
&laquo; Previous Trick
102+
</a>
103+
@endif
98104

99-
</div>
100-
<div class="row">
101-
<div class="col-lg-9 col-md-8">
102-
<div id="disqus_thread"></div>
103-
<script type="text/javascript">
104-
var disqus_shortname = '{{ Config::get("config.disqus_shortname") }}';
105-
var disqus_identifier = '{{$trick->id}}';
105+
@if($next)
106+
<a href="{{ route('tricks.show', $next->slug) }}"
107+
title="{{ $next->title }}" data-toggle="tooltip"
108+
class="btn btn-sm btn-primary pull-right">
109+
Next Trick &raquo;
110+
</a>
111+
@endif
112+
</div>
113+
</div>
114+
</div>
115+
</div>
116+
<div class="row">
117+
<div class="col-lg-9 col-md-8">
118+
<div id="disqus_thread"></div>
119+
<script type="text/javascript">
120+
var disqus_shortname = '{{ Config::get("config.disqus_shortname") }}';
121+
var disqus_identifier = '{{$trick->id}}';
106122
107-
(function() {
108-
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
109-
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
110-
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
111-
})();
112-
</script>
113-
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
114-
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
115-
</div>
116-
</div>
123+
(function() {
124+
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
125+
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
126+
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
127+
})();
128+
</script>
129+
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
130+
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
131+
</div>
132+
</div>
117133

118134

119-
{{--<div class="row">
120-
<div class="col-lg-12">
121-
<h2 class="title-between">Related tricks</h2>
122-
</div>
123-
</div>
124-
<div class="row">
125-
@for($i = 0; $i < 3; $i++)
126-
@include('tricks.card', [ 'test' => $i ])
127-
@endfor
128-
</div>--}}
135+
{{--<div class="row">
136+
<div class="col-lg-12">
137+
<h2 class="title-between">Related tricks</h2>
138+
</div>
139+
</div>
140+
<div class="row">
141+
@for($i = 0; $i < 3; $i++)
142+
@include('tricks.card', [ 'test' => $i ])
143+
@endfor
144+
</div>--}}
129145

130-
</div>
146+
</div>
131147
@stop

0 commit comments

Comments
 (0)