Зуев Егор / wiki.dev

Go to a project
Toggle navigation
Toggle navigation pinning
Dan Brown
787ad20c 1 parent 46217a58

Added link functionality

Inline Side-by-side
Showing 10 changed files with 84 additions and 19 deletions
...@@ -126,6 +126,12 @@ class PageController extends Controller ...@@ -126,6 +126,12 @@ class PageController extends Controller
126 return redirect($page->getUrl()); 126 return redirect($page->getUrl());
127 } 127 }
128 128
129 + public function redirectFromLink($pageId)
130 + {
131 + $page = $this->pageRepo->getById($pageId);
132 + return redirect($page->getUrl());
133 + }
134 +
129 /** 135 /**
130 * Remove the specified resource from storage. 136 * Remove the specified resource from storage.
131 * 137 *
......
...@@ -35,6 +35,8 @@ Route::get('/images/all', 'ImageController@getAll'); ...@@ -35,6 +35,8 @@ Route::get('/images/all', 'ImageController@getAll');
35 Route::get('/images/all/{page}', 'ImageController@getAll'); 35 Route::get('/images/all/{page}', 'ImageController@getAll');
36 Route::get('/images/{any}', 'ImageController@getImage')->where('any', '.*'); 36 Route::get('/images/{any}', 'ImageController@getImage')->where('any', '.*');
37 37
38 +Route::get('/link/{id}', 'PageController@redirectFromLink');
39 +
38 Route::get('/', function () { 40 Route::get('/', function () {
39 return view('base'); 41 return view('base');
40 }); 42 });
......
...@@ -29,6 +29,8 @@ h4 { ...@@ -29,6 +29,8 @@ h4 {
29 29
30 h1, h2, h3, h4 { 30 h1, h2, h3, h4 {
31 font-weight: 500; 31 font-weight: 500;
32 + position: relative;
33 + display: block;
32 .subheader { 34 .subheader {
33 display: block; 35 display: block;
34 font-size: 0.5em; 36 font-size: 0.5em;
......
...@@ -116,6 +116,8 @@ header .menu { ...@@ -116,6 +116,8 @@ header .menu {
116 } 116 }
117 } 117 }
118 118
119 +
120 +
119 .overlay { 121 .overlay {
120 background-color: rgba(0, 0, 0, 0.2); 122 background-color: rgba(0, 0, 0, 0.2);
121 position: fixed; 123 position: fixed;
...@@ -180,4 +182,21 @@ header .menu { ...@@ -180,4 +182,21 @@ header .menu {
180 padding-top: $-xl*1.2; 182 padding-top: $-xl*1.2;
181 color: #666; 183 color: #666;
182 border-top: 2px solid $primary; 184 border-top: 2px solid $primary;
185 +}
186 +
187 +// Link hooks & popovers
188 +a.link-hook {
189 + position: absolute;
190 + display: inline-block;
191 + top: $-xs;
192 + left: -$-xl+2px;
193 + font-size: 20px;
194 + line-height: 20px;
195 + color: #BBB;
196 + opacity: 0;
197 +}
198 +h1, h2, h3, h4, h5, h6 {
199 + &:hover a.link-hook {
200 + opacity: 1;
201 + }
183 } 202 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
10 <script src="/bower/bootstrap/dist/js/bootstrap.js"></script> 10 <script src="/bower/bootstrap/dist/js/bootstrap.js"></script>
11 <script> 11 <script>
12 $.fn.smoothScrollTo = function() { 12 $.fn.smoothScrollTo = function() {
13 + if(this.length === 0) return;
13 $('body').animate({ 14 $('body').animate({
14 scrollTop: this.offset().top - 60 // Adjust to change final scroll position top margin 15 scrollTop: this.offset().top - 60 // Adjust to change final scroll position top margin
15 }, 800); // Adjust to change animations speed (ms) 16 }, 800); // Adjust to change animations speed (ms)
...@@ -35,5 +36,6 @@ ...@@ -35,5 +36,6 @@
35 @yield('content') 36 @yield('content')
36 </section> 37 </section>
37 38
39 +@yield('bottom')
38 </body> 40 </body>
39 </html> 41 </html>
......
...@@ -16,4 +16,8 @@ ...@@ -16,4 +16,8 @@
16 $('#html').editable({inlineMode: false}); 16 $('#html').editable({inlineMode: false});
17 }); 17 });
18 </script> 18 </script>
19 +@stop
20 +
21 +@section('bottom')
22 + @include('pages/image-manager')
19 @stop 23 @stop
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -15,4 +15,8 @@ ...@@ -15,4 +15,8 @@
15 </form> 15 </form>
16 </div> 16 </div>
17 17
18 +@stop
19 +
20 +@section('bottom')
21 + @include('pages/image-manager')
18 @stop 22 @stop
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -18,25 +18,7 @@ ...@@ -18,25 +18,7 @@
18 18
19 19
20 20
21 -<section class="overlay" style="display:none;">
22 - <div id="image-manager">
23 - <div class="image-manager-left">
24 - <div class="image-manager-header">
25 - <button type="button" class="button neg float right" data-action="close">Close</button>
26 - <div class="image-manager-title">Image Library</div>
27 - </div>
28 - <div class="image-manager-display">
29 - </div>
30 - <form action="/upload/image" class="image-manager-dropzone">
31 - {{ csrf_field() }}
32 - Drag images or click here to upload
33 - </form>
34 - </div>
35 - {{--<div class="sidebar">--}}
36 21
37 - {{--</div>--}}
38 - </div>
39 -</section>
40 22
41 <script> 23 <script>
42 $(function() { 24 $(function() {
...@@ -49,7 +31,7 @@ ...@@ -49,7 +31,7 @@
49 relative_urls: false, 31 relative_urls: false,
50 height: 600, 32 height: 600,
51 plugins: "image table textcolor paste link imagetools", 33 plugins: "image table textcolor paste link imagetools",
52 - toolbar: "undo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | table | fontsizeselect full", 34 + toolbar: "undo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | table image link | fontsizeselect full",
53 content_style: "body {padding-left: 15px !important; padding-right: 15px !important; margin:0!important}", 35 content_style: "body {padding-left: 15px !important; padding-right: 15px !important; margin:0!important}",
54 file_browser_callback: function(field_name, url, type, win) { 36 file_browser_callback: function(field_name, url, type, win) {
55 ImageManager.show('#image-manager', function(image) { 37 ImageManager.show('#image-manager', function(image) {
......
1 +<section class="overlay" style="display:none;">
2 + <div id="image-manager">
3 + <div class="image-manager-left">
4 + <div class="image-manager-header">
5 + <button type="button" class="button neg float right" data-action="close">Close</button>
6 + <div class="image-manager-title">Image Library</div>
7 + </div>
8 + <div class="image-manager-display">
9 + </div>
10 + <form action="/upload/image" class="image-manager-dropzone">
11 + {{ csrf_field() }}
12 + Drag images or click here to upload
13 + </form>
14 + </div>
15 + {{--<div class="sidebar">--}}
16 +
17 + {{--</div>--}}
18 + </div>
19 +</section>
...\ No newline at end of file ...\ No newline at end of file
...@@ -50,6 +50,31 @@ ...@@ -50,6 +50,31 @@
50 header.smoothScrollTo(); 50 header.smoothScrollTo();
51 }) 51 })
52 }); 52 });
53 +
54 + // Set up link hooks
55 + var pageId = {{$page->id}};
56 + headers.each(function() {
57 + var text = $(this).text().trim();
58 + var link = '/link/' + pageId + '#' + encodeURIComponent(text);
59 + var linkHook = $('<a class="link-hook"><i class="fa fa-link"></i></a>')
60 + .attr({"data-content": link, href: link, target: '_blank'});
61 + linkHook.click(function(e) {
62 + e.preventDefault();
63 + goToText(text);
64 + });
65 + $(this).append(linkHook);
66 + });
67 +
68 + function goToText(text) {
69 + $('.page-content').find(':contains("'+text+'")').smoothScrollTo();
70 + }
71 +
72 + if(window.location.hash) {
73 + var text = window.location.hash.replace(/\%20/g, ' ').substr(1);
74 + goToText(text);
75 + }
76 +
77 + //$('[data-toggle="popover"]').popover()
53 }); 78 });
54 </script> 79 </script>
55 @stop 80 @stop
......