IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Conception Web Discussion :

intégrer logiciel chat PHP/MYSQL sur un site


Sujet :

Conception Web

  1. #1
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut intégrer logiciel chat PHP/MYSQL sur un site
    Bonjour,

    J'ai un petit logiciel de chat en PHP/MYSQL. Je voudrais l'intégrer à un site, sans qu'il ne masque trop le site.

    Je ne sais pas comment faire.
    J'ai essayé avec un lien ouvrant une fenêtre modale (popin), mais lorsque j'envoie du texte et valide, toute la page se rafraichit, ce qui ne va évidemment pas. Y a t il moyen d'y remédier ?

    Ou alors, serait-ce possible d'avoir une fenêtre, en bas à droite, par dessus le site en fait, que l'utilisateur pourrait agrandir ou réduire suivant s'il en a besoin ou non ?

    Merci d'avance pour vos conseils ;-)
    Très cordialement,

    ANDRE ANi
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  2. #2
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Pour être un peu plus précis, je me suis servi du code du tuto ici (fenêtre modale en CSS 3, sur ce site) :
    http://dmouronval.developpez.com/tut...e-modale-css3/
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  3. #3
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Voila le code de la page avec le chat. C'est donc le formulaire de chat que je voudrais arriver à mettre dans une fenêtre modale, sans que, à chaque fois que je clique sur envoyer toute la page se recharge.

    Est ce que cela doit se faire dans le script php du chat, ou alors dans le code de la fenêtre modale ?

    Ou alors, serait-il possible d'avoir juste une petite fenêtre de chat qu'on pourrait faire apparaitre ou minimiser (comme cela se fait sur la pluspart des sites) ?

    Merci de vos idées ;-)
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  4. #4
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 957
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 957
    Points : 44 121
    Points
    44 121
    Par défaut
    Bonjour,
    Comment réaliser un chat complet en AJAX devrait t'apporter pas mal de réponses.

  5. #5
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Ok, merci bien ;-)
    Je vais regarder si cela peut m'aider.
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  6. #6
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Bonjour,

    J'ai essayé divers script afin de pouvoir recharger une div sans recharger toute la page, mais rien ne marche. Donc, je suppose que je dois faire une erreur quelque part...

    Voici ma page, avec le script :

    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    197
    198
    199
    200
    201
    202
    203
    204
    205
    206
    207
    208
    209
    210
    211
    212
    213
    214
    215
    216
    217
    218
    219
    <?php
    /***************************************
      * http://www.program-o.com
      * PROGRAM O
      * Version: 2.3.1
      * FILE: index.php
      * AUTHOR: Elizabeth Perreau and Dave Morton
      * DATE: 07-23-2013
      * DETAILS: This is the XML GUI interface for Program O
      ***************************************/
     
      // $display = 'Make sure that you edit this file to change the value of $url below to reflect the correct address, and to remove this message.';
      $url = 'http://mon-site.fr/chatbot/conversation_start.php';
      $display_template = <<<end_display
          <span class="user_name">[user_name]: </span><span class="user_say">[input]</span><br>
          <span class="bot_name">[bot_name]: </span><span class="bot_say">[response]</span><br>
    
    end_display;
     
      $post_vars = (!empty($_POST)) ? filter_input_array(INPUT_POST) : array();
      $get_vars = (!empty($_GET)) ? filter_input_array(INPUT_GET) : array();
      $request_vars = array_merge($get_vars, $post_vars);
      $convo_id = (isset ($request_vars['convo_id'])) ? $request_vars['convo_id'] : get_convo_id();
      $bot_id = (isset ($request_vars['bot_id'])) ? $request_vars['bot_id'] : 2;
      if (!empty ($request_vars))
      {
        $options = array(
          CURLOPT_USERAGENT => 'Program_O_XML_API',
          CURLOPT_RETURNTRANSFER => true,
          CURLOPT_POST => true,
          //CURLOPT_CONNECTTIMEOUT => 3,
        );
        $ch = curl_init($url);
        curl_setopt_array($ch, $options);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $request_vars);
        $data = curl_exec($ch);
        curl_close($ch);
        $xml = new SimpleXMLElement($data);
        $display = '';
        $success = $xml->status->success;
        if (isset($xml->status->message))
        {
          $message = (string) $xml->status->message;
          $display = 'There was an error in the script. Message = ' . $message;
        }
        else
        {
          $user_name = (string) $xml->user_name;
          $bot_name = (string) $xml->bot_name;
          $chat = $xml->chat;
          $lines = $chat->xpath('line');
          foreach ($lines as $line)
          {
            $input = (string) $line->input;
            $response = (string) $line->response;
            $tmp_row = str_replace('[user_name]', $user_name, $display_template);
            $tmp_row = str_replace('[bot_name]', $bot_name, $tmp_row);
            $tmp_row = str_replace('[input]', $input, $tmp_row);
            $tmp_row = str_replace('[response]', $response, $tmp_row);
            $display .= $tmp_row;
          }
        }
     
      }
     
      function get_convo_id()
      {
        if (isset($_COOKIE['Program_O_XML_API'])) $convo_id = $_COOKIE['Program_O_XML_API'];
        else
        {
          session_name('Program O XML GUI');
          session_start();
          $convo_id = session_id();
          session_destroy();
        }
        return $convo_id;
      }
     
    ?>
     
     
     
     
     
     
     
     
    <!DOCTYPE html>
    <!--[if IE 8]> 		<html class="no-js lt-ie9" lang="en" > <![endif]-->
    <!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
     
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
     
      <link rel="shortcut icon" href="favicon.ico"  type="image/x-icon">
     
      <link rel="stylesheet" href="template/css/foundation.css">
      <link rel="stylesheet" href="template/css/foundation-icons.css">
      <script src="template/js/vendor/custom.modernizr.js"></script>
     
     
     
    <style type="text/css">
          h3 {
            text-align: center;
          }
          .user_name {
            color: rgb(16, 45, 178);
          }
          .bot_name {
            color: rgb(204, 0, 0);
          }
     
        </style>  
     
     
    <script language="javascript">
    window.onload = auto_refresh;
     
    function auto_refresh()
    {
    	new Ajax.Updater("chat", "./bot2.php", {parameters:'mode=auto_refresh', evalScripts:true, asynchronous:true})
      setTimeout("auto_refresh()",2000);
      return true
    }
    </script>
     
     
     
     
    <!-- <script type="text/javascript">
    function refresh() {
    $.ajax({
        url: "./bot2.php",
        success:
            function(retour){
            $("response").html(retour); 
        }
    });
     
    }
    setInterval("refresh()", 1000)
    </script> -->
     
     
     
    </head>
    <body>
     
    <?php include("template/inc/header.inc.php"); ?>
     
    <!-- Main Page Content and Sidebar -->
     
    <div class="row">
     
    <!-- Main Blog Content -->
    <div class="large-9 columns">
     
    <article>
    <div class="text-justify">
    <br>
    <div class="row">
    <div class="large-11 columns">
    <h1>A propos</h1>
    <br>
     
     
     
     
    <p>
    <body onload="document.forms[0].say.focus();">
        <h3>Posez vos questions</h3>
     
    <div id="chat">
        <img src="live.png">
        <form accept-charset="utf-8" method="get" action="<?php echo $_SERVER['PHP_SELF'] ?>">
          <p>
            <input type="text" name="say" id="say" />
            <input id="bot_id" type="hidden" name="bot_id" value="<?php echo $bot_id ?>">
            <input id="convo_id" type="hidden" name="convo_id" value="<?php echo $convo_id ?>">
            <input id="format" type="hidden" name="format" value="xml">
            <input type="submit" value="Chat" OnClick="auto_refresh()"/>
          </p>
        </form>
        <div id="response">
     <?php echo $display ?> 
        </div>
     
    </div>
     
    </p>
     
     
     
     
    </div>
    </div>
    </div>
    </article>
     
    </div>
     
    <!-- End Main Content -->
     
     
    <!-- Sidebar -->
    <?php include("template/inc/sidebar.inc.php"); ?>
     
    <!-- End Sidebar -->
    </div>
     
    <!-- End Main Content and Sidebar -->
     
    <?php include("template/inc/footer.inc.php"); ?>
     
     
    </body>
    </html>

    Si vous voyez pourquoi ça ne fonctionne pas. J'en ai essayé d'autre, mais rien à faire.
    Je n'y connais trop rien en javascript, mais j'ai vu que c'était faisable facilement avec.

    Merci d'avance,
    Très cordialement,

    ANDRE Ani
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  7. #7
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 957
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 957
    Points : 44 121
    Points
    44 121
    Par défaut
    1st: Il faudrait quand même penser à inclure la librairie jQuery attendu que tu l'utilises!

    2nd: Si on isole ce bout de code
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    function refresh() {
        $.ajax({
            url: "./bot2.php",
            success: function (retour) {
                $("response").html(retour);
            }
        });
    }
    setInterval("refresh()", 1000)
    cela signifie que coté serveur il y a un fichier bot2.php qui renvoie le contenu à afficher, ce fichier ne doit contenir que le HTML nécessaire et suffisant.
    Que renvoie ton fichier?

    3th: inutile de déclarer une 2éme fonction Ajax
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    function auto_refresh() {
        new Ajax.Updater("chat", "./bot2.php", {
            parameters: 'mode=auto_refresh',
            evalScripts: true,
            asynchronous: true
        })
        setTimeout("auto_refresh()", 2000);
        return true
    }

  8. #8
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Bon, ok pour jQuery, je vais l'ajouter.

    Le fichier bot2.php, c'est justement ce fichier. Tout est dedans, le PHP à traiter, la div à actualiser et le javascript pour actualiser la div.

    Il faudrait donc que je sépare tout cela ? Je ne sais pas trop comment faire.
    Je n'y connais vraiment pas grand chose en Javascript...

    Merci beaucoup pour l'aide ;-)
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  9. #9
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    J'ai ajouté jQuery.
    Mais maintenant, je ne sais pas comment séparer le HTML du PHP, du JS et de la div à actualiser...

    J'ai fais plusieurs essais (PHP dans un seul fichier, div dans un autre...) mais ça ne fonctionne pas, je suis un peu perdu...

    fichier traitement2.php, la page avec le code HTML, le PHP et le JS :

    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    <?php
    /***************************************
      * http://www.program-o.com
      * PROGRAM O
      * Version: 2.3.1
      * FILE: index.php
      * AUTHOR: Elizabeth Perreau and Dave Morton
      * DATE: 07-23-2013
      * DETAILS: This is the XML GUI interface for Program O
      ***************************************/
     
      // $display = 'Make sure that you edit this file to change the value of $url below to reflect the correct address, and to remove this message.';
      $url = 'http://mon-site.fr/chatbot/conversation_start.php';
      $display_template = <<<end_display
          <span class="user_name">[user_name]: </span><span class="user_say">[input]</span><br>
          <span class="bot_name">[bot_name]: </span><span class="bot_say">[response]</span><br>
    
    end_display;
     
      $post_vars = (!empty($_POST)) ? filter_input_array(INPUT_POST) : array();
      $get_vars = (!empty($_GET)) ? filter_input_array(INPUT_GET) : array();
      $request_vars = array_merge($get_vars, $post_vars);
      $convo_id = (isset ($request_vars['convo_id'])) ? $request_vars['convo_id'] : get_convo_id();
      $bot_id = (isset ($request_vars['bot_id'])) ? $request_vars['bot_id'] : 2;
      if (!empty ($request_vars))
      {
        $options = array(
          CURLOPT_USERAGENT => 'Program_O_XML_API',
          CURLOPT_RETURNTRANSFER => true,
          CURLOPT_POST => true,
          //CURLOPT_CONNECTTIMEOUT => 3,
        );
        $ch = curl_init($url);
        curl_setopt_array($ch, $options);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $request_vars);
        $data = curl_exec($ch);
        curl_close($ch);
        $xml = new SimpleXMLElement($data);
        $display = '';
        $success = $xml->status->success;
        if (isset($xml->status->message))
        {
          $message = (string) $xml->status->message;
          $display = 'There was an error in the script. Message = ' . $message;
        }
        else
        {
          $user_name = (string) $xml->user_name;
          $bot_name = (string) $xml->bot_name;
          $chat = $xml->chat;
          $lines = $chat->xpath('line');
          foreach ($lines as $line)
          {
            $input = (string) $line->input;
            $response = (string) $line->response;
            $tmp_row = str_replace('[user_name]', $user_name, $display_template);
            $tmp_row = str_replace('[bot_name]', $bot_name, $tmp_row);
            $tmp_row = str_replace('[input]', $input, $tmp_row);
            $tmp_row = str_replace('[response]', $response, $tmp_row);
            $display .= $tmp_row;
          }
        }
     
      }
     
      function get_convo_id()
      {
        if (isset($_COOKIE['Program_O_XML_API'])) $convo_id = $_COOKIE['Program_O_XML_API'];
        else
        {
          session_name('Program O XML GUI');
          session_start();
          $convo_id = session_id();
          session_destroy();
        }
        return $convo_id;
      }
     
    ?>
     
     
     
     
    <!DOCTYPE html>
    <!--[if IE 8]> 		<html class="no-js lt-ie9" lang="en" > <![endif]-->
    <!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
     
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
      <title>Prof Tux - Tutoriels et conseils sur Gnu Linux - A propos</title>
      <meta name="description" content="Prof Tux : tutoriels (en PDF), support et conseil (par mail) sur Gnu Linux et les logiciels libres, pour les particuliers">
      <meta name="keywords" content="gnu, linux, gnu linux, prof tux, GNU, LINUX, tutoriels, cours, tutoriel, conseils, conseil, support, logiciel libre, open source, formation, logiciels libres">
      <link rel="shortcut icon" href="favicon.ico"  type="image/x-icon">
     
      <link rel="stylesheet" href="template/css/foundation.css">
      <link rel="stylesheet" href="template/css/foundation-icons.css">
      <script src="template/js/vendor/custom.modernizr.js"></script>
     
    <!-- flux rss -->
      <script type="text/javascript" src="template/js/jquery.js" ></script>
      <script type="text/javascript" src="template/js/FeedEk.js"></script>
     
    <style type="text/css">
          h3 {
            text-align: center;
          }
          .user_name {
            color: rgb(16, 45, 178);
          }
          .bot_name {
            color: rgb(204, 0, 0);
          }
     
        </style>  
     
     
    </head>
    <body>
     
    <?php include("template/inc/header.inc.php"); ?>
     
    <!-- Main Page Content and Sidebar -->
     
    <div class="row">
     
    <!-- Main Blog Content -->
    <div class="large-9 columns">
     
    <article>
    <div class="text-justify">
    <br>
    <div class="row">
    <div class="large-11 columns">
    <h1>A propos</h1>
    <br>
     
     
    <p>
    <body onload="document.forms[0].say.focus();">
        <h3>Posez vos questions</h3>
     
    <script type="text/javascript">
    function refresh() {
    $.ajax({
        url: "./bot2.php",
        success:
            function(retour){
            $("chat").html(retour); 
        }
    });
     
    }
    setInterval("refresh()", 1000)
    </script>
     
     
    </div>
     
    </p>
     
     
    </div>
    </div>
    </div>
    </article>
     
    </div>
     
    <!-- End Main Content -->
     
     
    <!-- Sidebar -->
    <?php include("template/inc/sidebar.inc.php"); ?>
     
    <!-- End Sidebar -->
    </div>
     
    <!-- End Main Content and Sidebar -->
     
    <?php include("template/inc/footer.inc.php"); ?>
     
    </body>
    </html>


    Et le fichier bot2.php qui contient la div à actualiser :

    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    <div id="chat">
        <img src="live.png">
        <form accept-charset="utf-8" method="get" action="<?php echo $_SERVER['PHP_SELF'] ?>">
          <p>
            <input type="text" name="say" id="say" />
            <input id="bot_id" type="hidden" name="bot_id" value="<?php echo $bot_id ?>">
            <input id="convo_id" type="hidden" name="convo_id" value="<?php echo $convo_id ?>">
            <input id="format" type="hidden" name="format" value="xml">
            <input type="submit" value="Chat" OnClick="refresh()"/>
          </p>
        </form>
        <div id="response">
     <?php echo $display ?> 
    </div>
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  10. #10
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 957
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 957
    Points : 44 121
    Points
    44 121
    Par défaut
    Je pense que tu n'as pas bien compris le principe des échanges
    Comprendre les mécanismes d'AJAX.

  11. #11
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Merci pour le lien, mais j'avoue que je suis encore plus perdu maintenant...

    Enfin, d'après ce que je comprends, il faudrait ma page avec le HTML, le formulaire et le JS pour actualiser ma div, et le script JS devrait renvoyer vers le code PHP non ?

    Comme cela, ma requête est traitée avec le PHP sur le serveur, qui renvoie une réponse, qui est actualisée par le JS pour enfin être affichée.

    Il faudrait donc un fichier PHP comme ceci :

    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    <?php
    /***************************************
      * http://www.program-o.com
      * PROGRAM O
      * Version: 2.3.1
      * FILE: index.php
      * AUTHOR: Elizabeth Perreau and Dave Morton
      * DATE: 07-23-2013
      * DETAILS: This is the XML GUI interface for Program O
      ***************************************/
     
      // $display = 'Make sure that you edit this file to change the value of $url below to reflect the correct address, and to remove this message.';
      $url = 'http://mon-site.fr/chatbot/conversation_start.php';
      $display_template = <<<end_display
          <span class="user_name">[user_name]: </span><span class="user_say">[input]</span><br>
          <span class="bot_name">[bot_name]: </span><span class="bot_say">[response]</span><br>
     
    end_display;
     
      $post_vars = (!empty($_POST)) ? filter_input_array(INPUT_POST) : array();
      $get_vars = (!empty($_GET)) ? filter_input_array(INPUT_GET) : array();
      $request_vars = array_merge($get_vars, $post_vars);
      $convo_id = (isset ($request_vars['convo_id'])) ? $request_vars['convo_id'] : get_convo_id();
      $bot_id = (isset ($request_vars['bot_id'])) ? $request_vars['bot_id'] : 2;
      if (!empty ($request_vars))
      {
        $options = array(
          CURLOPT_USERAGENT => 'Program_O_XML_API',
          CURLOPT_RETURNTRANSFER => true,
          CURLOPT_POST => true,
          //CURLOPT_CONNECTTIMEOUT => 3,
        );
        $ch = curl_init($url);
        curl_setopt_array($ch, $options);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $request_vars);
        $data = curl_exec($ch);
        curl_close($ch);
        $xml = new SimpleXMLElement($data);
        $display = '';
        $success = $xml->status->success;
        if (isset($xml->status->message))
        {
          $message = (string) $xml->status->message;
          $display = 'There was an error in the script. Message = ' . $message;
        }
        else
        {
          $user_name = (string) $xml->user_name;
          $bot_name = (string) $xml->bot_name;
          $chat = $xml->chat;
          $lines = $chat->xpath('line');
          foreach ($lines as $line)
          {
            $input = (string) $line->input;
            $response = (string) $line->response;
            $tmp_row = str_replace('[user_name]', $user_name, $display_template);
            $tmp_row = str_replace('[bot_name]', $bot_name, $tmp_row);
            $tmp_row = str_replace('[input]', $input, $tmp_row);
            $tmp_row = str_replace('[response]', $response, $tmp_row);
            $display .= $tmp_row;
          }
        }
     
      }
     
      function get_convo_id()
      {
        if (isset($_COOKIE['Program_O_XML_API'])) $convo_id = $_COOKIE['Program_O_XML_API'];
        else
        {
          session_name('Program O XML GUI');
          session_start();
          $convo_id = session_id();
          session_destroy();
        }
        return $convo_id;
      }
     
    ?>


    Et ma page :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    <!DOCTYPE html>
    <!--[if IE 8]> 		<html class="no-js lt-ie9" lang="en" > <![endif]-->
    <!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
     
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
     
      <link rel="shortcut icon" href="favicon.ico"  type="image/x-icon">
     
      <link rel="stylesheet" href="template/css/foundation.css">
      <link rel="stylesheet" href="template/css/foundation-icons.css">
      <script src="template/js/vendor/custom.modernizr.js"></script>
     
    <!-- flux rss -->
      <script type="text/javascript" src="template/js/jquery.js" ></script>
      <script type="text/javascript" src="template/js/FeedEk.js"></script>
     
     
     
    <script type="text/javascript">
    function refresh() {
    $.ajax({
        url: "./bot2.php",
        success:
            function(retour){
            $("chat").html(retour); 
        }
    });
     
    }
    setInterval("refresh()", 1000)
    </script>
     
     
     
    <style type="text/css">
          h3 {
            text-align: center;
          }
          .user_name {
            color: rgb(16, 45, 178);
          }
          .bot_name {
            color: rgb(204, 0, 0);
          }
     
        </style>  
     
     
    </head>
    <body>
     
    <?php include("template/inc/header.inc.php"); ?>
     
    <!-- Main Page Content and Sidebar -->
     
    <div class="row">
     
    <!-- Main Blog Content -->
    <div class="large-9 columns">
     
    <article>
    <div class="text-justify">
    <br>
    <div class="row">
    <div class="large-11 columns">
    <h1>A propos</h1>
    <br>
     
     
    <p>
    <body onload="document.forms[0].say.focus();">
        <h3>Posez vos questions</h3>
     
     
     
    <div id="chat">
        <img src="live.png">
        <form accept-charset="utf-8" method="get" action="<?php echo $_SERVER['PHP_SELF'] ?>">
          <p>
            <input type="text" name="say" id="say" />
            <input id="bot_id" type="hidden" name="bot_id" value="<?php echo $bot_id ?>">
            <input id="convo_id" type="hidden" name="convo_id" value="<?php echo $convo_id ?>">
            <input id="format" type="hidden" name="format" value="xml">
            <input type="submit" value="Chat" OnClick="refresh()"/>
          </p>
        </form>
        <div id="response">
     <?php echo $display ?> 
    </div>
     
     
    </div>
     
    </p>
     
     
    </div>
    </div>
    </div>
    </article>
     
    </div>
     
    <!-- End Main Content -->
     
     
    <!-- Sidebar -->
    <?php include("template/inc/sidebar.inc.php"); ?>
     
    <!-- End Sidebar -->
    </div>
     
    <!-- End Main Content and Sidebar -->
     
    <?php include("template/inc/footer.inc.php"); ?>
     
    </body>
    </html>


    C'est comme cela que je le comprends. Mais ça ne marche pas. Je n'ai plus de réponse qui s'affiche du tout comme cela...
    Pourtant, ça me paraissait logique.
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  12. #12
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 957
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 957
    Points : 44 121
    Points
    44 121
    Par défaut
    Enfin, d'après ce que je comprends, il faudrait ma page avec le HTML, le formulaire et le JS pour actualiser ma div, et le script JS devrait renvoyer vers le code PHP non ?

    Comme cela, ma requête est traitée avec le PHP sur le serveur, qui renvoie une réponse, qui est actualisée par le JS pour enfin être affichée.
    à peu de chose prêt oui.

    Le retour dans le fichier PHP se fait par un echo $variable_retour; et je n'en vois point dans ton code!

  13. #13
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Déjà, si je comprends le principe, c'est pas mal ;-)

    Donc, les fichiers sont bons comme cela, le PHP d'un côté, et le reste avec HTML et JS de l'autre. Y a du mieux.

    Dans la page HTML, la réponse est affichée grâce à :

    Et cette variable dans le PHP est response. Si j'ajoute un :
    en fin de fichier PHP, j'ai la réponse en double, mais pas de rafraichissement de la div uniquement.

    Y a (encore) un truc que je dois pas pijer là...
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  14. #14
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 957
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 957
    Points : 44 121
    Points
    44 121
    Par défaut
    Je viens de voir une erreur dans ton code
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    function refresh() {
        $.ajax({
            url: "./bot2.php",
            success:
                function(retour){
                $("chat").html(retour); // ICI il faut mettre $("#response")
            }
        });
    }
    setInterval("refresh()", 1000)
    en mettant $("#reponse"), déjà tu respectes la syntaxe pour récupérer un élément dont l'iD est 'response', c'est le #, ensuite tu écris la réponse là ou elle doit se trouver et non dans le conteneur de ta FORM.

    De plus comme tu utilises une FORM et sa méthode submit, il faut savoir que si tu n’inhibes pas l'action par défaut sur le submit, ta page se recharge ce qui n'est pas franchement souhaité sur un tchat.

    Pour récupérer/envoyer les données de la FORM à des fins d'envoi via Ajax, tu peux regarder du coté de la méthode serialize().

  15. #15
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    J'ai toujours mon fichier traitement2.php comme ceci :

    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    <?php
    /***************************************
      * http://www.program-o.com
      * PROGRAM O
      * Version: 2.3.1
      * FILE: index.php
      * AUTHOR: Elizabeth Perreau and Dave Morton
      * DATE: 07-23-2013
      * DETAILS: This is the XML GUI interface for Program O
      ***************************************/
     
      // $display = 'Make sure that you edit this file to change the value of $url below to reflect the correct address, and to remove this message.';
      $url = 'http://dev.prof-tux.fr/chatbot/conversation_start.php';
      $display_template = <<<end_display
          <span class="user_name">[user_name]: </span><span class="user_say">[input]</span><br>
          <span class="bot_name">[bot_name]: </span><span class="bot_say">[response]</span><br>
     
    end_display;
     
      $post_vars = (!empty($_POST)) ? filter_input_array(INPUT_POST) : array();
      $get_vars = (!empty($_GET)) ? filter_input_array(INPUT_GET) : array();
      $request_vars = array_merge($get_vars, $post_vars);
      $convo_id = (isset ($request_vars['convo_id'])) ? $request_vars['convo_id'] : get_convo_id();
      $bot_id = (isset ($request_vars['bot_id'])) ? $request_vars['bot_id'] : 2;
      if (!empty ($request_vars))
      {
        $options = array(
          CURLOPT_USERAGENT => 'Program_O_XML_API',
          CURLOPT_RETURNTRANSFER => true,
          CURLOPT_POST => true,
          //CURLOPT_CONNECTTIMEOUT => 3,
        );
        $ch = curl_init($url);
        curl_setopt_array($ch, $options);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $request_vars);
        $data = curl_exec($ch);
        curl_close($ch);
        $xml = new SimpleXMLElement($data);
        $display = '';
        $success = $xml->status->success;
        if (isset($xml->status->message))
        {
          $message = (string) $xml->status->message;
          $display = 'There was an error in the script. Message = ' . $message;
        }
        else
        {
          $user_name = (string) $xml->user_name;
          $bot_name = (string) $xml->bot_name;
          $chat = $xml->chat;
          $lines = $chat->xpath('line');
          foreach ($lines as $line)
          {
            $input = (string) $line->input;
            $response = (string) $line->response;
            $tmp_row = str_replace('[user_name]', $user_name, $display_template);
            $tmp_row = str_replace('[bot_name]', $bot_name, $tmp_row);
            $tmp_row = str_replace('[input]', $input, $tmp_row);
            $tmp_row = str_replace('[response]', $response, $tmp_row);
            $display .= $tmp_row;
          }
        }
     
      }
     
      function get_convo_id()
      {
        if (isset($_COOKIE['Program_O_XML_API'])) $convo_id = $_COOKIE['Program_O_XML_API'];
        else
        {
          session_name('Program O XML GUI');
          session_start();
          $convo_id = session_id();
          session_destroy();
        }
        return $convo_id;
     
      }
     
    ?>


    J'ai corrigé l'erreur avec #response dans le fichier bot2.php, et grâce a un exemple fournit avec le programme de bot que j'utilise, j'ai fais quelques modifs et inclus un script pour serialize, comme ceci :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    <!DOCTYPE html>
    <!--[if IE 8]> 		<html class="no-js lt-ie9" lang="en" > <![endif]-->
    <!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
     
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
     
      <link rel="shortcut icon" href="favicon.ico"  type="image/x-icon">
     
      <link rel="stylesheet" href="template/css/foundation.css">
      <link rel="stylesheet" href="template/css/foundation-icons.css">
      <script src="template/js/vendor/custom.modernizr.js"></script>
     
    <!-- flux rss -->
      <script type="text/javascript" src="template/js/jquery.js" ></script>
      <script type="text/javascript" src="template/js/FeedEk.js"></script>
     
     
     
    <script type="text/javascript">
    function refresh() {
    $.ajax({
        url: "./traitement2.php",
        success:
            function(retour){
            $("#response").html(retour); 
        }
    });
     
    }
    setInterval("refresh()", 1000)
    </script>
     
     
     
    <style type="text/css">
          h3 {
            text-align: center;
          }
          .user_name {
            color: rgb(16, 45, 178);
          }
          .bot_name {
            color: rgb(204, 0, 0);
          }
     
        </style>  
     
     
    </head>
    <body>
     
    <?php include("template/inc/header.inc.php"); ?>
     
    <!-- Main Page Content and Sidebar -->
     
    <div class="row">
     
    <!-- Main Blog Content -->
    <div class="large-9 columns">
     
    <article>
    <div class="text-justify">
    <br>
    <div class="row">
    <div class="large-11 columns">
    <h1>A propos</h1>
    <br>
     
     
    <p>
    <body onload="document.forms[0].say.focus();">
        <h3>Posez vos questions</h3>
     
    <div id="chat">
    <div class="botsay"> bot : </div>
    <div class="usersay"> user : </div>
     
     
     
        <img src="live.png">
        <form accept-charset="utf-8" id="talkform" method="get" action="<?php echo $_SERVER['PHP_SELF'] ?>">
          <p>
            <input type="text" name="say" id="say" />
            <input id="bot_id" type="hidden" name="bot_id" value="<?php echo $bot_id ?>">
            <input id="convo_id" type="hidden" name="convo_id" value="<?php echo $convo_id ?>">
            <input id="format" type="hidden" name="format" value="xml">
            <input type="submit" value="Chat" OnClick="refresh()"/>
          </p>
        </form>
        <div id="response">
     <?php echo $display ?> 
     
    </div>
     
     
     
    <script type="text/javascript" >
         $(document).ready(function() {
            $('#talkform').submit(function(e) {
              e.preventDefault();
              user = $('#say').val();
              $('.usersay').text(user);
              formdata = $("#talkform").serialize();
              $('#say').val('')
              $('#say').focus();
              $.post('<?php echo $url ?>', formdata, function(data){
                var b = data.botsay;
                var usersay = data.usersay;
                if (user != usersay) $('.usersay').text(usersay);
                $('.botsay').html(b);
              }, 'json');
              return false;
            });
          });
        </script>
     
     
    </div>
     
    </p>
     
     
    </div>
    </div>
    </div>
    </article>
     
    </div>
     
    <!-- End Main Content -->
     
     
    <!-- Sidebar -->
    <?php include("template/inc/sidebar.inc.php"); ?>
     
    <!-- End Sidebar -->
    </div>
     
    <!-- End Main Content and Sidebar -->
     
    <?php include("template/inc/footer.inc.php"); ?>
     
    </body>
    </html>

    Le soucis c'est que je n'ai plus les réponses du bot qui s'affichent, par contre, le texte entré par l'utilisateur s'affiche bien sans recharger la page.

    J'ai testé en remettant le PHP dans bot2.php et en commentant le script de refresh, j'ai la même chose en fait, pas de réponse, mais affichage sans rechargement.
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  16. #16
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Je fais des essais. Si je fais un seul fichier, comme ceci, avec #response, ma page se recharge en entier toutes les secondes semble-t-il, mais j'ai des parties qui s'affichent plusieurs fois, et impossible d'écrire dans le formulaire :

    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    133
    134
    135
    136
    137
    138
    139
    140
    141
    142
    143
    144
    145
    146
    147
    148
    149
    150
    151
    152
    153
    154
    155
    156
    157
    158
    159
    160
    161
    162
    163
    164
    165
    166
    167
    168
    169
    170
    171
    172
    173
    174
    175
    176
    177
    178
    179
    180
    181
    182
    183
    184
    185
    186
    187
    188
    189
    190
    191
    192
    193
    194
    195
    196
    197
    198
    199
    200
    201
    <?php
    /***************************************
      * http://www.program-o.com
      * PROGRAM O
      * Version: 2.3.1
      * FILE: index.php
      * AUTHOR: Elizabeth Perreau and Dave Morton
      * DATE: 07-23-2013
      * DETAILS: This is the XML GUI interface for Program O
      ***************************************/
     
      // $display = 'Make sure that you edit this file to change the value of $url below to reflect the correct address, and to remove this message.';
      $url = 'http://dev.prof-tux.fr/chatbot/conversation_start.php';
      $display_template = <<<end_display
          <span class="user_name">[user_name]: </span><span class="user_say">[input]</span><br>
          <span class="bot_name">[bot_name]: </span><span class="bot_say">[response]</span><br>
     
    end_display;
     
      $post_vars = (!empty($_POST)) ? filter_input_array(INPUT_POST) : array();
      $get_vars = (!empty($_GET)) ? filter_input_array(INPUT_GET) : array();
      $request_vars = array_merge($get_vars, $post_vars);
      $convo_id = (isset ($request_vars['convo_id'])) ? $request_vars['convo_id'] : get_convo_id();
      $bot_id = (isset ($request_vars['bot_id'])) ? $request_vars['bot_id'] : 2;
      if (!empty ($request_vars))
      {
        $options = array(
          CURLOPT_USERAGENT => 'Program_O_XML_API',
          CURLOPT_RETURNTRANSFER => true,
          CURLOPT_POST => true,
          //CURLOPT_CONNECTTIMEOUT => 3,
        );
        $ch = curl_init($url);
        curl_setopt_array($ch, $options);
        curl_setopt($ch, CURLOPT_POSTFIELDS, $request_vars);
        $data = curl_exec($ch);
        curl_close($ch);
        $xml = new SimpleXMLElement($data);
        $display = '';
        $success = $xml->status->success;
        if (isset($xml->status->message))
        {
          $message = (string) $xml->status->message;
          $display = 'There was an error in the script. Message = ' . $message;
        }
        else
        {
          $user_name = (string) $xml->user_name;
          $bot_name = (string) $xml->bot_name;
          $chat = $xml->chat;
          $lines = $chat->xpath('line');
          foreach ($lines as $line)
          {
            $input = (string) $line->input;
            $response = (string) $line->response;
            $tmp_row = str_replace('[user_name]', $user_name, $display_template);
            $tmp_row = str_replace('[bot_name]', $bot_name, $tmp_row);
            $tmp_row = str_replace('[input]', $input, $tmp_row);
            $tmp_row = str_replace('[response]', $response, $tmp_row);
            $display .= $tmp_row;
          }
        }
     
      }
     
      function get_convo_id()
      {
        if (isset($_COOKIE['Program_O_XML_API'])) $convo_id = $_COOKIE['Program_O_XML_API'];
        else
        {
          session_name('Program O XML GUI');
          session_start();
          $convo_id = session_id();
          session_destroy();
        }
        return $convo_id;
      }
     
    ?>
     
     
    <!DOCTYPE html>
    <!--[if IE 8]> 		<html class="no-js lt-ie9" lang="en" > <![endif]-->
    <!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
     
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
     
      <link rel="shortcut icon" href="favicon.ico"  type="image/x-icon">
     
      <link rel="stylesheet" href="template/css/foundation.css">
      <link rel="stylesheet" href="template/css/foundation-icons.css">
      <script src="template/js/vendor/custom.modernizr.js"></script>
     
    <!-- flux rss -->
      <script type="text/javascript" src="template/js/jquery.js" ></script>
      <script type="text/javascript" src="template/js/FeedEk.js"></script>
     
     
     
    <script type="text/javascript">
    function refresh() {
    $.ajax({
        url: "./bot3.php",
        success:
            function(retour){
            $("#response").html(retour); 
        }
    });
     
    }
    setInterval("refresh()", 1000)
    </script>
     
     
     
    <style type="text/css">
          h3 {
            text-align: center;
          }
          .user_name {
            color: rgb(16, 45, 178);
          }
          .bot_name {
            color: rgb(204, 0, 0);
          }
     
        </style>  
     
     
    </head>
    <body>
     
    <?php include("template/inc/header.inc.php"); ?>
     
    <!-- Main Page Content and Sidebar -->
     
    <div class="row">
     
    <!-- Main Blog Content -->
    <div class="large-9 columns">
     
    <article>
    <div class="text-justify">
    <br>
    <div class="row">
    <div class="large-11 columns">
    <h1>A propos</h1>
    <br>
     
     
    <p>
    <body onload="document.forms[0].say.focus();">
        <h3>Posez vos questions</h3>
     
     
     
    <div id="chat">
        <img src="live.png">
        <form accept-charset="utf-8" method="get" action="<?php echo $_SERVER['PHP_SELF'] ?>">
          <p>
            <input type="text" name="say" id="say" />
            <input id="bot_id" type="hidden" name="bot_id" value="<?php echo $bot_id ?>">
            <input id="convo_id" type="hidden" name="convo_id" value="<?php echo $convo_id ?>">
            <input id="format" type="hidden" name="format" value="xml">
            <input type="submit" value="Chat" OnClick="refresh()"/>
          </p>
        </form>
        <div id="response">
     <?php echo $display ?> 
    </div>
     
     
    </div>
     
    </p>
     
     
    </div>
    </div>
    </div>
    </article>
     
    </div>
     
    <!-- End Main Content -->
     
     
    <!-- Sidebar -->
    <?php include("template/inc/sidebar.inc.php"); ?>
     
    <!-- End Sidebar -->
    </div>
     
    <!-- End Main Content and Sidebar -->
     
    <?php include("template/inc/footer.inc.php"); ?>
     
    </body>
    </html>


    Avec l'essai d'avant, en 2 fichiers et avec le script serialize(), je n'arrive pas à avoir la réponse... Je patauge encore...
    Mais c'est intéressant, j'apprends des trucs grâce à vous, merci ;-)
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  17. #17
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 957
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 957
    Points : 44 121
    Points
    44 121
    Par défaut
    Tout d'abord, inutile de remettre à chaque fois tout ton code surtout si celui ci n'est pas modifié.

    Merci également d'indiquer le langage utilisé ([code=xxx]) pour activer la coloration syntaxique ce qui facilite la lecture.

    Ceci étant, je me perds, tu te perds, nous nous perdons

    Il faut que tu arrêtes de modifier à l'aveuglette, il faut que tu comprennes le fonctionnement simple de ce que tu essaies de faire.

    Reprenons sur un code simple, voire simpliste.
    Voici un petit exemple pour t'aider à mieux visualiser le principe

    fichier chat_reponse.php, c'est dans ce fichier, que l'on va appeler, que les paramètres sont à gérer, ici il est minimaliste à souhait
    Code php : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    <?php
    header('Content-Type: text/html; charset=utf-8');
    $retour = "";
    if( !empty($_POST['action'])){
      $action = $_POST['action'];
      if( $action == 'maj'){
          $retour = 'Aucune new disponible!';
      }
      else if( $action == 'envoi'){
        $retour = !empty($_POST['message']) ? $_POST['message'] : '<span style="color:#F00;">Merci de saisir un message!!</span>';
      }
      echo '<p class="' .$action .'"><i>[' .date("Y-m-d H:i:s") .']</i> ' .$retour .= '</p>';
    }
    ?>
    fichier mini_chat.html, c'est le fichier chargé au départ, le index.html en quelque sorte, et contenant l'appel au fichier chat_reponse.php, suit le code complet pour test.
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    <!DOCTYPE html>
    <html lang="fr">
    <head>
    <meta charset="utf-8">
    <title>Il en fait le minimum</title>
    <style>
    html, body{
      font-size:100%;
      margin:2em;
      background:#FFF;    
    }
    fieldset, input, button{
      border:1px solid #CCC;
    }
    button{
      background:#EEE;
      border-radius:3px;
      cursor:pointer;
    }
    #page{
      width:40em;
      margin:auto;
    }
    #page h1{
      margin:0.5em 0;
      font-size:1.5em;
    }
    #message{
      width:40em;
      line-height:1.5em;
      height:1.5em;  
    }
    #clear{
      float:right;
      margin:1em 0 0;
    }
    #response{
      font-size:.8em;
      height:30em;
      overflow-y: scroll;
      border:1px solid #EEF;
    }
    #response i{
      font-size:.8em;
    }
    #response p{
      margin:0;
      padding:0.25em;
    }
    .envoi{
      color:#00F;
      background:#EEF;
    }
    .maj{
      color:#888;
    }
    </style>
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      function refresh( cde, message){
        // récup. des données à envoyer
        var data =  "action=" +cde + (message ? "&message=" + message :'');
        $.ajax({
          'type': "POST",
          'url':  "chat_reponse.php",
          'data': data,
          'success': function(retour){
              var oDest = $("#response");
              // écrit le retour dans l'élément
              oDest.append(retour); 
              // scroll en fin
              oDest.scrollTop( oDest[0].scrollHeight);
            }
        });
      }
      // action sur le bouton envoyer
      $('#envoi').on('click', function(){
        // envoi du message
        refresh(this.id, $("#message").val());
        // efface le message
        $("#message").val('');
      });
      // action sur le bouton clear  
      $('#clear').on('click', function(){  
        $("#response").html('');
      });  
      // lancement de la fonction toutes les 5s
      setInterval( function(){
          refresh( 'maj');
        },
        5000); 
    });
    </script>
    </head>
    <body>
    <div id="page">
      <h1>Il en fait le minimum!</h1>
      <fieldset>
        <legend>Message</legend>
        <input type="text" id="message">
        <button id="envoi">Envoi</button>
      </fieldset>
      <fieldset>
        <legend>Discussion</legend>
        <div id="response"></div>
        <button id="clear">Clear</button>    
      </fieldset>
    </div>
    </body>
    </html>
    le code html se résume à :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    <div id="page">
      <h1>Il en fait le minimum!</h1>
      <fieldset>
        <legend>Message</legend>
        <input type="text" id="message">
        <button id="envoi">Envoi</button>
      </fieldset>
      <fieldset>
        <legend>Discussion</legend>
        <div id="response"></div>
        <button id="clear">Clear</button>    
      </fieldset>
    </div>
    il n'y a que les champs permettant l'interface plus un peu de cosmétique

    La partie code javascript suivante est commentée pour ne pas rajouter d'explication
    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    $(document).ready(function(){
      function refresh( cde, message){
        // récup. des données à envoyer
        var data =  "action=" +cde + (message ? "&message=" + message :'');
        $.ajax({
          'type': "POST",
          'url':  "chat_reponse.php",
          'data': data,
          'success': function(retour){
              var oDest = $("#response");
              // écrit le retour dans l'élément
              oDest.append(retour); 
              // scroll en fin
              oDest.scrollTop( oDest[0].scrollHeight);
            }
        });
      }
      // action sur le bouton envoyer
      $('#envoi').on('click', function(){
        // envoi du message
        refresh(this.id, $("#message").val());
        // efface le message
        $("#message").val('');
      });
      // action sur le bouton clear  
      $('#clear').on('click', function(){  
        $("#response").html('');
      });  
      // lancement de la fonction toutes les 5s
      setInterval( function(){
          refresh( 'maj');
        },
        5000); 
    });
    n'hésite pas à tester et regarde le mécanisme simple de fonctionnement.

    Pour simplifier je suis passé par 2 fichiers séparés ce qui me paraît plus sain pour comprendre le fonctionnement.

    A toi de jouer

  18. #18
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Merci beaucoup pour toutes ces explications ;-)
    C'est plus clair comme cela. Je pense avoir mieux compri le fonctionnement.

    J'ai regardé les fichiers pour voir ce qu'il faisaient, et comment.

    J'ai adapté mon fichier bot par rapport à mini_chat, notamment le javascript et le button submit :

    Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
     
     
     <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
      function refresh( cde, message){
        // récup. des données à envoyer
        var data =  "action=" +cde + (message ? "&message=" + message :'');
        $.ajax({
          'type': "POST",
          'url':  "traitement3.php",
          'data': data,
          'success': function(retour){
              var oDest = $("#response");
              // écrit le retour dans l'élément
              oDest.append(retour); 
              // scroll en fin
              oDest.scrollTop( oDest[0].scrollHeight);
            }
        });
      }
      // action sur le bouton envoyer
      $('#envoie').on('click', function(){
        // envoi du message
        refresh(this.id, $("#message").val());
        // efface le message
        $("#message").val('');
      });
     
      // lancement de la fonction toutes les 5s
      setInterval( function(){
          refresh( 'maj');
        },
        5000); 
    });
    </script>


    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
     
    <div id="chat">
        <img src="live.png">
        <form accept-charset="utf-8" method="get" action="<?php echo $_SERVER['PHP_SELF'] ?>">
          <p>
            <input type="text" name="say" id="say" />
            <input id="bot_id" type="hidden" name="bot_id" value="<?php echo $bot_id ?>">
            <input id="convo_id" type="hidden" name="convo_id" value="<?php echo $convo_id ?>">
            <input id="format" type="hidden" name="format" value="xml">
            <button type="submit" id="envoie">Parler</button>
          </p>
        </form>
        <div id="response">
     <?php echo $display ?> 
    </div>

    Par contre, pour le traitement, la je peine...
    De plus, mon fichier traitement utilise du XML :
    $xml = new SimpleXMLElement($data);

    et du coup j'ai une erreur :

    Fatal error: Uncaught exception 'Exception' with message 'String could not be parsed as XML' in /test/traitement3.php:38 Stack trace: #0 /test/traitement3.php(38): SimpleXMLElement->__construct('') #1 {main} thrown in/test/traitement3.php on line 38
    Faut que je comprennes comment fonctionne mon fichier traitement, par rapport à chat_reponse.

    Mais grâce à tout ça, je comprends mieux, encore merci ;-)
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

  19. #19
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 957
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 957
    Points : 44 121
    Points
    44 121
    Par défaut
    Je considère la discussion résolue pour moi tu as toutes les billes en main, quant à ton problème il relève plus du coté serveur, comment réaliser un fichier XML conforme!

  20. #20
    Membre habitué Avatar de lostsoul
    Homme Profil pro
    Rédacteur web, blogueur, développeur web junior
    Inscrit en
    Novembre 2003
    Messages
    759
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : France, Cher (Centre)

    Informations professionnelles :
    Activité : Rédacteur web, blogueur, développeur web junior
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2003
    Messages : 759
    Points : 184
    Points
    184
    Par défaut
    Bon...
    Moi, je n'ai pas résolu mon problème.
    J'ai réglé le soucis du xml, mais ça ne fonctionne tjs pas comme il faut. Toute la page s'actualise quand je clic.

    J'ai fais un seul fichier, c'est peut-être plus simple à gérer. Mais ça fait des heures que je suis dessus, et je n'y arrive tjs pas.

    Merci quand même beaucoup pour l'aide et la patience ;-)

    Je vais continuer, il faut que j'arrive à faire ça.
    ANDRE Ani
    GNU/Linux et Informatique Libre
    https://andre-ani.fr

Discussions similaires

  1. Réponses: 4
    Dernier message: 02/04/2008, 21h58
  2. [MySQL] Installation PHP/MySQL sur serveur 2003
    Par jacques9000 dans le forum PHP & Base de données
    Réponses: 3
    Dernier message: 17/01/2008, 14h13
  3. insérer du code php externe sur un site en javascript
    Par pas30 dans le forum Général JavaScript
    Réponses: 5
    Dernier message: 28/08/2007, 14h12
  4. Réponses: 4
    Dernier message: 19/04/2007, 01h33
  5. Logiciel en php mysql
    Par mmz dans le forum Débuter
    Réponses: 12
    Dernier message: 28/06/2006, 17h54

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo