add setting for sync horizontal scroll #29

Author: mupchrch

CHANGELOG.md

@@ -2,6 +2,7 @@
 * Now using placeholder text to display help message #32
 * Fixed a bug where diff was updated twice on initial run
 * Fixed a bug where scroll was not synced on initial run
+* Added setting to sync horizontal scrolling #29
 
 ## 0.7.2 - 2016-04-08
 * Fixed package disabling immediately in 1.7 beta #28

README.md

@@ -26,6 +26,7 @@ To stop diffing, simply close one of the panes *or* use the `Toggle` command.
 
 * **Ignore Whitespace** - Will not diff whitespace when this box is checked.
 * **Show Word Diff** - Diffs the words between each line when this box is checked.
+* **Sync Horizontal Scroll** - Syncs the horizontal scrolling of the editors.
 * **Left Editor Color** - Specifies the highlight color for the left editor.
 * **Right Editor Color** - Specifies the highlight color for the right editor.
 

lib/build-lines.js

@@ -44,7 +44,10 @@ module.exports = class DiffViewEditor {
     this._editor.setPlaceholderText('Paste what you want to diff here!');
 
     for(var offsetLineNumber of offsetLineNumbers) {
-      if(offsetLineNumber != 0) {
+      if(offsetLineNumber == 0) {
+        // add block decoration before if adding to line 0
+        this._addOffsetDecoration(offsetLineNumber-1, lineOffsets[offsetLineNumber], 'before');
+      } else {
         // add block decoration after if adding to lines > 0
         this._addOffsetDecoration(offsetLineNumber-1, lineOffsets[offsetLineNumber], 'after');
       }

lib/config-schema.coffee

@@ -9,6 +9,11 @@ module.exports =
     description: 'Diffs the words between each line when this box is checked.'
     type: 'boolean'
     default: true
+  syncHorizontalScroll:
+    title: 'Sync Horizontal Scroll'
+    description: 'Syncs the horizontal scrolling of the editors.'
+    type: 'boolean'
+    default: false
   leftEditorColor:
     title: 'Left Editor Color'
     description: 'Specifies the highlight color for the left editor.'

lib/split-diff.coffee

@@ -114,14 +114,7 @@ module.exports = SplitDiff =
     @editorSubscriptions.add editors.editor2.onDidDestroy =>
       @disable(true)
 
-    # update diff on any settings change
-    @editorSubscriptions.add atom.config.onDidChange 'split-diff.ignoreWhitespace', ({newValue, oldValue}) =>
-      @updateDiff(editors)
-    @editorSubscriptions.add atom.config.onDidChange 'split-diff.diffWords', ({newValue, oldValue}) =>
-      @updateDiff(editors)
-    @editorSubscriptions.add atom.config.onDidChange 'split-diff.leftEditorColor', ({newValue, oldValue}) =>
-      @updateDiff(editors)
-    @editorSubscriptions.add atom.config.onDidChange 'split-diff.rightEditorColor', ({newValue, oldValue}) =>
+    @editorSubscriptions.add atom.config.onDidChange 'split-diff', () =>
       @updateDiff(editors)
 
     # manually update diff if there are already two editors
@@ -156,6 +149,7 @@ module.exports = SplitDiff =
 
     detailMsg = 'Ignore Whitespace: ' + @isWhitespaceIgnored
     detailMsg += '\nShow Word Diff: ' + @isWordDiffEnabled
+    detailMsg += '\nSync Horizontal Scroll: ' + @getConfig('syncHorizontalScroll')
     atom.notifications.addInfo('Split Diff Enabled', {detail: detailMsg, dismissable: false})
 
   # called by both diffPanes and the editor subscription to update the diff
@@ -165,6 +159,7 @@ module.exports = SplitDiff =
     @clearDiff()
     @isWhitespaceIgnored = @getConfig('ignoreWhitespace')
     @isWordDiffEnabled = @getConfig('diffWords')
+    syncHorizontalScroll = @getConfig('syncHorizontalScroll')
 
     SplitDiffCompute = require './split-diff-compute'
     computedDiff = SplitDiffCompute.computeDiff(editors.editor1.getText(), editors.editor2.getText(), @isWhitespaceIgnored)
@@ -176,7 +171,7 @@ module.exports = SplitDiff =
     if @isWordDiffEnabled
       @highlightWordDiff(SplitDiffCompute, @linkedDiffChunks)
 
-    @syncScroll = new SyncScroll(editors.editor1, editors.editor2)
+    @syncScroll = new SyncScroll(editors.editor1, editors.editor2, syncHorizontalScroll)
     @syncScroll.syncPositions()
 
   # called by "Disable" command

lib/sync-scroll.js

@@ -4,7 +4,8 @@ var {CompositeDisposable} = require('atom');
 
 class SyncScroll {
 
-  constructor(editor1: TextEditor, editor2: TextEditor) {
+  constructor(editor1: TextEditor, editor2: TextEditor, syncHorizontalScroll: boolean) {
+    this._syncHorizontalScroll = syncHorizontalScroll;
     this._subscriptions = new CompositeDisposable();
     this._syncInfo = [{
       editor: editor1,
@@ -19,6 +20,10 @@ class SyncScroll {
     this._syncInfo.forEach((editorInfo, i) => {
       // Note that 'onDidChangeScrollTop' isn't technically in the public API.
       this._subscriptions.add(editorInfo.editorView.onDidChangeScrollTop(() => this._scrollPositionChanged(i)));
+      // Note that 'onDidChangeScrollLeft' isn't technically in the public API.
+      if(this._syncHorizontalScroll) {
+        this._subscriptions.add(editorInfo.editorView.onDidChangeScrollLeft(() => this._scrollPositionChanged(i)));
+      }
       // bind this so that the editors line up on start of package
       this._subscriptions.add(editorInfo.editor.emitter.on('did-change-scroll-top', () => this._scrollPositionChanged(i)));
     });
@@ -34,6 +39,9 @@ class SyncScroll {
     otherInfo.scrolling = true;
     try {
       otherInfo.editorView.setScrollTop(thisInfo.editorView.getScrollTop());
+      if(this._syncHorizontalScroll) {
+        otherInfo.editorView.setScrollLeft(thisInfo.editorView.getScrollLeft());
+      }
     } catch (e) {
       //console.log(e);
     }