-
Notifications
You must be signed in to change notification settings - Fork 8
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
new option eventList: onInputSubmit, called at every input submit. Can
be used to build chat dinamically based on an API, for example.
- Loading branch information
1 parent
a6b8746
commit b955606
Showing
7 changed files
with
146 additions
and
50 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <title>convForm - example</title> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1"> | ||
| <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> | ||
| <link rel="stylesheet" type="text/css" href="dist/jquery.convform.css"> | ||
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> | ||
| <link rel="stylesheet" type="text/css" href="demo.css"> | ||
| </head> | ||
| <body> | ||
| <section id="demo"> | ||
| <div class="vertical-align"> | ||
| <div class="container"> | ||
| <div class="row"> | ||
| <div class="col-sm-6 col-sm-offset-3 col-xs-offset-0"> | ||
| <div class="card no-border"> | ||
| <div id="chat"> | ||
| <form action="" method="GET" class="hidden"> | ||
| <select data-conv-question="Hello! This is an example use of the plugin to dynamically generate questions (like using an API). This is the only question that was written on the initial HTML. To end the loop, select END." name="first-question"> | ||
| <option value="understood">Understood</option> | ||
| <option value="okay">Okay, captain!</option> | ||
| </select> | ||
| </form> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| <script type="text/javascript" src="jquery-1.12.3.min.js"></script> | ||
| <script type="text/javascript" src="dist/autosize.min.js"></script> | ||
| <script type="text/javascript" src="dist/jquery.convform.js"></script> | ||
|
|
||
| <script> | ||
| jQuery(function($){ | ||
| var count = 0; | ||
| var convForm = $('#chat').convform({eventList:{onInputSubmit: function(convState, ready) { | ||
| //here you send the response to your API, get the results and build the next question | ||
| //when ready, call 'ready' callback (passed as the second parameter) | ||
| if(convState.current.answer.value==='end') { | ||
| convState.current.next = false; | ||
| //emulating random response time (100-600ms) | ||
| setTimeout(ready, Math.random()*500+100); | ||
| } else { | ||
| convState.current.next = convState.newState({ | ||
| type: 'select', | ||
| name: 'dynamic-question-'+count, | ||
| questions: ['This question state was built on your previous answer (you answered: '+convState.current.answer.text+')'], | ||
| answers: [ | ||
| {text: 'Answer 1', value: '1'}, | ||
| {text: 'Answer 2', value: '2'}, | ||
| {text: 'END', value: 'end'} | ||
| ] | ||
| }); | ||
| //emulating random response time (100-600ms) | ||
| setTimeout(ready, Math.random()*500+100); | ||
| } | ||
| count++; | ||
| }}}); | ||
| }); | ||
| </script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.