Merge branch 'develop'

LICENSE.md

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2013-2016 SPACE10
+Copyright (c) 2013-2018 SPACE10
 
 Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
 

bower.json

@@ -1,6 +1,6 @@
 {
     "name": "conversational-form",
-    "version": "0.9.80",
+    "version": "0.9.81",
     "authors": [
         {
             "name" : "Daniel Friis",

dist/conversational-form.js

@@ -4707,6 +4707,8 @@ var cf;
             // now set it
             if (this.isRobotResponse) {
                 this.textEl.innerHTML = "";
+                if (!this.uiOptions)
+                    this.uiOptions = this.cfReference.uiOptions; // On edit uiOptions are empty, so this mitigates the problem. Not ideal.
                 var robotInitResponseTime = this.uiOptions.robot.robotResponseTime;
                 if (robotInitResponseTime != 0) {
                     this.setToThinking();
@@ -4733,9 +4735,10 @@ var cf;
                         _this.onReadyCallback();
                     // reset, as it can be called again
                     _this.onReadyCallback = null;
-                    if (_this._tag.skipUserInput === true) {
+                    if (_this._tag && _this._tag.skipUserInput === true) {
                         setTimeout(function () {
                             _this._tag.flowManager.nextStep();
+                            _this._tag.skipUserInput = false; // to avoid nextStep being fired again as this would make the flow jump too far when editing a response
                         }, _this.uiOptions.robot.chainedResponseTime);
                     }
                 }, robotInitResponseTime + (chainedResponses.length * this.uiOptions.robot.chainedResponseTime));
@@ -4767,6 +4770,8 @@ var cf;
         ChatResponse.prototype.scrollTo = function () {
             var y = this.el.offsetTop;
             var h = this.el.offsetHeight;
+            if (!this.container && this.el)
+                this.container = this.el; // On edit this.container is empty so this is a fix to reassign it. Not ideal, but...
             this.container.scrollTop = y + h + this.container.scrollTop;
         };
         ChatResponse.prototype.checkForEditMode = function () {
@@ -5432,7 +5437,7 @@ var cf;
 (function (cf_1) {
     var ConversationalForm = /** @class */ (function () {
         function ConversationalForm(options) {
-            this.version = "0.9.80";
+            this.version = "0.9.81";
             this.cdnPath = "https://cdn.jsdelivr.net/gh/space10-community/conversational-form@{version}/dist/";
             this.isDevelopment = false;
             this.loadExternalStyleSheet = true;

docs/0.9.80/getting-started/index.html

@@ -134,7 +134,7 @@ <h1 id="getting-started">Getting Started</h1>
     <p>Turning web forms into conversations. Conversational Form is an open-source concept by <a href="https://space10.io/" target="_blank">SPACE10</a> to easily turn any form element on a web page into a conversational form interface. It features conversational replacement of all input elements, reusable variables from previous questions and complete customization and control over the styling.</p>
 
     <h2 id="include-conversationalform-in-your-page">Include ConversationalForm in your page</h2>
-    <pre><code class="language-html" data-lang="html">&lt;script type="text/javascript" src="https://cdn.jsdelivr.net/gh/space10-community/conversational-form@0.9.80/dist/conversational-form.min.js" crossorigin></script></code></pre>
+    <pre><code class="language-html" data-lang="html">&lt;script type="text/javascript" src="https://cdn.jsdelivr.net/gh/space10-community/conversational-form@0.9.80/dist/conversational-form.min.js" crossorigin>&lt;/script></code></pre>
 
     <p>ConversationalForm will automatically look through the DOM for a form element with the attibute cf-form, and auto-instantiate.</p>
     <pre><code class="language-html" data-lang="html">&lt;form id="my-form-element" cf-form ...></code></pre>

docs/0.9.80/src/pages/getting-started/index.twig

@@ -8,7 +8,7 @@
     <p>Turning web forms into conversations. Conversational Form is an open-source concept by <a href="https://space10.io/" target="_blank">SPACE10</a> to easily turn any form element on a web page into a conversational form interface. It features conversational replacement of all input elements, reusable variables from previous questions and complete customization and control over the styling.</p>
 
     <h2 id="include-conversationalform-in-your-page">Include ConversationalForm in your page</h2>
-    <pre><code class="language-html" data-lang="html">&lt;script type="text/javascript" src="https://cdn.jsdelivr.net/gh/space10-community/conversational-form@{{nextVersion}}/dist/conversational-form.min.js" crossorigin></script></code></pre>
+    <pre><code class="language-html" data-lang="html">&lt;script type="text/javascript" src="https://cdn.jsdelivr.net/gh/space10-community/conversational-form@{{nextVersion}}/dist/conversational-form.min.js" crossorigin>&lt;/script></code></pre>
 
     <p>ConversationalForm will automatically look through the DOM for a form element with the attibute cf-form, and auto-instantiate.</p>
     <pre><code class="language-html" data-lang="html">&lt;form id="my-form-element" cf-form ...></code></pre>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "conversational-form",
-  "version": "0.9.80",
+  "version": "0.9.81",
   "description": "Turning web forms into conversations",
   "main": "dist/conversational-form.js",
   "directories": {

src/development-cf-robot-message.html

@@ -189,31 +189,16 @@
 	<body>
 
 				<form id="cf-form">
-
-					<input cf-questions="red or blue pill" type="text" name="pill">
-
-					<cf-robot-message cf-conditional-pill="blue" cf-questions="GREAT. YOU ARE ON THE BLUE PILL!!!!!!!!!!"></cf-robot-message>
-
-					<cf-robot-message cf-questions="Welcome to this form&&It will take around 20 seconds to complete it."></cf-robot-message>
-					<cf-robot-message cf-questions="Buckle up||Let's do this"></cf-robot-message>
-
-					<fieldset>
-						<label>
-							<input cf-questions="Checkboxes, not required." type="checkbox" name="checkboxes" id="checkboxes-1" value="developer">
-							Developer
-						</label>
-						<label>
-							<input type="checkbox" name="checkboxes" id="checkboxes-2" value="designer">
-							Designer
-						</label>
-						</div>
-						<label>
-							<input type="checkbox" name="checkboxes" id="checkboxes-3" value="curious-mind">
-							Curious mind
-						</label>
-					</fieldset>
-
-					<cf-robot-message cf-questions="Thank you for playing along."></cf-robot-message>
+						<input type="text" name="CHEESE" value="comte" cf-questions="What is your fave cheese?">
+					  <!-- <label for="radio">
+					    <input cf-questions="Hi friend. Ready to signup for our demo newsletter?" cf-label="Yes, let's begin!" type="radio" value="0">
+					    Start
+					  </label> -->
+					  <cf-robot-message cf-questions="this is just a test message to show that the next question will be skipped when trying to edit the first question."></cf-robot-message>
+					  <input type="text" name="FNAME" cf-questions="What is your firstname?">
+					  <input type="text" name="LNAME" cf-questions="What is your lastname?">
+					  <input type="text" name="EMAIL" cf-questions="What is your email?">
+
 				</form>
 
 			<div id="cf-context" role="cf-context" cf-context style="height: 600px; width: 400px; border: 1px solid #999;">

src/scripts/cf/ConversationalForm.ts

@@ -84,7 +84,7 @@ namespace cf {
 	}
 
 	export class ConversationalForm{
-		public version: string = "0.9.80";
+		public version: string = "0.9.81";
 
 		public static animationsEnabled: boolean = true;
 		public static illustrateAppFlow: boolean = true;

src/scripts/cf/ui/chat/ChatResponse.ts

@@ -207,6 +207,8 @@ namespace cf {
 				if(this.isRobotResponse){
 					this.textEl.innerHTML = "";
 
+					if(!this.uiOptions) this.uiOptions = this.cfReference.uiOptions; // On edit uiOptions are empty, so this mitigates the problem. Not ideal.
+
 					let robotInitResponseTime: number = this.uiOptions.robot.robotResponseTime;
 					if(robotInitResponseTime != 0){
 						this.setToThinking();
@@ -235,9 +237,10 @@ namespace cf {
 						// reset, as it can be called again
 						this.onReadyCallback = null;
 
-						if(this._tag.skipUserInput === true){
+						if(this._tag && this._tag.skipUserInput === true){
 							setTimeout(() =>{
 								this._tag.flowManager.nextStep()
+								this._tag.skipUserInput = false; // to avoid nextStep being fired again as this would make the flow jump too far when editing a response
 							},this.uiOptions.robot.chainedResponseTime);
 						}
 
@@ -277,6 +280,9 @@ namespace cf {
 		public scrollTo(){
 			const y: number = this.el.offsetTop;
 			const h: number = this.el.offsetHeight;
+
+			if(!this.container && this.el) this.container = this.el; // On edit this.container is empty so this is a fix to reassign it. Not ideal, but...
+
 			this.container.scrollTop = y + h + this.container.scrollTop;
 		}