text: export default {
    randomId() {
      return Math.random().toString(36).substring(7)
    },
  
    // gets canvas style from css properties
    fillStyle(style, svg) {
      let pseudo = null
      let id = 'picker-' + this.randomId()
      let el = this.canvasPicker(style, id)
      // to replace 'px'
      svg.appendChild(el)
      let props = {
        fillStyle: 'fill',
        strokeStyle: 'stroke',
        lineWidth: 'stroke-width',
        fontFamily: 'font-family'
      }
      style = this.mapStyle(id, props, style, pseudo)
      svg.removeChild(el)
      return style
    },
    mapStyle(id, props, style, pseudo, numberValues) {
      let cStyle = window.getComputedStyle(document.getElementById(id), pseudo)
      numberValues = numberValues || ['lineWidth']
      for (let p in props) {
        let value = cStyle.getPropertyValue(props[p])
        if (numberValues.indexOf(p) > -1) value = parseInt(value, 10)
        if (value) {
          style[p] = value
        }
      }
      return style
    },
    // creates svg elements to pick css properties
    canvasPicker(style, id) {
      let attrs = style._svgAttrs || {}
      let element = style._svgElement || 'circle'
      if (!style._svgAttrs) {
        switch (element) {
          case 'text':
            attrs = { x: 10, y: 10, fontSize: 20 }
            break
          case 'circle':
            attrs = { cx: 10, cy: 10, r: 10 }
            break
        }
      }
      attrs.class = style._cssClass
      attrs.id = id
      return this.svgCreate(element, attrs)
    },
    compColor(color) {
      let el = document.createElement('div')
      el.style.backgroundColor = color
      document.body.appendChild(el)
      let nColor = window
        .getComputedStyle(el, null)
        .getPropertyValue('background-color')
      document.body.removeChild(el)
      return nColor
    },
    // creates svg element
    svgCreate(element, attrs) {
      let el = document.createElementNS('http://www.w3.org/2000/svg', element)
      for (let a in attrs) {
        el.setAttributeNS(null, a, attrs[a])
      }
      return el
    },
    create(element, idPref, appendTo) {
      appendTo = appendTo || 'body'
      let el = document.createElement(element)
      let id = idPref || ''
      id += this.randomId()
      el.setAttribute('id', id)
      document[appendTo].appendChild(el)
      return el
    }
  }
  