import { elt, removeChildren } from "../util/dom.js"
import { regChange } from "./view_tracking.js"
import { alignHorizontally } from "./line_numbers.js"
import { updateGutterSpace } from "./update_display.js"

export function getGutters(gutters, lineNumbers) {
  let result = [], sawLineNumbers = false
  for (let i = 0; i < gutters.length; i++) {
    let name = gutters[i], style = null
    if (typeof name != "string") { style = name.style; name = name.className }
    if (name == "CodeMirror-linenumbers") {
      if (!lineNumbers) continue
      else sawLineNumbers = true
    }
    result.push({className: name, style})
  }
  if (lineNumbers && !sawLineNumbers) result.push({className: "CodeMirror-linenumbers", style: null})
  return result
}

// Rebuild the gutter elements, ensure the margin to the left of the
// code matches their width.
export function renderGutters(display) {
  let gutters = display.gutters, specs = display.gutterSpecs
  removeChildren(gutters)
  display.lineGutter = null
  for (let i = 0; i < specs.length; ++i) {
    let {className, style} = specs[i]
    let gElt = gutters.appendChild(elt("div", null, "CodeMirror-gutter " + className))
    if (style) gElt.style.cssText = style
    if (className == "CodeMirror-linenumbers") {
      display.lineGutter = gElt
      gElt.style.width = (display.lineNumWidth || 1) + "px"
    }
  }
  gutters.style.display = specs.length ? "" : "none"
  updateGutterSpace(display)
}

export function updateGutters(cm) {
  renderGutters(cm.display)
  regChange(cm)
  alignHorizontally(cm)
}