Partage
  • Partager sur Facebook
  • Partager sur Twitter

Mise en place d'Ajax

TchatBot ajout de fonctionnalité

22 juillet 2018 à 16:18:17

Bonjour, je travail sur un tchatbot mais afin de garantir une réel interaction j'aimerai enregistrer les questions du bot et les réponses de l'utilisateur dans une base de données.

Donc passer par ajax, crée une table user et bot, chaque conversation est cloisonné grâce au nom et prénom que l'utilisateur aura entré via le textearea.

J'ai fait la version sans php:

Code HTML :

<header>
      <h1>jQuery Chatbot v. 1.0</h1>
</header>
    <section id= "container"></section>
    <div id= "controls">
        <textarea id= "textbox" placeholder = "Entrer un message ..."></textarea>
        <button id="send">Envoi</button>
        <br/>
        <input checked type="checkbox" id= "enter"/>
        <label>Envoi avec la touche entrer</label>
    </div>

Code js :

var username = "";
function send_message(message){
  var prevState = $("#container").html();
  
  if (prevState.length > 3){
          prevState = prevState + "<br/>";
      }
  $("#container").html(prevState + "<span class='message_courant'>" + "<span class = 'bot'>Chatbot :</span>" + message + "</span>");
  $(".message_courant").hide();
  $(".message_courant").delay(500).fadeIn();
  $(".message_courant").removeClass("message_courant");
}


function get_username(){
    send_message("Bonjour, comment te prénomme tu ?");
}

function ai(message){
  if (username.length<3){
    username = message;
    send_message("Enchanté de faire ta connaissance " + username + ", comment vas-tu ?");
    }
  if ((message.indexOf("ca va et toi")>=0) || (message.indexOf("ça va et toi")>=0) || (message.indexOf("comment vas tu")>=0) || (message.indexOf("comment vas-tu")>=0) || (message.indexOf("comment va tu")>=0) || (message.indexOf("Comment vas tu")>=0)){
      send_message("Merci, je vais bien !");
    }
  if((message.indexOf("pas fort")>=0) || (message.indexOf("pas du tout")>=0)){
    send_message("Que ce passe t'il ? Tu veux m'en parler ?");
  }
  if ((message.indexOf("heure")>=0) || (message.indexOf("heur")>=0)){
     var date = new Date();
     var h = date.getHours();
     var m = date.getMinutes();
    send_message("Il est actuellement: "+h+":"+m);
  }
  
}

$(function(){
  get_username();
                $("#textbox").keypress(function(event){
                    if (event.which == 13){
                        if($("#enter").prop("checked")){
                            
                            $("#send").click();
                            event.preventDefault();
                        }
                    }
                });
            });
            
            $("#send").click(function(){
                var username = "<span class='username'>Vous :</span>";
                var newMessage = $("#textbox").val();
                $("#textbox").val('');
                var prevState = $("#container").html();
              if (prevState.length > 3){
                  prevState = prevState + "<br/>";
              }
               $("#container").html(prevState + username + newMessage);
                $("#container").scrollTop($("#container").prop("scrollHeight"));
          ai(newMessage);
            });





Merci d'avance, de vos réponses, de votre aide et conseils.



  • Partager sur Facebook
  • Partager sur Twitter