From bb91581b0a3ab11ca325445d621d814de5a84c97 Mon Sep 17 00:00:00 2001
From: Marijn Haverbeke <marijn@haverbeke.nl>
Date: Thu, 2 Jun 2016 10:16:18 +0200
Subject: [PATCH] [rulers addon] Make sure rulers don't cause scrollbars

Closes #4042
---
 addon/display/rulers.js | 38 +++++++++++++-------------------------
 lib/codemirror.css      |  6 ++++++
 2 files changed, 19 insertions(+), 25 deletions(-)

diff --git a/addon/display/rulers.js b/addon/display/rulers.js
index 01f65667c4..730054473a 100644
--- a/addon/display/rulers.js
+++ b/addon/display/rulers.js
@@ -11,30 +11,26 @@
 })(function(CodeMirror) {
   "use strict";
 
-  CodeMirror.defineOption("rulers", false, function(cm, val, old) {
-    if (old && old != CodeMirror.Init) {
-      clearRulers(cm);
-      cm.off("refresh", refreshRulers);
+  CodeMirror.defineOption("rulers", false, function(cm, val) {
+    if (cm.state.rulerDiv) {
+      cm.display.lineSpace.removeChild(cm.state.rulerDiv)
+      cm.state.rulerDiv = null
+      cm.off("refresh", drawRulers)
     }
     if (val && val.length) {
-      setRulers(cm);
-      cm.on("refresh", refreshRulers);
+      cm.state.rulerDiv = cm.display.lineSpace.insertBefore(document.createElement("div"), cm.display.cursorDiv)
+      cm.state.rulerDiv.className = "CodeMirror-rulers"
+      drawRulers(cm)
+      cm.on("refresh", drawRulers)
     }
   });
 
-  function clearRulers(cm) {
-    for (var i = cm.display.lineSpace.childNodes.length - 1; i >= 0; i--) {
-      var node = cm.display.lineSpace.childNodes[i];
-      if (/(^|\s)CodeMirror-ruler($|\s)/.test(node.className))
-        node.parentNode.removeChild(node);
-    }
-  }
-
-  function setRulers(cm) {
+  function drawRulers(cm) {
+    cm.state.rulerDiv.textContent = ""
     var val = cm.getOption("rulers");
     var cw = cm.defaultCharWidth();
     var left = cm.charCoords(CodeMirror.Pos(cm.firstLine(), 0), "div").left;
-    var minH = cm.display.scroller.offsetHeight + 30;
+    cm.state.rulerDiv.style.minHeight = (cm.display.scroller.offsetHeight + 30) + "px";
     for (var i = 0; i < val.length; i++) {
       var elt = document.createElement("div");
       elt.className = "CodeMirror-ruler";
@@ -49,15 +45,7 @@
         if (conf.width) elt.style.borderLeftWidth = conf.width;
       }
       elt.style.left = (left + col * cw) + "px";
-      elt.style.top = "-50px";
-      elt.style.bottom = "-20px";
-      elt.style.minHeight = minH + "px";
-      cm.display.lineSpace.insertBefore(elt, cm.display.cursorDiv);
+      cm.state.rulerDiv.appendChild(elt)
     }
   }
-
-  function refreshRulers(cm) {
-    clearRulers(cm);
-    setRulers(cm);
-  }
 });
diff --git a/lib/codemirror.css b/lib/codemirror.css
index 4bd815eb54..1e24ed8f7e 100644
--- a/lib/codemirror.css
+++ b/lib/codemirror.css
@@ -88,8 +88,14 @@
 
 .cm-tab { display: inline-block; text-decoration: inherit; }
 
+.CodeMirror-rulers {
+  position: absolute;
+  left: 0; right: 0; top: -50px; bottom: -20px;
+  overflow: hidden;
+}
 .CodeMirror-ruler {
   border-left: 1px solid #ccc;
+  top: 0; bottom: 0;
   position: absolute;
 }