X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=app%2FResources%2Fstatic%2Fthemes%2Fbaggy%2Fjs%2Finit.js;h=c6a54f6fa696fc75c858d8a4ee327a3455aa89fa;hb=c146f6940a176142084b4fc3c610d13aca60d90e;hp=d7d4b166155daf3a4a2c43fb79150ee30949d343;hpb=55345331c47ca6f389e38a842584c3062476601d;p=github%2Fwallabag%2Fwallabag.git diff --git a/app/Resources/static/themes/baggy/js/init.js b/app/Resources/static/themes/baggy/js/init.js index d7d4b166..c6a54f6f 100755 --- a/app/Resources/static/themes/baggy/js/init.js +++ b/app/Resources/static/themes/baggy/js/init.js @@ -1,21 +1,25 @@ -var $ = global.jquery = require('jquery'); +const $ = global.jquery = require('jquery'); require('jquery.cookie'); require('jquery-ui'); -var annotator = require('annotator'); +const annotator = require('annotator'); +import { savePercent, retrievePercent } from '../../_global/js/tools.js'; +import { split, extractLast } from './autoCompleteTags.js'; +import { toggleSaveLinkForm } from './uiTools.js'; -$.fn.ready(function () { - var $listmode = $('#listmode'); - var $listentries = $('#list-entries'); +$.fn.ready(() => { + const $listmode = $('#listmode'); + const $listentries = $('#list-entries'); /* ========================================================================== Menu ========================================================================== */ - $('#menu').click(function () { + $('#menu').click(() => { $('#links').toggleClass('menu--open'); - if ($('#content').hasClass('opacity03')) { - $('#content').removeClass('opacity03'); + const content = $('#content'); + if (content.hasClass('opacity03')) { + content.removeClass('opacity03'); } }); @@ -23,8 +27,8 @@ $.fn.ready(function () { List mode or Table Mode ========================================================================== */ - $listmode.click(function () { - if (jquery.cookie('listmode') === 1) { + $listmode.click(() => { + if ($.cookie('listmode') === 1) { // Cookie $.removeCookie('listmode'); @@ -33,7 +37,7 @@ $.fn.ready(function () { $listmode.addClass('listmode'); } else { // Cookie - jquery.cookie('listmode', 1, { expires: 365 }); + $.cookie('listmode', 1, { expires: 365 }); $listentries.addClass('listmode'); $listmode.removeClass('listmode'); @@ -45,7 +49,7 @@ $.fn.ready(function () { Cookie listmode ========================================================================== */ - if (jquery.cookie('listmode') === 1) { + if ($.cookie('listmode') === 1) { $listentries.addClass('listmode'); $listmode.removeClass('listmode'); $listmode.addClass('tablemode'); @@ -56,43 +60,250 @@ $.fn.ready(function () { ========================================================================== */ - $('#nav-btn-add-tag').on('click', function () { + $('#nav-btn-add-tag').on('click', () => { $('.nav-panel-add-tag').toggle(100); $('.nav-panel-menu').addClass('hidden'); $('#tag_label').focus(); return false; }); + /** + * Filters & Export + */ + // no display if filters not available + if ($('div').is('#filters')) { + $('#button_filters').show(); + $('#clear_form_filters').on('click', () => { + $('#filters input').val(''); + $('#filters :checked').removeAttr('checked'); + return false; + }); + } + /* ========================================================================== Annotations & Remember position ========================================================================== */ - if ($('article').length) { - var app = new annotator.App(); + if ($('article').length) { + const app = new annotator.App(); + + app.include(annotator.ui.main, { + element: document.querySelector('article'), + }); - app.include(annotator.ui.main, { - element: document.querySelector('article'), - }); + const x = JSON.parse($('#annotationroutes').html()); + app.include(annotator.storage.http, x); - var x = JSON.parse($('#annotationroutes').html()); - app.include(annotator.storage.http, x); + app.start().then(() => { + app.annotations.load({ entry: x.entryId }); + }); - app.start().then(function () { - app.annotations.load({ entry: x.entryId }); - }); + $(window).scroll(() => { + const scrollTop = $(window).scrollTop(); + const docHeight = $(document).height(); + const scrollPercent = (scrollTop) / (docHeight); + const scrollPercentRounded = Math.round(scrollPercent * 100) / 100; + savePercent(x.entryId, scrollPercentRounded); + }); - $(window).scroll(function (e) { - var scrollTop = $(window).scrollTop(); - var docHeight = $(document).height(); - var scrollPercent = (scrollTop) / (docHeight); - var scrollPercentRounded = Math.round(scrollPercent * 100) / 100; - savePercent(x.entryId, scrollPercentRounded); - }); + retrievePercent(x.entryId); + $(window).resize(() => { retrievePercent(x.entryId); + }); + } + + /** + * Close window after adding entry if popup + */ + const currentUrl = window.location.href; + if (currentUrl.match('&closewin=true')) { + window.close(); + } + + /** + * Tags autocomplete + */ + $('#value').bind('keydown', (event) => { + if (event.keyCode === $.ui.keyCode.TAB && $(this).data('ui-autocomplete').menu.active) { + event.preventDefault(); + } + }).autocomplete({ + source: function source(request, response) { + $.getJSON('./?view=tags', { + term: extractLast(request.term), + //id: $(':hidden#entry_id').val() + }, response); + }, + search: function search() { + // custom minLength + const term = extractLast(this.value); + return term.length >= 1; + }, + focus: function focus() { + // prevent value inserted on focus + return false; + }, + select: function select(event, ui) { + const terms = split(this.value); + // remove the current input + terms.pop(); + // add the selected item + terms.push(ui.item.value); + // add placeholder to get the comma-and-space at the end + terms.push(''); + this.value = terms.join(', '); + return false; + }, + }); + + //--------------------------------------------------------------------------- + // Close the message box when the user clicks the close icon + //--------------------------------------------------------------------------- + $('a.closeMessage').on('click', () => { + $(this).parents('div.messages').slideUp(300, () => { $(this).remove(); }); + return false; + }); + + $('#search-form').hide(); + $('#bagit-form').hide(); + $('#filters').hide(); + $('#download-form').hide(); - $(window).resize(function () { - retrievePercent(x.entryId); - }); + //--------------------------------------------------------------------------- + // Toggle the 'Search' popup in the sidebar + //--------------------------------------------------------------------------- + function toggleSearch() { + $('#search-form').toggle(); + $('#search').toggleClass('current'); + $('#search').toggleClass('active-current'); + $('#search-arrow').toggleClass('arrow-down'); + if ($('#search').hasClass('current')) { + $('#content').addClass('opacity03'); + } else { + $('#content').removeClass('opacity03'); + } + } + + //--------------------------------------------------------------------------- + // Toggle the 'Filter' popup on entries list + //--------------------------------------------------------------------------- + function toggleFilter() { + $('#filters').toggle(); + } + + //--------------------------------------------------------------------------- + // Toggle the 'Download' popup on entries list + //--------------------------------------------------------------------------- + function toggleDownload() { + $('#download-form').toggle(); + } + + //--------------------------------------------------------------------------- + // Toggle the 'Save a Link' popup in the sidebar + //--------------------------------------------------------------------------- + function toggleBagit() { + $('#bagit-form').toggle(); + $('#bagit').toggleClass('current'); + $('#bagit').toggleClass('active-current'); + $('#bagit-arrow').toggleClass('arrow-down'); + if ($('#bagit').hasClass('current')) { + $('#content').addClass('opacity03'); + } else { + $('#content').removeClass('opacity03'); } + } + + //--------------------------------------------------------------------------- + // Close all #links popups in the sidebar + //--------------------------------------------------------------------------- + function closePopups() { + $('#links .messages').hide(); + $('#links > li > a').removeClass('active-current'); + $('#links > li > a').removeClass('current'); + $('[id$=-arrow]').removeClass('arrow-down'); + $('#content').removeClass('opacity03'); + } + + $('#search').click(() => { + closePopups(); + toggleSearch(); + $('#searchfield').focus(); + }); + + $('.filter-btn').click(() => { + closePopups(); + toggleFilter(); + }); + + $('.download-btn').click(() => { + closePopups(); + toggleDownload(); + }); + + $('#bagit').click(() => { + closePopups(); + toggleBagit(); + $('#plainurl').focus(); + }); + + $('#search-form-close').click(() => { + toggleSearch(); + }); + + $('#filter-form-close').click(() => { + toggleFilter(); + }); + + $('#download-form-close').click(() => { + toggleDownload(); + }); + + $('#bagit-form-close').click(() => { + toggleBagit(); + }); + + const $bagitFormForm = $('#bagit-form-form'); + + /* ========================================================================== + bag it link and close button + ========================================================================== */ + + // send 'bag it link' form request via ajax + $bagitFormForm.submit((event) => { + $('body').css('cursor', 'wait'); + $('#add-link-result').empty(); + + $.ajax({ + type: $bagitFormForm.attr('method'), + url: $bagitFormForm.attr('action'), + data: $bagitFormForm.serialize(), + success: function success() { + $('#add-link-result').html('Done!'); + $('#plainurl').val(''); + $('#plainurl').blur(''); + $('body').css('cursor', 'auto'); + }, + error: function error() { + $('#add-link-result').html('Failed!'); + $('body').css('cursor', 'auto'); + }, + }); + + event.preventDefault(); + }); + + /* ========================================================================== + Process all links inside an article + ========================================================================== */ + + $('article a[href^="http"]').after( + () => `' + ); + + $('.add-to-wallabag-link-after').click((event) => { + toggleSaveLinkForm($(this).attr('href'), event); + event.preventDefault(); + }); });