Add a smoothScrolling to enable/disable canvas offset

atom-minimap · Dec 24, 2015 · 18f57c8 · 18f57c8
1 parent 24b4901
commit 18f57c8
Show file tree

Hide file tree

Showing 3 changed files with 46 additions and 8 deletions.
diff --git a/lib/config-schema.json b/lib/config-schema.json
@@ -73,6 +73,11 @@
     "default":300,
     "description":"The duration of scrolling animations when clicking on the minimap."
   },
+  "smoothScrolling": {
+    "type": "boolean",
+    "default": true,
+    "description": "Whether to offset the minimap canvas when scrolling to keep the scroll smooth. When `true` the minimap canvas will be offseted, resulting in a smoother scroll, but with the side-effect of a blurry minimap when the canvas is placed between pixels. When `false` the canvas will always stay at the same position, and will never look blurry, but the scroll will appear more jagged."
+  },
   "createPluginInDevMode":{
     "type":"boolean",
     "default":false

diff --git a/lib/minimap-element.js b/lib/minimap-element.js
@@ -243,6 +243,20 @@ export default class MinimapElement {
         if (this.attached) { this.requestForcedUpdate() }
       },
 
+      'minimap.smoothScrolling': (smoothScrolling) => {
+        this.smoothScrolling = smoothScrolling
+
+        if (this.attached) {
+          if (!this.smoothScrolling) {
+            this.backLayer.canvas.style.cssText = ''
+            this.tokensLayer.canvas.style.cssText = ''
+            this.frontLayer.canvas.style.cssText = ''
+          } else {
+            this.requestUpdate()
+          }
+        }
+      },
+
       'minimap.adjustMinimapWidthToSoftWrap': (adjustToSoftWrap) => {
         this.adjustToSoftWrap = adjustToSoftWrap
 
@@ -761,14 +775,16 @@ export default class MinimapElement {
       canvasTransform += ' ' + this.makeScale(1 / devicePixelRatio)
     }
 
-    if (SPEC_MODE) {
-      this.applyStyles(this.backLayer.canvas, {top: canvasTop + 'px'})
-      this.applyStyles(this.tokensLayer.canvas, {top: canvasTop + 'px'})
-      this.applyStyles(this.frontLayer.canvas, {top: canvasTop + 'px'})
-    } else {
-      this.applyStyles(this.backLayer.canvas, {transform: canvasTransform})
-      this.applyStyles(this.tokensLayer.canvas, {transform: canvasTransform})
-      this.applyStyles(this.frontLayer.canvas, {transform: canvasTransform})
+    if(this.smoothScrolling) {
+      if (SPEC_MODE) {
+        this.applyStyles(this.backLayer.canvas, {top: canvasTop + 'px'})
+        this.applyStyles(this.tokensLayer.canvas, {top: canvasTop + 'px'})
+        this.applyStyles(this.frontLayer.canvas, {top: canvasTop + 'px'})
+      } else {
+        this.applyStyles(this.backLayer.canvas, {transform: canvasTransform})
+        this.applyStyles(this.tokensLayer.canvas, {transform: canvasTransform})
+        this.applyStyles(this.frontLayer.canvas, {transform: canvasTransform})
+      }
     }
 
     if (this.minimapScrollIndicator && minimap.canScroll() && !this.scrollIndicator) {

diff --git a/spec/minimap-element-spec.js b/spec/minimap-element-spec.js
@@ -40,6 +40,7 @@ describe('MinimapElement', () => {
     atom.config.set('minimap.charWidth', 2)
     atom.config.set('minimap.interline', 1)
     atom.config.set('minimap.textOpacity', 1)
+    atom.config.set('minimap.smoothScrolling', true)
 
     MinimapElement.registerViewProvider(Minimap)
 
@@ -1184,6 +1185,22 @@ describe('MinimapElement', () => {
       })
     })
 
+    describe('when the smoothScrolling setting is disabled', () => {
+      beforeEach(() => {
+        atom.config.set('minimap.smoothScrolling', false)
+      })
+      it('does not offset the canvas when the scroll does not match line height', () => {
+        editorElement.setScrollTop(1004)
+
+        waitsFor(() => { return nextAnimationFrame !== noAnimationFrame })
+        runs(() => {
+          nextAnimationFrame()
+
+          expect(realOffsetTop(canvas)).toEqual(0)
+        })
+      })
+    })
+
     //     #######  ##     ## ####  ######  ##    ##
     //    ##     ## ##     ##  ##  ##    ## ##   ##
     //    ##     ## ##     ##  ##  ##       ##  ##