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

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