diff --git a/bower.json b/bower.json index 111f3d5..079dd4a 100644 --- a/bower.json +++ b/bower.json @@ -5,7 +5,7 @@ "authors": [ "dmitrizzle " ], - "description": "Simple chatbot bubble creator based on JSON", + "description": "Simple chatbot bubble creator based on JSON conversation structure", "license": "MIT", "private": true, "ignore": [ diff --git a/component/Bubbles.js b/component/Bubbles.js index 190580a..2c25291 100644 --- a/component/Bubbles.js +++ b/component/Bubbles.js @@ -9,6 +9,10 @@ function Bubbles(container, self, options) { inputCallbackFn = options.inputCallbackFn || false; // should we display an input field? var standingAnswer = "ice"; // remember where to restart convo if interrupted + + var _convo = {}; // local memory for conversation JSON object + //--> NOTE that this object is only assigned once, per session and does not change for this + // constructor name during open session. @@ -23,7 +27,7 @@ function Bubbles(container, self, options) { var inputWrap = document.createElement("div"); inputWrap.className = "input-wrap"; var inputText = document.createElement("textarea"); - inputText.setAttribute("placeholder", "Type your question..."); + inputText.setAttribute("placeholder", "Ask me anything..."); inputWrap.appendChild(inputText); inputText.addEventListener("keypress", function(e){ // register user input if(e.keyCode == 13){ @@ -35,7 +39,7 @@ function Bubbles(container, self, options) { // callback typeof callbackFn === "function" ? callbackFn({ "input" : this.value, - "convo" : convo, + "convo" : _convo, "standingAnswer": standingAnswer }) : false; this.value = ""; @@ -61,12 +65,15 @@ function Bubbles(container, self, options) { // accept JSON & create bubbles this.talk = function(convo, here) { - this.convo = convo; - this.reply(this.convo[here]); + + // all further .talk() calls will append the conversation with additional blocks defined in convo parameter + _convo = Object.assign(_convo, convo); // POLYFILL REQUIRED FOR OLDER BROWSERS + + this.reply(_convo[here]); here ? standingAnswer = here : false; } this.reply = function(turn) { - turn = typeof turn !== "undefined" ? turn : this.convo.ice; + turn = typeof turn !== "undefined" ? turn : _convo.ice; questionsHTML = ""; if(turn.reply !== undefined){ turn.reply.reverse(); @@ -88,7 +95,7 @@ function Bubbles(container, self, options) { // navigate "answers" this.answer = function(key){ var func = function(key){ typeof window[key] === "function" ? window[key]() : false; } - this.convo[key] !== undefined ? (this.reply(this.convo[key]), standingAnswer = key) : func(key); + _convo[key] !== undefined ? (this.reply(_convo[key]), standingAnswer = key) : func(key); }; // api for typing bubble diff --git a/component/examples/4-advanced-keyboard.html b/component/examples/4-advanced-keyboard.html index 7cce50b..1af9a12 100644 --- a/component/examples/4-advanced-keyboard.html +++ b/component/examples/4-advanced-keyboard.html @@ -97,17 +97,17 @@ // this is where you may want to connect this script to NLC backend. inputCallbackFn: function(o){ - // do this if no answer matched + // add error conversation block & recall it if no answer matched var miss = function(){ givemeBubbles.talk({ - "ice": { + "i-dont-get-it": { "says": [ "Sorry, I don't get it 😕. Pls repeat? Or you can just click below 👇", ], "reply" : o.convo[o.standingAnswer].reply }, - }) + }, "i-dont-get-it") } // do this if answer found diff --git a/package.json b/package.json index af11c24..daf1833 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "chat-bubble", - "version": "1.0.0", - "description": "Simple chatbot bubble creator based on JSON", + "version": "1.2.0", + "description": "Simple chatbot bubble creator based on JSON conversation structure", "main": "component/Bubble.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1"