Skip to content

Commit 576fa3e

Browse files
yousufnoor5yousufnoor5
committed
initial commit
0 parents  commit 576fa3e

File tree

8 files changed

+1395
-0
lines changed

8 files changed

+1395
-0
lines changed

‎composer.json‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"name": "yousuf/chatman",
3+
"description": "Chatbot is a php library that uses machine learning to generate responses based on collection of known conversations.",
4+
"keywords": [
5+
"machine learning chatbot",
6+
"php chatbot",
7+
"ai chatbot",
8+
"chatman"
9+
],
10+
"type": "library",
11+
"license": "MIT",
12+
"authors": [
13+
{
14+
"name": "Muhammad Yousuf Noor",
15+
"email": "[email protected]"
16+
}
17+
],
18+
"require": {
19+
"php": "^7.2",
20+
"php-ai/php-ml" : "^0.9.0",
21+
"writecrow/lemmatizer" : "dev-master"
22+
},
23+
"autoload": {
24+
"psr-4": {
25+
"Chatman\\": "src/"
26+
}
27+
28+
29+
30+
}
31+
}

‎data/testhtml.html‎

Lines changed: 214 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,214 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<title>Chatman Test</title>
9+
</head>
10+
<style>
11+
body {
12+
margin: 0px;
13+
padding: 0px;
14+
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
15+
}
16+
17+
#chatbox-container {
18+
display: flex;
19+
justify-content: center;
20+
align-items: center;
21+
width: 100%;
22+
min-height: 100vh;
23+
background-color: gainsboro;
24+
}
25+
26+
#chatbox {
27+
position: relative;
28+
width: 350px;
29+
min-height: 500px;
30+
border-radius: 5px;
31+
border-bottom-left-radius: 0px;
32+
border-bottom-right-radius: 0px;
33+
background-color: white;
34+
}
35+
36+
h4 {
37+
margin: 10px;
38+
padding: 5px;
39+
border-bottom: 1px solid gainsboro;
40+
}
41+
42+
#chatmsgs {
43+
height: 400px;
44+
min-height: 400px;
45+
overflow-y: scroll;
46+
padding: 10px;
47+
}
48+
49+
#chatmsgs::-webkit-scrollbar {
50+
display: none;
51+
}
52+
53+
#chatmsgs {
54+
-ms-overflow-style: none;
55+
scrollbar-width: none;
56+
}
57+
58+
#chatwrite {
59+
display: flex;
60+
justify-content: center;
61+
align-items: center;
62+
border-top: 1px solid gainsboro;
63+
}
64+
65+
#chatwrite input {
66+
padding: 10px;
67+
outline: none;
68+
width: 80%;
69+
height: 17px;
70+
border: none;
71+
font-size: 15px;
72+
}
73+
74+
#chatwrite button {
75+
width: 15%;
76+
padding: 10px;
77+
height: 53px;
78+
outline: none;
79+
border: none;
80+
font-size: 23px;
81+
text-decoration: none;
82+
cursor: pointer;
83+
color: white;
84+
background-color: #008CBA;
85+
}
86+
87+
p {
88+
font-size: 15px;
89+
margin: 5px;
90+
}
91+
92+
.usermsg {
93+
border-radius: 15px;
94+
padding: 5px 10px 5px 10px;
95+
float: right;
96+
background-color: green;
97+
margin-top: 10px;
98+
color: white;
99+
background-color: #4CAF50;
100+
display: block;
101+
}
102+
103+
.botmsg {
104+
border-radius: 15px;
105+
padding: 5px 10px 5px 10px;
106+
float: left;
107+
background-color: blue;
108+
margin-bottom: 10px;
109+
color: white;
110+
background-color: #26A69A;
111+
display: block;
112+
}
113+
114+
.msg {
115+
display: inline-block;
116+
min-width: 330px;
117+
}
118+
</style>
119+
120+
<body>
121+
122+
<div id="chatbox-container">
123+
124+
<div id="chatbox">
125+
<h4>Chatman</h4>
126+
127+
<div id="chatmsgs">
128+
129+
130+
</div>
131+
132+
<div id="chatwrite">
133+
134+
<input id="userinput" type="text">
135+
<button onclick="sendMsg()"> ➤ </button>
136+
137+
</div>
138+
139+
</div>
140+
141+
</div>
142+
143+
144+
</body>
145+
146+
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
147+
<script>
148+
const chatMsgs = document.getElementById("chatmsgs");
149+
const userInput = document.getElementById("userinput");
150+
151+
const sendMsg = () => {
152+
153+
if (userInput.value == "" || userInput.placeholder == "typing...") {
154+
return;
155+
}
156+
157+
chatMsgs.innerHTML += '<div class="msg"><p class="usermsg">' + userInput.value + '</p></div>';
158+
159+
chatMsgs.scrollTo({
160+
top: 1000000000,
161+
behavior: 'smooth'
162+
});
163+
164+
userInput.placeholder = "typing...";
165+
askBot(userInput.value);
166+
167+
userInput.value = "";
168+
};
169+
170+
const botMsg = (msg) => {
171+
172+
if (msg == "") {
173+
userInput.placeholder = "";
174+
return;
175+
}
176+
177+
setTimeout(() => {
178+
179+
chatMsgs.innerHTML += '<div class="msg"><p class="botmsg">' + msg + '</p> </div>';
180+
userInput.placeholder = "";
181+
182+
chatMsgs.scrollTo({
183+
top: 1000000000,
184+
behavior: 'smooth'
185+
});
186+
187+
}, 1000);
188+
189+
190+
};
191+
192+
window.addEventListener("keyup", (event) => {
193+
194+
if (event.keyCode === 13) {
195+
sendMsg();
196+
}
197+
});
198+
199+
const askBot = (query) => {
200+
201+
axios.post('{{location}}', {
202+
query : query,
203+
})
204+
.then(function(response) {
205+
botMsg(response.data);
206+
})
207+
.catch(function(error) {
208+
console.log(error);
209+
});
210+
211+
};
212+
</script>
213+
214+
</html>

0 commit comments

Comments
 (0)