<?php

/* default/chatbot.html.twig */
class __TwigTemplate_2f65fa757dc3f1f2ab06a1832d39a471e0f2971a2c04ec9a2e00ce35bd3b0a0d extends Twig_Template
{
    public function __construct(Twig_Environment $env)
    {
        parent::__construct($env);

        $this->parent = false;

        $this->blocks = array(
        );
    }

    protected function doDisplay(array $context, array $blocks = array())
    {
        // line 1
        echo "<html>
  <head>
    <link href=\"";
        // line 3
        echo twig_escape_filter($this->env, $this->env->getExtension('Symfony\Bridge\Twig\Extension\AssetExtension')->getAssetUrl("bootstrap.min.css"), "html", null, true);
        echo "\" rel=\"stylesheet\" id=\"bootstrap-css\">
    <script src=\"";
        // line 4
        echo twig_escape_filter($this->env, $this->env->getExtension('Symfony\Bridge\Twig\Extension\AssetExtension')->getAssetUrl("bootstrap.min.js"), "html", null, true);
        echo "\"></script>
    <script src=\"";
        // line 5
        echo twig_escape_filter($this->env, $this->env->getExtension('Symfony\Bridge\Twig\Extension\AssetExtension')->getAssetUrl("jquery-1.11.1.min.js"), "html", null, true);
        echo "\"></script>
    <!------ Include the above in your HEAD tag ---------->
    
    <style type=\"text/css\">
      .container{max-width:1170px; margin:auto;}
      img{ max-width:100%;}
      .inbox_people {
        background: #f8f8f8 none repeat scroll 0 0;
        float: left;
        overflow: hidden;
        width: 40%; border-right:1px solid #c4c4c4;
      }
      .inbox_msg {
        border: 1px solid #c4c4c4;
        clear: both;
        /*overflow: hidden;*/
      }
      .top_spac{ margin: 20px 0 0;}


      .recent_heading {float: left; width:40%;}
      .srch_bar {
        display: inline-block;
        text-align: right;
        width: 60%; padding:
      }
      .headind_srch{ padding:10px 29px 10px 20px; overflow:hidden; border-bottom:1px solid #c4c4c4;}

      .recent_heading h4 {
        color: #05728f;
        font-size: 21px;
        margin: auto;
      }
      .srch_bar input{ border:1px solid #cdcdcd; border-width:0 0 1px 0; width:80%; padding:2px 0 4px 6px; background:none;}
      .srch_bar .input-group-addon button {
        background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
        border: medium none;
        padding: 0;
        color: #707070;
        font-size: 18px;
      }
      .srch_bar .input-group-addon { margin: 0 0 0 -27px;}

      .chat_ib h5{ font-size:15px; color:#464646; margin:0 0 8px 0;}
      .chat_ib h5 span{ font-size:13px; float:right;}
      .chat_ib p{ font-size:14px; color:#989898; margin:auto}
      .chat_img {
        float: left;
        width: 11%;
      }
      .chat_ib {
        float: left;
        padding: 0 0 0 15px;
        width: 88%;
      }

      .chat_people{ overflow:hidden; clear:both;}
      .chat_list {
        border-bottom: 1px solid #c4c4c4;
        margin: 0;
        padding: 18px 16px 10px;
      }
      .inbox_chat { height: 550px; overflow-y: scroll;}

      .active_chat{ background:#ebebeb;}

      .incoming_msg_img {
        display: inline-block;
        width: 6%;
      }
      .received_msg {
        display: inline-block;
        padding: 0 0 0 10px;
        vertical-align: top;
        width: 92%;
       }
       .received_withd_msg p {
        background: #ebebeb none repeat scroll 0 0;
        border-radius: 3px;
        color: #646464;
        font-size: 14px;
        margin: 0;
        padding: 5px 10px 5px 12px;
        width: 100%;
      }
      .time_date {
        color: #747474;
        display: block;
        font-size: 12px;
        margin: 8px 0 0;
      }
      .received_withd_msg { width: 57%;}
      .mesgs {
        /*float: left;*/
        padding: 30px 15px 0 25px;
        width: 100%;
      }

       .sent_msg p {
        background: #05728f none repeat scroll 0 0;
        border-radius: 3px;
        font-size: 14px;
        margin: 0; color:#fff;
        padding: 5px 10px 5px 12px;
        width:100%;
      }
      .outgoing_msg{ overflow:hidden; margin:26px 0 26px;}
      .sent_msg {
        float: right;
        width: 46%;
      }
      .input_msg_write input {
        background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
        border: medium none;
        color: #4c4c4c;
        font-size: 15px;
        min-height: 48px;
        width: 100%;
      }

      .type_msg {border-top: 1px solid #c4c4c4;height: 70px;padding-top: 10px;}
      .msg_send_btn {
        background: #05728f none repeat scroll 0 0;
        border: medium none;
        border-radius: 50%;
        color: #fff;
        cursor: pointer;
        font-size: 17px;
        height: 33px;
        position: absolute;
        right: 0;
        top: 11px;
        width: 33px;
      }
      .messaging { padding: 0 0 50px 0;}
      .msg_history {
        /*height: 506px;*/
        /*overflow-y: auto;*/
      }

      .bot-opt{
      \tcursor: pointer;
      \tmargin-right: 5px;
      \tborder-radius: 5px;
      \tbackground: #fff;
      \tcolor: #000;
      \tborder: solid 1px #007bff;
      }
      .bot-opt:hover{
      \tbackground: #007bff52;
      }
    </style>

    <link href=\"";
        // line 158
        echo twig_escape_filter($this->env, $this->env->getExtension('Symfony\Bridge\Twig\Extension\AssetExtension')->getAssetUrl("font-awesome.css"), "html", null, true);
        echo "\" type=\"text/css\" rel=\"stylesheet\">
    <title> Dynamic Forms </title>
  </head>
  <body>
    <div class=\"container\">
      <h3 class=\" text-center\"> ";
        // line 163
        echo twig_escape_filter($this->env, $this->getAttribute(($context["chatbot"] ?? null), "botName", array()), "html", null, true);
        echo "   </h3>
      <div class=\"messaging\">
            <div class=\"inbox_msg\">
             <div class=\"mesgs\">
                <div class=\"msg_history\" id=\"conversation\">
                  <div id=\"chatbox\">
                  \t<div class=\"incoming_msg\">
                  \t\t<div class=\"incoming_msg_img\"> 
                  \t\t\t<img src=\"";
        // line 171
        echo twig_escape_filter($this->env, $this->env->getExtension('Symfony\Bridge\Twig\Extension\AssetExtension')->getAssetUrl("template/img/a2.jpg"), "html", null, true);
        echo "\" alt=\"sunil\"> 
                  \t\t</div>
                  \t\t<div class=\"received_msg\">
                  \t\t\t<div class=\"received_withd_msg\">
                  \t\t\t\t<p>
                  \t\t\t\t\t";
        // line 176
        echo twig_escape_filter($this->env, ($context["starterMsg"] ?? null), "html", null, true);
        echo " 
  \t                \t\t\t\t<br/>
  \t                \t\t\t\t<br/>
  \t                \t\t\t\t<button class=\"btn btn-sm btn-primary\" onclick=\"loadQuestion(";
        // line 179
        echo twig_escape_filter($this->env, $this->getAttribute(($context["firstQuestion"] ?? null), "order", array()), "html", null, true);
        echo ")\">
  \t                \t\t\t\t\tCLIQUEZ ICI POUR COMMENCER 
  \t                \t\t\t\t</button>
                  \t\t\t\t</p>
                  \t\t\t\t<br/>
                  \t\t\t</div>
                  \t\t</div>
                    </div>

                \t</div>
                  <br/>
                  <div class=\"incoming_msg\" style=\"display: none;\" id=\"good-bye-div\">
                      <div class=\"received_msg\">
                        <div class=\"received_withd_msg\">
                          <p>
                            ";
        // line 194
        echo twig_escape_filter($this->env, ($context["lastMsg"] ?? null), "html", null, true);
        echo " 
                            <br/>
                          </p>
                          <br/>
                        </div>
                      </div>
                    </div>
                </div>
                <div class=\"type_msg\">
                \t<div style=\"clear: both; display: block;\">
\t\t\t\t\t\t<div class=\"input_msg_write\" id=\"answer-box\">

\t\t\t\t\t\t</div>
                \t</div>
                </div>
              </div>
            </div>
            
            
            <p class=\"text-center top_spac\"> Design by <a target=\"_blank\" href=\"#\">Sunil Rajput</a></p>
            
      </div>
    </div>

    <script type=\"text/javascript\">
\t\t\tvar botJsonUrl = \"";
        // line 219
        echo twig_escape_filter($this->env, $this->env->getExtension('Symfony\Bridge\Twig\Extension\RoutingExtension')->getPath("chatbot_json", array("botlink" => $this->getAttribute(($context["chatbot"] ?? null), "botLink", array()))), "html", null, true);
        echo "\";
\t\t\tconst req = new XMLHttpRequest();
\t\t\treq.open('GET', botJsonUrl, false);
\t\t\treq.send(null);
\t\t\tvar questions = JSON.parse(req.responseText);
\t\t\tconsole.log(questions);
\t\t\tvar chatSummary = Array();

\t\t\t// var i = 0;
\t\t\tvar answerBox = document.getElementById('answer-box');
\t\t\tvar chatBox = document.getElementById('chatbox');

\t\t\tfunction loadQuestion(i){
\t\t\t\tvar q = questions[i];
\t\t\t\tconsole.log(i);
\t\t\t\tif(q !== undefined){
\t\t\t\t\tchatbox.innerHTML += '<div class=\"incoming_msg\"><div class=\"received_msg\"><div class=\"received_withd_msg\"><p>'+ q['question'] +'</p> </div></div></div>';
\t\t\t\t\tvar answers = q['answers'];
\t\t\t\t\tif( q['isInput'] === true ){
\t\t\t\t\t\tvar input = document.createElement('input');
\t\t\t\t\t\tinput.setAttribute('id', 'input');
\t\t\t\t\t\tinput.setAttribute('placeholder', 'Votre reponse ici');
\t\t\t\t\t\tinput.setAttribute('class', 'write_msg');
\t\t\t\t\t\tinput.setAttribute('name', 'response');
\t\t\t\t\t\tinput.setAttribute('onkeypress', 'return myKeyPress(event, '+ i +')');
\t\t\t\t\t\tanswerBox.appendChild(input);
\t\t\t\t\t}
\t\t\t\t\telse{
\t\t\t\t\t\tif(answers == null || answers === undefined){
\t\t\t\t\t\t\tconsole.log('bas asnwers');
\t\t\t\t\t\t}
\t\t\t\t\t\telse{
\t\t\t\t\t\t\tfor (var j = 0;  j < answers.length;  j++) {
\t\t\t\t\t\t\t\tvar answer = answers[j];
\t\t\t\t\t\t\t\tvar choice = document.createElement('span');
\t\t\t\t\t\t\t\tchoice.setAttribute('id', 'opt-'+i+ '-'+j);
\t\t\t\t\t\t\t\tchoice.setAttribute('class', 'bot-opt alert alert-info');
\t\t\t\t\t\t\t\tchoice.setAttribute('onclick', 'chooseOption('+ i +', '+ j +')');
\t\t\t\t\t\t\t\tchoice.innerHTML = answer['option'];
\t\t\t\t\t\t\t\tanswerBox.appendChild(choice);\t\t\t
\t\t\t\t\t\t\t}
\t\t\t\t\t\t}
\t\t\t\t\t}
\t\t\t\t}
\t\t\t\telse{
\t\t\t\t\tconsole.log(JSON.parse(chatSummary));
\t\t\t\t}
\t\t\t}


\t\t\tfunction chooseOption(q,opt){
\t\t\t\tvar quest = questions[q];
\t\t\t\tvar answers = quest['answers'];
\t\t\t\tvar choice = answers[opt];
\t\t\t\tchatSummary.push([quest['idQuest'], choice['id']]);
\t\t\t\t// var txt = (document.getElementById('opt-'+q+ '-'+opt)).innerHTML;
\t\t\t\tchatbox.innerHTML += '<div class=\"outgoing_msg\"><div class=\"sent_msg\"><p> '+ choice['option'] +' </p></div></div>';

\t\t\t\t// var msg = document.createElement('label');
\t\t\t\t// msg.innerHTML = choice['option'];
\t\t\t\t// msg.style = \"display:block;float:left;\"
\t\t\t\t// chatbox.appendChild(msg);
\t\t\t\tanswerBox.innerHTML = \"\";
\t\t\t\tq = choice['next'];

        var continueChat = false;
        if(questions[q] !== undefined){
            continueChat = true;
        }
        console.log(\"next from inout \" + q);
        if(continueChat){
          loadQuestion(q);          
        }
        else{
          sayGoodBye();
        }




\t\t\t\tscrollBody();
\t\t\t}

\t\t\tfunction answerToTheBot(q){
\t\t\t\tvar quest = questions[q];
\t\t\t\tvar input = document.getElementById('input');
\t\t\t\tvar answer = input.value;
\t\t\t\tchatSummary.push([quest['idQuest'], answer]);
\t\t\t\t// var msg = document.createElement('label');
\t\t\t\t// msg.innerHTML = answer;
\t\t\t\t// msg.style = \"display:block;float:left;\"
\t\t\t\t// chatbox.appendChild(msg);
\t\t\t\tchatbox.innerHTML += '<div class=\"outgoing_msg\"><div class=\"sent_msg\"><p> '+ answer +' </p>  </div></div>';
\t\t\t\tanswerBox.innerHTML = \"\";
        q++;
        var continueChat = false;
        for (var i = q; i < 2000; i++) {
            if(questions[i] !== undefined){
                continueChat = true;
                break;
            };
        }
\t\t\t\tq = i;
        console.log(\"next from inout \" + q);
        if(continueChat){
\t\t\t\t  loadQuestion(q);          
        }
        else{
          sayGoodBye();
        }
        scrollBody();
\t\t\t}

\t\t\tfunction myKeyPress(e, q){
\t\t\t\tvar keyNum;
\t\t\t\tkeyNum = e.keyCode;
\t\t\t\tif(keyNum === 13){
\t\t\t\t\tconsole.log(keyNum);
\t\t\t\t\tanswerToTheBot(q);
\t\t\t\t}
\t\t\t}

      function scrollChat(){
        var objDiv = document.getElementById(\"conversation\");
        objDiv.scrollTop = objDiv.scrollHeight;
      }

      function scrollBody(){
        window.scrollTo(0,document.body.scrollHeight);
      }

      function sayGoodBye(){
        document.getElementById('good-bye-div').style.display = \"block\";
        sendChatRequest();
      }

      function sendChatRequest() {
        var jsonConversation = JSON.stringify(chatSummary);

        \$.ajax({
            type: \"POST\",
            url: \"";
        // line 360
        echo $this->env->getExtension('Symfony\Bridge\Twig\Extension\RoutingExtension')->getPath("save_botconv");
        echo "\",
            data: { 'data': jsonConversation }
        }).done(function (data) {
            console.log(data);
        }).error(function (jqXHR, textStatus, errorThrown) {
            alert(jqXHR.responseText || textStatus);
        });
    }
\t\t
\t\t</script>
  </body>
</html>



";
    }

    public function getTemplateName()
    {
        return "default/chatbot.html.twig";
    }

    public function isTraitable()
    {
        return false;
    }

    public function getDebugInfo()
    {
        return array (  410 => 360,  266 => 219,  238 => 194,  220 => 179,  214 => 176,  206 => 171,  195 => 163,  187 => 158,  31 => 5,  27 => 4,  23 => 3,  19 => 1,);
    }

    /** @deprecated since 1.27 (to be removed in 2.0). Use getSourceContext() instead */
    public function getSource()
    {
        @trigger_error('The '.__METHOD__.' method is deprecated since version 1.27 and will be removed in 2.0. Use getSourceContext() instead.', E_USER_DEPRECATED);

        return $this->getSourceContext()->getCode();
    }

    public function getSourceContext()
    {
        return new Twig_Source("", "default/chatbot.html.twig", "/home/smspnbgj/dynamic-form.smspro.tg/chatbot-manager/app/Resources/views/default/chatbot.html.twig");
    }
}
