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(-) 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 From 9196a356ae675ab97e7ed49e48c1e59105ad2a81 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Tue, 26 Sep 2017 14:58:14 +0200 Subject: Polished Back Button for files that are not in the tree anymore --- app/assets/javascripts/repo/components/repo_sidebar.vue | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index 535206bafe3..702056a7e3a 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -26,7 +26,11 @@ export default { methods: { addPopEventListener() { window.addEventListener('popstate', (event) => { - const selectedFile = this.files.find(file => location.href.indexOf(file.url) > -1); + let selectedFile = this.files.find(file => {return location.pathname.indexOf(file.url) > -1}); + if (!selectedFile) { + // Maybe it is not in the current tree but in the opened tabs + selectedFile = Store.openedFiles.find(file => {return location.pathname.indexOf(file.url) > -1}); + } if (selectedFile) { if (selectedFile.url !== this.activeFile.url) { this.fileClicked(selectedFile); @@ -46,6 +50,11 @@ export default { } } } + } else { + // Not opened at all lets open new tab + this.fileClicked({ + url: location.href, + }); } }); }, -- cgit v1.2.1 From 45b8266bcd97c1132a5012ca4df578df4999c6ac Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Fri, 29 Sep 2017 09:07:47 +0200 Subject: Fixed Eslint Errors --- app/assets/javascripts/repo/components/repo_sidebar.vue | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index 702056a7e3a..f741a8d46bc 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -25,11 +25,11 @@ export default { methods: { addPopEventListener() { - window.addEventListener('popstate', (event) => { - let selectedFile = this.files.find(file => {return location.pathname.indexOf(file.url) > -1}); + window.addEventListener('popstate', () => { + let selectedFile = this.files.find(file => location.pathname.indexOf(file.url) > -1); if (!selectedFile) { // Maybe it is not in the current tree but in the opened tabs - selectedFile = Store.openedFiles.find(file => {return location.pathname.indexOf(file.url) > -1}); + selectedFile = Store.openedFiles.find(file => location.pathname.indexOf(file.url) > -1); } if (selectedFile) { if (selectedFile.url !== this.activeFile.url) { @@ -41,7 +41,7 @@ export default { if (!isNaN(lineNumber)) { Store.setActiveLine(lineNumber); if (Store.isPreviewView()) { - document.getElementById('L' + lineNumber).scrollIntoView(); + document.getElementById(`L${lineNumber}`).scrollIntoView(); } else { Helper.monacoInstance.setPosition({ lineNumber: this.activeLine, -- cgit v1.2.1 From 1429e5b57df2107746d8550abebb423107b5399a Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Mon, 2 Oct 2017 15:02:52 +0200 Subject: Added Test for Back Button Behaviour --- .../repo/components/repo_sidebar_spec.js | 32 ++++++++++++++++++++++ 1 file changed, 32 insertions(+) diff --git a/spec/javascripts/repo/components/repo_sidebar_spec.js b/spec/javascripts/repo/components/repo_sidebar_spec.js index db9911c7a2c..9959d23a07d 100644 --- a/spec/javascripts/repo/components/repo_sidebar_spec.js +++ b/spec/javascripts/repo/components/repo_sidebar_spec.js @@ -121,5 +121,37 @@ describe('RepoSidebar', () => { expect(RepoService.url).toEqual(prevUrl); }); }); + + describe('back button', () => { + const file1 = { + id: 1, + url: 'file1', + }; + const file2 = { + id: 2, + url: 'file2', + }; + RepoStore.files = [file1, file2]; + RepoStore.openedFiles = [file1, file2]; + RepoStore.isRoot = true; + + const vm = createComponent(); + vm.fileClicked(file1); + + it('render previous file when using back button', () => { + spyOn(Helper, 'getContent').and.callThrough(); + vm.fileClicked(file2); + expect(Helper.getContent).toHaveBeenCalledWith(file2); + + history.pushState({ + key: Math.random(), + }, '', file1.url); + const popEvent = document.createEvent('Event'); + popEvent.initEvent('popstate', true, true); + window.dispatchEvent(popEvent); + + expect(Helper.getContent).toHaveBeenCalledWith(file1); + }); + }); }); }); -- cgit v1.2.1 From 25186c7aee7f0c25bd3c8fbaab353742d54afdf2 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Tue, 3 Oct 2017 11:01:36 +0200 Subject: Fixed Repo Sidebar Tests --- .../javascripts/repo/components/repo_sidebar.vue | 59 +++++++++++----------- .../repo/components/repo_sidebar_spec.js | 26 +++++++--- 2 files changed, 48 insertions(+), 37 deletions(-) diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index f741a8d46bc..9d3e20a195b 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -18,45 +18,46 @@ export default { }, created() { - this.addPopEventListener(); + window.addEventListener('popstate', this.checkHistory); + }, + destroyed() { + window.removeEventListener('popstate', this.checkHistory); }, data: () => Store, methods: { - addPopEventListener() { - window.addEventListener('popstate', () => { - let selectedFile = this.files.find(file => location.pathname.indexOf(file.url) > -1); - if (!selectedFile) { - // Maybe it is not in the current tree but in the opened tabs - selectedFile = Store.openedFiles.find(file => location.pathname.indexOf(file.url) > -1); + checkHistory() { + let selectedFile = this.files.find(file => location.pathname.indexOf(file.url) > -1); + if (!selectedFile) { + // Maybe it is not in the current tree but in the opened tabs + selectedFile = Store.openedFiles.find(file => location.pathname.indexOf(file.url) > -1); + } + if (selectedFile) { + if (selectedFile.url !== this.activeFile.url) { + this.fileClicked(selectedFile); } - 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, - }); - } + 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, + }); } } - } else { - // Not opened at all lets open new tab - this.fileClicked({ - url: location.href, - }); } - }); + } else { + // Not opened at all lets open new tab + this.fileClicked({ + url: location.href, + }); + } }, fileClicked(clickedFile) { diff --git a/spec/javascripts/repo/components/repo_sidebar_spec.js b/spec/javascripts/repo/components/repo_sidebar_spec.js index 9959d23a07d..07ad995479a 100644 --- a/spec/javascripts/repo/components/repo_sidebar_spec.js +++ b/spec/javascripts/repo/components/repo_sidebar_spec.js @@ -5,18 +5,26 @@ import RepoStore from '~/repo/stores/repo_store'; import repoSidebar from '~/repo/components/repo_sidebar.vue'; describe('RepoSidebar', () => { + let vm; + function createComponent() { const RepoSidebar = Vue.extend(repoSidebar); return new RepoSidebar().$mount(); } + afterEach(() => { + vm.$destroy(); + }); + it('renders a sidebar', () => { RepoStore.files = [{ id: 0, }]; RepoStore.openedFiles = []; - const vm = createComponent(); + RepoStore.isRoot = false; + + vm = createComponent(); const thead = vm.$el.querySelector('thead'); const tbody = vm.$el.querySelector('tbody'); @@ -35,7 +43,7 @@ describe('RepoSidebar', () => { RepoStore.openedFiles = [{ id: 0, }]; - const vm = createComponent(); + vm = createComponent(); expect(vm.$el.classList.contains('sidebar-mini')).toBeTruthy(); expect(vm.$el.querySelector('thead')).toBeFalsy(); @@ -47,7 +55,7 @@ describe('RepoSidebar', () => { tree: true, }; RepoStore.files = []; - const vm = createComponent(); + vm = createComponent(); expect(vm.$el.querySelectorAll('tbody .loading-file').length).toEqual(5); }); @@ -57,7 +65,7 @@ describe('RepoSidebar', () => { id: 0, }]; RepoStore.isRoot = true; - const vm = createComponent(); + vm = createComponent(); expect(vm.$el.querySelector('tbody .prev-directory')).toBeTruthy(); }); @@ -103,7 +111,7 @@ describe('RepoSidebar', () => { }; RepoStore.files = [file1]; RepoStore.isRoot = true; - const vm = createComponent(); + vm = createComponent(); vm.fileClicked(file1); @@ -114,7 +122,7 @@ describe('RepoSidebar', () => { describe('goToPreviousDirectoryClicked', () => { it('should hide files in directory if already open', () => { const prevUrl = 'foo/bar'; - const vm = createComponent(); + vm = createComponent(); vm.goToPreviousDirectoryClicked(prevUrl); @@ -135,13 +143,15 @@ describe('RepoSidebar', () => { RepoStore.openedFiles = [file1, file2]; RepoStore.isRoot = true; - const vm = createComponent(); + vm = createComponent(); vm.fileClicked(file1); it('render previous file when using back button', () => { spyOn(Helper, 'getContent').and.callThrough(); + vm.fileClicked(file2); expect(Helper.getContent).toHaveBeenCalledWith(file2); + Helper.getContent.calls.reset(); history.pushState({ key: Math.random(), @@ -150,7 +160,7 @@ describe('RepoSidebar', () => { popEvent.initEvent('popstate', true, true); window.dispatchEvent(popEvent); - expect(Helper.getContent).toHaveBeenCalledWith(file1); + expect(Helper.getContent.calls.mostRecent().args[0].url).toContain(file1.url); }); }); }); -- cgit v1.2.1 From a0d238066eb7d88a1ad136dab7c56fc63993b7d2 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Tue, 3 Oct 2017 11:32:47 +0200 Subject: Fixed RepoFile Test --- spec/javascripts/repo/components/repo_file_spec.js | 16 +++++++++------- spec/javascripts/repo/components/repo_sidebar_spec.js | 4 ++-- 2 files changed, 11 insertions(+), 9 deletions(-) diff --git a/spec/javascripts/repo/components/repo_file_spec.js b/spec/javascripts/repo/components/repo_file_spec.js index f15633bd8b9..620b604f404 100644 --- a/spec/javascripts/repo/components/repo_file_spec.js +++ b/spec/javascripts/repo/components/repo_file_spec.js @@ -29,15 +29,17 @@ describe('RepoFile', () => { }).$mount(); } - beforeEach(() => { - spyOn(repoFile.mixins[0].methods, 'timeFormated').and.returnValue(updated); - }); - it('renders link, icon, name and last commit details', () => { - const vm = createComponent({ - file, - activeFile, + const RepoFile = Vue.extend(repoFile); + const vm = new RepoFile({ + propsData: { + file, + activeFile, + }, }); + spyOn(vm, 'timeFormated').and.returnValue(updated); + vm.$mount(); + const name = vm.$el.querySelector('.repo-file-name'); const fileIcon = vm.$el.querySelector('.file-icon'); diff --git a/spec/javascripts/repo/components/repo_sidebar_spec.js b/spec/javascripts/repo/components/repo_sidebar_spec.js index 07ad995479a..5a81c6e611f 100644 --- a/spec/javascripts/repo/components/repo_sidebar_spec.js +++ b/spec/javascripts/repo/components/repo_sidebar_spec.js @@ -80,7 +80,7 @@ describe('RepoSidebar', () => { }; RepoStore.files = [file1]; RepoStore.isRoot = true; - const vm = createComponent(); + vm = createComponent(); vm.fileClicked(file1); @@ -95,7 +95,7 @@ describe('RepoSidebar', () => { spyOn(Helper, 'getFileFromPath').and.returnValue(file); spyOn(RepoStore, 'setActiveFiles'); - const vm = createComponent(); + vm = createComponent(); vm.fileClicked(file); expect(RepoStore.setActiveFiles).toHaveBeenCalledWith(file); -- cgit v1.2.1 From 5c07687b3eedfc4200c9b3fcdffbc79026c285db Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Tue, 3 Oct 2017 13:56:01 +0200 Subject: Added Check for Line Number Element --- app/assets/javascripts/repo/components/repo_sidebar.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index 9d3e20a195b..0e6acf96836 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -43,7 +43,7 @@ export default { if (!isNaN(lineNumber)) { Store.setActiveLine(lineNumber); if (Store.isPreviewView()) { - document.getElementById(`L${lineNumber}`).scrollIntoView(); + if (document.getElementById(`L${lineNumber}`)) document.getElementById(`L${lineNumber}`).scrollIntoView(); } else { Helper.monacoInstance.setPosition({ lineNumber: this.activeLine, -- cgit v1.2.1 From 0a671c8223d7fab14acdb40d30a7a74696885d75 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Wed, 4 Oct 2017 11:20:06 +0200 Subject: Fixes the unhandled promise rejection --- spec/javascripts/repo/components/repo_sidebar_spec.js | 2 ++ spec/javascripts/vue_mr_widget/services/mr_widget_service_spec.js | 1 + 2 files changed, 3 insertions(+) diff --git a/spec/javascripts/repo/components/repo_sidebar_spec.js b/spec/javascripts/repo/components/repo_sidebar_spec.js index 5a81c6e611f..bcc03ed743d 100644 --- a/spec/javascripts/repo/components/repo_sidebar_spec.js +++ b/spec/javascripts/repo/components/repo_sidebar_spec.js @@ -161,6 +161,8 @@ describe('RepoSidebar', () => { window.dispatchEvent(popEvent); expect(Helper.getContent.calls.mostRecent().args[0].url).toContain(file1.url); + + window.history.pushState({}, null, '/'); }); }); }); diff --git a/spec/javascripts/vue_mr_widget/services/mr_widget_service_spec.js b/spec/javascripts/vue_mr_widget/services/mr_widget_service_spec.js index b63633c03b8..e667b4b3677 100644 --- a/spec/javascripts/vue_mr_widget/services/mr_widget_service_spec.js +++ b/spec/javascripts/vue_mr_widget/services/mr_widget_service_spec.js @@ -31,6 +31,7 @@ describe('MRWidgetService', () => { }); it('should have methods defined', () => { + window.history.pushState({}, null, '/'); const service = new MRWidgetService(mr); expect(service.merge()).toBeDefined(); -- cgit v1.2.1 From 8d14a95638d7d6b52254b192b3e54296e22fddc3 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Wed, 4 Oct 2017 17:22:07 +0200 Subject: Optimising If --- app/assets/javascripts/repo/components/repo_sidebar.vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index 0e6acf96836..9f58f63b850 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -42,8 +42,8 @@ export default { const lineNumber = Number(location.hash.substr(2)); if (!isNaN(lineNumber)) { Store.setActiveLine(lineNumber); - if (Store.isPreviewView()) { - if (document.getElementById(`L${lineNumber}`)) document.getElementById(`L${lineNumber}`).scrollIntoView(); + if (Store.isPreviewView() && document.getElementById(`L${lineNumber}`)) { + document.getElementById(`L${lineNumber}`).scrollIntoView(); } else { Helper.monacoInstance.setPosition({ lineNumber: this.activeLine, -- cgit v1.2.1 From 8b16f1074ddb6ea6a5404d37409ab81002f28d52 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Thu, 5 Oct 2017 11:54:46 +0200 Subject: Refactored Highlighting mechanism --- app/assets/javascripts/line_highlighter.js | 9 ++++++--- app/assets/javascripts/repo/components/repo_editor.vue | 14 +++++++++----- app/assets/javascripts/repo/components/repo_preview.vue | 3 +++ app/assets/javascripts/repo/components/repo_sidebar.vue | 8 -------- 4 files changed, 18 insertions(+), 16 deletions(-) diff --git a/app/assets/javascripts/line_highlighter.js b/app/assets/javascripts/line_highlighter.js index a16d00b5cef..9999b5a200c 100644 --- a/app/assets/javascripts/line_highlighter.js +++ b/app/assets/javascripts/line_highlighter.js @@ -54,12 +54,14 @@ LineHighlighter.prototype.bindEvents = function() { $fileHolder.on('highlight:line', this.highlightHash); }; -LineHighlighter.prototype.highlightHash = function() { - var range; +LineHighlighter.prototype.highlightHash = function(newHash) { + let range; + if (newHash) this._hash = newHash; + + this.clearHighlight(); if (this._hash !== '') { range = this.hashToRange(this._hash); - if (range[0]) { this.highlightRange(range); const lineSelector = `#L${range[0]}`; @@ -131,6 +133,7 @@ LineHighlighter.prototype.hashToRange = function(hash) { // // lineNumber - Line number to highlight LineHighlighter.prototype.highlightLine = function(lineNumber) { + console.log('LINE : ' + lineNumber); return $("#LC" + lineNumber).addClass(this.highlightLineClass); }; diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue index f1acd339ad3..02d9c775046 100644 --- a/app/assets/javascripts/repo/components/repo_editor.vue +++ b/app/assets/javascripts/repo/components/repo_editor.vue @@ -64,11 +64,6 @@ const RepoEditor = { if (e.target.element.classList.contains('line-numbers')) { location.hash = `L${lineNumber}`; Store.setActiveLine(lineNumber); - - Helper.monacoInstance.setPosition({ - lineNumber: this.activeLine, - column: 1, - }); } }, }, @@ -101,6 +96,15 @@ const RepoEditor = { this.setupEditor(); } }, + + activeLine() { + if (Helper.monacoInstance) { + Helper.monacoInstance.setPosition({ + lineNumber: this.activeLine, + column: 1, + }); + } + }, }, computed: { shouldHideEditor() { diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue index 2fe369a4693..514c7d9284c 100644 --- a/app/assets/javascripts/repo/components/repo_preview.vue +++ b/app/assets/javascripts/repo/components/repo_preview.vue @@ -28,6 +28,9 @@ export default { this.highlightFile(); }); }, + activeLine(e) { + this.lineHighlighter.highlightHash('#L' + Store.activeLine); + }, }, }; diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index 9f58f63b850..2b0f1f661ff 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -42,14 +42,6 @@ export default { const lineNumber = Number(location.hash.substr(2)); if (!isNaN(lineNumber)) { Store.setActiveLine(lineNumber); - if (Store.isPreviewView() && document.getElementById(`L${lineNumber}`)) { - document.getElementById(`L${lineNumber}`).scrollIntoView(); - } else { - Helper.monacoInstance.setPosition({ - lineNumber: this.activeLine, - column: 1, - }); - } } } } else { -- cgit v1.2.1 From 8cd4a7cfd702ffce4630b48a3c266e0954087362 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Thu, 5 Oct 2017 12:01:37 +0200 Subject: Removed the console.log --- app/assets/javascripts/line_highlighter.js | 1 - 1 file changed, 1 deletion(-) diff --git a/app/assets/javascripts/line_highlighter.js b/app/assets/javascripts/line_highlighter.js index 9999b5a200c..ef91d471639 100644 --- a/app/assets/javascripts/line_highlighter.js +++ b/app/assets/javascripts/line_highlighter.js @@ -133,7 +133,6 @@ LineHighlighter.prototype.hashToRange = function(hash) { // // lineNumber - Line number to highlight LineHighlighter.prototype.highlightLine = function(lineNumber) { - console.log('LINE : ' + lineNumber); return $("#LC" + lineNumber).addClass(this.highlightLineClass); }; -- cgit v1.2.1 From 8262cb2f4e9f366e99592859d6348f48da4a4d39 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Thu, 5 Oct 2017 12:29:31 +0200 Subject: CHanged to Helper Method --- app/assets/javascripts/repo/components/repo_sidebar.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index 2b0f1f661ff..99bf471b83d 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -31,7 +31,7 @@ export default { let selectedFile = this.files.find(file => location.pathname.indexOf(file.url) > -1); if (!selectedFile) { // Maybe it is not in the current tree but in the opened tabs - selectedFile = Store.openedFiles.find(file => location.pathname.indexOf(file.url) > -1); + selectedFile = Helper.getFileFromPath(location.pathname); } if (selectedFile) { if (selectedFile.url !== this.activeFile.url) { -- cgit v1.2.1 From eda9e6b65baece281f45255e25a263e895d36db5 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Thu, 5 Oct 2017 15:14:33 +0200 Subject: Fixed Linting Error + Error with Line Highlighter found in Test --- app/assets/javascripts/line_highlighter.js | 2 +- app/assets/javascripts/repo/components/repo_preview.vue | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/app/assets/javascripts/line_highlighter.js b/app/assets/javascripts/line_highlighter.js index ef91d471639..a75d1a4b8d0 100644 --- a/app/assets/javascripts/line_highlighter.js +++ b/app/assets/javascripts/line_highlighter.js @@ -56,7 +56,7 @@ LineHighlighter.prototype.bindEvents = function() { LineHighlighter.prototype.highlightHash = function(newHash) { let range; - if (newHash) this._hash = newHash; + if (newHash && typeof newHash === 'string') this._hash = newHash; this.clearHighlight(); diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue index 514c7d9284c..04732489c5f 100644 --- a/app/assets/javascripts/repo/components/repo_preview.vue +++ b/app/assets/javascripts/repo/components/repo_preview.vue @@ -28,8 +28,8 @@ export default { this.highlightFile(); }); }, - activeLine(e) { - this.lineHighlighter.highlightHash('#L' + Store.activeLine); + activeLine() { + this.lineHighlighter.highlightHash(`#L${Store.activeLine}`); }, }, }; -- cgit v1.2.1 From 7453b64347c7096b3e435c90e9e6a4eee4ab5638 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Fri, 6 Oct 2017 09:12:33 +0200 Subject: Resetting of active Line + setting it for the async display functions --- .../javascripts/repo/components/repo_preview.vue | 8 +++++++- .../javascripts/repo/components/repo_sidebar.vue | 22 ++++++++++++---------- app/assets/javascripts/repo/stores/repo_store.js | 5 +++-- 3 files changed, 22 insertions(+), 13 deletions(-) diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue index 04732489c5f..9a9d200b8c6 100644 --- a/app/assets/javascripts/repo/components/repo_preview.vue +++ b/app/assets/javascripts/repo/components/repo_preview.vue @@ -14,6 +14,11 @@ export default { highlightFile() { $(this.$el).find('.file-content').syntaxHighlight(); }, + highlightLine() { + if (Store.activeLine > -1) { + this.lineHighlighter.highlightHash(`#L${Store.activeLine}`); + } + } }, mounted() { this.highlightFile(); @@ -26,10 +31,11 @@ export default { html() { this.$nextTick(() => { this.highlightFile(); + this.highlightLine(); }); }, activeLine() { - this.lineHighlighter.highlightHash(`#L${Store.activeLine}`); + this.highlightLine(); }, }, }; diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index 99bf471b83d..10de23d0199 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -33,26 +33,25 @@ export default { // Maybe it is not in the current tree but in the opened tabs selectedFile = Helper.getFileFromPath(location.pathname); } + + let lineNumber = null; + if (location.hash.indexOf('#L') > -1) lineNumber = Number(location.hash.substr(2)); + 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); - } + this.fileClicked(selectedFile, lineNumber); + } else { + Store.setActiveLine(lineNumber); } } else { // Not opened at all lets open new tab this.fileClicked({ url: location.href, - }); + }, lineNumber); } }, - fileClicked(clickedFile) { + fileClicked(clickedFile, lineNumber) { let file = clickedFile; if (file.loading) return; file.loading = true; @@ -60,17 +59,20 @@ export default { if (file.type === 'tree' && file.opened) { file = Store.removeChildFilesOfTree(file); file.loading = false; + Store.setActiveLine(lineNumber); } else { const openFile = Helper.getFileFromPath(file.url); if (openFile) { file.loading = false; Store.setActiveFiles(openFile); + Store.setActiveLine(lineNumber); } else { Service.url = file.url; Helper.getContent(file) .then(() => { file.loading = false; Helper.scrollTabsRight(); + Store.setActiveLine(lineNumber); }) .catch(Helper.loadingError); } diff --git a/app/assets/javascripts/repo/stores/repo_store.js b/app/assets/javascripts/repo/stores/repo_store.js index 0d1853ff148..93b39cff27e 100644 --- a/app/assets/javascripts/repo/stores/repo_store.js +++ b/app/assets/javascripts/repo/stores/repo_store.js @@ -26,7 +26,7 @@ const RepoStore = { }, activeFile: Helper.getDefaultActiveFile(), activeFileIndex: 0, - activeLine: 0, + activeLine: -1, activeFileLabel: 'Raw', files: [], isCommitable: false, @@ -85,6 +85,7 @@ const RepoStore = { if (!file.loading) Helper.updateHistoryEntry(file.url, file.pageTitle || file.name); RepoStore.binary = file.binary; + RepoStore.setActiveLine(-1); }, setFileActivity(file, openedFile, i) { @@ -102,7 +103,7 @@ const RepoStore = { }, setActiveLine(activeLine) { - RepoStore.activeLine = activeLine; + if (!isNaN(activeLine)) RepoStore.activeLine = activeLine; }, setActiveToRaw() { -- cgit v1.2.1 From 5197e7c1a127767ec3b36eb5642489d9d4631827 Mon Sep 17 00:00:00 2001 From: Tim Zallmann Date: Fri, 6 Oct 2017 11:11:59 +0200 Subject: Good old dangling comma --- app/assets/javascripts/repo/components/repo_preview.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue index 9a9d200b8c6..a87bef6084a 100644 --- a/app/assets/javascripts/repo/components/repo_preview.vue +++ b/app/assets/javascripts/repo/components/repo_preview.vue @@ -18,7 +18,7 @@ export default { if (Store.activeLine > -1) { this.lineHighlighter.highlightHash(`#L${Store.activeLine}`); } - } + }, }, mounted() { this.highlightFile(); -- cgit v1.2.1