From 6b8c92a8dbeabe1b8fde0fee487516513a421303 Mon Sep 17 00:00:00 2001 From: zhudock Date: Tue, 28 Feb 2017 12:31:24 -0500 Subject: [PATCH 1/2] Add ignorecase option for case insensitive search #39 --- lib/mergely.js | 134 +++++++++++++++++++++++++------------------------ 1 file changed, 69 insertions(+), 65 deletions(-) diff --git a/lib/mergely.js b/lib/mergely.js index e2679d9..80447c4 100644 --- a/lib/mergely.js +++ b/lib/mergely.js @@ -1,4 +1,4 @@ -"use strict"; +"use strict"; (function( window, document, jQuery, CodeMirror ){ @@ -9,7 +9,7 @@ Mgly.Timer = function(){ self.start = function() { self.t0 = new Date().getTime(); }; self.stop = function() { var t1 = new Date().getTime(); - var d = t1 - self.t0; + var d = t1 - self.t0; self.t0 = t1; return d; }; @@ -126,6 +126,9 @@ jQuery.extend(Mgly.CodeifyText.prototype, { if (this.options.ignorews) { line = line.replace(/\s+/g, ''); } + if (this.options.ignorecase) { + line = line.toLowerCase(); + } var aCode = this._diff_codes[line]; if (aCode != undefined) { ctx.codes[i] = aCode; @@ -177,11 +180,11 @@ jQuery.extend(Mgly.diff.prototype, { var change = 'c'; if (item.lhs_deleted_count == 0 && item.rhs_inserted_count > 0) change = 'a'; else if (item.lhs_deleted_count > 0 && item.rhs_inserted_count == 0) change = 'd'; - + if (item.lhs_deleted_count == 1) lhs_str = item.lhs_start + 1; else if (item.lhs_deleted_count == 0) lhs_str = item.lhs_start; else lhs_str = (item.lhs_start + 1) + ',' + (item.lhs_start + item.lhs_deleted_count); - + if (item.rhs_inserted_count == 1) rhs_str = item.rhs_start + 1; else if (item.rhs_inserted_count == 0) rhs_str = item.rhs_start; else rhs_str = (item.rhs_start + 1) + ',' + (item.rhs_start + item.rhs_inserted_count); @@ -373,7 +376,7 @@ jQuery.extend(Mgly.mergely.prototype, { Mgly.CodeMirrorDiffView = function(el, options) { CodeMirror.defineExtension('centerOnCursor', function() { var coords = this.cursorCoords(null, 'local'); - this.scrollTo(null, + this.scrollTo(null, (coords.y + coords.yBot) / 2 - (this.getScrollerElement().clientHeight / 2)); }); this.init(el, options); @@ -391,6 +394,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { sidebar: true, viewport: false, ignorews: false, + ignorecase: false, fadein: 'fast', editor_width: '650px', editor_height: '400px', @@ -449,15 +453,15 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { }; this.lhs_cmsettings = {}; this.rhs_cmsettings = {}; - + // save this element for faster queries this.element = jQuery(el); - + // save options if there are any if (options && options.cmsettings) jQuery.extend(this.lhs_cmsettings, cmsettings, options.cmsettings, options.lhs_cmsettings); if (options && options.cmsettings) jQuery.extend(this.rhs_cmsettings, cmsettings, options.cmsettings, options.rhs_cmsettings); //if (options) jQuery.extend(this.settings, options); - + // bind if the element is destroyed this.element.bind('destroyed', jQuery.proxy(this.teardown, this)); @@ -614,7 +618,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { this.prev_query[side] = query; } var cursor = this.cursor[this.id]; - + if (cursor[direction]()) { editor.setSelection(cursor.from(), cursor.to()); } @@ -659,7 +663,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { } this.merge_rhs_button = jQuery(merge_rhs_button); this.merge_lhs_button = jQuery(merge_lhs_button); - + // create the textarea and canvas elements var height = this.settings.editor_height; var width = this.settings.editor_width; @@ -801,23 +805,23 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { var midline = this.editor[editor_name].coordsChar({left:0, top:this.midway}); var top_to = scroller.scrollTop(); var left_to = scroller.scrollLeft(); - + this.trace('scroll', 'side', editor_name); this.trace('scroll', 'midway', this.midway); this.trace('scroll', 'midline', midline); this.trace('scroll', 'top_to', top_to); this.trace('scroll', 'left_to', left_to); - + var editor_name1 = this.id + '-lhs'; var editor_name2 = this.id + '-rhs'; - + for (var name in this.editor) { if (!this.editor.hasOwnProperty(name)) continue; if (editor_name == name) continue; //same editor var this_side = editor_name.replace(this.id + '-', ''); var other_side = name.replace(this.id + '-', ''); var top_adjust = 0; - + // find the last change that is less than or within the midway point // do not move the rhs until the lhs end point is >= the rhs end point. var last_change = null; @@ -835,14 +839,14 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { force_scroll = true; } else { - top_adjust += - (change[this_side+'-y-end'] - change[this_side+'-y-start']) - + top_adjust += + (change[this_side+'-y-end'] - change[this_side+'-y-start']) - (change[other_side+'-y-end'] - change[other_side+'-y-start']); } } } } - + var vp = this.editor[name].getViewport(); var scroll = true; if (last_change) { @@ -859,7 +863,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { this.editor[name].scrollTo(left_to, top_to - top_adjust); } else this.trace('scroll', 'not scrolling other side'); - + if (this.settings.autoupdate) { var timer = new Mgly.Timer(); this._calculate_offsets(editor_name1, editor_name2, this.changes); @@ -915,12 +919,12 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { editor.operation(clear_changes); } self.chfns[name] = []; - + var ex = this._draw_info(this.id + '-lhs', this.id + '-rhs'); var ctx_lhs = ex.clhs.get(0).getContext('2d'); var ctx_rhs = ex.crhs.get(0).getContext('2d'); var ctx = ex.dcanvas.getContext('2d'); - + ctx_lhs.beginPath(); ctx_lhs.fillStyle = this.settings.bgcolor; ctx_lhs.strokeStyle = '#888'; @@ -932,7 +936,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { ctx_rhs.strokeStyle = '#888'; ctx_rhs.fillRect(0, 0, 6.5, ex.visible_page_height); ctx_rhs.strokeRect(0, 0, 6.5, ex.visible_page_height); - + ctx.beginPath(); ctx.fillStyle = '#fff'; ctx.fillRect(0, 0, this.draw_mid_width, ex.visible_page_height); @@ -1010,16 +1014,16 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { var saveY = this.editor[editor_name1].getScrollInfo().top; // temporarily scroll to top this.editor[editor_name1].scrollTo(null, 0); - - // this is the distance from the top of the screen to the top of the + + // this is the distance from the top of the screen to the top of the // content of the first codemirror editor var topnode = this.element.find('.CodeMirror-measure').first(); var top_offset = topnode.offset().top - 4; if(!top_offset) return false; - + // restore editor's scroll position this.editor[editor_name1].scrollTo(null, saveY); - + this.draw_top_offset = 0.5 - top_offset; return true; }, @@ -1049,10 +1053,10 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { var lhschc = this.editor[editor_name1].charCoords({line: 0}); var rhschc = this.editor[editor_name2].charCoords({line: 0}); var vp = this._get_viewport(editor_name1, editor_name2); - + for (var i = 0; i < changes.length; ++i) { var change = changes[i]; - + if (!this.settings.sidebar && !this._is_change_in_view(vp, change)) { // if the change is outside the viewport, skip delete change['lhs-y-start']; @@ -1065,7 +1069,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { var llt = change['lhs-line-to'] >= 0 ? change['lhs-line-to'] : 0; var rlf = change['rhs-line-from'] >= 0 ? change['rhs-line-from'] : 0; var rlt = change['rhs-line-to'] >= 0 ? change['rhs-line-to'] : 0; - + var ls, le, rs, re, tls, tle, lhseh, lhssh, rhssh, rhseh; if (this.editor[editor_name1].getOption('lineWrapping') || this.editor[editor_name2].getOption('lineWrapping')) { // If using line-wrapping, we must get the height of the line @@ -1076,7 +1080,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { tle = this.editor[editor_name1].cursorCoords({line: llt, ch: 0}, 'page'); lhseh = this.editor[editor_name1].getLineHandle(llt); le = { top: tle.top, bottom: tle.top + lhseh.height }; - + tls = this.editor[editor_name2].cursorCoords({line: rlf, ch: 0}, 'page'); rhssh = this.editor[editor_name2].getLineHandle(rlf); rs = { top: tls.top, bottom: tls.top + rhssh.height }; @@ -1087,24 +1091,24 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { } else { // If not using line-wrapping, we can calculate the line position - ls = { - top: lhschc.top + llf * this.em_height, + ls = { + top: lhschc.top + llf * this.em_height, bottom: lhschc.bottom + llf * this.em_height + 2 }; le = { - top: lhschc.top + llt * this.em_height, + top: lhschc.top + llt * this.em_height, bottom: lhschc.bottom + llt * this.em_height + 2 }; rs = { - top: rhschc.top + rlf * this.em_height, + top: rhschc.top + rlf * this.em_height, bottom: rhschc.bottom + rlf * this.em_height + 2 }; re = { - top: rhschc.top + rlt * this.em_height, + top: rhschc.top + rlt * this.em_height, bottom: rhschc.bottom + rlt * this.em_height + 2 }; } - + if (change['op'] == 'a') { // adds (right), normally start from the end of the lhs, // except for the case when the start of the rhs is 0 @@ -1143,7 +1147,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { }, _markup_changes: function (editor_name1, editor_name2, changes) { this.element.find('.merge-button').remove(); //clear - + var self = this; var led = this.editor[editor_name1]; var red = this.editor[editor_name2]; @@ -1157,11 +1161,11 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { var llt = change['lhs-line-to'] >= 0 ? change['lhs-line-to'] : 0; var rlf = change['rhs-line-from'] >= 0 ? change['rhs-line-from'] : 0; var rlt = change['rhs-line-to'] >= 0 ? change['rhs-line-to'] : 0; - + var clazz = ['mergely', 'lhs', change['op'], 'cid-' + i]; led.addLineClass(llf, 'background', 'start'); led.addLineClass(llt, 'background', 'end'); - + if (current_diff == i) { if (llf != llt) { led.addLineClass(llf, 'background', 'current'); @@ -1179,7 +1183,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { led.addLineClass(j, 'background', clazz.join(' ')); } } - + if (!red.getOption('readOnly')) { // add widgets to lhs, if rhs is not read only var rhs_button = self.merge_rhs_button.clone(); @@ -1195,7 +1199,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { }); var vp = this._get_viewport(editor_name1, editor_name2); - + this.trace('change', 'markup lhs-editor time', timer.stop()); red.operation(function() { for (var i = 0; i < changes.length; ++i) { @@ -1204,12 +1208,12 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { var llt = change['lhs-line-to'] >= 0 ? change['lhs-line-to'] : 0; var rlf = change['rhs-line-from'] >= 0 ? change['rhs-line-from'] : 0; var rlt = change['rhs-line-to'] >= 0 ? change['rhs-line-to'] : 0; - + if (!self._is_change_in_view(vp, change)) { // if the change is outside the viewport, skip continue; } - + var clazz = ['mergely', 'rhs', change['op'], 'cid-' + i]; red.addLineClass(rlf, 'background', 'start'); red.addLineClass(rlt, 'background', 'end'); @@ -1246,7 +1250,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { } }); this.trace('change', 'markup rhs-editor time', timer.stop()); - + // mark text deleted, LCS changes var marktext = [], i, j, k, p; for (i = 0; this.settings.lcs && i < changes.length; ++i) { @@ -1255,7 +1259,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { var llt = change['lhs-line-to'] >= 0 ? change['lhs-line-to'] : 0; var rlf = change['rhs-line-from'] >= 0 ? change['rhs-line-from'] : 0; var rlt = change['rhs-line-to'] >= 0 ? change['rhs-line-to'] : 0; - + if (!this._is_change_in_view(vp, change)) { // if the change is outside the viewport, skip continue; @@ -1271,7 +1275,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { } else if (change['op'] == 'c') { // apply LCS changes to each line - for (j = llf, k = rlf, p = 0; + for (j = llf, k = rlf, p = 0; ((j >= 0) && (j <= llt)) || ((k >= 0) && (k <= rlt)); ++j, ++k) { var lhs_line, rhs_line; @@ -1302,7 +1306,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { } } this.trace('change', 'LCS marktext time', timer.stop()); - + // mark changes outside closure led.operation(function() { // apply lhs markup @@ -1322,7 +1326,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { }); this.trace('change', 'LCS markup time', timer.stop()); - + // merge buttons var ed = {lhs:led, rhs:red}; this.element.find('.merge-button').on('click', function(ev){ @@ -1389,7 +1393,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { var text = ed[side].getRange( CodeMirror.Pos(change[side + '-line-from'], 0), CodeMirror.Pos(change[side + '-line-to'] + 1, 0)); - + if (change['op'] == 'c') { ed[oside].replaceRange(text, CodeMirror.Pos(change[oside + '-line-from'], 0), @@ -1467,14 +1471,14 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { this.trace('draw', 'visible_page_ratio', ex.visible_page_ratio); this.trace('draw', 'lhs-scroller-top', ex.lhs_scroller.scrollTop()); this.trace('draw', 'rhs-scroller-top', ex.rhs_scroller.scrollTop()); - + jQuery.each(this.element.find('canvas'), function () { jQuery(this).get(0).height = ex.visible_page_height; }); - + ex.clhs.unbind('click'); ex.crhs.unbind('click'); - + ctx_lhs.beginPath(); ctx_lhs.fillStyle = this.settings.bgcolor; ctx_lhs.strokeStyle = '#888'; @@ -1516,29 +1520,29 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { ctx_rhs.lineWidth = 0.5; ctx_rhs.fillRect(1.5, rhs_y_start, 4.5, Math.max(rhs_y_end - rhs_y_start, 5)); ctx_rhs.strokeRect(1.5, rhs_y_start, 4.5, Math.max(rhs_y_end - rhs_y_start, 5)); - + if (!this._is_change_in_view(vp, change)) { continue; } - + lhs_y_start = change['lhs-y-start']; lhs_y_end = change['lhs-y-end']; rhs_y_start = change['rhs-y-start']; rhs_y_end = change['rhs-y-end']; - + var radius = 3; - + // draw left box ctx.beginPath(); ctx.strokeStyle = fill; ctx.lineWidth = (this._current_diff==i) ? 1.5 : 1; - + var rectWidth = this.draw_lhs_width; var rectHeight = lhs_y_end - lhs_y_start - 1; var rectX = this.draw_lhs_min; var rectY = lhs_y_start; // top and top top-right corner - + // draw left box ctx.moveTo(rectX, rectY); if (navigator.appName == 'Microsoft Internet Explorer') { @@ -1559,7 +1563,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { ctx.lineTo(rectX, rectY + rectHeight); } ctx.stroke(); - + rectWidth = this.draw_rhs_width; rectHeight = rhs_y_end - rhs_y_start - 1; rectX = this.draw_rhs_max; @@ -1583,7 +1587,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { ctx.lineTo(rectX, rectY + rectHeight); } ctx.stroke(); - + // connect boxes var cx = this.draw_lhs_min + this.draw_lhs_width; var cy = lhs_y_start + (lhs_y_end + 1 - lhs_y_start) / 2.0; @@ -1606,7 +1610,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { // visible window feedback ctx_lhs.fillStyle = this.settings.vpcolor; ctx_rhs.fillStyle = this.settings.vpcolor; - + var lto = ex.clhs.height() * ex.visible_page_ratio; var lfrom = (ex.lhs_scroller.scrollTop() / ex.gutter_height) * ex.clhs.height(); var rto = ex.crhs.height() * ex.visible_page_ratio; @@ -1617,10 +1621,10 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { this.trace('draw', 'visible_page_ratio', ex.visible_page_ratio); this.trace('draw', 'lhs from', lfrom, 'lhs to', lto); this.trace('draw', 'rhs from', rfrom, 'rhs to', rto); - + ctx_lhs.fillRect(1.5, lfrom, 4.5, lto); ctx_rhs.fillRect(1.5, rfrom, 4.5, rto); - + ex.clhs.click(function (ev) { var y = ev.pageY - ex.lhs_xyoffset.top - (lto / 2); var sto = Math.max(0, (y / mcanvas_lhs.height) * ex.lhs_scroller.get(0).scrollHeight); @@ -1628,7 +1632,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { }); ex.crhs.click(function (ev) { var y = ev.pageY - ex.rhs_xyoffset.top - (rto / 2); - var sto = Math.max(0, (y / mcanvas_rhs.height) * ex.rhs_scroller.get(0).scrollHeight); + var sto = Math.max(0, (y / mcanvas_rhs.height) * ex.rhs_scroller.get(0).scrollHeight); ex.rhs_scroller.scrollTop(sto); }); }, @@ -1636,14 +1640,14 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { if(this.settings._debug.indexOf(name) >= 0) { arguments[0] = name + ':'; console.log([].slice.apply(arguments)); - } + } } }); jQuery.pluginMaker = function(plugin) { // add the plugin function as a jQuery plugin jQuery.fn[plugin.prototype.name] = function(options) { - // get the arguments + // get the arguments var args = jQuery.makeArray(arguments), after = args.slice(1); var rc; From d761609e54fbb0500cce983a35ea5956a8e093df Mon Sep 17 00:00:00 2001 From: zhudock Date: Tue, 28 Feb 2017 15:55:52 -0500 Subject: [PATCH 2/2] Add wrapdiff option for scrollToDiff next\prev to wrap to start\end of text. resolves #57 --- lib/mergely.js | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/lib/mergely.js b/lib/mergely.js index 80447c4..0f48af3 100644 --- a/lib/mergely.js +++ b/lib/mergely.js @@ -395,6 +395,7 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { viewport: false, ignorews: false, ignorecase: false, + wrapdiff: false, fadein: 'fast', editor_width: '650px', editor_height: '400px', @@ -498,10 +499,18 @@ jQuery.extend(Mgly.CodeMirrorDiffView.prototype, { scrollToDiff: function(direction) { if (!this.changes.length) return; if (direction == 'next') { - this._current_diff = Math.min(++this._current_diff, this.changes.length - 1); + if (this.settings.wrapdiff && this._current_diff == this.changes.length -1) { + this._current_diff = 0; + } else { + this._current_diff = Math.min(++this._current_diff, this.changes.length - 1); + } } else if (direction == 'prev') { - this._current_diff = Math.max(--this._current_diff, 0); + if (this.settings.wrapdiff && this._current_diff == 0) { + this._current_diff = this.changes.length - 1; + } else { + this._current_diff = Math.max(--this._current_diff, 0); + } } this._scroll_to_change(this.changes[this._current_diff]); this._changed(this.id + '-lhs', this.id + '-rhs');