]>
Commit | Line | Data |
---|---|---|
6cb364a2 TC |
1 | import { savePercent, retrievePercent } from '../../_global/js/tools'; |
2 | import { toggleSaveLinkForm } from './uiTools'; | |
3 | ||
c146f694 | 4 | const $ = global.jquery = require('jquery'); |
5ecdfcd0 | 5 | require('jquery.cookie'); |
8f234d01 | 6 | require('jquery-ui-browserify'); |
c146f694 | 7 | const annotator = require('annotator'); |
5ecdfcd0 TC |
8 | |
9 | ||
c146f694 TC |
10 | $.fn.ready(() => { |
11 | const $listmode = $('#listmode'); | |
12 | const $listentries = $('#list-entries'); | |
19f2f11e NL |
13 | |
14 | /* ========================================================================== | |
15 | Menu | |
16 | ========================================================================== */ | |
17 | ||
c146f694 | 18 | $('#menu').click(() => { |
0743287f | 19 | $('#links').toggleClass('menu--open'); |
c146f694 TC |
20 | const content = $('#content'); |
21 | if (content.hasClass('opacity03')) { | |
22 | content.removeClass('opacity03'); | |
19f2f11e NL |
23 | } |
24 | }); | |
25 | ||
26 | /* ========================================================================== | |
27 | List mode or Table Mode | |
28 | ========================================================================== */ | |
29 | ||
c146f694 TC |
30 | $listmode.click(() => { |
31 | if ($.cookie('listmode') === 1) { | |
19f2f11e | 32 | // Cookie |
0743287f | 33 | $.removeCookie('listmode'); |
19f2f11e | 34 | |
0743287f TC |
35 | $listentries.removeClass('listmode'); |
36 | $listmode.removeClass('tablemode'); | |
37 | $listmode.addClass('listmode'); | |
38 | } else { | |
19f2f11e | 39 | // Cookie |
c146f694 | 40 | $.cookie('listmode', 1, { expires: 365 }); |
19f2f11e | 41 | |
0743287f TC |
42 | $listentries.addClass('listmode'); |
43 | $listmode.removeClass('listmode'); | |
44 | $listmode.addClass('tablemode'); | |
19f2f11e | 45 | } |
19f2f11e NL |
46 | }); |
47 | ||
48 | /* ========================================================================== | |
49 | Cookie listmode | |
50 | ========================================================================== */ | |
51 | ||
c146f694 | 52 | if ($.cookie('listmode') === 1) { |
0743287f TC |
53 | $listentries.addClass('listmode'); |
54 | $listmode.removeClass('listmode'); | |
55 | $listmode.addClass('tablemode'); | |
19f2f11e NL |
56 | } |
57 | ||
56349e47 TC |
58 | /* ========================================================================== |
59 | Add tag panel | |
60 | ========================================================================== */ | |
61 | ||
62 | ||
c146f694 | 63 | $('#nav-btn-add-tag').on('click', () => { |
0743287f TC |
64 | $('.nav-panel-add-tag').toggle(100); |
65 | $('.nav-panel-menu').addClass('hidden'); | |
66 | $('#tag_label').focus(); | |
67 | return false; | |
68 | }); | |
56349e47 | 69 | |
c146f694 TC |
70 | /** |
71 | * Filters & Export | |
72 | */ | |
73 | // no display if filters not available | |
74 | if ($('div').is('#filters')) { | |
75 | $('#button_filters').show(); | |
76 | $('#clear_form_filters').on('click', () => { | |
77 | $('#filters input').val(''); | |
78 | $('#filters :checked').removeAttr('checked'); | |
79 | return false; | |
80 | }); | |
81 | } | |
82 | ||
5ecdfcd0 TC |
83 | /* ========================================================================== |
84 | Annotations & Remember position | |
85 | ========================================================================== */ | |
86 | ||
c146f694 TC |
87 | if ($('article').length) { |
88 | const app = new annotator.App(); | |
89 | ||
90 | app.include(annotator.ui.main, { | |
91 | element: document.querySelector('article'), | |
92 | }); | |
5ecdfcd0 | 93 | |
c146f694 TC |
94 | const x = JSON.parse($('#annotationroutes').html()); |
95 | app.include(annotator.storage.http, x); | |
5ecdfcd0 | 96 | |
c146f694 TC |
97 | app.start().then(() => { |
98 | app.annotations.load({ entry: x.entryId }); | |
99 | }); | |
5ecdfcd0 | 100 | |
c146f694 TC |
101 | $(window).scroll(() => { |
102 | const scrollTop = $(window).scrollTop(); | |
103 | const docHeight = $(document).height(); | |
104 | const scrollPercent = (scrollTop) / (docHeight); | |
105 | const scrollPercentRounded = Math.round(scrollPercent * 100) / 100; | |
106 | savePercent(x.entryId, scrollPercentRounded); | |
107 | }); | |
5ecdfcd0 | 108 | |
c146f694 | 109 | retrievePercent(x.entryId); |
5ecdfcd0 | 110 | |
c146f694 | 111 | $(window).resize(() => { |
0743287f | 112 | retrievePercent(x.entryId); |
c146f694 TC |
113 | }); |
114 | } | |
115 | ||
116 | /** | |
117 | * Close window after adding entry if popup | |
118 | */ | |
119 | const currentUrl = window.location.href; | |
120 | if (currentUrl.match('&closewin=true')) { | |
121 | window.close(); | |
122 | } | |
123 | ||
124 | /** | |
125 | * Tags autocomplete | |
126 | */ | |
8f234d01 TC |
127 | /** |
128 | * Not working on v2 | |
129 | * | |
130 | ||
c146f694 TC |
131 | $('#value').bind('keydown', (event) => { |
132 | if (event.keyCode === $.ui.keyCode.TAB && $(this).data('ui-autocomplete').menu.active) { | |
133 | event.preventDefault(); | |
134 | } | |
135 | }).autocomplete({ | |
136 | source: function source(request, response) { | |
137 | $.getJSON('./?view=tags', { | |
138 | term: extractLast(request.term), | |
139 | //id: $(':hidden#entry_id').val() | |
140 | }, response); | |
141 | }, | |
142 | search: function search() { | |
143 | // custom minLength | |
144 | const term = extractLast(this.value); | |
145 | return term.length >= 1; | |
146 | }, | |
147 | focus: function focus() { | |
148 | // prevent value inserted on focus | |
149 | return false; | |
150 | }, | |
151 | select: function select(event, ui) { | |
152 | const terms = split(this.value); | |
153 | // remove the current input | |
154 | terms.pop(); | |
155 | // add the selected item | |
156 | terms.push(ui.item.value); | |
157 | // add placeholder to get the comma-and-space at the end | |
158 | terms.push(''); | |
159 | this.value = terms.join(', '); | |
160 | return false; | |
161 | }, | |
162 | }); | |
8f234d01 | 163 | */ |
c146f694 TC |
164 | |
165 | //--------------------------------------------------------------------------- | |
166 | // Close the message box when the user clicks the close icon | |
167 | //--------------------------------------------------------------------------- | |
168 | $('a.closeMessage').on('click', () => { | |
169 | $(this).parents('div.messages').slideUp(300, () => { $(this).remove(); }); | |
170 | return false; | |
171 | }); | |
172 | ||
173 | $('#search-form').hide(); | |
174 | $('#bagit-form').hide(); | |
175 | $('#filters').hide(); | |
176 | $('#download-form').hide(); | |
5ecdfcd0 | 177 | |
c146f694 TC |
178 | //--------------------------------------------------------------------------- |
179 | // Toggle the 'Search' popup in the sidebar | |
180 | //--------------------------------------------------------------------------- | |
181 | function toggleSearch() { | |
182 | $('#search-form').toggle(); | |
183 | $('#search').toggleClass('current'); | |
184 | $('#search').toggleClass('active-current'); | |
185 | $('#search-arrow').toggleClass('arrow-down'); | |
186 | if ($('#search').hasClass('current')) { | |
187 | $('#content').addClass('opacity03'); | |
188 | } else { | |
189 | $('#content').removeClass('opacity03'); | |
190 | } | |
191 | } | |
192 | ||
193 | //--------------------------------------------------------------------------- | |
194 | // Toggle the 'Filter' popup on entries list | |
195 | //--------------------------------------------------------------------------- | |
196 | function toggleFilter() { | |
197 | $('#filters').toggle(); | |
198 | } | |
199 | ||
200 | //--------------------------------------------------------------------------- | |
201 | // Toggle the 'Download' popup on entries list | |
202 | //--------------------------------------------------------------------------- | |
203 | function toggleDownload() { | |
204 | $('#download-form').toggle(); | |
205 | } | |
206 | ||
207 | //--------------------------------------------------------------------------- | |
208 | // Toggle the 'Save a Link' popup in the sidebar | |
209 | //--------------------------------------------------------------------------- | |
210 | function toggleBagit() { | |
211 | $('#bagit-form').toggle(); | |
212 | $('#bagit').toggleClass('current'); | |
213 | $('#bagit').toggleClass('active-current'); | |
214 | $('#bagit-arrow').toggleClass('arrow-down'); | |
215 | if ($('#bagit').hasClass('current')) { | |
216 | $('#content').addClass('opacity03'); | |
217 | } else { | |
218 | $('#content').removeClass('opacity03'); | |
5ecdfcd0 | 219 | } |
c146f694 TC |
220 | } |
221 | ||
222 | //--------------------------------------------------------------------------- | |
223 | // Close all #links popups in the sidebar | |
224 | //--------------------------------------------------------------------------- | |
225 | function closePopups() { | |
226 | $('#links .messages').hide(); | |
227 | $('#links > li > a').removeClass('active-current'); | |
228 | $('#links > li > a').removeClass('current'); | |
229 | $('[id$=-arrow]').removeClass('arrow-down'); | |
230 | $('#content').removeClass('opacity03'); | |
231 | } | |
232 | ||
233 | $('#search').click(() => { | |
234 | closePopups(); | |
235 | toggleSearch(); | |
236 | $('#searchfield').focus(); | |
237 | }); | |
238 | ||
239 | $('.filter-btn').click(() => { | |
240 | closePopups(); | |
241 | toggleFilter(); | |
242 | }); | |
243 | ||
244 | $('.download-btn').click(() => { | |
245 | closePopups(); | |
246 | toggleDownload(); | |
247 | }); | |
248 | ||
249 | $('#bagit').click(() => { | |
250 | closePopups(); | |
251 | toggleBagit(); | |
252 | $('#plainurl').focus(); | |
253 | }); | |
254 | ||
255 | $('#search-form-close').click(() => { | |
256 | toggleSearch(); | |
257 | }); | |
258 | ||
259 | $('#filter-form-close').click(() => { | |
260 | toggleFilter(); | |
261 | }); | |
262 | ||
263 | $('#download-form-close').click(() => { | |
264 | toggleDownload(); | |
265 | }); | |
266 | ||
267 | $('#bagit-form-close').click(() => { | |
268 | toggleBagit(); | |
269 | }); | |
270 | ||
271 | const $bagitFormForm = $('#bagit-form-form'); | |
272 | ||
273 | /* ========================================================================== | |
274 | bag it link and close button | |
275 | ========================================================================== */ | |
276 | ||
277 | // send 'bag it link' form request via ajax | |
278 | $bagitFormForm.submit((event) => { | |
279 | $('body').css('cursor', 'wait'); | |
280 | $('#add-link-result').empty(); | |
281 | ||
282 | $.ajax({ | |
283 | type: $bagitFormForm.attr('method'), | |
284 | url: $bagitFormForm.attr('action'), | |
285 | data: $bagitFormForm.serialize(), | |
286 | success: function success() { | |
287 | $('#add-link-result').html('Done!'); | |
288 | $('#plainurl').val(''); | |
289 | $('#plainurl').blur(''); | |
290 | $('body').css('cursor', 'auto'); | |
291 | }, | |
292 | error: function error() { | |
293 | $('#add-link-result').html('Failed!'); | |
294 | $('body').css('cursor', 'auto'); | |
295 | }, | |
296 | }); | |
297 | ||
298 | event.preventDefault(); | |
299 | }); | |
300 | ||
301 | /* ========================================================================== | |
302 | Process all links inside an article | |
303 | ========================================================================== */ | |
304 | ||
305 | $('article a[href^="http"]').after( | |
306 | () => `<a href="${$(this).attr('href')}" class="add-to-wallabag-link-after" ` + | |
307 | 'alt="add to wallabag" title="add to wallabag"></a>' | |
308 | ); | |
309 | ||
310 | $('.add-to-wallabag-link-after').click((event) => { | |
311 | toggleSaveLinkForm($(this).attr('href'), event); | |
312 | event.preventDefault(); | |
313 | }); | |
19f2f11e | 314 | }); |