Sha256: e975fe40f8e39f7489aaba9e5ec3367b54ab098761da50f2de1e9aca6618c1a8

Contents?: true

Size: 1.51 KB

Versions: 36

Compression:

Stored size: 1.51 KB

Contents

import tippy from "tippy.js"

export default class SatisCopyable extends HTMLElement {
  constructor() {
    super()

    const shadow = this.attachShadow({ mode: "open" })

    this.textSpan = document.createElement("span")
    this.textSpan.textContent = this.textContent
    shadow.appendChild(this.textSpan)

    this.tippy = tippy(this.textSpan, { content: "Click to copy" })

    this.input = document.createElement("input")
    this.input.style.position = "fixed"
    this.input.style.bottom = 0
    this.input.style.left = 0
    this.input.style.width = "1px"
    this.input.style.height = "1px"
    this.input.style.padding = 0
    this.input.style.border = "none"
    this.input.style.outline = "none"
    this.input.style.boxShadow = "none"
    this.input.style.background = "transparent"
    this.input.value = this.textSpan.textContent.replace(this.getAttribute("scrub"), "")

    shadow.appendChild(this.input)

    this.textSpan.addEventListener("click", this.copy.bind(this))
  }

  copy(event) {
    this.input.select()

    try {
      var successful = document.execCommand("copy")
      var msg = successful ? "Copied!" : "Not copied"
      this.tippy.setContent(msg)
      this.tippy.show()
    } catch (err) {
      this.tippy.setContent("Oops, unable to copy")
      this.tippy.show()
    }
    setTimeout(() => {
      this.tippy.hide()
    }, 700)

    setTimeout(() => {
      this.tippy.setContent("Click to copy")
    }, 1000)

    window.getSelection().removeAllRanges()
    event.preventDefault()
    return false
  }
}

Version data entries

36 entries across 36 versions & 1 rubygems

Version Path
satis-2.1.43 app/javascript/satis/elements/copyable_element.js
satis-2.1.42 app/javascript/satis/elements/copyable_element.js
satis-2.1.41 app/javascript/satis/elements/copyable_element.js
satis-2.1.40 app/javascript/satis/elements/copyable_element.js
satis-2.1.39 app/javascript/satis/elements/copyable_element.js
satis-2.1.38 app/javascript/satis/elements/copyable_element.js
satis-2.1.37 app/javascript/satis/elements/copyable_element.js
satis-2.1.36 app/javascript/satis/elements/copyable_element.js
satis-2.1.35 app/javascript/satis/elements/copyable_element.js
satis-2.1.33 app/javascript/satis/elements/copyable_element.js
satis-2.1.31 app/javascript/satis/elements/copyable_element.js
satis-2.1.30 app/javascript/satis/elements/copyable_element.js
satis-2.1.29 app/javascript/satis/elements/copyable_element.js
satis-2.1.28 app/javascript/satis/elements/copyable_element.js
satis-2.1.27 app/javascript/satis/elements/copyable_element.js
satis-2.1.26 app/javascript/satis/elements/copyable_element.js
satis-2.1.24 app/javascript/satis/elements/copyable_element.js
satis-2.1.23 app/javascript/satis/elements/copyable_element.js
satis-2.1.22 app/javascript/satis/elements/copyable_element.js
satis-2.1.21 app/javascript/satis/elements/copyable_element.js