text: const celeste = document.getElementById('celeste')
  const violeta = document.getElementById('violeta')
  const naranja = document.getElementById('naranja')
  const verde = document.getElementById('verde')
  const btnEmpezar = document.getElementById('btnEmpezar')
  const ULT_NIVEL = 10
  
  swal('Hola Laura, estas a punto de jugar a un juego que te divertirá! Al menos un ratito... :)')
  class Juego {
    constructor () {
      this.inicializar = this.inicializar.bind(this)
      this.inicializar()
      this.generarSecuencia()
      setTimeout(this.siguienteNivel, 1000)
    }
  
    inicializar () {
      this.elegirColor = this.elegirColor.bind(this) // para hacer referncia al new juego y no al botón
      this.siguienteNivel = this.siguienteNivel.bind(this)
      this.toggleBtnEmpezar()
      this.nivel = 1
      this.colores = {
        celeste, // celeste, ---> celeste: celeste, (este última celesta hace ref. a la variable)
        violeta,
        naranja,
        verde
      }
    }
  
    toggleBtnEmpezar () {
      if (btnEmpezar.classList.contains('hide')) {
        btnEmpezar.classList.remove('hide')
      } else {
        btnEmpezar.classList.add('hide')
      }
    }
  
    generarSecuencia () {
      this.secuencia = new Array(ULT_NIVEL).fill(0).map(n => Math.floor(Math.random() * 4));
    }
  
    siguienteNivel () {
      this.subnivel = 0
      this.iluminarSecuencia();
      this.agregarEventosClick ();
    }
  
    transformarNumeroAColor (numero) {
      switch (numero) {
        case 0:
          return 'celeste'; // no hace falta el break porque con return el code acaba ahí.
        case 1:
          return 'violeta';      
        case 2:
          return 'naranja';
        case 3:
          return 'verde'; 
      }
    }
  
    transformarColorANumero (color) {
      switch (color) {
        case 'celeste':
          return 0
        case 'violeta':
          return 1    
        case 'naranja':
          return 2
        case 'verde':
          return 3
      }
    }
  
    iluminarSecuencia () {
      for (let i = 0; i < this.nivel; i++) {
        const color = this.transformarNumeroAColor(this.secuencia[i])
        setTimeout(() => this.iluminarColor (color), 1000 * i)
      }
    }
  
    iluminarColor (color) {
      this.colores[color].classList.add('light')
      setTimeout(() => this.apagarColor(color), 350)
    }
  
    apagarColor (color) {
      this.colores [color].classList.remove('light')
    }
  
    agregarEventosClick () {
      this.colores.celeste.addEventListener('click', this.elegirColor)
      this.colores.violeta.addEventListener('click', this.elegirColor)
      this.colores.naranja.addEventListener('click', this.elegirColor)
      this.colores.verde.addEventListener('click', this.elegirColor)
    }
  
    eliminarEventosClick () {
      this.colores.celeste.removeEventListener('click', this.elegirColor)
      this.colores.violeta.removeEventListener('click', this.elegirColor)
      this.colores.naranja.removeEventListener('click', this.elegirColor)
      this.colores.verde.removeEventListener('click', this.elegirColor)
    }
  
    elegirColor (ev) {
      console.log(ev)
      const nombreColor = ev.target.dataset.color
      const numeroColor = this.transformarColorANumero(nombreColor)
      console.log(numeroColor)
      this.iluminarColor(nombreColor)
      if (numeroColor === this.secuencia[this.subnivel]) {
        this.subnivel++
        if (this.subnivel === this.nivel) {
          this.nivel++
          this.eliminarEventosClick()
          if (this.nivel === (ULT_NIVEL + 1)) {
            this.ganoElJuego();
          } else {
              setTimeout(this.siguienteNivel, 1500)
          }
        }
      } else {
        this.perdioElJuego();
      }
    }
  
    ganoElJuego () {
      swal('HAS GANADO LA PARTIDA', `Enhorabuena, has superado los ${ULT_NIVEL} niveles de manera satifactoria`, 'success')
        .then (this.inicializar)
    }
  
    perdioElJuego () {
      swal('HAS PERDIDO...', `Has llegado hasta el nivel ${this.subnivel}/${ULT_NIVEL}, vuelve a intentarlo`, 'error')
        .then (() => {
          this.eliminarEventosClick()
          this.inicializar()
        })
    }
  }
  
  
  function empezarJuego() {
    var juego = new Juego()
  }
    