From 619b43ffa41002aa4d0da9c809488b6718bcee00 Mon Sep 17 00:00:00 2001 From: Ivan Vorontsov Date: Sun, 1 May 2016 22:02:11 +0300 Subject: [PATCH 1/3] Implemented separated column selection through javascript clipboard hook. --- src/ui/css/diff2html.css | 30 ++++++++++++++++++++++ src/ui/js/diff2html-ui.js | 53 +++++++++++++++++++++++++++++++++++++++ 2 files changed, 83 insertions(+) diff --git a/src/ui/css/diff2html.css b/src/ui/css/diff2html.css index 665f46e..60f8397 100644 --- a/src/ui/css/diff2html.css +++ b/src/ui/css/diff2html.css @@ -274,3 +274,33 @@ ins.d2h-change, del.d2h-change { font-size: 10px; cursor: pointer; } + +/* + * Selection util. + */ + +.selecting-left .d2h-code-line, +.selecting-left .d2h-code-line *, +.selecting-right td.d2h-code-linenumber, +.selecting-right td.d2h-code-linenumber *, +.selecting-left .d2h-code-side-line, +.selecting-left .d2h-code-side-line *, +.selecting-right td.d2h-code-side-linenumber, +.selecting-right td.d2h-code-side-linenumber *{ + -webkit-touch-callout: none; + -webkit-user-select: none; + -khtml-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; +} + +.selecting-left .d2h-code-line::selection, +.selecting-left .d2h-code-line *::selection +.selecting-right td.d2h-code-linenumber::selection, +.selecting-left .d2h-code-side-line::selection, +.selecting-left .d2h-code-side-line *::selection, +.selecting-right td.d2h-code-side-linenumber::selection, +.selecting-right td.d2h-code-side-linenumber *::selection { + background: transparent; +} diff --git a/src/ui/js/diff2html-ui.js b/src/ui/js/diff2html-ui.js index 273c2e2..4686bd9 100644 --- a/src/ui/js/diff2html-ui.js +++ b/src/ui/js/diff2html-ui.js @@ -14,6 +14,7 @@ var diffJson = null; var defaultTarget = "body"; + var currentSelectionColumnId = -1; function Diff2HtmlUI(config) { var cfg = config || {}; @@ -23,6 +24,8 @@ } else if (cfg.json) { diffJson = cfg.json; } + + this._initSelection(); } Diff2HtmlUI.prototype.draw = function(targetId, config) { @@ -130,6 +133,56 @@ }); }; + Diff2HtmlUI.prototype._initSelection = function () { + var body = $('body'), + that = this; + + body.on('mousedown', '.d2h-diff-table', function (event) { + var target = $(event.target), + table = target.closest('.d2h-diff-table'); + + if (target.closest('.d2h-code-line,.d2h-code-side-line').length) { + table.removeClass('selecting-left'); + table.addClass('selecting-right'); + currentSelectionColumnId = 1; + } else if (target.closest('.d2h-code-linenumber,.d2h-code-side-linenumber').length) { + table.removeClass('selecting-right'); + table.addClass('selecting-left'); + currentSelectionColumnId = 0; + } + }); + + body.on('copy', '.d2h-diff-table', function (event) { + var clipboardData = event.originalEvent.clipboardData; + var text = that._getSelectedText(); + clipboardData.setData('text', text); + event.preventDefault(); + }); + }; + + + Diff2HtmlUI.prototype._getSelectedText = function () { + var table = $('.d2h-diff-table'), + sel = window.getSelection(), + range = sel.getRangeAt(0), + doc = range.cloneContents(), + nodes = doc.querySelectorAll('tr'), + text = ''; + + var idx = currentSelectionColumnId; + + if (nodes.length === 0) { + text = doc.textContent; + } else { + [].forEach.call(nodes, function (tr, i) { + var td = tr.cells[tr.cells.length == 1 ? 0 : idx]; + text += (i ? '\n' : '') + td.textContent.replace(/(?:\r\n|\r|\n)/g, ''); + }); + } + + return text; + }; + module.exports.Diff2HtmlUI = Diff2HtmlUI; // Expose diff2html in the browser From 12b2ee9356308c2f47942b064a9b932377293863 Mon Sep 17 00:00:00 2001 From: Ivan Vorontsov Date: Sun, 1 May 2016 22:26:10 +0300 Subject: [PATCH 2/3] Test fixes. --- src/ui/js/diff2html-ui.js | 31 +++++++++++++++---------------- 1 file changed, 15 insertions(+), 16 deletions(-) diff --git a/src/ui/js/diff2html-ui.js b/src/ui/js/diff2html-ui.js index 4686bd9..5752e79 100644 --- a/src/ui/js/diff2html-ui.js +++ b/src/ui/js/diff2html-ui.js @@ -133,13 +133,13 @@ }); }; - Diff2HtmlUI.prototype._initSelection = function () { - var body = $('body'), - that = this; + Diff2HtmlUI.prototype._initSelection = function() { + var body = $('body'); + var that = this; - body.on('mousedown', '.d2h-diff-table', function (event) { - var target = $(event.target), - table = target.closest('.d2h-diff-table'); + body.on('mousedown', '.d2h-diff-table', function(event) { + var target = $(event.target); + var table = target.closest('.d2h-diff-table'); if (target.closest('.d2h-code-line,.d2h-code-side-line').length) { table.removeClass('selecting-left'); @@ -152,7 +152,7 @@ } }); - body.on('copy', '.d2h-diff-table', function (event) { + body.on('copy', '.d2h-diff-table', function(event) { var clipboardData = event.originalEvent.clipboardData; var text = that._getSelectedText(); clipboardData.setData('text', text); @@ -161,20 +161,19 @@ }; - Diff2HtmlUI.prototype._getSelectedText = function () { - var table = $('.d2h-diff-table'), - sel = window.getSelection(), - range = sel.getRangeAt(0), - doc = range.cloneContents(), - nodes = doc.querySelectorAll('tr'), - text = ''; - + Diff2HtmlUI.prototype._getSelectedText = function() { + var table = $('.d2h-diff-table'); + var sel = window.getSelection(); + var range = sel.getRangeAt(0); + var doc = range.cloneContents(); + var nodes = doc.querySelectorAll('tr'); + var text = ''; var idx = currentSelectionColumnId; if (nodes.length === 0) { text = doc.textContent; } else { - [].forEach.call(nodes, function (tr, i) { + [].forEach.call(nodes, function(tr, i) { var td = tr.cells[tr.cells.length == 1 ? 0 : idx]; text += (i ? '\n' : '') + td.textContent.replace(/(?:\r\n|\r|\n)/g, ''); }); From 8c50a590b003b676f400b93a3c09883e7c2afdbd Mon Sep 17 00:00:00 2001 From: Ivan Vorontsov Date: Sun, 1 May 2016 22:33:55 +0300 Subject: [PATCH 3/3] Quality gate fixes, part 2 --- src/ui/js/diff2html-ui.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/ui/js/diff2html-ui.js b/src/ui/js/diff2html-ui.js index 5752e79..aece81b 100644 --- a/src/ui/js/diff2html-ui.js +++ b/src/ui/js/diff2html-ui.js @@ -162,7 +162,6 @@ Diff2HtmlUI.prototype._getSelectedText = function() { - var table = $('.d2h-diff-table'); var sel = window.getSelection(); var range = sel.getRangeAt(0); var doc = range.cloneContents(); @@ -174,7 +173,7 @@ text = doc.textContent; } else { [].forEach.call(nodes, function(tr, i) { - var td = tr.cells[tr.cells.length == 1 ? 0 : idx]; + var td = tr.cells[tr.cells.length === 1 ? 0 : idx]; text += (i ? '\n' : '') + td.textContent.replace(/(?:\r\n|\r|\n)/g, ''); }); }