From c434568f3759dfcdb8f9c55a11aa037a760ec7d2 Mon Sep 17 00:00:00 2001 From: Luke Bennett Date: Fri, 9 Sep 2016 16:47:43 +0100 Subject: [PATCH] re-apply MR !6285 "Added forceLoad ability to singleFileDiffs, added callback to getContentHTML, added conditional force load if a collapsed diff line anchor is found" Use url utility to retrieve hash --- app/assets/javascripts/diff.js.es6 | 11 ++++++++++ .../javascripts/merge_request_tabs.js.es6 | 9 ++++++-- app/assets/javascripts/single_file_diff.js | 22 ++++++++++++------- 3 files changed, 32 insertions(+), 10 deletions(-) diff --git a/app/assets/javascripts/diff.js.es6 b/app/assets/javascripts/diff.js.es6 index eacf53d1e1b..239dd84d8a3 100644 --- a/app/assets/javascripts/diff.js.es6 +++ b/app/assets/javascripts/diff.js.es6 @@ -58,6 +58,17 @@ $.get(link, params, response => $target.parent().replaceWith(response)); } + openAnchoredDiff(anchoredDiff, cb) { + const diffTitle = $(`#file-path-${anchoredDiff}`); + const diffFile = diffTitle.closest('.diff-file'); + const nothingHereBlock = $('.nothing-here-block:visible', diffFile); + if (nothingHereBlock.length) { + diffFile.singleFileDiff(true, cb); + } else { + cb(); + } + } + handleClickLineNum(event) { const hash = $(event.currentTarget).attr('href'); event.preventDefault(); diff --git a/app/assets/javascripts/merge_request_tabs.js.es6 b/app/assets/javascripts/merge_request_tabs.js.es6 index d3248a4757e..1a3df1bed36 100644 --- a/app/assets/javascripts/merge_request_tabs.js.es6 +++ b/app/assets/javascripts/merge_request_tabs.js.es6 @@ -239,9 +239,14 @@ this.expandViewContainer(); } this.diffsLoaded = true; - this.scrollToElement('#diffs'); - new gl.Diff(); + const diffPage = new gl.Diff(); + + const locationHash = gl.utils.getLocationHash(); + const anchoredDiff = locationHash && locationHash.split('_')[0]; + if (anchoredDiff) { + diffPage.openAnchoredDiff(anchoredDiff, () => this.scrollToElement('#diffs')); + } }, }); } diff --git a/app/assets/javascripts/single_file_diff.js b/app/assets/javascripts/single_file_diff.js index f5e06e6c817..0d48e69cce9 100644 --- a/app/assets/javascripts/single_file_diff.js +++ b/app/assets/javascripts/single_file_diff.js @@ -13,7 +13,8 @@ COLLAPSED_HTML = '
This diff is collapsed. Click to expand it.
'; - function SingleFileDiff(file) { + function SingleFileDiff(file, forceLoad, cb) { + var clickTarget; this.file = file; this.toggleDiff = bind(this.toggleDiff, this); this.content = $('.diff-content', this.file); @@ -31,10 +32,13 @@ this.content.after(this.collapsedContent); this.$toggleIcon.addClass('fa-caret-down'); } - $('.file-title, .click-to-expand', this.file).on('click', this.toggleDiff); + clickTarget = $('.file-title, .click-to-expand', this.file).on('click', this.toggleDiff); + if (forceLoad) { + this.toggleDiff({ target: clickTarget }, cb); + } } - SingleFileDiff.prototype.toggleDiff = function(e) { + SingleFileDiff.prototype.toggleDiff = function(e, cb) { var $target = $(e.target); if (!$target.hasClass('file-title') && !$target.hasClass('click-to-expand') && !$target.hasClass('diff-toggle-caret')) return; this.isOpen = !this.isOpen; @@ -54,11 +58,11 @@ } } else { this.$toggleIcon.addClass('fa-caret-down').removeClass('fa-caret-right'); - return this.getContentHTML(); + return this.getContentHTML(cb); } }; - SingleFileDiff.prototype.getContentHTML = function() { + SingleFileDiff.prototype.getContentHTML = function(cb) { this.collapsedContent.hide(); this.loadingContent.show(); $.get(this.diffForPath, (function(_this) { @@ -76,6 +80,8 @@ if (typeof gl.diffNotesCompileComponents !== 'undefined') { gl.diffNotesCompileComponents(); } + + if (cb) cb(); }; })(this)); }; @@ -84,10 +90,10 @@ })(); - $.fn.singleFileDiff = function() { + $.fn.singleFileDiff = function(forceLoad, cb) { return this.each(function() { - if (!$.data(this, 'singleFileDiff')) { - return $.data(this, 'singleFileDiff', new SingleFileDiff(this)); + if (!$.data(this, 'singleFileDiff') || forceLoad) { + return $.data(this, 'singleFileDiff', new SingleFileDiff(this, forceLoad, cb)); } }); };