FIX_CHATBOT

This commit is contained in:
velz 2025-08-11 15:13:49 +05:30
parent 70b35995b8
commit d39b2ca2d3
2 changed files with 123 additions and 53 deletions

View File

@ -10,8 +10,11 @@ use App\Helpers\ChatbotHelper;
class EcardDownloadConversation extends Conversation class EcardDownloadConversation extends Conversation
{ {
protected $buttonsData = [];
public function run() public function run()
{ {
$this->bot->types();
sleep(0.5);
$this->showEcardMenu(); $this->showEcardMenu();
} }
@ -22,6 +25,7 @@ class EcardDownloadConversation extends Conversation
$chat_session_info = get_chatbot_session_info(); $chat_session_info = get_chatbot_session_info();
$policy_list = ChatbotHelper::getListOfPolicies($chat_session_info); $policy_list = ChatbotHelper::getListOfPolicies($chat_session_info);
$buttons = []; $buttons = [];
$question = 'Choose Policy to Download Ecard:'; $question = 'Choose Policy to Download Ecard:';
// log_message('error', ('policy_list : ' . json_encode($policy_list))); // log_message('error', ('policy_list : ' . json_encode($policy_list)));
@ -34,20 +38,24 @@ class EcardDownloadConversation extends Conversation
// Button::create("🔹 $policy['policy_name']")->value("$policy['emp_policy_id']"), // Button::create("🔹 $policy['policy_name']")->value("$policy['emp_policy_id']"),
// Button::create("◀️ Go Back")->value("go_back"), // Button::create("◀️ Go Back")->value("go_back"),
// ]); // ]);
$buttons[] = Button::create("🔹 {$policy['policy_name']}")->value($policy['emp_policy_id'].'#'.$policy['rand_string']); $this->buttonsData[$policy['emp_policy_id'].'#'.$policy['rand_string']] = ['response_text' => "🔹 {$policy['policy_name']}"] ;
$buttons[] = Button::create("{$policy['policy_name']}")->value($policy['emp_policy_id'].'#'.$policy['rand_string']);
} }
} }
else else
{ {
$question = 'No policy found'; $question = 'No policy found';
} }
$this->buttonsData['go_back'] = ['response_text' => '◀️ Go Back'] ;
$buttons = array_merge($buttons,[Button::create("◀️ Go Back")->value("go_back")]); $buttons = array_merge($buttons,[Button::create("◀️ Go Back")->value("go_back")]);
$question = Question::create($question) $question = Question::create($question)
->addButtons($buttons); ->addButtons($buttons);
$temp = $this->buttonsData;
$this->bot->ask($question, function ($answer) { $this->bot->ask($question, function ($answer) use ($temp) {
log_message('error', 'showEcardMenu answer received');
log_message('error', ($answer));
$selectedOption = $answer->getText(); $selectedOption = $answer->getText();
$this->say("You have selected {$selectedOption}"); $this->say("You have selected {$temp[$selectedOption]['response_text']}");
switch ($answer->getValue()) { switch ($answer->getValue()) {
case "go_back": case "go_back":
$this->bot->startConversation(new MainMenuConversation()); $this->bot->startConversation(new MainMenuConversation());

View File

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Insurance ChatBot</title> <title>Insurance ChatBot</title>
</head> </head>
@ -12,8 +12,8 @@
margin: 0; margin: 0;
} }
body { /* body {
background-color: rgba(0, 0, 0, 0.3); /* 30% transparent black */ background-color: rgba(0, 0, 0, 0.3);
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@ -31,15 +31,72 @@
50% { color: green; } 50% { color: green; }
75% { color: blue; } 75% { color: blue; }
100% { color: violet; } 100% { color: violet; }
} }*/
</style> </style>
<style>
/* Full-screen overlay */
#page-loader {
position: fixed;
inset: 0; /* top:0; right:0; bottom:0; left:0 */
display: flex;
align-items: center;
justify-content: center;
background: rgba(255,255,255,0.85);
z-index: 9999;
transition: opacity 300ms ease, visibility 300ms ease;
visibility: visible;
opacity: 1;
}
/* Hidden state */
#page-loader.hidden {
opacity: 0;
visibility: hidden;
pointer-events: none;
}
/* Optional card around GIF */
#page-loader .loader-box {
text-align: center;
padding: 18px;
border-radius: 12px;
box-shadow: 0 8px 30px rgba(0,0,0,0.12);
background: rgba(255,255,255,0.95);
backdrop-filter: blur(4px);
}
/* Restrict gif size for large screens */
#page-loader img {
display: block;
max-width: 120px;
width: 20vw;
height: auto;
}
/* Example page content styling */
body.noscroll {
overflow: hidden; /* prevent scrolling while loader is visible */
}
main { padding: 2rem; font-family: Arial, Helvetica, sans-serif; }
</style>
<body> <body>
<h1>Loading...</h1> <!-- <h1>Loading...from page</h1> -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script> <!-- Page loader overlay (visible by default) -->
<script src='https://cdn.jsdelivr.net/npm/botman-web-widget@0/build/js/widget.js'></script> <div id="page-loader" aria-hidden="false">
<div class="loader-box">
<!-- Replace the src with your GIF file path -->
<img src="https://venbait.in/nhance/dev/assets/images/nhance-loader.gif" alt="Loading..." />
<!-- <div style="margin-top:8px;font-size:14px;color:#555;">Loading, please wait...</div> -->
</div>
</div>
<script> <script>
// alert('start of main');
var uid = Math.floor(100000 + Math.random() * 900000); var uid = Math.floor(100000 + Math.random() * 900000);
console.log('CURRENT_USER' + uid); console.log('CURRENT_USER' + uid);
@ -157,35 +214,35 @@ function setupMessageObserver() {
// Set initial height based on device // Set initial height based on device
const initialHeight = isMobile ? 700 : 800; // Default to keyboard closed state const initialHeight = isMobile ? 700 : 800; // Default to keyboard closed state
// Method 1: Create style element with high specificity // // Method 1: Create style element with high specificity
const style = doc.createElement("style"); // const style = doc.createElement("style");
style.id = 'dynamic-chat-height'; // style.id = 'dynamic-chat-height';
style.textContent = ` // style.textContent = `
/* High specificity selectors */ // /* High specificity selectors */
#messageArea ol.chat, // #messageArea ol.chat,
#messageArea .chat, // #messageArea .chat,
ol.chat { // ol.chat {
height: ${initialHeight}px !important; // height: ${initialHeight}px !important;
max-height: ${initialHeight}px !important; // max-height: ${initialHeight}px !important;
min-height: ${initialHeight}px !important; // min-height: ${initialHeight}px !important;
transition: height 0.3s ease; // transition: height 0.3s ease;
} // }
/* Additional styling to ensure proper display */ // /* Additional styling to ensure proper display */
#messageArea { // #messageArea {
height: auto !important; // height: auto !important;
} // }
`; // `;
doc.head.appendChild(style); // doc.head.appendChild(style);
// Method 2: Direct style application as backup // Method 2: Direct style application as backup
setTimeout(() => { setTimeout(() => {
const chatElements = doc.querySelectorAll("#messageArea .chat, #messageArea ol.chat, ol.chat"); const chatElements = doc.querySelectorAll("#messageArea .chat, #messageArea ol.chat, ol.chat");
chatElements.forEach(element => { chatElements.forEach(element => {
if (element) { if (element) {
element.style.setProperty("height", initialHeight + "px", "important"); element.style.setProperty("height", 85 + "vh", "important");
element.style.setProperty("max-height", initialHeight + "px", "important"); element.style.setProperty("max-height", 85 + "vh", "important");
element.style.setProperty("min-height", initialHeight + "px", "important"); element.style.setProperty("min-height", 85 + "vh", "important");
element.style.setProperty("transition", "height 0.3s ease", "important"); element.style.setProperty("transition", "height 0.3s ease", "important");
console.log('Direct style applied to:', element); console.log('Direct style applied to:', element);
} }
@ -312,31 +369,31 @@ function setupMessageObserver() {
const doc = currentIframe.contentDocument || currentIframe.contentWindow.document; const doc = currentIframe.contentDocument || currentIframe.contentWindow.document;
if (doc) { if (doc) {
// Update existing style // Update existing style
let styleElement = doc.querySelector('#dynamic-chat-height'); // let styleElement = doc.querySelector('#dynamic-chat-height');
if (!styleElement) { // if (!styleElement) {
styleElement = doc.createElement('style'); // styleElement = doc.createElement('style');
styleElement.id = 'dynamic-chat-height'; // styleElement.id = 'dynamic-chat-height';
doc.head.appendChild(styleElement); // doc.head.appendChild(styleElement);
} // }
styleElement.textContent = ` // styleElement.textContent = `
#messageArea ol.chat, // #messageArea ol.chat,
#messageArea .chat, // #messageArea .chat,
ol.chat { // ol.chat {
height: ${height}px !important; // height: ${height}px !important;
max-height: ${height}px !important; // max-height: ${height}px !important;
min-height: ${height}px !important; // min-height: ${height}px !important;
transition: height 0.3s ease; // transition: height 0.3s ease;
} // }
`; // `;
// Direct style application as backup // Direct style application as backup
const chatElements = doc.querySelectorAll("#messageArea .chat, #messageArea ol.chat, ol.chat"); const chatElements = doc.querySelectorAll("#messageArea .chat, #messageArea ol.chat, ol.chat");
chatElements.forEach(element => { chatElements.forEach(element => {
if (element) { if (element) {
element.style.setProperty("height", height + "px", "important"); element.style.setProperty("height", 85 + "vh", "important");
element.style.setProperty("max-height", height + "px", "important"); element.style.setProperty("max-height", 85 + "vh", "important");
element.style.setProperty("min-height", height + "px", "important"); element.style.setProperty("min-height", 85 + "vh", "important");
} }
}); });
@ -593,6 +650,11 @@ function setupMessageObserver() {
</script> </script>
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<script src='https://cdn.jsdelivr.net/npm/botman-web-widget@0/build/js/widget.js'></script> <script src='https://cdn.jsdelivr.net/npm/botman-web-widget@0/build/js/widget.js'></script>
</body> </body>
</html> </html>