//'use strict';  //Opcional, activar Esto puede generar advertencias en el script al no estar definido React
const e = React.createElement;

// PRUEBA1 #############################################################################################
class BotonLike extends React.Component {
  constructor(props) {
    super(props);
    this.state = { liked: false };
  }

  render() {
    if (this.state.liked) {
      return 'Has presionado el me gusta';
    }

    return e(
      'button',
      { onClick: () => this.setState({ liked: true }) },
      'Me gusta',
    );
  }
}

// PRUEBA2 #############################################################################################
class EnlaceHREF extends React.Component {
  constructor(props) {
    super(props);
    this.state = { liked: false };
  }

  render() {
        return React.createElement('a', {href: 'https://www.unixlandia.org',class: 'btn btn-info', target: '_blank'}, 'Ejemplo de enlace')
  }
}



function PruebasReactJS()
    {
        //#############################################################################################
        console.log("PRUEBA 1:  Adicion control basico de ReactJS a contenedor_react_01");
        const domContainer = document.querySelector('#contenedor_react_01');
        ReactDOM.render(e(BotonLike), domContainer);

        //#############################################################################################
        console.log("PRUEBA 2:  Adicion control HREF sin JSX a contenedor_react_02");
        const domContainerHREF = document.querySelector('#contenedor_react_02');
        ReactDOM.render(e(EnlaceHREF), domContainerHREF);
    }


function FrmAutoRun()
    {
        //Ejecuta las pruebas cuando se asegure que ya se cargo todo lo necesario del documento
        $( document ).ready(function() {
            console.log("###### Iniciando pruebas de ReactJS");
            PruebasReactJS();
            console.log("###### Finalizando pruebas de ReactJS Correctamente");
        });
    }
