Convert some classes to ES6

src/display/scrollbars.js

@@ -3,7 +3,7 @@ import { on } from "../util/event"
 import { scrollGap, paddingVert } from "../measurement/position_measurement"
 import { ie, ie_version, mac, mac_geMountainLion } from "../util/browser"
 import { updateHeightsInViewport } from "./update_lines"
-import { copyObj, Delayed } from "../util/misc"
+import { Delayed } from "../util/misc"
 
 import { setScrollLeft, setScrollTop } from "./scroll_events"
 
@@ -27,26 +27,26 @@ export function measureForScrollbars(cm) {
   }
 }
 
-function NativeScrollbars(place, scroll, cm) {
-  this.cm = cm
-  let vert = this.vert = elt("div", [elt("div", null, null, "min-width: 1px")], "CodeMirror-vscrollbar")
-  let horiz = this.horiz = elt("div", [elt("div", null, null, "height: 100%; min-height: 1px")], "CodeMirror-hscrollbar")
-  place(vert); place(horiz)
-
-  on(vert, "scroll", () => {
-    if (vert.clientHeight) scroll(vert.scrollTop, "vertical")
-  })
-  on(horiz, "scroll", () => {
-    if (horiz.clientWidth) scroll(horiz.scrollLeft, "horizontal")
-  })
-
-  this.checkedZeroWidth = false
-  // Need to set a minimum width to see the scrollbar on IE7 (but must not set it on IE8).
-  if (ie && ie_version < 8) this.horiz.style.minHeight = this.vert.style.minWidth = "18px"
-}
+class NativeScrollbars {
+  constructor(place, scroll, cm) {
+    this.cm = cm
+    let vert = this.vert = elt("div", [elt("div", null, null, "min-width: 1px")], "CodeMirror-vscrollbar")
+    let horiz = this.horiz = elt("div", [elt("div", null, null, "height: 100%; min-height: 1px")], "CodeMirror-hscrollbar")
+    place(vert); place(horiz)
+
+    on(vert, "scroll", () => {
+      if (vert.clientHeight) scroll(vert.scrollTop, "vertical")
+    })
+    on(horiz, "scroll", () => {
+      if (horiz.clientWidth) scroll(horiz.scrollLeft, "horizontal")
+    })
+
+    this.checkedZeroWidth = false
+    // Need to set a minimum width to see the scrollbar on IE7 (but must not set it on IE8).
+    if (ie && ie_version < 8) this.horiz.style.minHeight = this.vert.style.minWidth = "18px"
+  }
 
-NativeScrollbars.prototype = copyObj({
-  update: function(measure) {
+  update(measure) {
     let needsH = measure.scrollWidth > measure.clientWidth + 1
     let needsV = measure.scrollHeight > measure.clientHeight + 1
     let sWidth = measure.nativeBarWidth
@@ -81,23 +81,27 @@ NativeScrollbars.prototype = copyObj({
     }
 
     return {right: needsV ? sWidth : 0, bottom: needsH ? sWidth : 0}
-  },
-  setScrollLeft: function(pos) {
+  }
+
+  setScrollLeft(pos) {
     if (this.horiz.scrollLeft != pos) this.horiz.scrollLeft = pos
     if (this.disableHoriz) this.enableZeroWidthBar(this.horiz, this.disableHoriz)
-  },
-  setScrollTop: function(pos) {
+  }
+
+  setScrollTop(pos) {
     if (this.vert.scrollTop != pos) this.vert.scrollTop = pos
     if (this.disableVert) this.enableZeroWidthBar(this.vert, this.disableVert)
-  },
-  zeroWidthHack: function() {
+  }
+
+  zeroWidthHack() {
     let w = mac && !mac_geMountainLion ? "12px" : "18px"
     this.horiz.style.height = this.vert.style.width = w
     this.horiz.style.pointerEvents = this.vert.style.pointerEvents = "none"
     this.disableHoriz = new Delayed
     this.disableVert = new Delayed
-  },
-  enableZeroWidthBar: function(bar, delay) {
+  }
+
+  enableZeroWidthBar(bar, delay) {
     bar.style.pointerEvents = "auto"
     function maybeDisable() {
       // To find out whether the scrollbar is still visible, we
@@ -112,22 +116,21 @@ NativeScrollbars.prototype = copyObj({
       else delay.set(1000, maybeDisable)
     }
     delay.set(1000, maybeDisable)
-  },
-  clear: function() {
+  }
+
+  clear() {
     let parent = this.horiz.parentNode
     parent.removeChild(this.horiz)
     parent.removeChild(this.vert)
   }
-}, NativeScrollbars.prototype)
-
-function NullScrollbars() {}
+}
 
-NullScrollbars.prototype = copyObj({
-  update: function() { return {bottom: 0, right: 0} },
-  setScrollLeft: function() {},
-  setScrollTop: function() {},
-  clear: function() {}
-}, NullScrollbars.prototype)
+class NullScrollbars {
+  update() { return {bottom: 0, right: 0} }
+  setScrollLeft() {}
+  setScrollTop() {}
+  clear() {}
+}
 
 export function updateScrollbars(cm, measure) {
   if (!measure) measure = measureForScrollbars(cm)

src/display/update_display.js

@@ -17,28 +17,30 @@ import { adjustView, countDirtyView, resetView } from "./view_tracking"
 
 // DISPLAY DRAWING
 
-export function DisplayUpdate(cm, viewport, force) {
-  let display = cm.display
-
-  this.viewport = viewport
-  // Store some values that we'll need later (but don't want to force a relayout for)
-  this.visible = visibleLines(display, cm.doc, viewport)
-  this.editorIsHidden = !display.wrapper.offsetWidth
-  this.wrapperHeight = display.wrapper.clientHeight
-  this.wrapperWidth = display.wrapper.clientWidth
-  this.oldDisplayWidth = displayWidth(cm)
-  this.force = force
-  this.dims = getDimensions(cm)
-  this.events = []
-}
+export class DisplayUpdate {
+  constructor(cm, viewport, force) {
+    let display = cm.display
+
+    this.viewport = viewport
+    // Store some values that we'll need later (but don't want to force a relayout for)
+    this.visible = visibleLines(display, cm.doc, viewport)
+    this.editorIsHidden = !display.wrapper.offsetWidth
+    this.wrapperHeight = display.wrapper.clientHeight
+    this.wrapperWidth = display.wrapper.clientWidth
+    this.oldDisplayWidth = displayWidth(cm)
+    this.force = force
+    this.dims = getDimensions(cm)
+    this.events = []
+  }
 
-DisplayUpdate.prototype.signal = function(emitter, type) {
-  if (hasHandler(emitter, type))
-    this.events.push(arguments)
-}
-DisplayUpdate.prototype.finish = function() {
-  for (let i = 0; i < this.events.length; i++)
-    signal.apply(null, this.events[i])
+  signal(emitter, type) {
+    if (hasHandler(emitter, type))
+      this.events.push(arguments)
+  }
+  finish() {
+    for (let i = 0; i < this.events.length; i++)
+      signal.apply(null, this.events[i])
+  }
 }
 
 export function maybeClipScrollbars(cm) {

src/input/ContentEditableInput.js

@@ -12,21 +12,21 @@ import { getBidiPartAt, getOrder } from "../util/bidi"
 import { gecko, ie_version } from "../util/browser"
 import { contains, range, removeChildrenAndAdd, selectInput } from "../util/dom"
 import { on, signalDOMEvent } from "../util/event"
-import { copyObj, Delayed, lst, nothing, sel_dontScroll } from "../util/misc"
+import { Delayed, lst, sel_dontScroll } from "../util/misc"
 
 // CONTENTEDITABLE INPUT STYLE
 
-export default function ContentEditableInput(cm) {
-  this.cm = cm
-  this.lastAnchorNode = this.lastAnchorOffset = this.lastFocusNode = this.lastFocusOffset = null
-  this.polling = new Delayed()
-  this.composing = null
-  this.gracePeriod = false
-  this.readDOMTimeout = null
-}
+export default class ContentEditableInput {
+  constructor(cm) {
+    this.cm = cm
+    this.lastAnchorNode = this.lastAnchorOffset = this.lastFocusNode = this.lastFocusOffset = null
+    this.polling = new Delayed()
+    this.composing = null
+    this.gracePeriod = false
+    this.readDOMTimeout = null
+  }
 
-ContentEditableInput.prototype = copyObj({
-  init: function(display) {
+  init(display) {
     let input = this, cm = input.cm
     let div = input.div = display.lineDiv
     disableBrowserMagic(div, cm.options.spellcheck)
@@ -99,21 +99,21 @@ ContentEditableInput.prototype = copyObj({
     }
     on(div, "copy", onCopyCut)
     on(div, "cut", onCopyCut)
-  },
+  }
 
-  prepareSelection: function() {
+  prepareSelection() {
     let result = prepareSelection(this.cm, false)
     result.focus = this.cm.state.focused
     return result
-  },
+  }
 
-  showSelection: function(info, takeFocus) {
+  showSelection(info, takeFocus) {
     if (!info || !this.cm.display.view.length) return
     if (info.focus || takeFocus) this.showPrimarySelection()
     this.showMultipleSelections(info)
-  },
+  }
 
-  showPrimarySelection: function() {
+  showPrimarySelection() {
     let sel = window.getSelection(), prim = this.cm.doc.sel.primary()
     let curAnchor = domToPos(this.cm, sel.anchorNode, sel.anchorOffset)
     let curFocus = domToPos(this.cm, sel.focusNode, sel.focusOffset)
@@ -154,48 +154,48 @@ ContentEditableInput.prototype = copyObj({
       else if (gecko) this.startGracePeriod()
     }
     this.rememberSelection()
-  },
+  }
 
-  startGracePeriod: function() {
+  startGracePeriod() {
     clearTimeout(this.gracePeriod)
     this.gracePeriod = setTimeout(() => {
       this.gracePeriod = false
       if (this.selectionChanged())
         this.cm.operation(() => this.cm.curOp.selectionChanged = true)
     }, 20)
-  },
+  }
 
-  showMultipleSelections: function(info) {
+  showMultipleSelections(info) {
     removeChildrenAndAdd(this.cm.display.cursorDiv, info.cursors)
     removeChildrenAndAdd(this.cm.display.selectionDiv, info.selection)
-  },
+  }
 
-  rememberSelection: function() {
+  rememberSelection() {
     let sel = window.getSelection()
     this.lastAnchorNode = sel.anchorNode; this.lastAnchorOffset = sel.anchorOffset
     this.lastFocusNode = sel.focusNode; this.lastFocusOffset = sel.focusOffset
-  },
+  }
 
-  selectionInEditor: function() {
+  selectionInEditor() {
     let sel = window.getSelection()
     if (!sel.rangeCount) return false
     let node = sel.getRangeAt(0).commonAncestorContainer
     return contains(this.div, node)
-  },
+  }
 
-  focus: function() {
+  focus() {
     if (this.cm.options.readOnly != "nocursor") {
       if (!this.selectionInEditor())
         this.showSelection(this.prepareSelection(), true)
       this.div.focus()
     }
-  },
-  blur: function() { this.div.blur() },
-  getField: function() { return this.div },
+  }
+  blur() { this.div.blur() }
+  getField() { return this.div }
 
-  supportsTouch: function() { return true },
+  supportsTouch() { return true }
 
-  receivedFocus: function() {
+  receivedFocus() {
     let input = this
     if (this.selectionInEditor())
       this.pollSelection()
@@ -209,15 +209,15 @@ ContentEditableInput.prototype = copyObj({
       }
     }
     this.polling.set(this.cm.options.pollInterval, poll)
-  },
+  }
 
-  selectionChanged: function() {
+  selectionChanged() {
     let sel = window.getSelection()
     return sel.anchorNode != this.lastAnchorNode || sel.anchorOffset != this.lastAnchorOffset ||
       sel.focusNode != this.lastFocusNode || sel.focusOffset != this.lastFocusOffset
-  },
+  }
 
-  pollSelection: function() {
+  pollSelection() {
     if (!this.composing && this.readDOMTimeout == null && !this.gracePeriod && this.selectionChanged()) {
       let sel = window.getSelection(), cm = this.cm
       this.rememberSelection()
@@ -228,9 +228,9 @@ ContentEditableInput.prototype = copyObj({
         if (anchor.bad || head.bad) cm.curOp.selectionChanged = true
       })
     }
-  },
+  }
 
-  pollContent: function() {
+  pollContent() {
     if (this.readDOMTimeout != null) {
       clearTimeout(this.readDOMTimeout)
       this.readDOMTimeout = null
@@ -291,22 +291,22 @@ ContentEditableInput.prototype = copyObj({
       replaceRange(cm.doc, newText, chFrom, chTo, "+input")
       return true
     }
-  },
+  }
 
-  ensurePolled: function() {
+  ensurePolled() {
     this.forceCompositionEnd()
-  },
-  reset: function() {
+  }
+  reset() {
     this.forceCompositionEnd()
-  },
-  forceCompositionEnd: function() {
+  }
+  forceCompositionEnd() {
     if (!this.composing) return
     this.composing = null
     if (!this.pollContent()) regChange(this.cm)
     this.div.blur()
     this.div.focus()
-  },
-  readFromDOMSoon: function() {
+  }
+  readFromDOMSoon() {
     if (this.readDOMTimeout != null) return
     this.readDOMTimeout = setTimeout(() => {
       this.readDOMTimeout = null
@@ -314,27 +314,27 @@ ContentEditableInput.prototype = copyObj({
       if (this.cm.isReadOnly() || !this.pollContent())
         runInOp(this.cm, () => regChange(this.cm))
     }, 80)
-  },
+  }
 
-  setUneditable: function(node) {
+  setUneditable(node) {
     node.contentEditable = "false"
-  },
+  }
 
-  onKeyPress: function(e) {
+  onKeyPress(e) {
     e.preventDefault()
     if (!this.cm.isReadOnly())
       operation(this.cm, applyTextInput)(this.cm, String.fromCharCode(e.charCode == null ? e.keyCode : e.charCode), 0)
-  },
+  }
 
-  readOnlyChanged: function(val) {
+  readOnlyChanged(val) {
     this.div.contentEditable = String(val != "nocursor")
-  },
+  }
 
-  onContextMenu: nothing,
-  resetPosition: nothing,
+  onContextMenu() {}
+  resetPosition() {}
+}
 
-  needsContentAttribute: true
-  }, ContentEditableInput.prototype)
+ContentEditableInput.prototype.needsContentAttribute = true
 
 function posToDOM(cm, pos) {
   let view = findViewForLine(cm, pos.line)

src/input/TextareaInput.js

@@ -9,31 +9,31 @@ import { captureRightClick, ie, ie_version, ios, mac, mobile, presto, webkit } f
 import { activeElt, removeChildrenAndAdd, selectInput } from "../util/dom"
 import { e_preventDefault, e_stop, off, on, signalDOMEvent } from "../util/event"
 import { hasCopyEvent, hasSelection } from "../util/feature_detection"
-import { copyObj, Delayed, nothing, sel_dontScroll } from "../util/misc"
+import { Delayed, sel_dontScroll } from "../util/misc"
 
 // TEXTAREA INPUT STYLE
 
-export default function TextareaInput(cm) {
-  this.cm = cm
-  // See input.poll and input.reset
-  this.prevInput = ""
-
-  // Flag that indicates whether we expect input to appear real soon
-  // now (after some event like 'keypress' or 'input') and are
-  // polling intensively.
-  this.pollingFast = false
-  // Self-resetting timeout for the poller
-  this.polling = new Delayed()
-  // Tracks when input.reset has punted to just putting a short
-  // string into the textarea instead of the full selection.
-  this.inaccurateSelection = false
-  // Used to work around IE issue with selection being forgotten when focus moves away from textarea
-  this.hasSelection = false
-  this.composing = null
-}
-
-TextareaInput.prototype = copyObj({
-  init: function(display) {
+export default class TextareaInput {
+  constructor(cm) {
+    this.cm = cm
+    // See input.poll and input.reset
+    this.prevInput = ""
+
+    // Flag that indicates whether we expect input to appear real soon
+    // now (after some event like 'keypress' or 'input') and are
+    // polling intensively.
+    this.pollingFast = false
+    // Self-resetting timeout for the poller
+    this.polling = new Delayed()
+    // Tracks when input.reset has punted to just putting a short
+    // string into the textarea instead of the full selection.
+    this.inaccurateSelection = false
+    // Used to work around IE issue with selection being forgotten when focus moves away from textarea
+    this.hasSelection = false
+    this.composing = null
+  }
+
+  init(display) {
     let input = this, cm = this.cm
 
     // Wraps and hides input textarea
@@ -112,9 +112,9 @@ TextareaInput.prototype = copyObj({
         input.composing = null
       }
     })
-  },
+  }
 
-  prepareSelection: function() {
+  prepareSelection() {
     // Redraw the selection and/or cursor
     let cm = this.cm, display = cm.display, doc = cm.doc
     let result = prepareSelection(cm)
@@ -130,9 +130,9 @@ TextareaInput.prototype = copyObj({
     }
 
     return result
-  },
+  }
 
-  showSelection: function(drawn) {
+  showSelection(drawn) {
     let cm = this.cm, display = cm.display
     removeChildrenAndAdd(display.cursorDiv, drawn.cursors)
     removeChildrenAndAdd(display.selectionDiv, drawn.selection)
@@ -140,11 +140,11 @@ TextareaInput.prototype = copyObj({
       this.wrapper.style.top = drawn.teTop + "px"
       this.wrapper.style.left = drawn.teLeft + "px"
     }
-  },
+  }
 
   // Reset the input to correspond to the selection (or to be empty,
   // when not typing and nothing is selected)
-  reset: function(typing) {
+  reset(typing) {
     if (this.contextMenuPending) return
     let minimal, selected, cm = this.cm, doc = cm.doc
     if (cm.somethingSelected()) {
@@ -161,41 +161,41 @@ TextareaInput.prototype = copyObj({
       if (ie && ie_version >= 9) this.hasSelection = null
     }
     this.inaccurateSelection = minimal
-  },
+  }
 
-  getField: function() { return this.textarea },
+  getField() { return this.textarea }
 
-  supportsTouch: function() { return false },
+  supportsTouch() { return false }
 
-  focus: function() {
+  focus() {
     if (this.cm.options.readOnly != "nocursor" && (!mobile || activeElt() != this.textarea)) {
       try { this.textarea.focus() }
       catch (e) {} // IE8 will throw if the textarea is display: none or not in DOM
     }
-  },
+  }
 
-  blur: function() { this.textarea.blur() },
+  blur() { this.textarea.blur() }
 
-  resetPosition: function() {
+  resetPosition() {
     this.wrapper.style.top = this.wrapper.style.left = 0
-  },
+  }
 
-  receivedFocus: function() { this.slowPoll() },
+  receivedFocus() { this.slowPoll() }
 
   // Poll for input changes, using the normal rate of polling. This
   // runs as long as the editor is focused.
-  slowPoll: function() {
+  slowPoll() {
     if (this.pollingFast) return
     this.polling.set(this.cm.options.pollInterval, () => {
       this.poll()
       if (this.cm.state.focused) this.slowPoll()
     })
-  },
+  }
 
   // When an event has just come in that is likely to add or change
   // something in the input textarea, we poll faster, to ensure that
   // the change appears on the screen quickly.
-  fastPoll: function() {
+  fastPoll() {
     let missed = false, input = this
     input.pollingFast = true
     function p() {
@@ -204,7 +204,7 @@ TextareaInput.prototype = copyObj({
       else {input.pollingFast = false; input.slowPoll()}
     }
     input.polling.set(20, p)
-  },
+  }
 
   // Read input from the textarea, and update the document to match.
   // When something is selected, it is present in the textarea, and
@@ -212,7 +212,7 @@ TextareaInput.prototype = copyObj({
   // used). When nothing is selected, the cursor sits after previously
   // seen text (can be empty), which is stored in prevInput (we must
   // not reset the textarea when typing, because that breaks IME).
-  poll: function() {
+  poll() {
     let cm = this.cm, input = this.textarea, prevInput = this.prevInput
     // Since this is called a *lot*, try to bail out as cheaply as
     // possible when it is clear that nothing happened. hasSelection
@@ -259,18 +259,18 @@ TextareaInput.prototype = copyObj({
       }
     })
     return true
-  },
+  }
 
-  ensurePolled: function() {
+  ensurePolled() {
     if (this.pollingFast && this.poll()) this.pollingFast = false
-  },
+  }
 
-  onKeyPress: function() {
+  onKeyPress() {
     if (ie && ie_version >= 9) this.hasSelection = null
     this.fastPoll()
-  },
+  }
 
-  onContextMenu: function(e) {
+  onContextMenu(e) {
     let input = this, cm = input.cm, display = cm.display, te = input.textarea
     let pos = posFromMouse(cm, e), scrollPos = display.scroller.scrollTop
     if (!pos || presto) return // Opera is difficult.
@@ -346,13 +346,13 @@ TextareaInput.prototype = copyObj({
     } else {
       setTimeout(rehide, 50)
     }
-  },
+  }
 
-  readOnlyChanged: function(val) {
+  readOnlyChanged(val) {
     if (!val) this.reset()
-  },
+  }
 
-  setUneditable: nothing,
+  setUneditable() {}
+}
 
-  needsContentAttribute: false
-}, TextareaInput.prototype)
+TextareaInput.prototype.needsContentAttribute = false

src/util/misc.js

@@ -87,7 +87,7 @@ export function insertSorted(array, value, score) {
   array.splice(pos, 0, value)
 }
 
-export function nothing() {}
+function nothing() {}
 
 export function createObj(base, props) {
   let inst