<commit_before>import { updateStarPath } from './shapes.js'
import { updateUrlQuery } from './url.js'

const sliders = new Map()
sliders.add = function addSlider(slider) {
  this.set(slider.name, slider)
}

class Slider {
  constructor(name, urlKey, defaultValue, initialValue) {
    this.name = name
    this._element = document.getElementById(name)
    this._output = document.getElementById(`${name}-value`)
    this._section = document.getElementById(`${name}-section`)
    this._isVisible = true
    this._urlKey = urlKey

    this._element.addEventListener('input', (event) => {
      this._updateText(event.currentTarget.value)
      updateStarPath()
      this.updateBackground()  // This is not needed for IE, and not called because IE only does change events
    })
    this._element.addEventListener('change', (event) => {
      this._updateText(event.currentTarget.value)
      updateStarPath()
      updateUrlQuery(this._urlKey, event.currentTarget.value)
    })
    const value = initialValue === undefined ? defaultValue : initialValue
    this._element.value = value
    this._updateText(value)

    this.initializeCssRules()
  }

  val() {
    return this._element.value
  }

  show() {
    if (this._isVisible) {
      return this
    }

    this._section.style.display = ''
    this.updateBackground()
    this._isVisible = true
    return this
  }

  hide() {
    if (!this._isVisible) {
      return this
    }

    this._section.style.display = 'none'
    this._isVisible = false
    return this
  }

  _format(value) {
    return value
  }

  _updateText(value) {
    this._output.textContent = this._format(value)
  }

  initializeCssRules() {
    const stylesheet = document.styleSheets[0]
    const property = this.calculateCssForBackground()
    let ruleIndex
    try {
      ruleIndex = stylesheet.insertRule(
        `#${this.name}::-webkit-slider-runnable-track {${property} }`,
        stylesheet.cssRules.length)
    } catch (e) {
      if (e.name !== 'SyntaxError') {
        throw e
      }
      try {
        ruleIndex = stylesheet.insertRule(
          `#${this.name}::-moz-range-track {${property}}`,
          stylesheet.cssRules.length)
      } catch (e2) {
        if (e2.name !== 'SyntaxError') {
          throw e2
        }
      }
    }
    if (ruleIndex !== undefined) {
      this.dynamicStyle = stylesheet.cssRules[ruleIndex].style
    } else {
      this.dynamicStyle = null
    }
  }
  calculateCssForBackground() {
    const thumbWidth = 20  // If the CSS for the thumb width changes, so must this line
    const trackWidth = this._element.scrollWidth
    const minFilledFraction = (thumbWidth / 2) / trackWidth
    const fillableFraction = (trackWidth - thumbWidth) / trackWidth

    const min = this._element.min
    const max = this._element.max
    const current = this.val()

    const currentFraction = (current - min) / (max - min)
    const filledFraction = (fillableFraction * currentFraction) + minFilledFraction
    const filledPercent = filledFraction * 100

    return `background-size: ${filledPercent}% 100%, 100% 100%`
  }
  updateBackground() {
    if (this.dynamicStyle !== null) {
      const property = this.calculateCssForBackground()
      this.dynamicStyle.cssText = property
    }
  }
}


class PercentSlider extends Slider {
  _format(value) {
    return `${value}%`
  }
}

export function initializeSliders(options) {
  sliders.add(new Slider('inner-radius', 'r', 1 - (2 / (1 + Math.sqrt(5))), options.r))
  sliders.add(new PercentSlider('straight-percentage', 'l', 75, options.l))
  sliders.add(new PercentSlider('control-percentage', 'c', 100, options.c))
  sliders.add(new Slider('control-angle', 'ca', 180, options.ca))
  sliders.add(new Slider('control-distance', 'cd', 0.15, options.cd))
}

export function resizeSliders() {
  for (const slider of sliders.values()) {
    slider.updateBackground()
  }<commit_msg>Removed _ to mark private members of Slider since the entire class is private to its module.<commit_after>import { updateStarPath } from './shapes.js'
import { updateUrlQuery } from './url.js'

const sliders = new Map()
sliders.add = function addSlider(slider) {
  this.set(slider.name, slider)
}

class Slider {
  constructor(name, urlKey, defaultValue, initialValue) {
    this.name = name
    this.element = document.getElementById(name)
    this.output = document.getElementById(`${name}-value`)
    this.section = document.getElementById(`${name}-section`)
    this.isVisible = true
    this.urlKey = urlKey

    this.element.addEventListener('input', (event) => {
      this.updateText(event.currentTarget.value)
      updateStarPath()
      this.updateBackground()  // This is not needed for IE, and not called because IE only does change events
    })
    this.element.addEventListener('change', (event) => {
      this.updateText(event.currentTarget.value)
      updateStarPath()
      updateUrlQuery(this.urlKey, event.currentTarget.value)
    })
    const value = initialValue === undefined ? defaultValue : initialValue
    this.element.value = value
    this.updateText(value)

    this.initializeCssRules()
  }

  val() {
    return this.element.value
  }

  show() {
    if (this.isVisible) {
      return this
    }

    this.section.style.display = ''
    this.updateBackground()
    this.isVisible = true
    return this
  }

  hide() {
    if (!this.isVisible) {
      return this
    }

    this.section.style.display = 'none'
    this.isVisible = false
    return this
  }

  format(value) {
    return value
  }

  updateText(value) {
    this.output.textContent = this.format(value)
  }

  initializeCssRules() {
    const stylesheet = document.styleSheets[0]
    const property = this.calculateCssForBackground()
    let ruleIndex
    try {
      ruleIndex = stylesheet.insertRule(
        `#${this.name}::-webkit-slider-runnable-track {${property} }`,
        stylesheet.cssRules.length)
    } catch (e) {
      if (e.name !== 'SyntaxError') {
        throw e
      }
      try {
        ruleIndex = stylesheet.insertRule(
          `#${this.name}::-moz-range-track {${property}}`,
          stylesheet.cssRules.length)
      } catch (e2) {
        if (e2.name !== 'SyntaxError') {
          throw e2
        }
      }
    }
    if (ruleIndex !== undefined) {
      this.dynamicStyle = stylesheet.cssRules[ruleIndex].style
    } else {
      this.dynamicStyle = null
    }
  }
  calculateCssForBackground() {
    const thumbWidth = 20  // If the CSS for the thumb width changes, so must this line
    const trackWidth = this.element.scrollWidth
    const minFilledFraction = (thumbWidth / 2) / trackWidth
    const fillableFraction = (trackWidth - thumbWidth) / trackWidth

    const min = this.element.min
    const max = this.element.max
    const current = this.val()

    const currentFraction = (current - min) / (max - min)
    const filledFraction = (fillableFraction * currentFraction) + minFilledFraction
    const filledPercent = filledFraction * 100

    return `background-size: ${filledPercent}% 100%, 100% 100%`
  }
  updateBackground() {
    if (this.dynamicStyle !== null) {
      const property = this.calculateCssForBackground()
      this.dynamicStyle.cssText = property
    }
  }
}


class PercentSlider extends Slider {
  format(value) {
    return `${value}%`
  }
}

export function initializeSliders(options) {
  sliders.add(new Slider('inner-radius', 'r', 1 - (2 / (1 + Math.sqrt(5))), options.r))
  sliders.add(new PercentSlider('straight-percentage', 'l', 75, options.l))
  sliders.add(new PercentSlider('control-percentage', 'c', 100, options.c))
  sliders.add(new Slider('control-angle', 'ca', 180, options.ca))
  sliders.add(new Slider('control-distance', 'cd', 0.15, options.cd))
}

export function resizeSliders() {
  for (const slider of sliders.values()) {
    slider.updateBackground()
  }
{'fraction_non_alphanumeric': 0.1263386027536971, 'fraction_numerical': 0.008669046404895462, 'mean_word_length': 3.002551020408163, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 7, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1494074', 'n_tokens_mistral': 2474, 'n_tokens_neox': 2378, 'n_words': 535}