From 68ab130286c7302eb673b9c6ddf991357a40b36a Mon Sep 17 00:00:00 2001 From: HomamS Date: Mon, 23 Sep 2019 17:02:56 -0400 Subject: [PATCH 1/3] Chatbot Part2 --- index.Js | 63 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 63 insertions(+) create mode 100644 index.Js diff --git a/index.Js b/index.Js new file mode 100644 index 0000000..f06ff4f --- /dev/null +++ b/index.Js @@ -0,0 +1,63 @@ + +//here we are going to define and declare object and inside the object I define two arrays +const object = [ + { + input: "Hello", + output: ["Hi","Hey","Greeting"], + }, + { + input: "what is your favourite colour ?", + output: ["I am not sure","There are too many to chose from","I like everyone"], + }, + { + input: "How are you ?", + output: ["Fine","not so good","great"], + }, +]; + + + +//here we define function called reply and this function will let the chatpot to give me the proper anwers based on the input the we give + function reply(){ + //I defince variable called question and I put inside this variable the value (input from user) + let question = document.getElementById('input').value; + let randomNumber = Math.floor(Math.random() * 3); + let filterType = null; + let answer = object.filter(function(name){ + return name.input == "Hello" + }) + console.log(answer); + + //I used if statement to check the input and give the outpot + //if(object.input.includes(question)){ + if(answer.length> 0){ + + if(document.getElementById('longest').checked){ + let longest = object.filter(long =>long.input.length >3); + document.getElementById('output').textContent = + + + } + else if(document.getElementById('shortest').checked){ + + } + else if(document.getElementById('random').checked){ + + } + } + //here we define variable called i, inside this variable i checked the index of the input based on the location in array + let i= object.input.indexOf(question); + //last step is to give the output location based on the input location in the array + document.getElementById('output').textContent = object.output[i]; + + } + else{ + document.getElementById('output').textContent = "I don't understand that command. Please enter another"; + + } + } + //finally i used eventlessenors to activate the click button in chatBot + + document.querySelector('button').addEventListener("click", reply); + +*/ From 7a14ac41175f42278d62e5a03706f76c30e10d3d Mon Sep 17 00:00:00 2001 From: HomamS Date: Sun, 29 Sep 2019 14:02:37 -0400 Subject: [PATCH 2/3] Chatbot 3 --- index.Js | 62 +++++++++++++++++++++++------------------------------- index.html | 9 ++++---- 2 files changed, 31 insertions(+), 40 deletions(-) diff --git a/index.Js b/index.Js index f06ff4f..17c1871 100644 --- a/index.Js +++ b/index.Js @@ -2,62 +2,52 @@ //here we are going to define and declare object and inside the object I define two arrays const object = [ { - input: "Hello", + input: ['Hello', 'Hi', 'Greetings'], output: ["Hi","Hey","Greeting"], }, { - input: "what is your favourite colour ?", + input: ['What is your favourite colour?', 'Who is your favourite HYF instructor?', 'Who is your role model?'], output: ["I am not sure","There are too many to chose from","I like everyone"], }, { - input: "How are you ?", + input: ['How are you?', 'How is the weather today?', 'How is Canada doing in the Olympics?'], output: ["Fine","not so good","great"], }, ]; - + //here we define function called reply and this function will let the chatpot to give me the proper anwers based on the input the we give function reply(){ //I defince variable called question and I put inside this variable the value (input from user) - let question = document.getElementById('input').value; + let question = document.getElementById('input').value; let randomNumber = Math.floor(Math.random() * 3); let filterType = null; - let answer = object.filter(function(name){ - return name.input == "Hello" - }) - console.log(answer); - - //I used if statement to check the input and give the outpot - //if(object.input.includes(question)){ - if(answer.length> 0){ - - if(document.getElementById('longest').checked){ - let longest = object.filter(long =>long.input.length >3); - document.getElementById('output').textContent = +//let answer = object.filter((item) => item.input.includes(question)); + let answer = object.filter(function(item){ + //if(item.input === question){ + if(item.input.includes(question)){ + return true; + } + }); - } - else if(document.getElementById('shortest').checked){ - - } - else if(document.getElementById('random').checked){ + if(answer.length > 0){ + if(document.getElementById('longest').checked){ + let longest = answer[0].output.sort((a,b) => b.length - a.length); + document.getElementById('output').textContent = longest[0] + '\n' + document.getElementById('output').textContent; + console.log(longest[0]); + }else if(document.getElementById('shortest').checked){ + let shortest = answer[0].output.sort((a,b) => a.length - b.length); + document.getElementById('output').textContent = shortest[0] + '\n' + document.getElementById('output').textContent; + console.log(shortest[0]); + }else if(document.getElementById('random').checked){ + document.getElementById('output').textContent = answer[0].output[randomNumber] + '\n' + document.getElementById('output').textContent; } + }else{ + document.getElementById('output').textContent = "I don't understand that command. Please enter another"; } - //here we define variable called i, inside this variable i checked the index of the input based on the location in array - let i= object.input.indexOf(question); - //last step is to give the output location based on the input location in the array - document.getElementById('output').textContent = object.output[i]; - - } - else{ - document.getElementById('output').textContent = "I don't understand that command. Please enter another"; - - } - } - //finally i used eventlessenors to activate the click button in chatBot + } document.querySelector('button').addEventListener("click", reply); - -*/ diff --git a/index.html b/index.html index c516c16..7156b3c 100755 --- a/index.html +++ b/index.html @@ -2,6 +2,7 @@ My First Chatbot + @@ -9,7 +10,7 @@

My first chatbot!

Talk to your bot!

- +
@@ -18,16 +19,16 @@

Talk to your bot!

Shortest Answer Longest Answer
- +

Chat history


-
+ - \ No newline at end of file + From 856b973b910bd6889b512617f12be0ee3c9a2a6f Mon Sep 17 00:00:00 2001 From: HomamS Date: Sun, 6 Oct 2019 12:49:13 -0400 Subject: [PATCH 3/3] Chatbot4- Week11 --- index.Js | 41 +++++++++++++++++++++++++++++++++++++++-- index.html | 2 +- test.js | 10 ++++++++++ 3 files changed, 50 insertions(+), 3 deletions(-) create mode 100644 test.js diff --git a/index.Js b/index.Js index 17c1871..1600ef6 100644 --- a/index.Js +++ b/index.Js @@ -1,3 +1,26 @@ +// I declare a function to get the information from API +function showMedog(){ +var chat = new XMLHttpRequest(); +chat.onreadystatechange = function() { + if (chat.readyState == XMLHttpRequest.DONE) { + + let data = JSON.parse(chat.responseText); + console.log(data); + + + document.getElementById('image').setAttribute('src', data.message); + } +} + chat.open('GET', 'https://dog.ceo/api/breeds/image/random', true); + chat.send(); + +} + +// I declare function to use it for the alert +function delayedAlert(){ +setTimeout(function(){alert("Did you forget about me? It is your friend, the Alarm!")}, 2000); + +} //here we are going to define and declare object and inside the object I define two arrays const object = [ @@ -25,11 +48,13 @@ const object = [ let filterType = null; //let answer = object.filter((item) => item.input.includes(question)); + let answer = object.filter(function(item){ //if(item.input === question){ + if(item.input.includes(question)){ return true; - } + } }); if(answer.length > 0){ @@ -45,9 +70,21 @@ const object = [ }else if(document.getElementById('random').checked){ document.getElementById('output').textContent = answer[0].output[randomNumber] + '\n' + document.getElementById('output').textContent; } - }else{ + } + // Imn this step i add if statement inside the excisting else in order to do the action when we type "Show mw a dog" + else{ + if(question === "Show me a dog"){ + showMedog(); + } + // Imn this step i add if statement inside the excisting else in order to do the action when we type "set an alarm" + + else if (question === "Set an alarm") { + delayedAlert(); + } + else{ document.getElementById('output').textContent = "I don't understand that command. Please enter another"; } + } } document.querySelector('button').addEventListener("click", reply); diff --git a/index.html b/index.html index 7156b3c..a77d575 100755 --- a/index.html +++ b/index.html @@ -21,11 +21,11 @@

Talk to your bot!


-

Chat history


+
diff --git a/test.js b/test.js new file mode 100644 index 0000000..39e58f5 --- /dev/null +++ b/test.js @@ -0,0 +1,10 @@ +var chat = new XMLHttpRequest(); +chat.onreadystatechange = function() { + if (chat.readyState == XMLHttpRequest.DONE) { + + let data = JSON.parse(chat.responseText); + console.log(data); + + + chat.open('GET', 'https://dog.ceo/api/breeds/image/random', true); + chat.send();