app/Resources/static/themes/material/js/init.js

   1 import { savePercent, retrievePercent, initFilters, initExport } from '../../_global/js/tools';
   2
   3 const $ = require('jquery');
   4
   5 global.jQuery = $;
   6 require('materialize'); // eslint-disable-line
   7 const annotator = require('annotator');
   8
   9 $(document).ready(() => {
  10   // sideNav
  11   $('.button-collapse').sideNav();
  12   $('select').material_select();
  13   $('.collapsible').collapsible({
  14     accordion: false,
  15   });
  16   $('.datepicker').pickadate({
  17     selectMonths: true,
  18     selectYears: 15,
  19     formatSubmit: 'dd/mm/yyyy',
  20     hiddenName: true,
  21     format: 'dd/mm/yyyy',
  22   });
  23   initFilters();
  24   initExport();
  25
  26   $('#nav-btn-add-tag').on('click', () => {
  27     $('.nav-panel-add-tag').toggle(100);
  28     $('.nav-panel-menu').addClass('hidden');
  29     $('#tag_label').focus();
  30     return false;
  31   });
  32   $('#nav-btn-add').on('click', () => {
  33     $('.nav-panel-buttom').hide(100);
  34     $('.nav-panel-add').show(100);
  35     $('.nav-panels .action').hide(100);
  36     $('.nav-panel-menu').addClass('hidden');
  37     $('.nav-panels').css('background', 'white');
  38     $('#entry_url').focus();
  39     return false;
  40   });
  41   $('#nav-btn-search').on('click', () => {
  42     $('.nav-panel-buttom').hide(100);
  43     $('.nav-panel-search').show(100);
  44     $('.nav-panels .action').hide(100);
  45     $('.nav-panel-menu').addClass('hidden');
  46     $('.nav-panels').css('background', 'white');
  47     $('#searchfield').focus();
  48     return false;
  49   });
  50   $('.close').on('click', () => {
  51     $('.nav-panel-add').hide(100);
  52     $('.nav-panel-search').hide(100);
  53     $('.nav-panel-buttom').show(100);
  54     $('.nav-panels .action').show(100);
  55     $('.nav-panel-menu').removeClass('hidden');
  56     $('.nav-panels').css('background', 'transparent');
  57     return false;
  58   });
  59   $(window).scroll(() => {
  60     const s = $(window).scrollTop();
  61     const d = $(document).height();
  62     const c = $(window).height();
  63     const scrollPercent = (s / (d - c)) * 100;
  64     $('.progress .determinate').css('width', `${scrollPercent}%`);
  65   });
  66
  67 /* ==========================================================================
  68    Annotations & Remember position
  69    ========================================================================== */
  70
  71   if ($('article').length) {
  72     const app = new annotator.App();
  73     const x = JSON.parse($('#annotationroutes').html());
  74
  75     app.include(annotator.ui.main, {
  76       element: document.querySelector('article'),
  77     });
  78
  79     app.include(annotator.storage.http, x);
  80
  81     app.start().then(() => {
  82       app.annotations.load({ entry: x.entryId });
  83     });
  84
  85     $(window).scroll(() => {
  86       const scrollTop = $(window).scrollTop();
  87       const docHeight = $(document).height();
  88       const scrollPercent = (scrollTop) / (docHeight);
  89       const scrollPercentRounded = Math.round(scrollPercent * 100) / 100;
  90       savePercent(x.entryId, scrollPercentRounded);
  91     });
  92
  93     retrievePercent(x.entryId);
  94
  95     $(window).resize(() => {
  96       retrievePercent(x.entryId);
  97     });
  98   }
  99 });