Libreria da Tau Prolog en JavaScrit

I am using: Version SWI-Prolog 8.03

I want the code to implement the Tau Prolog library. since I am working with a recommender. which is answered with answers yes or no,
the project already believes it in prolog, with interface and everything, but I don’t know how to implement everything I have in prolog in JavaScript using the library
from Tau prolog.

But what I get is an error loading the page, I’m nusncaod help on how I can implement the code in .Js

My code looks like this:

<html>
  <head>
    <title>Proyecto Recomendador</title>
    <link href="doge.css" rel="stylesheet">
    <script type="text/javascript" src="tau-prolog/core.js"></script>
    <script type="text/javascript" src="tau-prolog/dom.js"></script>
    <script type="text/prolog" id="doge.pl">

      %declaracion de librerias para la interfaz

:-use_module(library(pce)).
:-use_module(library(pce_style_item)).

% metodo principal para iniciar la interfaz grafica, declaracion de
% botones, labels, y la pocicion en pantalla.

inicio:-
  new(Menu, dialog('Proyecto REA', size(1000,800))),
  new(L,label(nombre,'SISTEMA DE RECOMENDADO DE ESTILOS DE APRENDIZAJE')),
  new(A,label(nombre,'Proyecto by Gerson Ezequiel Hernandez Delgado & Fernando Pedrasa Urbano ')),
  new(@texto,label(nombre,'Profavor responda una simples preguntas S/N')),
  new(@respl,label(nombre,'')),
  new(Salir,button('SALIR',and(message(Menu, destroy),message(Menu,free)))),
  new(@boton,button('realizar test',message(@prolog,botones))),


  send(Menu,append(L)),new(@btncarrera,button('Diagnostico?')),
  send(Menu,display,L,point(125,20)),
  send(Menu,display,A,point(80,360)),
  send(Menu,display,@boton,point(100,150)),
  send(Menu,display,@texto,point(20,100)),
  send(Menu,display,Salir,point(20,400)),
  send(Menu,display,@respl,point(20,130)),
  send(Menu,open_centered).

%enfermedad que precenta y tratamiento de acuerdo a las reglas de diagnostico


fallas('USTED TIENE EL ESTILO DE APRENDISAJE LLAMADO VISUAL:
Estilo de aprendizaje Visual:
El sistema de representacion visual tiende a ser el sistema de representacion 
dominante en la mayoria de las personas. Ocurre cuando uno tiende a pensar en 
imágenes y a relacionarlas con ideas y conceptos. Como por ejemplo cuando uno 
recurre a mapas conceptuales para recordar ideas, conceptos y procesos complejos.
 Por lo mismo, este sistema esta directamente relacionado con nuestra capacidad 
 de abstraccion y planificacion.
         '):-visual,!.

fallas('USTED TIENE EL ESTILO DE APRENDISAJE LLAMADO AUDITIVO:
Estilo de aprendizaje Autivo:
Las personas que son más auditivas tienden a recordar mejor la informaciOn
 siguiendo y rememorando una explicación oral. Este sistema no permite abstraer
  o relacionar conceptos con la misma facilidad que el visual, pero resulta 
  fundamental para el aprendizaje de cosas como la música y los idiomas.
         '):-auditivo,!.

fallas('USTED TIENE EL ESTILO DE APRENDISAJE LLAMADO KINESTESICO:
Estilo de aprendizaJe kinestesico:
Se trata del aprendizaje relacionado a nuestras sensaciones y movimientos. 
En otras palabras, es lo que ocurre cuando aprendemos más fácilmente al movernos
 y tocar las cosas, como cuando caminamos al recitar información o hacemos un 
 experimento manipulando instrumentos de laboratorio. Este sistema es mas lento 
 que los otros dos, pero tiende a generar un aprendizaje más profundo y difícil 
 de olvidar, como cuando aprendemos a andar en bicicleta.
'):-kinestesico,!.

fallas('Sin resultados, usted no dio la informacion necesaria o suficiente
ERROR al contestar..!').


visual:- svisual,
  pregunta('Presenta dificultades cuando las explicaciones son verbales?'),
  pregunta('Aprendes mejor cuando el material es representado de manera visual?'),
  pregunta('Tienes mayor facilidad para recordar imagenes y videos?'),
  pregunta('Eres capaz de memorizar utilizando patrones, imagenes y colores? '),
  pregunta('Te cuesta trabajo explicar verbalmente o recordar informacion verbal?'),
  pregunta('Piensan y almacenan la informacion utilizando imagenes?');
  pregunta('Tienes una inclinacion hacia las artes?'),
  pregunta('Tienes una gran imaginacion y un fuerte sentido del color.?').

auditivo:- sauditivo,
  pregunta('Aprendes facilmente al prestar atencion a lo que dice o narra el profesor?'),
  pregunta('Eres capaz de recordar signos audibles com cambios de tono de voz, entonaciones y acentos?'),
  pregunta('Puedes repetir con habilidad y recordar lo que dice alguien más en una conferencia o en una clase?'),
  pregunta('Se te da bien los examenes orales y las presentaciones?'),
  pregunta('Eres bueno en relatar relatos, narraciones, historias y cuentos?');
  pregunta('Te gusta que te expliquen kas cosas con sintonia de ritmo o instrumento?').

kinestesico:- skinestesico,
  pregunta('Te gusta aprender a traves de experiencias, como practicas en laboratorio, juegos, modelos, incluso representaciones tangentes de lo que estudias, como un globo terraqueo o un esqueleto humano?'),
  pregunta('Eres una persona inquieta, que se mueve constantemente al hacer tarea o concentrarse en una actividad?'),
  pregunta('Necesitas involucrarte en lo que estás aprendizaje, de lo contrario, te cuesta mucho y se convierte en algo cansado?'),
  pregunta('Tus movimientos son una extensión de tus pensamientos creativos?');
  pregunta('Te gusta la rutina?');
  pregunta('Te gusta compartir tus experiencias?');
  pregunta('Eres imperactivo o inquieto a la hora de trabajar en equipo?');
  pregunta('Te es dificil expresarte de forma corporal tus expresiones ante otra persona? ').



%identificador de falla que dirige a las reguntas sobre los estilos de aprendizaje 
svisual:-pregunta('Eres muy observador?'),!.
sauditivo:-pregunta('Te gusta estudiar con musica y puedes recordar datos y personas con ella?'),!.
skinestesico:-pregunta('Tienes la necesidad de expresarte de forma corporal.?'),!.


:-dynamic si/1,no/1.
preguntar(Problema):- new(Di,dialog('Recomendador Estilos de Aprendizaje')),
     new(L2,label(texto,'Responde las siguientes preguntas')),
     new(La,label(prob,Problema)),
     new(B1,button(si,and(message(Di,return,si)))),
     new(B2,button(no,and(message(Di,return,no)))),

         send(Di,append(L2)),
   send(Di,append(La)),
   send(Di,append(B1)),
   send(Di,append(B2)),

   send(Di,default_button,si),
   send(Di,open_centered),get(Di,confirm,Answer),
   write(Answer),send(Di,destroy),
   ((Answer==si)->assert(si(Problema));
   assert(no(Problema)),fail).

pregunta(S):-(si(S)->true; (no(S)->fail; preguntar(S))).
limpiar :- retract(si(_)),fail.
limpiar :- retract(no(_)),fail.
limpiar.

% proceso de eleccion de acuerdo al diagnostico basado en las preguntas
% anteriores

botones :- lim,
  send(@boton,free),
  send(@btncarrera,free),
  fallas(Falla),
  send(@texto,selection(' ')),
  send(@respl,selection(Falla)),
  new(@boton,button('inicia procedimiento mecanico',message(@prolog,botones))),
        send(Menu,display,@boton,point(40,50)),
        send(Menu,display,@btncarrera,point(20,50)),
limpiar.
lim :- send(@respl, selection('')).

    </script>
  </head>
  <body>
    <div id="board">
      <div id="doge"></div>
      <div id="controls">
        <div class="control" id="control-w">w</div>
        <div class="control" id="control-a">a</div>
        <div class="control" id="control-s">s</div>
        <div class="control" id="control-d">d</div>
        <div class="control" id="control-p">p (poop)</div>
      </div>
    </div>
    <script type="text/javascript">
      // Create session
      var session = pl.create(1000);
      // Consult program
      session.consult("doge.pl");
      // Query goal
      session.query("init.");
      // Find answers
      session.answer(console.log);
    </script>

  </body>
</html>

como lo hecharia andar??