<!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;">

<!-- Aquí se carga la web.nocache que permite ejecutar escenas en local para la web -->
<script type="text/javascript" language="javascript" src="../GeoGebra5/web/web.nocache.js"></script>
<!-- El elemento en el que se crea una escena de GeoGebra, el parámetro data-param-useBrowserForJS="true" es necesario para que funcione la función ggbOnInit y el parámetro data-param-language="es" es necesario para utilizar comandos de GeoGebra en español -->
<article class="geogebraweb" 
  data-param-useBrowserForJS="true"
  data-param-language="es"></article>

<!-- Aquí inicia la programación JavaScript -->
<script type="text/javascript">
  //BLOQUE 1

  //Este primer bloque requiere mayores conocimientos de JS, por lo que... NO LO TOQUES
  //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
    var data = evt.data;
    nombre = data.name;

    //Mensaje con el comando enviado desde DescartesJS, al ser "evalua" entonces invoca la función calculosCAS() para ejecutar el comando enviado. Una vez evaluado, retorna el cálculo (vCalculado) a DescartesJS
    if ((data.type === "set") && (data.name === "evalua")) {
      dComando = data.value;
      rComando = calculosCAS(dComando);

      window.parent.postMessage({
        type: "set",
        name: "vCalculado",
        value: rComando
      }, '*');
      window.parent.postMessage({
        type: "update"
      }, '*');
    }
    // se maneja un mensaje del tipo update
    else if (data.type === "update") {}
  }

  //BLOQUE 3

  //Si el mensaje es un comando de GeoGebra como
  //Derivada[x^4] se ejecuta
  //Para que esto funcione es necesario utilizar 
  //data-param-language="es" de lo contrario los
  //comandos deben ser enviados en inglés
  function calculosCAS(dComando) {
    document.ggbApplet.reset();
    return document.ggbApplet.evalCommandCAS("f:" + dComando);
  }

  //BLOQUE 4

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