From a167897bed66ed2b9aafad7020d75334e2badf32 Mon Sep 17 00:00:00 2001 From: Mike Greiling Date: Mon, 14 Nov 2016 15:33:21 -0600 Subject: move wiki navbar content to right sidebar --- app/assets/javascripts/wikis.js.es6 | 70 +++++++++++++++++++++++++++++++++++++ 1 file changed, 70 insertions(+) create mode 100644 app/assets/javascripts/wikis.js.es6 (limited to 'app/assets/javascripts/wikis.js.es6') diff --git a/app/assets/javascripts/wikis.js.es6 b/app/assets/javascripts/wikis.js.es6 new file mode 100644 index 00000000000..e246ed6828f --- /dev/null +++ b/app/assets/javascripts/wikis.js.es6 @@ -0,0 +1,70 @@ +/* eslint-disable no-param-reassign */ +/* global Breakpoints */ + +/*= require latinise */ +/*= require breakpoints */ + +((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; + + const sidebarToggles = document.querySelectorAll('.js-sidebar-wiki-toggle'); + for (const toggle of sidebarToggles) { + toggle.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(event) { + 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}`; + event.preventDefault(); + } + } + + handleToggleSidebar(event) { + event.preventDefault(); + this.sidebarExpanded = !this.sidebarExpanded; + this.renderSidebar(); + } + + sidebarCanCollapse() { + const bootstrapBreakpoint = this.bp.getBreakpointSize(); + return bootstrapBreakpoint === 'xs' || bootstrapBreakpoint === 'sm'; + } + + renderSidebar() { + 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 = {})); -- cgit v1.2.1 From 8e23d7ad84db730413b1df66117775b241dfe38c Mon Sep 17 00:00:00 2001 From: Mike Greiling Date: Tue, 15 Nov 2016 02:04:39 -0600 Subject: allow wiki sidebar to scroll on overflow --- app/assets/javascripts/wikis.js.es6 | 2 ++ 1 file changed, 2 insertions(+) (limited to 'app/assets/javascripts/wikis.js.es6') diff --git a/app/assets/javascripts/wikis.js.es6 b/app/assets/javascripts/wikis.js.es6 index e246ed6828f..b5626f5bd81 100644 --- a/app/assets/javascripts/wikis.js.es6 +++ b/app/assets/javascripts/wikis.js.es6 @@ -3,6 +3,7 @@ /*= require latinise */ /*= require breakpoints */ +/*= require jquery.nicescroll */ ((global) => { const dasherize = str => str.replace(/[_\s]+/g, '-'); @@ -13,6 +14,7 @@ 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 (const toggle of sidebarToggles) { -- cgit v1.2.1 From e069875e80117020eea5bfe1b06f1a5bf868ffc9 Mon Sep 17 00:00:00 2001 From: Mike Greiling Date: Tue, 15 Nov 2016 11:32:57 -0600 Subject: fix tests broken by new wiki page design --- app/assets/javascripts/wikis.js.es6 | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'app/assets/javascripts/wikis.js.es6') diff --git a/app/assets/javascripts/wikis.js.es6 b/app/assets/javascripts/wikis.js.es6 index b5626f5bd81..8710ca973c4 100644 --- a/app/assets/javascripts/wikis.js.es6 +++ b/app/assets/javascripts/wikis.js.es6 @@ -17,8 +17,8 @@ $(this.sidebarEl).niceScroll(); const sidebarToggles = document.querySelectorAll('.js-sidebar-wiki-toggle'); - for (const toggle of sidebarToggles) { - toggle.addEventListener('click', e => this.handleToggleSidebar(e)); + 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'); -- cgit v1.2.1 From f0d20b09dc6604d4ea11a39a7d7492ad10574094 Mon Sep 17 00:00:00 2001 From: Mike Greiling Date: Wed, 16 Nov 2016 12:10:16 -0600 Subject: use wiki pages index for sidebar overflow and limit sidebar list to 15 pages --- app/assets/javascripts/wikis.js.es6 | 1 + 1 file changed, 1 insertion(+) (limited to 'app/assets/javascripts/wikis.js.es6') diff --git a/app/assets/javascripts/wikis.js.es6 b/app/assets/javascripts/wikis.js.es6 index 8710ca973c4..fa6d0e1f56c 100644 --- a/app/assets/javascripts/wikis.js.es6 +++ b/app/assets/javascripts/wikis.js.es6 @@ -55,6 +55,7 @@ } renderSidebar() { + if (!this.sidebarEl) return; const { classList } = this.sidebarEl; if (this.sidebarExpanded || !this.sidebarCanCollapse()) { if (!classList.contains('right-sidebar-expanded')) { -- cgit v1.2.1 From 3833a28c3aa7a7ae8c1a353e2c6d4338f50b5fb1 Mon Sep 17 00:00:00 2001 From: Mike Greiling Date: Wed, 30 Nov 2016 13:32:26 -0600 Subject: rename event variable to just e --- app/assets/javascripts/wikis.js.es6 | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'app/assets/javascripts/wikis.js.es6') diff --git a/app/assets/javascripts/wikis.js.es6 b/app/assets/javascripts/wikis.js.es6 index fa6d0e1f56c..ecff5fd5bf4 100644 --- a/app/assets/javascripts/wikis.js.es6 +++ b/app/assets/javascripts/wikis.js.es6 @@ -30,7 +30,7 @@ this.renderSidebar(); } - handleNewWikiSubmit(event) { + handleNewWikiSubmit(e) { if (!this.newWikiForm) return; const slugInput = this.newWikiForm.querySelector('#new_wiki_path'); @@ -39,12 +39,12 @@ if (slug.length > 0) { const wikisPath = slugInput.getAttribute('data-wikis-path'); window.location.href = `${wikisPath}/${slug}`; - event.preventDefault(); + e.preventDefault(); } } - handleToggleSidebar(event) { - event.preventDefault(); + handleToggleSidebar(e) { + e.preventDefault(); this.sidebarExpanded = !this.sidebarExpanded; this.renderSidebar(); } -- cgit v1.2.1