From e58c8413d47080498f4327cbcb6e08edae44aa9e Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Tue, 26 Sep 2017 14:23:01 +0200 Subject: Fixed Back Button for files + line number jumping for preview and editor --- .../javascripts/repo/components/repo_editor.vue | 2 +- .../javascripts/repo/components/repo_sidebar.vue | 27 ++++++++++++++++++---- app/assets/javascripts/repo/helpers/repo_helper.js | 4 +++- app/assets/javascripts/repo/stores/repo_store.js | 4 ++++ 4 files changed, 30 insertions(+), 7 deletions(-) (limited to 'app/assets') diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue index 96d6a75bb61..f1acd339ad3 100644 --- a/app/assets/javascripts/repo/components/repo_editor.vue +++ b/app/assets/javascripts/repo/components/repo_editor.vue @@ -63,7 +63,7 @@ const RepoEditor = { const lineNumber = e.target.position.lineNumber; if (e.target.element.classList.contains('line-numbers')) { location.hash = `L${lineNumber}`; - Store.activeLine = lineNumber; + Store.setActiveLine(lineNumber); Helper.monacoInstance.setPosition({ lineNumber: this.activeLine, diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index 1e40814b95f..535206bafe3 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -25,11 +25,28 @@ export default { methods: { addPopEventListener() { - window.addEventListener('popstate', () => { - if (location.href.indexOf('#') > -1) return; - this.linkClicked({ - url: location.href, - }); + window.addEventListener('popstate', (event) => { + const selectedFile = this.files.find(file => location.href.indexOf(file.url) > -1); + if (selectedFile) { + if (selectedFile.url !== this.activeFile.url) { + this.fileClicked(selectedFile); + } + + if (location.hash.indexOf('#L') > -1) { + const lineNumber = Number(location.hash.substr(2)); + if (!isNaN(lineNumber)) { + Store.setActiveLine(lineNumber); + if (Store.isPreviewView()) { + document.getElementById('L' + lineNumber).scrollIntoView(); + } else { + Helper.monacoInstance.setPosition({ + lineNumber: this.activeLine, + column: 1, + }); + } + } + } + } }); }, diff --git a/app/assets/javascripts/repo/helpers/repo_helper.js b/app/assets/javascripts/repo/helpers/repo_helper.js index ac59a2bed23..7483f8bc305 100644 --- a/app/assets/javascripts/repo/helpers/repo_helper.js +++ b/app/assets/javascripts/repo/helpers/repo_helper.js @@ -254,7 +254,9 @@ const RepoHelper = { RepoHelper.key = RepoHelper.genKey(); - history.pushState({ key: RepoHelper.key }, '', url); + if (document.location.pathname !== url) { + history.pushState({ key: RepoHelper.key }, '', url); + } if (title) { document.title = title; diff --git a/app/assets/javascripts/repo/stores/repo_store.js b/app/assets/javascripts/repo/stores/repo_store.js index 9a4fc40bc69..0d1853ff148 100644 --- a/app/assets/javascripts/repo/stores/repo_store.js +++ b/app/assets/javascripts/repo/stores/repo_store.js @@ -101,6 +101,10 @@ const RepoStore = { RepoStore.activeFileIndex = i; }, + setActiveLine(activeLine) { + RepoStore.activeLine = activeLine; + }, + setActiveToRaw() { RepoStore.activeFile.raw = false; // can't get vue to listen to raw for some reason so RepoStore for now. -- cgit v1.2.1