]>
git.immae.eu Git - github/wallabag/wallabag.git/blob - app/Resources/static/themes/baggy/js/init.js
1 import $ from 'jquery';
3 /* eslint-disable no-unused-vars */
4 /* jquery has default scope */
5 import cookie
from 'jquery.cookie';
6 import ui
from 'jquery-ui-browserify';
7 /* eslint-enable no-unused-vars */
9 import annotator
from 'annotator';
11 import { savePercent
, retrievePercent
} from '../../_global/js/tools';
12 import toggleSaveLinkForm
from './uiTools';
17 const $listmode
= $('#listmode');
18 const $listentries
= $('#list-entries');
20 /* ==========================================================================
22 ========================================================================== */
24 $('#menu').click(() => {
25 $('#links').toggleClass('menu--open');
26 const content
= $('#content');
27 if (content
.hasClass('opacity03')) {
28 content
.removeClass('opacity03');
32 /* ==========================================================================
33 List mode or Table Mode
34 ========================================================================== */
36 $listmode
.click(() => {
37 if ($.cookie('listmode') === 1) {
39 $.removeCookie('listmode');
41 $listentries
.removeClass('listmode');
42 $listmode
.removeClass('tablemode');
43 $listmode
.addClass('listmode');
46 $.cookie('listmode', 1, { expires: 365 });
48 $listentries
.addClass('listmode');
49 $listmode
.removeClass('listmode');
50 $listmode
.addClass('tablemode');
54 /* ==========================================================================
56 ========================================================================== */
58 if ($.cookie('listmode') === 1) {
59 $listentries
.addClass('listmode');
60 $listmode
.removeClass('listmode');
61 $listmode
.addClass('tablemode');
64 /* ==========================================================================
66 ========================================================================== */
69 $('#nav-btn-add-tag').on('click', () => {
70 $('.nav-panel-add-tag').toggle(100);
71 $('.nav-panel-menu').addClass('hidden');
72 $('#tag_label').focus();
79 // no display if filters not available
80 if ($('div').is('#filters')) {
81 $('#button_filters').show();
82 $('#clear_form_filters').on('click', () => {
83 $('#filters input').val('');
84 $('#filters :checked').removeAttr('checked');
89 /* ==========================================================================
90 Annotations & Remember position
91 ========================================================================== */
93 if ($('article').length
) {
94 const app
= new annotator
.App();
96 app
.include(annotator
.ui
.main
, {
97 element: document
.querySelector('article'),
100 const x
= JSON
.parse($('#annotationroutes').html());
101 app
.include(annotator
.storage
.http
, x
);
103 app
.start().then(() => {
104 app
.annotations
.load({ entry: x
.entryId
});
107 $(window
).scroll(() => {
108 const scrollTop
= $(window
).scrollTop();
109 const docHeight
= $(document
).height();
110 const scrollPercent
= (scrollTop
) / (docHeight
);
111 const scrollPercentRounded
= Math
.round(scrollPercent
* 100) / 100;
112 savePercent(x
.entryId
, scrollPercentRounded
);
115 retrievePercent(x
.entryId
);
117 $(window
).resize(() => {
118 retrievePercent(x
.entryId
);
123 * Close window after adding entry if popup
125 const currentUrl
= window
.location
.href
;
126 if (currentUrl
.match('&closewin=true')) {
137 $('#value').bind('keydown', (event) => {
138 if (event.keyCode === $.ui.keyCode.TAB && $(this).data('ui-autocomplete').menu.active) {
139 event.preventDefault();
142 source: function source(request, response) {
143 $.getJSON('./?view=tags', {
144 term: extractLast(request.term),
145 //id: $(':hidden#entry_id').val()
148 search: function search() {
150 const term = extractLast(this.value);
151 return term.length >= 1;
153 focus: function focus() {
154 // prevent value inserted on focus
157 select: function select(event, ui) {
158 const terms = split(this.value);
159 // remove the current input
161 // add the selected item
162 terms.push(ui.item.value);
163 // add placeholder to get the comma-and-space at the end
165 this.value = terms.join(', ');
171 //---------------------------------------------------------------------------
172 // Close the message box when the user clicks the close icon
173 //---------------------------------------------------------------------------
174 $('a.closeMessage').on('click', () => {
175 $(this).parents('div.messages').slideUp(300, () => { $(this).remove(); });
179 $('#search-form').hide();
180 $('#bagit-form').hide();
181 $('#filters').hide();
182 $('#download-form').hide();
184 //---------------------------------------------------------------------------
185 // Toggle the 'Search' popup in the sidebar
186 //---------------------------------------------------------------------------
187 function toggleSearch() {
188 $('#search-form').toggle();
189 $('#search').toggleClass('current');
190 $('#search').toggleClass('active-current');
191 $('#search-arrow').toggleClass('arrow-down');
192 if ($('#search').hasClass('current')) {
193 $('#content').addClass('opacity03');
195 $('#content').removeClass('opacity03');
199 //---------------------------------------------------------------------------
200 // Toggle the 'Filter' popup on entries list
201 //---------------------------------------------------------------------------
202 function toggleFilter() {
203 $('#filters').toggle();
206 //---------------------------------------------------------------------------
207 // Toggle the 'Download' popup on entries list
208 //---------------------------------------------------------------------------
209 function toggleDownload() {
210 $('#download-form').toggle();
213 //---------------------------------------------------------------------------
214 // Toggle the 'Save a Link' popup in the sidebar
215 //---------------------------------------------------------------------------
216 function toggleBagit() {
217 $('#bagit-form').toggle();
218 $('#bagit').toggleClass('current');
219 $('#bagit').toggleClass('active-current');
220 $('#bagit-arrow').toggleClass('arrow-down');
221 if ($('#bagit').hasClass('current')) {
222 $('#content').addClass('opacity03');
224 $('#content').removeClass('opacity03');
228 //---------------------------------------------------------------------------
229 // Close all #links popups in the sidebar
230 //---------------------------------------------------------------------------
231 function closePopups() {
232 $('#links .messages').hide();
233 $('#links > li > a').removeClass('active-current');
234 $('#links > li > a').removeClass('current');
235 $('[id$=-arrow]').removeClass('arrow-down');
236 $('#content').removeClass('opacity03');
239 $('#search').click(() => {
242 $('#searchfield').focus();
245 $('.filter-btn').click(() => {
250 $('.download-btn').click(() => {
255 $('#bagit').click(() => {
258 $('#plainurl').focus();
261 $('#search-form-close').click(() => {
265 $('#filter-form-close').click(() => {
269 $('#download-form-close').click(() => {
273 $('#bagit-form-close').click(() => {
277 const $bagitFormForm
= $('#bagit-form-form');
279 /* ==========================================================================
280 bag it link and close button
281 ========================================================================== */
283 // send 'bag it link' form request via ajax
284 $bagitFormForm
.submit((event
) => {
285 $('body').css('cursor', 'wait');
286 $('#add-link-result').empty();
289 type: $bagitFormForm
.attr('method'),
290 url: $bagitFormForm
.attr('action'),
291 data: $bagitFormForm
.serialize(),
292 success: function success() {
293 $('#add-link-result').html('Done!');
294 $('#plainurl').val('');
295 $('#plainurl').blur('');
296 $('body').css('cursor', 'auto');
298 error: function error() {
299 $('#add-link-result').html('Failed!');
300 $('body').css('cursor', 'auto');
304 event
.preventDefault();
307 /* ==========================================================================
308 Process all links inside an article
309 ========================================================================== */
311 $('article a[href^="http"]').after(
312 () => `<a href="${$(this).attr('href')}" class="add-to-wallabag-link-after" ` +
313 'alt="add to wallabag" title="add to wallabag"></a>'
316 $('.add-to-wallabag-link-after').click((event
) => {
317 toggleSaveLinkForm($(this).attr('href'), event
);
318 event
.preventDefault();