<!DOCTYPE html>
<html>
<head>
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">

    <title>underdogdirectory.com</title>
    <style>
body {
  background: linear-gradient(to bottom, #1abc9c, #3498db);
  font-family: Arial, sans-serif;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  color: #fff;
}


/* unvisited link */
a:link {
  color: orange;
}

/* visited link */
a:visited {
  color: orange;
}

/* mouse over link */
a:hover {
  color: orange;
}

/* selected link */
a:active {
  color: orange;
}


#chat-window {
  border: 1px solid #ccc;
  height: 300px;
  background: white;
  width: 420px;
  overflow: auto;
  padding: 10px;
  margin-bottom: 20px;
}


#bot-promotion {
  border: 0px solid #ccc;
  font-size: 20px;
  background: transparent;
 text-align: justify;
  width: 620px;
  padding: 10px;
  margin-bottom: 20px;


}



#bot-description {
  border: 0px solid #ccc;
  background: transparent;
  width: 620px;
  padding: 10px;
  margin-bottom: 20px;
  text-align: left;

}


.url::before {
  content: attr(data-url);
  text-decoration: underline;
  color: blue;
}

.url:hover::before {
  text-decoration: none;
}


.user-message {
  font-weight: bold;
  color: blue;
}

.chatbot-message {
  font-weight: bold;
  color: green;
}

#input-box {
  display: flex;
  flex-direction: row;
  align-items: center;
}

#message-form {
  display: flex;
  flex-direction: row;
  align-items: center;
}

#message-input {
  height: 40px;
  font-size: 16px;
  padding: 10px;
  border-radius: 20px;
  border: 1px solid #ccc;
  flex-grow: 1;
  margin-right: 10px;
}

#send-button {
  height: 40px;
  font-size: 16px;
  border-radius: 20px;
  border: none;
  color: #fff;
  background-color: #4CAF50;
  cursor: pointer;
  padding: 10px 20px;
  transition: all 0.3s ease-in-out;
}

#send-button:hover {
  background-color: #3e8e41;
}
    </style>
</head>
<body>
    <h1>underdogdirectory.com</h1>

    <div id="chat-window">
    </div>
    <div id="input-box">
        <form id="message-form">
            <input type="text" id="message-input" name="user-message" placeholder="Type your message here..." autocomplete="off">
            <input type="hidden" name="chatid" value="underdogdirectory.com_6573d2966928f">
            <button type="submit" id="send-button">Send</button>
        </form>
    </div>
    
           <br /><br /><div id="bot-promotion"></div>


<script>

  function getRandomDelay(min, max) {
    return Math.floor(Math.random() * (max - min + 1) + min);
  }

    var chatWindow = document.getElementById("chat-window");
    var messageForm = document.getElementById("message-form");
    var messageInput = document.getElementById("message-input");

    // Simulate the chatbot's greeting
    var greeting = "Hi! How can I help you today?";
    var chatbotMessage = document.createElement("p");
    chatbotMessage.className = "chatbot-message";
    chatbotMessage.textContent = "Ava: " + greeting;
    
     setTimeout(function() {
    chatWindow.appendChild(chatbotMessage);
      }, getRandomDelay(1000, 3000));
              


    messageForm.addEventListener("submit", function(event) {
        event.preventDefault(); // Prevent the form from being submitted normally
        submitForm();
    });

    messageInput.addEventListener("keyup", function(event) {
        if (event.keyCode === 13) {
            event.preventDefault();
            submitForm();
        }
    });

 
    function submitForm() {
        var userMessage = messageInput.value.trim(); // Trim whitespace from the message
        if (!userMessage) {
            return;
        }
        var chatMessage = document.createElement("p");
        chatMessage.className = "user-message";
        chatMessage.textContent = "You: " + userMessage;
        chatWindow.appendChild(chatMessage);
         chatWindow.scrollTop = chatWindow.scrollHeight;
        
            messageInput.disabled = true; // Disable the input box
            messageInput.placeholder = "Please wait...";


      var chatbotTyping = document.createElement("p");
        chatbotTyping.className = "chatbot-typing";
        chatbotTyping.innerHTML = "Ava is typing <span class='blink'>...</span>";
        
 
 setTimeout(function() {
      chatWindow.appendChild(chatbotTyping);
     chatWindow.scrollTop = chatWindow.scrollHeight;
              }, getRandomDelay(1000, 4000));

        setTimeout(function() {
            var xhr = new XMLHttpRequest();
            xhr.open("POST", "chatwithme.php", true);
            xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xhr.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {

                chatWindow.removeChild(chatbotTyping);
                    var chatbotMessage = document.createElement("p");
                    chatbotMessage.className = "chatbot-message";
                    chatbotMessage.innerHTML = "Ava: ";
                    chatWindow.appendChild(chatbotMessage);
                    
var responseText = this.responseText;
//var urlRegex = /https?:\/\/[^\s]+\.[^\s]+(?<![.,])/g;
var urlRegex = /(https?:\/\/[^\s]+\.[^\s]+)(?<![.,])/g;



if (urlRegex.test(responseText)) {
  var result = responseText.replace(urlRegex, '<small><a href="$1" target="_blank">$1</a></small>');

  chatbotMessage.innerHTML += result;
  chatWindow.scrollTop = chatWindow.scrollHeight;
        messageInput.focus();
      messageInput.disabled = false;
      messageInput.placeholder = "Type your message here...";
      messageInput.focus();
} else {
  var i = 0;

  var intervalId = setInterval(function() {
    chatbotMessage.insertAdjacentHTML('beforeend', responseText[i]);
    chatWindow.scrollTop = chatWindow.scrollHeight;
    i++;

    if (i >= responseText.length) {
      clearInterval(intervalId);
      chatWindow.scrollTop = chatWindow.scrollHeight;
      messageInput.focus();
      messageInput.disabled = false;
      messageInput.placeholder = "Type your message here...";
      messageInput.focus();
    }
  }, 25);
}


                }
            };

            xhr.send("chatid=underdogdirectory.com_6573d2966928f&firstname=Ava&marketplace=&language=English&price=1999&domain=underdogdirectory.com&usermessage=" + encodeURIComponent(userMessage));
            messageInput.value = "";
        }, getRandomDelay(2000, 4000)); // Wait 5 seconds before sending the request

        messageInput.value = "";
    }
    
    
        function blinkText() {
        var blink = document.querySelectorAll(".blink");
        for (var i = 0; i < blink.length; i++) {
            blink[i].style.opacity = (blink[i].style.opacity == 0 ? 1 : 0);
        }
    }

    setInterval(blinkText, 500);
    
    
</script>

<style>
    .chatbot-typing {
        color: #999;
    }
</style>




</body>
</html>

