window.ve_dom = (function () {
  /** Attributes * */
  var COMMON_ANALYSIS_OPTIONS = ['font', 'border', 'background']
  var TAGNAME_TO_FILTER = ['TITLE', 'STYLE', 'META', 'LINK', 'SCRIPT', 'BASE', 'AUDIO', 'VIDEO', 'HEAD']
  var CSS_VALUE_CACHE_STORAGE

  var DEFINITION_OPTION_PROPERTIES = {
    font: [
      'font-family',
      'font-size',
      'font-weight',
      'color'
    ],
    border: [
      'border-bottom-color',
      'border-bottom-left-radius',
      'border-bottom-right-radius',
      'border-bottom-style',
      'border-bottom-width',
      'border-left-color',
      'border-left-style',
      'border-left-width',
      'border-right-color',
      'border-right-style',
      'border-right-width',
      'border-top-color',
      'border-top-left-radius',
      'border-top-right-radius',
      'border-top-style',
      'border-top-width'],
    background: [
      'background-color'
    ]
  }
  var RGBA_FORCED_PROPERTIES = ['background-color', 'border-left-color', 'border-right-color', 'border-top-color',
    'border-bottom-color', 'color']
  var HEX_REGEX = /^#(?:[A-Fa-f0-9]{3}){1,2}$/
  var RGB_REGEX = /^rgb[(](?:\s*0*(?:\d\d?(?:\.\d+)?(?:\s*%)?|\.\d+\s*%|100(?:\.0*)?\s*%|(?:1\d\d|2[0-4]\d|25[0-5])(?:\.\d+)?)\s*(?:,(?![)])|(?=[)]))){3}[)]$/

  /** Cache functions * */

  function clearCache () {
    CSS_VALUE_CACHE_STORAGE = {}
  }

  function addCache (option, value) {
    CSS_VALUE_CACHE_STORAGE[option].push(value)
  }
  function getCacheIndex (option, value) {
    if (typeof CSS_VALUE_CACHE_STORAGE[option] === 'undefined') {
      CSS_VALUE_CACHE_STORAGE[option] = []
      addCache(option, value)
      return 0
    } if (CSS_VALUE_CACHE_STORAGE[option].indexOf(value) === -1) {
      addCache(option, value)
    }
    return CSS_VALUE_CACHE_STORAGE[option].indexOf(value)
  }
  /** Loop functions * */

  function loopThroughAllElementAndPseudo (resultTemplate, allElements, cssProps) {
    cssProps.forEach(function (cssProp) {
      var optionAndResultsObject = {
        option: cssProp,
        results: []
      }
      resultTemplate.push(optionAndResultsObject)
    })

    allElements.forEach((element) => {
      if (TAGNAME_TO_FILTER.includes(element.tagName)) { return }
      loopThroughAllPseudoElement(resultTemplate, cssProps, element)
    })
    return resultTemplate
  }

  function loopThroughAllPseudoElement (resultTemplate, cssProps, element) {
    var pseudoElement = ['', ':before', ':after']
    pseudoElement.forEach((pseudo, i) => {
      let content = window.getComputedStyle(element, pseudo).content
      if (content === 'none') { return }// Si pas de pseudo element, passer au suivant
      fillPropertiesWithCssProps(resultTemplate, cssProps, element, pseudo)
    })
  }

  /** Analysis functions * */
  function fillPropertiesWithCssProps (resultTemplate, cssProps, element, pseudo) {
    cssProps.forEach(function (cssProp, i) {
      if (Array.isArray(DEFINITION_OPTION_PROPERTIES[cssProp])) { // si c'est un array
        cssProp = DEFINITION_OPTION_PROPERTIES[cssProp]
        pushIntoPropertiesByCssPropArray(cssProp, element, pseudo, resultTemplate[i])
      } else {
        pushIntoPropertiesByCssPropString(cssProp, element, pseudo, resultTemplate[i])
      }
    })
  }

  function pushIntoPropertiesByCssPropArray (cssProp, element, pseudo, optionAndResultsObject) {
    let resultTemp = {
      score: 0,
      strValue: '',
      properties: []
    }
    cssProp.forEach(function (property) {
      var elementCssPropValue = window.getComputedStyle(element, pseudo)[property]
      if (RGBA_FORCED_PROPERTIES.includes(property)) { elementCssPropValue = forcedColorToRgba(elementCssPropValue) };
      resultTemp.properties.push({ property: property, value: elementCssPropValue })
      resultTemp.strValue += getCacheIndex(cssProp, elementCssPropValue)
      // resultTemp.strValue += elementCssPropValue
    })
    if (optionAndResultsObject.results.length === 0) {
      optionAndResultsObject.results.push(resultTemp)// premier push
    } else {
      for (var i = 0; i < optionAndResultsObject.results.length; i++) {
        if (optionAndResultsObject.results[i].strValue === resultTemp.strValue) {
          optionAndResultsObject.results[i].score++
          break
        } else if (i === optionAndResultsObject.results.length - 1) {
          optionAndResultsObject.results.push(resultTemp)
        }
      }
    }
  }

  function pushIntoPropertiesByCssPropString (cssProp, element, pseudo, optionAndResultsObject) {
    var elementCssPropValue = window.getComputedStyle(element, pseudo)[cssProp]
    if (RGBA_FORCED_PROPERTIES.includes(cssProp)) { elementCssPropValue = forcedColorToRgba(elementCssPropValue) };
    let resultTemp = {
      score: 0,
      strValue: '',
      properties: [{ property: cssProp, value: elementCssPropValue }]
    }
    if (optionAndResultsObject.results.length === 0) {
      optionAndResultsObject.results.push(resultTemp) // premier push pour avoir de quoi comparer
    } else {
      for (var i = 0; i < optionAndResultsObject.results.length; i++) {
        if (optionAndResultsObject.results[i].strValue === resultTemp.strValue) {
          optionAndResultsObject.results[i].score++
          break
        } else if (i === optionAndResultsObject.results.length - 1) {
          optionAndResultsObject.results.push(resultTemp)
        }
      }
    }
  }

  /** Color converter functions * */

  function forcedColorToRgba (colorProp) {
    if (HEX_REGEX.test(colorProp)) {
      colorProp = hexToRgba(colorProp)
    } else if (RGB_REGEX.test(colorProp)) {
      colorProp = rgbToRgba(colorProp)
    }
    return colorProp
  }

  // RGB to RGBA
  function rgbToRgba (rgb) {
    function insert (string, index, stringToInsert) {
      if (index > 0) { return string.substring(0, index) + stringToInsert + string.substring(index, string.length) }
      return stringToInsert + string
    }
    rgb = insert(rgb, 3, 'a')
    rgb = insert(rgb, rgb.length - 1, ',1')
    return (rgb)
  }

  // HEX to RGBA
  function hexToRgba (hex) {
    var r = 0; var g = 0; var
      b = 0
    if (hex.length === 4) { // Si format #FFF
      r = `0x${hex[1]}${hex[1]}`
      g = `0x${hex[2]}${hex[2]}`
      b = `0x${hex[3]}${hex[3]}`
    } else if (hex.length === 7) { // Si format #FFFFFF
      r = `0x${hex[1]}${hex[2]}`
      g = `0x${hex[3]}${hex[4]}`
      b = `0x${hex[5]}${hex[6]}`
    }
    return (`rgba(${parseInt(r)},${parseInt(g)},${parseInt(b)},1)`)
  }

  /** Sort functions * */
  function orderByScore (a, b) {
    if (a.score > b.score) {
      return -1
    }
    if (a.score < b.score) {
      return 1
    }
    return 0
  }

  function sortResultTemplate (resultTemplate) {
    for (var i = 0; i < resultTemplate.length; i++) {
      resultTemplate[i].results.sort(orderByScore)
    }
  }

  /** Public functions * */

  /** J'implémente les functions publique directement dans mon objet return, on sait mieux ce qui est public et ce qui ne l'est pas * */
  return {
    commonStyleAnalysis: function commonStyleAnalysis () {
      var start = Date.now()
      clearCache()
      /** this permet de pointer sur ton objet courant, en résumé, ton objet avec les méthodes publiques * */
      var resultTemplate = []
      var allElements = document.querySelectorAll('*')
      console.log(allElements.length + ' elements')
      loopThroughAllElementAndPseudo(resultTemplate, allElements, COMMON_ANALYSIS_OPTIONS)
      sortResultTemplate(resultTemplate)
      console.log(Date.now() - start)

      return resultTemplate
    },
    customStyleAnalysis: function customStyleAnalysis (cssProps) {
      var resultTemplate = []
      var start = Date.now()
      clearCache()

      var allElements = document.querySelectorAll('*')
      /** ICI il faut voir si tes cssProps sont des options, ou des attributs CSS seuls avant de continuer * */
      console.log(allElements.length + ' elements')
      loopThroughAllElementAndPseudo(resultTemplate, allElements, cssProps)
      sortResultTemplate(resultTemplate)
      console.log(Date.now() - start)

      return resultTemplate
    }
  }
}())