]> git.immae.eu Git - github/wallabag/wallabag.git/blobdiff - app/Resources/static/themes/baggy/js/init.js
Assets work
[github/wallabag/wallabag.git] / app / Resources / static / themes / baggy / js / init.js
index 1721ae41ab392ffc1bd64827586733a904f64479..c6a54f6fa696fc75c858d8a4ee327a3455aa89fa 100755 (executable)
@@ -1,22 +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'),
-      $listentries = $("#list-entries");
+$.fn.ready(() => {
+  const $listmode = $('#listmode');
+  const $listentries = $('#list-entries');
 
   /* ==========================================================================
      Menu
      ========================================================================== */
 
-  $("#menu").click(function(){
-    $("#links").toggleClass('menu--open');
-    if ($('#content').hasClass('opacity03')) {
-        $('#content').removeClass('opacity03');
+  $('#menu').click(() => {
+    $('#links').toggleClass('menu--open');
+    const content = $('#content');
+    if (content.hasClass('opacity03')) {
+      content.removeClass('opacity03');
     }
   });
 
@@ -24,34 +27,32 @@ $.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");
+      $.removeCookie('listmode');
 
-      $listentries.removeClass("listmode");
-      $listmode.removeClass("tablemode");
-      $listmode.addClass("listmode");
-    }
-    else {
+      $listentries.removeClass('listmode');
+      $listmode.removeClass('tablemode');
+      $listmode.addClass('listmode');
+    } else {
       // Cookie
-      jquery.cookie("listmode", 1, {expires: 365});
+      $.cookie('listmode', 1, { expires: 365 });
 
-      $listentries.addClass("listmode");
-      $listmode.removeClass("listmode");
-      $listmode.addClass("tablemode");
+      $listentries.addClass('listmode');
+      $listmode.removeClass('listmode');
+      $listmode.addClass('tablemode');
     }
-
   });
 
   /* ==========================================================================
      Cookie listmode
      ========================================================================== */
 
-  if ( jquery.cookie("listmode") == 1 ) {
-    $listentries.addClass("listmode");
-    $listmode.removeClass("listmode");
-    $listmode.addClass("tablemode");
+  if ($.cookie('listmode') === 1) {
+    $listentries.addClass('listmode');
+    $listmode.removeClass('listmode');
+    $listmode.addClass('tablemode');
   }
 
   /* ==========================================================================
@@ -59,43 +60,250 @@ $.fn.ready(function() {
      ========================================================================== */
 
 
-  $('#nav-btn-add-tag').on('click', function(){
-       $(".nav-panel-add-tag").toggle(100);
-       $(".nav-panel-menu").addClass('hidden');
-       $("#tag_label").focus();
-       return false;
+  $('#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'),
+    });
+
+    const x = JSON.parse($('#annotationroutes').html());
+    app.include(annotator.storage.http, x);
+
+    app.start().then(() => {
+      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);
+    });
+
+    retrievePercent(x.entryId);
+
+    $(window).resize(() => {
+      retrievePercent(x.entryId);
+    });
+  }
 
-        app.include(annotator.ui.main, {
-            element: document.querySelector('article')
-        });
+  /**
+   * Close window after adding entry if popup
+   */
+  const currentUrl = window.location.href;
+  if (currentUrl.match('&closewin=true')) {
+    window.close();
+  }
 
-        var x = JSON.parse($('#annotationroutes').html());
-        app.include(annotator.storage.http, x);
+  /**
+   * 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;
+    },
+  });
 
-        app.start().then(function () {
-             app.annotations.load({entry: x.entryId});
-        });
+  //---------------------------------------------------------------------------
+  // 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;
+  });
 
-        $(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);
-        });
+  $('#search-form').hide();
+  $('#bagit-form').hide();
+  $('#filters').hide();
+  $('#download-form').hide();
 
-        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');
+    }
+  }
 
-        $(window).resize(function(){
-            retrievePercent(x.entryId);
-        });
+  //---------------------------------------------------------------------------
+  // 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(
+      () => `<a href="${$(this).attr('href')}" class="add-to-wallabag-link-after" ` +
+      'alt="add to wallabag" title="add to wallabag"></a>'
+  );
+
+  $('.add-to-wallabag-link-after').click((event) => {
+    toggleSaveLinkForm($(this).attr('href'), event);
+    event.preventDefault();
+  });
 });