summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/wikis.js.es6
blob: ef99b2e92f06d72b0ae47e214480e19733e6013e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
/* eslint-disable no-param-reassign */
/* global Breakpoints */

require('vendor/latinise');
require('./breakpoints');
require('vendor/jquery.nicescroll');

((global) => {
  const dasherize = str => str.replace(/[_\s]+/g, '-');
  const slugify = str => dasherize(str.trim().toLowerCase().latinise());

  class Wikis {
    constructor() {
      this.bp = Breakpoints.get();
      this.sidebarEl = document.querySelector('.js-wiki-sidebar');
      this.sidebarExpanded = false;
      $(this.sidebarEl).niceScroll();

      const sidebarToggles = document.querySelectorAll('.js-sidebar-wiki-toggle');
      for (let i = 0; i < sidebarToggles.length; i += 1) {
        sidebarToggles[i].addEventListener('click', e => this.handleToggleSidebar(e));
      }

      this.newWikiForm = document.querySelector('form.new-wiki-page');
      if (this.newWikiForm) {
        this.newWikiForm.addEventListener('submit', e => this.handleNewWikiSubmit(e));
      }

      window.addEventListener('resize', () => this.renderSidebar());
      this.renderSidebar();
    }

    handleNewWikiSubmit(e) {
      if (!this.newWikiForm) return;

      const slugInput = this.newWikiForm.querySelector('#new_wiki_path');
      const slug = slugify(slugInput.value);

      if (slug.length > 0) {
        const wikisPath = slugInput.getAttribute('data-wikis-path');
        window.location.href = `${wikisPath}/${slug}`;
        e.preventDefault();
      }
    }

    handleToggleSidebar(e) {
      e.preventDefault();
      this.sidebarExpanded = !this.sidebarExpanded;
      this.renderSidebar();
    }

    sidebarCanCollapse() {
      const bootstrapBreakpoint = this.bp.getBreakpointSize();
      return bootstrapBreakpoint === 'xs' || bootstrapBreakpoint === 'sm';
    }

    renderSidebar() {
      if (!this.sidebarEl) return;
      const { classList } = this.sidebarEl;
      if (this.sidebarExpanded || !this.sidebarCanCollapse()) {
        if (!classList.contains('right-sidebar-expanded')) {
          classList.remove('right-sidebar-collapsed');
          classList.add('right-sidebar-expanded');
        }
      } else if (classList.contains('right-sidebar-expanded')) {
        classList.add('right-sidebar-collapsed');
        classList.remove('right-sidebar-expanded');
      }
    }
  }

  global.Wikis = Wikis;
})(window.gl || (window.gl = {}));