In todays tech-driven landscape, it is become increasingly common for applications to feature a dedicated assistant or helper. Recognizing this trend, I have crafted a user-friendly chatbot package designed to seamlessly integrate chat functionality into your projects.
To effortlessly incorporate the chatbot into your project, follow these simple steps:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/pvscreations/chatbot@v1.0.2/lib/chat.css">
<script src="https://cdn.jsdelivr.net/gh/pvscreations/chatbot@v1.0.2/lib/chat.js"></script>
For a local implementation, download the required files from the following links:
var content={
"attendance issues": {
"teacher": "database is down currently",
"app": {
"hanging": "requirements are 4gb",
"report issues": {
"on service": "database is down currently",
"on help": "database is down currently"
}
},
"other": "database is down currently"
},
"want to know my attendance?": {
"yearly": "database is down currently",
"monthly": "database is down currently",
"todays": "database is down currently",
"other": "database is down currently"
},
"raise complaint?": {
"on faculty": "database is down currently",
"on ams_app": "database is down currently",
"other": "database is down currently"
},
"want to give feedback on app?": "database is down currently",
};
- Here we create an instance
const assistant=new Chatbot(
{
content:content,
container:document.getElementById("chat"),
objectName:"assistant" //It is the object name you are creating here it is assistant you was creating line60
},
{
welcomeMsg:"hi i am your attendance assistant",
sendOfMsg:"goodbye",
redirectLink:"realtimechat.html"
}
);
- Parameters Description
- param1 is the required information to be sent to class * content is object of question and answers, * container is DOM element where chat will be rendered * objectname is name of the created chatbot
- param2 is optional which is used to customize the chatbot *welcomeMsg describes the chatbot msg which is hi i am xyz *sendofmsg describes the final msg of chatbot like goodbye *redirectlink is the link at final stage where you want to redirect the chatbot
/**
* Here we call the chatbot to come into effect
*/
assistant.initialise();
- Value Added Service (VAS) : Integrate a service for generating query and answer JSON objects.
- Modularity in Styling : Enhance styling modularity for a more adaptable design.
- Cross-Platform Support : Develop similar packages for Flutter, React Native, and React.
- Analytics Integration : Incorporate analytics for a deeper understanding of user interactions.
- Explore the example to see how the chatbot's basic layout looks and functions. Feel free to leverage this powerful tool for a more engaging and interactive user experience in your projects!