<!DOCTYPE html>
<html>

<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>TITULO</title>
</head>

<body style="margin:0;padding:0; border:0; overflow: hidden;">

  <script type="text/javascript" language="javascript" src="../GeoGebra5/web3d/web3d.nocache.js"></script>
  <article class="geogebraweb"
    data-param-width="595"
    data-param-height="390"
    data-param-showResetIcon="true"
    data-param-enableRightClick="true"
    data-param-enableLabelDrags="true"
    data-param-showMenuBar="false"
    data-param-showToolBar="false" 
    data-param-showAlgebraInput="false"
    data-param-showFullscreenButton="true"
    data-param-useBrowserForJS="true"
    data-param-language="es"
    data-param-ggbbase64="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"></article>

  <script type="text/javascript">
    // Bloque 1
    // Creación de dos matrices que almacenan los comandos de GeoGebra en español e inglés
    var vComandosD;
    var vComandosG;

    //Método que permite escuchar la comunicación entre las dos herramientas
    window.addEventListener("message", funcionQueManejaLosMensajes)

    // Bloque 2	
    //Función que maneja los mensajes escuchados
    function funcionQueManejaLosMensajes(evt) {

      //En la variable "nombre" se almacena el mensaje enviado por DescartesJS y en "aux" el mensaje que trae  "evalua"
      var data = evt.data;
      nombre = data.name;
      aux = nombre.search("evalua");

      //Si el mensaje escuchado es "reset" pues... se resetea (Reinicia)
      if ((data.type === "set") && (data.name === "reset")) {
        dComando = data.value;
        document.ggbApplet.reset();
        window.parent.postMessage({
          type: "update"
        }, '*');
      } else if (data.type === "update") {}

      // Bloque 3		 
      //Si el mensaje escuchado es "puntos", se ejecuta el comando GeoGebra enviado desde DescartesJS que es de la forma (xi, yi), es decir un punto
      if ((data.type === "set") && (data.name === "puntos")) {
        dComando = data.value;
        document.ggbApplet.evalCommand(dComando);

        //A las variables valor1, valor2 y valor3 se asignan los valores (xi, yi) de los puntos A, B y C
        valor1 = document.ggbApplet.getValueString('A');
        valor2 = document.ggbApplet.getValueString('B');
        valor3 = document.ggbApplet.getValueString('C');

        //Se envía un mensaje a DescartesJS con los valores anteriores. DescartesJS escucha y asigna estos valores a las variables puntoA, puntoB y puntoC
        window.parent.postMessage({
          type: "set",
          name: "puntoA",
          value: valor1
        }, '*');
        window.parent.postMessage({
          type: "set",
          name: "puntoB",
          value: valor2
        }, '*');
        window.parent.postMessage({
          type: "set",
          name: "puntoC",
          value: valor3
        }, '*');
        //Mensaje obligado para ir actualizando la comunicación, pues es permanente
        window.parent.postMessage({
          type: "update"
        }, '*');
      } else if (data.type === "update") {}

      // Bloque 4		 
      //Mensaje con los datos de los ángulos, por ejemplo Ángulo[A, B, C], al no incluir "evalua" entonces aux===0
      if ((data.type === "set") && (aux === 0)) {
        //Aquí num sería igual al sexto caracter de "evalua1", "evalua2" o "evalua3" que tienen como valor  'Ángulo[A, B, C]', 'Ángulo[B, C, A]' o 'Ángulo[C, A, B]' respectivamente, es decir, 1, 2 o 3
        num = nombre.charAt(6);
        //de acuerdo a lo anterior, la variable "figura" puede ser α1, α2 o α3
        figura = 'α' + num + ':'
        //La variable dComando toma el valor que trae el mensaje, es decir, 'Ángulo[ A, B, C ]', 'Ángulo[ B, C, A ]' o 'Ángulo[ C, A, B ]'
        dComando1 = data.value;
        //Con ese valor se ejecuta la función calculoCAS que no es otra cosa que ejecutar el comando de GeoGebra en inglés de la matriz correspondiente
        rComando1 = calculosCAS(dComando1);
        //Se captura el valor del ángulo α1, α2 o α3
        rComando1 = document.ggbApplet.getValueString('α' + num);
        //El valor anterior se asigna a la variable "variable"
        variable = "vCalculado" + num;
        //Se envía el mensaje a DescartesJs con el valor de los ángulos (rComando) para asignar a las variables vCalculado1, vCalculado2,...
        window.parent.postMessage({
          type: "set",
          name: variable,
          value: rComando1
        }, '*');
        window.parent.postMessage({
          type: "update"
        }, '*');
        //Decoración a gusto del diseñador

        //Asigna colores a los ángulos y al lado a
        document.ggbApplet.setColor('α1', 255, 0, 0);
        document.ggbApplet.setColor('α2', 255, 0, 255);
        document.ggbApplet.setColor('α3', 0, 55, 200);
        document.ggbApplet.setColor('a', 0, 200, 200);
        document.ggbApplet.setColor('b', 200, 0, 200);
        document.ggbApplet.setColor('c', 255, 30, 40);
        //Asigna grosor del lado
        document.ggbApplet.setLineThickness('a', 6);
        document.ggbApplet.setLineThickness('b', 4);
        document.ggbApplet.setLineThickness('c', 3);

      } else if (data.type === "update") {}
    }
    //Si el mensaje es un comando de GeoGebra como Polígono[A, B, C, A], se busca "Polígono" en las matrices de comandos y luego de identificar el número del elemento, se ejecuta el comando en inglés "Polygon"
    function calculosCAS(dComando) {
      str = dComando.split("[");
      str1 = str[0];
      com = str1;
      str2 = str[1];
      pos = vComandosD.indexOf(com);
      if (pos == "-1") {
        calculo = "No está disponible de momento"
      } else {
        cEjecuta = vComandosG[pos];
        comando = figura + cEjecuta + '[' + str2;
        calculo = ggbApplet.evalCommand(comando);
      }

      return calculo;
    }

    //Un comodín necesario para que funcione la comunicación
    function ggbOnInit() {
      comando='f:Derivative[x,1]';
      rComando=document.ggbApplet.evalCommandCAS(comando);

      vComandosD = Object.values(__GGB__keysVar['es'].command);
      vComandosG = Object.keys(__GGB__keysVar['es'].command);
    }
  </script>
</body>

</html>