diff --git a/.gitattributes b/.gitattributes
index a6344aac8c09253b3b630fb776ae94478aa0275b..24100abf35fe63a89f9510190876c4ea9ef4c2f2 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -33,3 +33,6 @@ saved_model/**/* filter=lfs diff=lfs merge=lfs -text
*.zip filter=lfs diff=lfs merge=lfs -text
*.zst filter=lfs diff=lfs merge=lfs -text
*tfevents* filter=lfs diff=lfs merge=lfs -text
+assets/bgmain.gif filter=lfs diff=lfs merge=lfs -text
+bot/20240210_194619.jpg filter=lfs diff=lfs merge=lfs -text
+v/m/asset/background.gif filter=lfs diff=lfs merge=lfs -text
diff --git a/DOCUMENTATION.md b/DOCUMENTATION.md
new file mode 100644
index 0000000000000000000000000000000000000000..cb8584c69f5d1a3b067ba542415c4d038bedadf5
--- /dev/null
+++ b/DOCUMENTATION.md
@@ -0,0 +1,9 @@
+To ensure that all the modules are installed globally or on your project. Just run the following.
+
+pip install
+
+pip install
+
+pip install
+
+pip install
\ No newline at end of file
diff --git a/assets/background1.jpg b/assets/background1.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..33e73f703a821a0d3f9ceb2a749e4895ebfe9afc
Binary files /dev/null and b/assets/background1.jpg differ
diff --git a/assets/background2.jpg b/assets/background2.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..2394db566d42aa225aa185be757647c8dcf657fc
Binary files /dev/null and b/assets/background2.jpg differ
diff --git a/assets/background3.jpg b/assets/background3.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..2d56bdfa534a54f3abd5c306498faee30c5d2987
Binary files /dev/null and b/assets/background3.jpg differ
diff --git a/assets/bgmain.gif b/assets/bgmain.gif
new file mode 100644
index 0000000000000000000000000000000000000000..3109b220b9900eebb83275904b6f5fa9f6875d35
--- /dev/null
+++ b/assets/bgmain.gif
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:7f64ee66076696ffd23580629896f2d600250d6c73f39f64741b56073eb5afbd
+size 6446788
diff --git a/assets/comments.png b/assets/comments.png
new file mode 100644
index 0000000000000000000000000000000000000000..77a344ae8e2a5bae47dd4aaae94033648a4c13d8
Binary files /dev/null and b/assets/comments.png differ
diff --git a/assets/hand.png b/assets/hand.png
new file mode 100644
index 0000000000000000000000000000000000000000..d6c8a92d9d5aa9924cafd23967a8f2ae6dfa5111
Binary files /dev/null and b/assets/hand.png differ
diff --git a/assets/shrug.png b/assets/shrug.png
new file mode 100644
index 0000000000000000000000000000000000000000..afd9141c961442eb9b6e1d5a50adcb4a91b9bb83
Binary files /dev/null and b/assets/shrug.png differ
diff --git a/assets/speech-bubble.gif b/assets/speech-bubble.gif
new file mode 100644
index 0000000000000000000000000000000000000000..b232db6638cfa1cfd6a6ed0dd3c56c472227ea25
Binary files /dev/null and b/assets/speech-bubble.gif differ
diff --git a/bot/20240210_194619.jpg b/bot/20240210_194619.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..d5e11b4a015cff19eb5c94c997d5f6bc7dd92281
--- /dev/null
+++ b/bot/20240210_194619.jpg
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:04a9c9de3cb95624766351e96e0b6c45839f35126308e32679626a7922ecb06d
+size 1369807
diff --git a/bot/data.js b/bot/data.js
new file mode 100644
index 0000000000000000000000000000000000000000..e82989fa17080ad784a18e99e17dee40bd50d0c6
--- /dev/null
+++ b/bot/data.js
@@ -0,0 +1,30 @@
+var audio = new Audio('sentmessage.mp3');
+var contactAngelo = "<div class='social'> <a target='_blank' href='tel:+639670971677'> <div class='socialItem' id='call'><img class='socialItemI' src='phone.svg'/><label class='number'></label></label></div> </a> <a href='mailto:angeloqq03@gmail.com'> <div class='socialItem'><img class='socialItemI' src='gmail.svg' alt=''></div> </a> <a target='_blank' href='https://github.com/angeloqq03'> <div class='socialItem'><img class='socialItemI' src='github.svg' alt=''></div> </a> <a target='_blank' href='https://wa.me/639670971677'> <div class='socialItem'><img class='socialItemI' src='whatsapp.svg' alt=''>";
+
+var addressString = "<iframe src='https://www.google.com/maps/place/Teresa,+Rizal/@14.564381,121.2249255,14z/data=!3m1!4b1!4m6!3m5!1s0x3397c064d31895b3:0x65a006a4044b8b23!8m2!3d14.5596491!4d121.2225713!16s%2Fg%2F11fyxbpxh8?entry=ttu' frameborder='0' />";
+
+const $ = {
+ a:[],
+
+ selector:{
+ selector1:['selector here with options']
+ }
+}
+
+const conversation = {
+ stage: 0,
+ applicantInfo: {
+ firstName: "",
+ lastName: "",
+ middleName: "",
+ age: "",
+ email: "",
+ phoneNumber: "",
+ address: "",
+ code: ""
+ }
+};
+$.a.push(6);
+$.a.push(1);
+$.a.push()
+console.log($.a);
\ No newline at end of file
diff --git a/bot/downloadIcon.svg b/bot/downloadIcon.svg
new file mode 100644
index 0000000000000000000000000000000000000000..80e50cebf3d967d34d1e7f6ac02c907afd897058
--- /dev/null
+++ b/bot/downloadIcon.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" fill="#657178"><g><rect fill="transparent" height="24" width="24"/></g><g><path d="M12,2C6.49,2,2,6.49,2,12s4.49,10,10,10s10-4.49,10-10S17.51,2,12,2z M11,10V6h2v4h3l-4,4l-4-4H11z M17,17H7v-2h10V17z"/></g></svg>
\ No newline at end of file
diff --git a/bot/favicon.ico b/bot/favicon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..b9c24d9fc2c7cc394433f4923571c037cc6321ba
Binary files /dev/null and b/bot/favicon.ico differ
diff --git a/bot/github.svg b/bot/github.svg
new file mode 100644
index 0000000000000000000000000000000000000000..aa05db9c5c2ec024fafe15c4147c691c219959f3
--- /dev/null
+++ b/bot/github.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
\ No newline at end of file
diff --git a/bot/gmail.svg b/bot/gmail.svg
new file mode 100644
index 0000000000000000000000000000000000000000..8bda1d910609685ed307a3e951893cecbddcf4c0
--- /dev/null
+++ b/bot/gmail.svg
@@ -0,0 +1 @@
+<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M22.288 21h-20.576c-.945 0-1.712-.767-1.712-1.712v-13.576c0-.945.767-1.712 1.712-1.712h20.576c.945 0 1.712.767 1.712 1.712v13.576c0 .945-.767 1.712-1.712 1.712zm-10.288-6.086l-9.342-6.483-.02 11.569h18.684v-11.569l-9.322 6.483zm8.869-9.914h-17.789l8.92 6.229s6.252-4.406 8.869-6.229z"/></svg>
\ No newline at end of file
diff --git a/bot/icons8-close.svg b/bot/icons8-close.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4e489cda56e919093be3583ec8435bcf6008e790
--- /dev/null
+++ b/bot/icons8-close.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="64px" height="64px"><path fill="#E04F5F" d="M504.1,256C504.1,119,393,7.9,256,7.9C119,7.9,7.9,119,7.9,256C7.9,393,119,504.1,256,504.1C393,504.1,504.1,393,504.1,256z"/><path fill="#FFF" d="M285,256l72.5-84.2c7.9-9.2,6.9-23-2.3-31c-9.2-7.9-23-6.9-30.9,2.3L256,222.4l-68.2-79.2c-7.9-9.2-21.8-10.2-31-2.3c-9.2,7.9-10.2,21.8-2.3,31L227,256l-72.5,84.2c-7.9,9.2-6.9,23,2.3,31c4.1,3.6,9.2,5.3,14.3,5.3c6.2,0,12.3-2.6,16.6-7.6l68.2-79.2l68.2,79.2c4.3,5,10.5,7.6,16.6,7.6c5.1,0,10.2-1.7,14.3-5.3c9.2-7.9,10.2-21.8,2.3-31L285,256z"/></svg>
\ No newline at end of file
diff --git a/bot/index.html b/bot/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..3e4aab5136687ba48ffec0c5bf038fcf33528b8a
--- /dev/null
+++ b/bot/index.html
@@ -0,0 +1,52 @@
+<!DOCTYPE html>
+<html lang="en" width="80%" height="80%">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <link rel="stylesheet" href="style.css">
+ <script src="script.js"></script>
+ <script src="data.js"></script>
+ <title>Developer | Angelo Collins </title>
+</head>
+<body onload="startFunction()" >
+ <nav>
+ <div class="navbar">
+ <img class="dpimg" onclick="openFullScreenDP()" src="20240210_194619.jpg" alt="">
+ <div class="personalInfo">
+ <label id="name">Angelo Collins</label>
+ <label id="lastseen">last seen today at 3:24 pms</label>
+ </div>
+ </div>
+ </nav>
+ <div class="scrollable" id="myScrollable">
+ <div class="fullScreenDP" id="fullScreenDP">
+ <div class="insideDP">
+ <img class="dp" src="" alt="">
+ <svg class="closeBTN" onclick="closeFullDP()" xmlns="http://www.w3.org/2000/svg" width="64px"
+ viewBox="0 0 512 512" height="64px">
+ <path class="btnColor" fill="#E04F5F"
+ d="M504.1,256C504.1,119,393,7.9,256,7.9C119,7.9,7.9,119,7.9,256C7.9,393,119,504.1,256,504.1C393,504.1,504.1,393,504.1,256z" />
+ <path fill="#FFF"
+ d="M285,256l72.5-84.2c7.9-9.2,6.9-23-2.3-31c-9.2-7.9-23-6.9-30.9,2.3L256,222.4l-68.2-79.2c-7.9-9.2-21.8-10.2-31-2.3c-9.2,7.9-10.2,21.8-2.3,31L227,256l-72.5,84.2c-7.9,9.2-6.9,23,2.3,31c4.1,3.6,9.2,5.3,14.3,5.3c6.2,0,12.3-2.6,16.6-7.6l68.2-79.2l68.2,79.2c4.3,5,10.5,7.6,16.6,7.6c5.1,0,10.2-1.7,14.3-5.3c9.2-7.9,10.2-21.8,2.3-31L285,256z" />
+ </svg>
+ </div>
+ </div>
+ <div id="chatting" class="chatting">
+ <ul id="listUL">
+ </ul>
+ </div>
+ </div>
+ <footer>
+ <div class="sendBar">
+ <input id="inputMSG" onkeypress="isEnter(event)" type="text" placeholder="Type a message" autofocus>
+ <svg onclick="sendMsg()" viewBox="0 0 24 24" width="24" height="24" class="">
+ <path fill="currentColor"
+ d="M1.101 21.757 23.8 12.028 1.101 2.3l.011 7.912 13.623 1.816-13.623 1.817-.011 7.912z"></path>
+ </svg>
+ </div>
+ </footer>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/bot/index.py b/bot/index.py
new file mode 100644
index 0000000000000000000000000000000000000000..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391
diff --git a/bot/instagram.svg b/bot/instagram.svg
new file mode 100644
index 0000000000000000000000000000000000000000..57b3f7c3bc2fedab8393b9c407d825567c9fe863
--- /dev/null
+++ b/bot/instagram.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/></svg>
\ No newline at end of file
diff --git a/bot/linkedin.svg b/bot/linkedin.svg
new file mode 100644
index 0000000000000000000000000000000000000000..c66342908bc82e3bf54691550a8433d81dc5809e
--- /dev/null
+++ b/bot/linkedin.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z"/></svg>
\ No newline at end of file
diff --git a/bot/pdf.png b/bot/pdf.png
new file mode 100644
index 0000000000000000000000000000000000000000..0f12ae535a09a397c3243a3d4f422f4fe5f82834
Binary files /dev/null and b/bot/pdf.png differ
diff --git a/bot/phone.svg b/bot/phone.svg
new file mode 100644
index 0000000000000000000000000000000000000000..a7b9b3f797aed198ca585e439ffbcc73a31e199d
--- /dev/null
+++ b/bot/phone.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M18.48 22.926l-1.193.658c-6.979 3.621-19.082-17.494-12.279-21.484l1.145-.637 3.714 6.467-1.139.632c-2.067 1.245 2.76 9.707 4.879 8.545l1.162-.642 3.711 6.461zm-9.808-22.926l-1.68.975 3.714 6.466 1.681-.975-3.715-6.466zm8.613 14.997l-1.68.975 3.714 6.467 1.681-.975-3.715-6.467z"/></svg>
\ No newline at end of file
diff --git a/bot/php/admin.php b/bot/php/admin.php
new file mode 100644
index 0000000000000000000000000000000000000000..530b383de579cb60d1e3274614fc25f5621c1dbb
--- /dev/null
+++ b/bot/php/admin.php
@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <title>Admin Panel</title>
+</head>
+<body>
+ <h1>Admin Panel</h1>
+
+ <!-- Form to Add Schedule and Link -->
+ <h2>Add Schedule and Link for Applicant</h2>
+ <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="POST">
+ <label for="applicant_code">Applicant Code:</label>
+ <input type="text" id="applicant_code" name="applicant_code" required><br><br>
+
+ <label for="schedule_date">Schedule Date:</label>
+ <input type="date" id="schedule_date" name="schedule_date" required><br><br>
+
+ <label for="link">Link:</label>
+ <input type="text" id="link" name="link" required><br><br>
+
+ <input type="submit" name="submit" value="Add Schedule and Link">
+ </form>
+
+ <hr>
+
+ <!-- Display Existing Schedules and Links -->
+ <h2>Existing Schedules and Links</h2>
+ <table border="1">
+ <tr>
+ <th>Applicant Code</th>
+ <th>Schedule Date</th>
+ <th>Link</th>
+ <th>Action</th>
+ </tr>
+ <?php
+ // Database Connection
+ $servername = "localhost";
+ $username = "root";
+ $password = "";
+ $dbname = "angelol";
+
+ // Create connection
+ $conn = new mysqli($servername, $username, $password, $dbname);
+
+ // Check connection
+ if ($conn->connect_error) {
+ die("Connection failed: " . $conn->connect_error);
+ }
+
+ // If form is submitted, add new schedule and link
+ if(isset($_POST['submit'])) {
+ $applicantCode = $_POST['applicant_code'];
+ $scheduleDate = $_POST['schedule_date'];
+ $link = $_POST['link'];
+
+ // SQL to insert data into applicant_schedule table
+ $sql = "INSERT INTO applicant_schedule (applicant_code, schedule_date, link)
+ VALUES ('$applicantCode', '$scheduleDate', '$link')";
+
+ if ($conn->query($sql) === TRUE) {
+ // Data inserted successfully
+ echo "<script>alert('New schedule and link added successfully');</script>";
+ } else {
+ // Error inserting data
+ echo "Error: " . $sql . "<br>" . $conn->error;
+ }
+ }
+
+ // SQL to retrieve schedules and links
+ $sql = "SELECT * FROM applicant_schedule";
+ $result = $conn->query($sql);
+
+ if ($result->num_rows > 0) {
+ // Output data of each row
+ while($row = $result->fetch_assoc()) {
+ echo "<tr>";
+ echo "<td>" . $row["applicant_code"] . "</td>";
+ echo "<td>" . $row["schedule_date"] . "</td>";
+ echo "<td>" . $row["link"] . "</td>";
+ echo "<td><a href='delete_schedule_link.php?id=" . $row["id"] . "'>Delete</a></td>";
+ echo "</tr>";
+ }
+ } else {
+ echo "<tr><td colspan='4'>No schedules and links found</td></tr>";
+ }
+ $conn->close();
+ ?>
+ </table>
+</body>
+</html>
diff --git a/bot/php/create_update_schedule.php b/bot/php/create_update_schedule.php
new file mode 100644
index 0000000000000000000000000000000000000000..ebacc22b71d131874fe675cb76515f85bed9b363
--- /dev/null
+++ b/bot/php/create_update_schedule.php
@@ -0,0 +1,43 @@
+<?php
+// Database Connection
+$servername = "localhost";
+$username = "root";
+$password = "";
+$dbname = "angelol";
+
+// Create connection
+$conn = new mysqli($servername, $username, $password, $dbname);
+
+// Check connection
+if ($conn->connect_error) {
+ die("Connection failed: " . $conn->connect_error);
+}
+
+$applicantCode = $_POST['applicant_code'];
+$scheduleDate = $_POST['schedule_date'];
+$link = $_POST['link'];
+
+// Check if applicant code already exists
+$sql_check = "SELECT * FROM applicant_schedule WHERE applicant_code = '$applicantCode'";
+$result_check = $conn->query($sql_check);
+
+if ($result_check->num_rows > 0) {
+ // Update existing record
+ $sql_update = "UPDATE applicant_schedule SET schedule_date = '$scheduleDate', link = '$link' WHERE applicant_code = '$applicantCode'";
+ if ($conn->query($sql_update) === TRUE) {
+ echo "Record updated successfully";
+ } else {
+ echo "Error updating record: " . $conn->error;
+ }
+} else {
+ // Insert new record
+ $sql_insert = "INSERT INTO applicant_schedule (applicant_code, schedule_date, link) VALUES ('$applicantCode', '$scheduleDate', '$link')";
+ if ($conn->query($sql_insert) === TRUE) {
+ echo "New record created successfully";
+ } else {
+ echo "Error: " . $sql_insert . "<br>" . $conn->error;
+ }
+}
+
+$conn->close();
+?>
diff --git a/bot/php/delete_schedule_link.php b/bot/php/delete_schedule_link.php
new file mode 100644
index 0000000000000000000000000000000000000000..b9ffaedec9215eaa2cb408332c5ef38296184b59
--- /dev/null
+++ b/bot/php/delete_schedule_link.php
@@ -0,0 +1,33 @@
+<?php
+// Database Connection
+$servername = "localhost";
+$username = "root";
+$password = "";
+$dbname = "angelol";
+
+// Create connection
+$conn = new mysqli($servername, $username, $password, $dbname);
+
+// Check connection
+if ($conn->connect_error) {
+ die("Connection failed: " . $conn->connect_error);
+}
+
+// Check if ID is set and valid
+if (isset($_POST['id']) && is_numeric($_POST['id'])) {
+ $id = $_POST['id'];
+
+ // SQL to delete schedule
+ $sql = "DELETE FROM applicant_schedule WHERE id = $id";
+
+ if ($conn->query($sql) === TRUE) {
+ echo "Schedule deleted successfully";
+ } else {
+ echo "Error deleting schedule: " . $conn->error;
+ }
+} else {
+ echo "Invalid ID";
+}
+
+$conn->close();
+?>
diff --git a/bot/php/get_applications.php b/bot/php/get_applications.php
new file mode 100644
index 0000000000000000000000000000000000000000..0da33044be864801c0e0b52faa3135be2c285a53
--- /dev/null
+++ b/bot/php/get_applications.php
@@ -0,0 +1,29 @@
+<?php
+// Connect to your database
+$servername = "localhost";
+$username = "root";
+$password = "";
+$dbname = "angelol";
+
+$conn = new mysqli($servername, $username, $password, $dbname);
+if ($conn->connect_error) {
+ die("Connection failed: " . $conn->connect_error);
+}
+
+// Query to get all applications
+$sql = "SELECT * FROM applications";
+$result = $conn->query($sql);
+
+$applications = array();
+if ($result->num_rows > 0) {
+ while ($row = $result->fetch_assoc()) {
+ $applications[] = $row;
+ }
+}
+
+$conn->close();
+
+// Return applications as JSON
+header('Content-Type: application/json');
+echo json_encode($applications);
+?>
diff --git a/bot/php/get_link.php b/bot/php/get_link.php
new file mode 100644
index 0000000000000000000000000000000000000000..63964917b2eecd7e65e48478686041e091c61380
--- /dev/null
+++ b/bot/php/get_link.php
@@ -0,0 +1,30 @@
+<?php
+// Connect to your database
+$servername = "localhost";
+$username = "your_username";
+$password = "your_password";
+$dbname = "your_database";
+
+$conn = new mysqli($servername, $username, $password, $dbname);
+if ($conn->connect_error) {
+ die("Connection failed: " . $conn->connect_error);
+}
+
+// Get code from POST request
+$code = $_POST['code'];
+
+// Query to get link based on code
+$sql = "SELECT link FROM applications WHERE code='$code'";
+$result = $conn->query($sql);
+
+$link = "";
+if ($result->num_rows > 0) {
+ $row = $result->fetch_assoc();
+ $link = $row['link'];
+}
+
+$conn->close();
+
+// Return link
+echo $link;
+?>
diff --git a/bot/php/get_schedule.php b/bot/php/get_schedule.php
new file mode 100644
index 0000000000000000000000000000000000000000..a4c9194fc726d93c96c9f17f537600303324a2c4
--- /dev/null
+++ b/bot/php/get_schedule.php
@@ -0,0 +1,47 @@
+<?php
+
+// Database Connection
+$servername = "localhost";
+$username = "root";
+$password = "";
+$dbname = "angelol";
+
+// Create connection
+$conn = new mysqli($servername, $username, $password, $dbname);
+
+// Check connection
+if ($conn->connect_error) {
+ die("Connection failed: " . $conn->connect_error);
+}
+
+// Assume $code is retrieved from POST data
+$code = $_POST['code'];
+
+// SQL to retrieve schedule date and link based on code
+$sql = "SELECT schedule_date, interview_link FROM interview_schedules WHERE applicant_code = '$code'";
+
+$result = $conn->query($sql);
+
+if ($result->num_rows > 0) {
+ $row = $result->fetch_assoc();
+ $scheduleDate = $row["schedule_date"];
+ $link = $row["interview_link"];
+
+ $response = array(
+ "success" => true,
+ "scheduleDate" => $scheduleDate,
+ "link" => $link
+ );
+} else {
+ $response = array(
+ "success" => false,
+ "message" => "No schedule found for the provided code"
+ );
+}
+
+$conn->close();
+
+header('Content-Type: application/json');
+echo json_encode($response);
+
+?>
diff --git a/bot/php/save_applicant_info.php b/bot/php/save_applicant_info.php
new file mode 100644
index 0000000000000000000000000000000000000000..f51d2ce9e6d2f44adf376dbbb5b997ff3a52556a
--- /dev/null
+++ b/bot/php/save_applicant_info.php
@@ -0,0 +1,54 @@
+<?php
+
+// Database Connection
+$servername = "localhost";
+$username = "root";
+$password = "root";
+$dbname = "angelol";
+
+// Create connection
+$conn = new mysqli($servername, $username, $password, $dbname);
+
+// Check connection
+if ($conn->connect_error) {
+ die("Connection failed: " . $conn->connect_error);
+}
+
+// Get applicant data from POST
+$firstName = $_POST['firstName'];
+$lastName = $_POST['lastName'];
+$middleName = $_POST['middleName'];
+$age = $_POST['age'];
+$email = $_POST['email'];
+$phoneNumber = $_POST['phoneNumber'];
+$address = $_POST['address'];
+
+// Function to generate unique 12-character alphanumeric code
+function generateCode() {
+ $characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+ $result = '';
+ $charactersLength = strlen($characters);
+ for ($i = 0; $i < 12; $i++) {
+ $result .= $characters[rand(0, $charactersLength - 1)];
+ }
+ return $result;
+}
+
+// Generate unique code
+$applicantCode = generateCode();
+
+// SQL to insert data into applicants table
+$sql = "INSERT INTO applicants (first_name, last_name, middle_name, age, email, phone_number, address, code, status)
+ VALUES ('$firstName', '$lastName', '$middleName', '$age', '$email', '$phoneNumber', '$address', '$applicantCode', 'Active')";
+
+if ($conn->query($sql) === TRUE) {
+ // Data inserted successfully
+ echo "Thank you! Your application has been submitted. To track the status of your application, here is a unique code: A-" . $applicantCode . ". Just send this format to check: A-" . $applicantCode;
+} else {
+ // Error inserting data
+ echo "Error: " . $sql . "<br>" . $conn->error;
+}
+
+$conn->close();
+
+?>
diff --git a/bot/replies.json b/bot/replies.json
new file mode 100644
index 0000000000000000000000000000000000000000..0ce706e2775c457bcf1db9e44eb3b54d5e930c7e
--- /dev/null
+++ b/bot/replies.json
@@ -0,0 +1,28 @@
+{
+ "a":"",
+ "b":"",
+ "d":"",
+ "e":"",
+ "f":"",
+ "g":"",
+ "h":"",
+ "i":"",
+ "j":"",
+ "k":"",
+ "l":"",
+ "m":"",
+ "n":"",
+ "o":"",
+ "p":"",
+ "q":"",
+ "r":"",
+ "s":"",
+ "t":"",
+ "u":"",
+ "v":"",
+ "w":"",
+ "x":"",
+ "y":"",
+ "z":"",
+ "help":"<h1 onload='asax()'> Hello </h1>"
+}
\ No newline at end of file
diff --git a/bot/script.js b/bot/script.js
new file mode 100644
index 0000000000000000000000000000000000000000..35f75c3ab03e9a74495b8e36658e90ea3f04697c
--- /dev/null
+++ b/bot/script.js
@@ -0,0 +1,393 @@
+/* OSCAR ANGELO COLLINS RIVERA @ 2024 */
+console.log('OSCAR ANGELO COLLINS RIVERA','Angelo Collins on facebook');
+
+
+var audio = new Audio('sentmessage.mp3');
+var contactAngelo = "<div class='social'> <a target='_blank' href='tel:+639670971677'> <div class='socialItem' id='call'><img class='socialItemI' src='phone.svg'/><label class='number'></label></label></div> </a> <a href='mailto:angeloqq03@gmail.com'> <div class='socialItem'><img class='socialItemI' src='gmail.svg' alt=''></div> </a> <a target='_blank' href='https://github.com/angeloqq03'> <div class='socialItem'><img class='socialItemI' src='github.svg' alt=''></div> </a> <a target='_blank' href='https://wa.me/639670971677'> <div class='socialItem'><img class='socialItemI' src='whatsapp.svg' alt=''>";
+
+var addressString = "<iframe src='https://www.google.com/maps/place/Teresa,+Rizal/@14.564381,121.2249255,14z/data=!3m1!4b1!4m6!3m5!1s0x3397c064d31895b3:0x65a006a4044b8b23!8m2!3d14.5596491!4d121.2225713!16s%2Fg%2F11fyxbpxh8?entry=ttu' frameborder='0' />";
+
+const $ = {
+ a:[],
+
+ selector:{
+ selector1:['selector here with options']
+ }
+}
+
+
+const conversation = {
+ stage: 0,
+ applicantInfo: {
+ firstName: "",
+ lastName: "",
+ middleName: "",
+ age: "",
+ email: "",
+ phoneNumber: "",
+ address: "",
+ code: ""
+ }
+};
+
+// Define a global variable to store the fetched replies
+let replies = {};
+
+
+setTimeout(() => {
+ repp(`
+ <h1>Hello</h1><br/>
+ <select class="select-start" id="select-start" onchange="started()">
+ <option> SELECT </option>
+ <option value="Services">Services</option>
+ <option> </option>
+ <option> </option>
+ </select>
+ `)
+}, 1200);
+
+
+const started = (selector) => {
+ selector = document.getElementById('select-start');
+
+ switch (selector.value) {
+ case "Services":
+ repp(`
+ <iframe class="ifrmm" src="/form.html" frameborder="0"/>
+ `)
+ break;
+
+ default:
+ break;
+ }
+}
+
+
+// Function to fetch replies from JSON file
+function fetchReplies() {
+ fetch('replies.json')
+ .then(response => response.json())
+ .then(data => {
+ replies = data;
+ })
+ .catch(error => {
+ console.error('Error fetching replies:', error);
+ });
+}
+
+// Call fetchReplies() to load replies when the script starts
+fetchReplies();
+
+// Function to set last seen time
+function setLastSeen() {
+ var date = new Date();
+ var lastSeen = document.getElementById("lastseen");
+ lastSeen.innerText = "last seen today at " + date.getHours() + ":" + date.getMinutes()
+}
+
+// Function to close full-screen display picture
+function closeFullDP() {
+ var x = document.getElementById("fullScreenDP");
+ if (x.style.display === 'flex') {
+ x.style.display = 'none';
+ } else {
+ x.style.display = 'flex';
+ }
+}
+
+// Function to open full-screen display picture
+function openFullScreenDP() {
+ var x = document.getElementById("fullScreenDP");
+ if (x.style.display === 'flex') {
+ x.style.display = 'none';
+ } else {
+ x.style.display = 'flex';
+ }
+}
+
+// Function to check if enter key is pressed
+function isEnter(event) {
+ if (event.keyCode == 13) {
+ sendMsg();
+ }
+}
+
+// Function to send message
+function sendMsg() {
+ var input = document.getElementById("inputMSG");
+ var ti = input.value;
+ if (input.value == "") {
+ return;
+ }
+ var date = new Date();
+ var myLI = document.createElement("li");
+ var myDiv = document.createElement("div");
+ var crDiv = document.createElement("div");
+ var dateLabel = document.createElement("label");
+ dateLabel.innerText = date.getHours() + ":" + date.getMinutes();
+ myDiv.setAttribute("class", "sent");
+ crDiv.setAttribute("class", "green");
+ crDiv.innerText = input.value;
+ myDiv.appendChild(crDiv);
+ myLI.appendChild(myDiv);
+ crDiv.appendChild(dateLabel);
+ document.getElementById("listUL").appendChild(myLI);
+ var s = document.getElementById("chatting");
+ s.scrollTop = s.scrollHeight;
+ setTimeout(function () { wNreply(ti) }, 2000);
+ input.value = "";
+ playSound();
+}
+
+// Function to generate unique code
+function generateUniqueCode() {
+ var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+ var code = '';
+ for (var i = 0; i < 12; i++) {
+ code += characters.charAt(Math.floor(Math.random() * characters.length));
+ }
+ return code;
+}
+
+// Function to play sent message sound
+function playSound() {
+ audio.play();
+}
+
+// Function to send response
+function sendResponse() {
+ setTimeout(setLastSeen, 2000);
+ var date = new Date();
+ var myLI = document.createElement("li");
+ var myDiv = document.createElement("div");
+ var crDiv = document.createElement("div");
+ var dateLabel = document.createElement("label");
+ dateLabel.innerText = date.getHours() + ":" + date.getMinutes();
+ myDiv.setAttribute("class", "received");
+ crDiv.setAttribute("class", "grey");
+ dateLabel.setAttribute("class", "dateLabel");
+ crDiv.innerText = "";
+ myDiv.appendChild(crDiv);
+ myLI.appendChild(myDiv);
+ crDiv.appendChild(dateLabel);
+ document.getElementById("listUL").appendChild(myLI);
+ var s = document.getElementById("chatting");
+ s.scrollTop = s.scrollHeight;
+ playSound();
+}
+
+
+
+// Function to process user input and reply
+function wNreply(inputText) {
+ var lastSeen = document.getElementById("lastseen");
+ lastSeen.innerText = "typing...";
+ var name = "";
+
+
+
+ let user = inputText.toLowerCase();
+
+ if (user.includes("my name is")) {
+ name = inputText.substring(inputText.indexOf("is") + 2);
+ if (name.toLowerCase().includes(name)) {
+ repp("Ohh! That's my name too" + name);
+ return
+ }
+ inputText = "input";
+ } else if (user.includes("gusto") || user.includes('applying')) {
+ repp("Im glad that you're interested for a Customer Service Representative Position. To get started, please enter your first name.");
+ conversation.stage = 1;
+ return;
+ } else if (user.includes('fb')) {
+ repp(DATA.form.form1);
+ return;
+ } else if (user.startsWith('a-')) {
+ checkApplicationStatus(user.substr(2)); // Extract the code after "A-"
+ return;
+ }
+
+ switch (user.trim()) {
+ case "help":
+ repp("help");
+ break;
+ case "resume":
+ repp(resumeString);
+ break;
+ case "intro":
+ repp("intro");
+ break;
+ case "i want to apply":
+ case "applicant":
+ case "apply":
+ case "applying for customer service position":
+ repp("To get started, please type your first name.");
+ conversation.stage = 1;
+ break;
+ case "clear":
+ clearChat();
+ break;
+ case "time":
+ var date = new Date();
+ repp("Current time is " + date.getHours() + ":" + date.getMinutes());
+ break;
+ case "date":
+ var date = new Date();
+ repp("Current date is " + date.getDate() + "/" + date.getMonth() + "/" + date.getFullYear());
+ break;
+ default:
+ if (conversation.stage > 0) {
+ // Handle collecting applicant information
+ processApplicantInfo(user.trim());
+ } else {
+ repp('Im quite not sure I understand that. You can try other term for that or just type "help" to see the other available commands.');
+ }
+ break;
+ }
+
+}
+
+// Function to process applicant information
+function processApplicantInfo(input) {
+ switch (conversation.stage) {
+
+ case 1:
+ conversation.applicantInfo.firstName = input;
+ conversation.stage = 2;
+ repp("Next, please type your last name.");
+ break;
+ case 2:
+ conversation.applicantInfo.lastName = input;
+ conversation.stage = 3;
+ repp("Please provide your middle name (if any), or type 'none'.");
+ break;
+ case 3:
+ if (input.toLowerCase() === "none") {
+ conversation.applicantInfo.middleName = "None";
+ } else {
+ conversation.applicantInfo.middleName = input;
+ }
+ conversation.stage = 4;
+ repp("What is your age?");
+ break;
+ case 4:
+ conversation.applicantInfo.age = input;
+ conversation.stage = 5;
+ repp("Please enter your email address.");
+ break;
+ case 5:
+ conversation.applicantInfo.email = input;
+ conversation.stage = 6;
+ repp("Next, please provide your phone number.");
+ break;
+ case 6:
+ conversation.applicantInfo.phoneNumber = input;
+ conversation.stage = 7;
+ repp("Finally, type your present address.");
+ break;
+ case 7:
+ conversation.applicantInfo.address = input;
+ conversation.applicantInfo.code = generateUniqueCode();
+ saveApplicantInfo(conversation.applicantInfo); // Call a function to save this information to the database
+ conversation.stage = 0; // Reset the conversation stage
+ repp("Thank you! Your application has been submitted. To track the status of your application, here is a unique code: A-" + conversation.applicantInfo.code + ". Just send 'A-" + conversation.applicantInfo.code + "' to check.");
+ break;
+ default:
+ repp("I'm sorry, I didn't understand that.");
+ break;
+ }
+}
+
+// Function to clear chat
+function clearChat() {
+ document.getElementById("listUL").innerHTML = "";
+ wNreply('intro');
+}
+
+// Function to fetch replies from JSON file
+function repp(textKey) {
+ setTimeout(setLastSeen, 2000);
+ var date = new Date();
+ var myLI = document.createElement("li");
+ var myDiv = document.createElement("div");
+ var crDiv = document.createElement("div");
+ var dateLabel = document.createElement("label");
+ dateLabel.setAttribute("id", "sentlabel");
+ dateLabel.id = "sentlabel";
+ dateLabel.innerText = date.getHours() + ":" + date.getMinutes();
+ myDiv.setAttribute("class", "received");
+ crDiv.setAttribute("class", "grey");
+
+ // Check if the textKey exists in fetched replies, otherwise use the textKey itself
+ const replyText = replies[textKey] ? replies[textKey] : textKey;
+
+ crDiv.innerHTML = replyText;
+ myDiv.appendChild(crDiv);
+ myLI.appendChild(myDiv);
+ crDiv.appendChild(dateLabel);
+ document.getElementById("listUL").appendChild(myLI);
+ var s = document.getElementById("chatting");
+ s.scrollTop = s.scrollHeight;
+ playSound();
+}
+
+// Function to save applicant information
+function saveApplicantInfo(applicantInfo) {
+ var xhr = new XMLHttpRequest();
+ xhr.open("POST", "save_applicant_info.php", true);
+ xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+ xhr.onreadystatechange = function() {
+ if (xhr.readyState === 4 && xhr.status === 200) {
+ console.log(xhr.responseText); // Log server response
+ }
+ };
+ var data = "firstName=" + encodeURIComponent(applicantInfo.firstName) +
+ "&lastName=" + encodeURIComponent(applicantInfo.lastName) +
+ "&middleName=" + encodeURIComponent(applicantInfo.middleName) +
+ "&age=" + encodeURIComponent(applicantInfo.age) +
+ "&email=" + encodeURIComponent(applicantInfo.email) +
+ "&phoneNumber=" + encodeURIComponent(applicantInfo.phoneNumber) +
+ "&address=" + encodeURIComponent(applicantInfo.address) +
+ "&code=" + encodeURIComponent(applicantInfo.code);
+ xhr.send(data);
+}
+
+// Function to check application status
+function checkApplicationStatus(code) {
+ repp("Checking application status for code: " + code);
+
+ var xhr = new XMLHttpRequest();
+ xhr.open("POST", "get_interview_schedule.php", true);
+ xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+ xhr.onreadystatechange = function() {
+ if (xhr.readyState === 4 && xhr.status === 200) {
+ var response = JSON.parse(xhr.responseText);
+ if (response.success) {
+ var scheduleDate = response.scheduleDate;
+ var link = response.link;
+ repp("Your application is currently scheduled for an Initial Interview on " + scheduleDate + ". Click here for more details: " + link);
+ } else {
+ repp("No schedule found for the provided code.");
+ }
+ }
+ };
+ xhr.send("code=" + encodeURIComponent(code));
+}
+
+// Function to get interview schedule
+function getInterviewSchedule(code, callback) {
+ var xhr = new XMLHttpRequest();
+ xhr.open("POST", "get_schedule.php", true);
+ xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+ xhr.onreadystatechange = function() {
+ if (xhr.readyState === 4 && xhr.status === 200) {
+ var response = JSON.parse(xhr.responseText);
+ if (response.success) {
+ callback(response.scheduleDate, response.link);
+ } else {
+ callback(null, null);
+ }
+ }
+ };
+ xhr.send("code=" + encodeURIComponent(code));
+}
diff --git a/bot/scripts.js b/bot/scripts.js
new file mode 100644
index 0000000000000000000000000000000000000000..fdf38ea25278fd2402ef38260de4e9ab5245d717
--- /dev/null
+++ b/bot/scripts.js
@@ -0,0 +1,309 @@
+var audio = new Audio('sentmessage.mp3');
+var contactAngelo = "<div class='social'> <a target='_blank' href='tel:+639670971677'> <div class='socialItem' id='call'><img class='socialItemI' src='phone.svg'/><label class='number'></label></label></div> </a> <a href='mailto:angeloqq03@gmail.com'> <div class='socialItem'><img class='socialItemI' src='gmail.svg' alt=''></div> </a> <a target='_blank' href='https://github.com/angeloqq03'> <div class='socialItem'><img class='socialItemI' src='github.svg' alt=''></div> </a> <a target='_blank' href='https://wa.me/639670971677'> <div class='socialItem'><img class='socialItemI' src='whatsapp.svg' alt=''>";
+
+var addressString = "";
+
+const DATA = {
+ goverment:{
+ psa:{
+ a:["Click the link to proceed on <a href='psa.com'>Philippines Statistics Authority </a>"]
+ }
+ },
+
+ social:{
+ facebook:[],
+ },
+
+ form:{
+ form1:[''],
+ },
+
+ selector:{
+ selector1:['selector here with options']
+ }
+}
+
+const conversation = {
+ stage: 0,
+ applicantInfo: {
+ firstName: "",
+ lastName: "",
+ middleName: "",
+ age: "",
+ email: "",
+ phoneNumber: "",
+ address: "",
+ code: ""
+ }
+};
+
+function startFunction() {
+ setLastSeen();
+ wNreply("intro");
+}
+
+function setLastSeen() {
+ var date = new Date();
+ var lastSeen = document.getElementById("lastseen");
+ lastSeen.innerText = "last seen today at " + date.getHours() + ":" + date.getMinutes()
+}
+
+function closeFullDP() {
+ var x = document.getElementById("fullScreenDP");
+ if (x.style.display === 'flex') {
+ x.style.display = 'none';
+ } else {
+ x.style.display = 'flex';
+ }
+}
+
+function openFullScreenDP() {
+ var x = document.getElementById("fullScreenDP");
+ if (x.style.display === 'flex') {
+ x.style.display = 'none';
+ } else {
+ x.style.display = 'flex';
+ }
+}
+
+function isEnter(event) {
+ if (event.keyCode == 13) {
+ sendMsg();
+ }
+}
+
+function sendMsg() {
+ var input = document.getElementById("inputMSG");
+ var ti = input.value;
+ if (input.value == "") {
+ return;
+ }
+ var date = new Date();
+ var myLI = document.createElement("li");
+ var myDiv = document.createElement("div");
+ var crDiv = document.createElement("div");
+ var dateLabel = document.createElement("label");
+ dateLabel.innerText = date.getHours() + ":" + date.getMinutes();
+ myDiv.setAttribute("class", "sent");
+ crDiv.setAttribute("class", "green");
+ dateLabel.setAttribute("class", "dateLabel");
+ crDiv.innerText = input.value;
+ myDiv.appendChild(crDiv);
+ myLI.appendChild(myDiv);
+ crDiv.appendChild(dateLabel);
+ document.getElementById("listUL").appendChild(myLI);
+ var s = document.getElementById("chatting");
+ s.scrollTop = s.scrollHeight;
+ setTimeout(function () { wNreply(ti) }, 1500);
+ input.value = "";
+ playSound();
+}
+
+function wNreply(inputText) {
+ var lastSeen = document.getElementById("lastseen");
+ lastSeen.innerText = "typing...";
+ var name = "";
+
+ let user = inputText.toLowerCase();
+
+ if (user.includes("my name is")) {
+ name = inputText.substring(inputText.indexOf("is") + 2);
+ if (name.toLowerCase().includes("angelo")) {
+ sendTextMessage("Ohh! That's my name too");
+
+ }
+ inputText = "input";
+ } else if (user.includes("gusto")||user.includes('applying')) {
+ sendTextMessage("Im glad that you're interedted for a Customer Service Representative Position. To get started, please enter your first name."),conversation.stage = 0;
+ return;
+ } else if (user.includes('fb')) {
+ sendTextMessage(DATA.form.form1);
+ return;
+ } else if ("") {
+ alert('&@');
+ }
+
+ switch (user.trim()) {
+ case "help":
+ sendTextMessage("<span class='sk'>You may send the following basic keywords<br>e.g<br><span class='bold'>'Apply'</span> - for applicants. <br><span class='bold'>'Interested'</span> - to know more about the process of application. <br><span class='bold'>'Newbie'</span> - if you are new in the world of Customer Service. <br><span class='bold'>'Contact'</span> - reach out to me personally. <br><span class='bold'>'FAQ's</span> - to see the most frequently asked questions about BPO Industry<br><span class='bold'>'Clear'</span> - to clear conversation<br><br> - Or you can just ask me anything that is Customer Service Related.<br>");
+ break;
+ case "resume":
+ sendTextMessage(resumeString);
+ break;
+ case "intro":
+ sendTextMessage("Hi There! <br> <br> I'm ACBA, Angelo Collins Bot Assistant. I am here to assist you.<br><br>Whether you're a newbie, or with experience. I will guide and assist you throughout the process.<br><br>You may send the keyword ''Help'' to know more.");
+ break;
+ case "i want to apply":
+ case "applicant":
+ case "apply":
+ case "applying for customer service position":
+ sendTextMessage("To get started, please type your first name.");
+ conversation.stage = 1;
+ break;
+ case "clear":
+ clearChat();
+ break;
+ case "time":
+ var date = new Date();
+ sendTextMessage("Current time is " + date.getHours() + ":" + date.getMinutes());
+ break;
+ case "date":
+ var date = new Date();
+ sendTextMessage("Current date is " + date.getDate() + "/" + date.getMonth() + "/" + date.getFullYear());
+ break;
+ default:
+ if (conversation.stage > 0) {
+ // Handle collecting applicant information
+ processApplicantInfo(user.trim());
+ } else if (user.includes("status of a-")) {
+ var code = user.split("a-")[1].toUpperCase();
+ checkApplicationStatus(code);
+ } else {
+ sendTextMessage('Im quite not sure I understand that. You can try other term for that or just type "help" to see the other available commands.');
+ }
+ break;
+ }
+}
+
+function processApplicantInfo(input) {
+ switch (conversation.stage) {
+
+ case 1:
+ conversation.applicantInfo.firstName = input;
+ conversation.stage = 2;
+ sendTextMessage("Next, please type your last name.");
+ break;
+ case 2:
+ conversation.applicantInfo.lastName = input;
+ conversation.stage = 3;
+ sendTextMessage("Please provide your middle name (if any), or type 'none'.");
+ break;
+ case 3:
+ if (input.toLowerCase() === "none") {
+ conversation.applicantInfo.middleName = "None";
+ } else {
+ conversation.applicantInfo.middleName = input;
+ }
+ conversation.stage = 4;
+ sendTextMessage("What is your age?");
+ break;
+ case 4:
+ conversation.applicantInfo.age = input;
+ conversation.stage = 5;
+ sendTextMessage("Please enter your email address.");
+ break;
+ case 5:
+ conversation.applicantInfo.email = input;
+ conversation.stage = 6;
+ sendTextMessage("Next, please provide your phone number.");
+ break;
+ case 6:
+ conversation.applicantInfo.phoneNumber = input;
+ conversation.stage = 7;
+ sendTextMessage("Finally, type your present address.");
+ break;
+ case 7:
+ conversation.applicantInfo.address = input;
+ conversation.stage = 8;
+ saveApplicantInfo(conversation.applicantInfo); // Call a function to save this information to the database
+ break;
+ case 8:
+ conversation.applicantInfo.code = generateCode(); // Generate and assign unique code
+ sendTextMessage(`Thank you! Your application has been submitted. To track the status of your application, here is your unique code: A-${conversation.applicantInfo.code}. Just send "Status of A-${conversation.applicantInfo.code}" to check.`);
+ conversation.stage = 0; // Reset the conversation stage
+ break;
+ default:
+ sendTextMessage("I'm sorry, I didn't understand that.");
+ break;
+ }
+}
+
+function clearChat() {
+ document.getElementById("listUL").innerHTML = "";
+ wNreply('intro');
+}
+
+function sendTextMessage(textToSend) {
+ setTimeout(setLastSeen, 1000);
+ var date = new Date();
+ var myLI = document.createElement("li");
+ var myDiv = document.createElement("div");
+ var crDiv = document.createElement("div");
+ var dateLabel = document.createElement("label");
+ dateLabel.setAttribute("id", "sentlabel");
+ dateLabel.id = "sentlabel";
+ dateLabel.innerText = date.getHours() + ":" + date.getMinutes();
+ myDiv.setAttribute("class", "received");
+ crDiv.setAttribute("class", "grey");
+ crDiv.innerHTML = textToSend;
+ myDiv.appendChild(crDiv);
+ myLI.appendChild(myDiv);
+ crDiv.appendChild(dateLabel);
+ document.getElementById("listUL").appendChild(myLI);
+ var s = document.getElementById("chatting");
+ s.scrollTop = s.scrollHeight;
+ playSound();
+}
+
+function generateCode() {
+ // Generate a unique 12-character alphanumeric code
+ var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
+ var code = '';
+ for (var i = 0; i < 12; i++) {
+ code += characters.charAt(Math.floor(Math.random() * characters.length));
+ }
+ return code;
+}
+
+function checkApplicationStatus(code) {
+ sendTextMessage("Checking application status...");
+
+ // Assume fetching status from server for the given code
+ var status = "Active";
+ var schedule = getInterviewSchedule(code);
+
+ switch (status) {
+ case "Active":
+ sendTextMessage(`Your application is currently Active and waiting for the initial interview on ${schedule}.`);
+ break;
+ case "Reviewed":
+ sendTextMessage("Your application is under review.");
+ break;
+ case "Initial Interview":
+ sendTextMessage(`Your application is scheduled for an Initial Interview on ${schedule}.`);
+ break;
+ case "Assessment":
+ sendTextMessage("Your application is currently in the Assessment stage.");
+ break;
+ case "Final Interview":
+ sendTextMessage(`Your application is scheduled for a Final Interview on ${schedule}.`);
+ break;
+ case "Passed":
+ sendTextMessage("Congratulations! Your application has passed all stages.");
+ break;
+ default:
+ sendTextMessage("No applications found with status: " + status);
+ break;
+ }
+}
+
+function getInterviewSchedule(code) {
+ let xhr = new XMLHttpRequest();
+ xhr.open("POST", "get_schedule.php", false);
+ xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
+ xhr.send("code=" + encodeURIComponent(code));
+
+ if (xhr.readyState === 4 && xhr.status === 200) {
+ return xhr.responseText;
+ } else {
+ return "No schedule available";
+ }
+ return "Interview schedule not found";
+}
+
+function saveApplicantInfo(applicantInfo) {
+ // Simulate saving applicant info to the database
+ // You can implement the server-side script to handle this
+ console.log("Saving applicant info to database:", applicantInfo);
+}
+
diff --git a/bot/sentmessage.mp3 b/bot/sentmessage.mp3
new file mode 100644
index 0000000000000000000000000000000000000000..1ef09b9f68ecc4108802987822b23a73dbbcccc9
Binary files /dev/null and b/bot/sentmessage.mp3 differ
diff --git a/bot/style.css b/bot/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..e28a64b12322dc244b13dc2d4c6a50fc1b33af4a
--- /dev/null
+++ b/bot/style.css
@@ -0,0 +1,504 @@
+* {
+ padding: 0;
+ margin: 0;
+ font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
+}
+
+body {
+ margin: 0 auto;
+ background-color: #1b1b1b;
+ background-size: unset;
+ background-repeat: repeat;
+ height: 100dvh;
+ box-sizing: border-box;
+ scrollbar-width: 0px;
+}
+
+body::-webkit-scrollbar{
+ display:none;
+}
+
+nav {
+ display: flex;
+ height: 6%;
+ background-color: #202c33;
+}
+
+.navbar {
+ width: 100%;
+ display: flex;
+ background-color: #202c33;
+}
+
+.dpimg {
+ cursor: pointer;
+ border-radius: 100%;
+ width: 5%;
+ height: 5%;
+ height: auto;
+ margin: auto 0px;
+ margin-left: 10px;
+}
+
+.navbar .personalInfo {
+ line-height: 100%;
+ display: flex;
+ flex-direction: column;
+ margin: auto 0px;
+ margin-left: 2%;
+}
+
+.personalInfo #name {
+ color: #e9edef;
+ margin-bottom: 4px;
+}
+
+.personalInfo #lastseen {
+ color: #8696a0;
+ font-size: small;
+}
+
+.scrollable {
+ overflow-y: scroll;
+ color: #fff;
+ display: flex;
+ height: 88%;
+ flex-direction: column;
+ background-color: ivory;
+ align-items: flex-end;
+ position: relative;
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+ position: relative;
+ box-sizing: border-box;
+ background: #003e33;
+
+}
+
+.scrollable::-webkit-scrollbar{
+ display: none;
+}
+
+.scrollable .chatting {
+ overflow-y: scroll;
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+ position: relative;
+ word-wrap: break-word;
+ height: 100%;
+ width: 100%;
+ box-sizing: border-box;
+
+}
+
+.scrollable .chatting::-webkit-scrollbar {
+ display: none;
+}
+
+#listUL {
+ overflow-y: hidden;
+ position: static;
+ width: 100%;
+ bottom: 0;
+ list-style-type: none;
+ display: flex;
+ flex-direction: column;
+ box-sizing: border-box;
+
+}
+
+#listUL li {
+ width: 100%;
+ text-decoration: none;
+ flex-direction: row-reverse;
+}
+
+.sent {
+ text-align: end;
+ float: right;
+ width: auto;
+ max-width: 45%;
+}
+
+.green {
+ margin: 5px;
+ text-align: end;
+ width: max-content;
+ max-width: 90dvw;
+ padding: 10px;
+ background-color: #005c4b;
+ border-radius: 15px 15px 0px;
+ box-sizing: border-box;
+ animation: fade-in 0.7s ease;
+}
+
+
+
+.green::-webkit-scrollbar{
+ display: none;
+}
+.green::-webkit-scrollbar-track{
+ display: none;
+}
+#sentlabel {
+ color: #94bab3;
+ display: block;
+ text-align: end;
+ font-size: x-small;
+}
+
+.recieved {
+ float: left;
+ width: 45%;
+ max-width: 45%;
+}
+
+.grey {
+ max-width: 90dvw;
+ margin: 5px;
+ text-align: start;
+ width: max-content;
+ padding: 12px;
+ background-color: #202c33;
+ border-radius: 0px 15px 15px;
+ box-sizing: border-box;
+ max-height: 90dvh;
+ animation: slide-in-left 0.2s ease;
+}
+
+@keyframes slide-in-left{
+from{
+transform: translate3d(-100%, 0, 0);
+visibility: visible;
+}
+to{
+transform: translate3d(0, 0, 0);
+}
+}
+@keyframes fade-in{
+ from{
+ opacity: 0;
+ }
+ to{
+ opacity: 1;
+ }
+ }
+
+/* iframe messages */
+.ifrmm{
+ width: 84dvw;
+ border: 4px solid rgb(201, 201, 201);
+ overflow: hidden;
+ height: 58dvh;
+}
+
+
+
+.ifrmm::-webkit-scrollbar{
+ display: none;
+}
+
+.grey .mapview {
+ margin: auto;
+ display: flex;
+ padding: 5px;
+ box-sizing: border-box;
+}
+
+.add address {
+ margin-top: 10px;
+ padding-left: 15px;
+}
+
+.map {
+ margin: auto;
+ width: 100%;
+ border-radius: 10px;
+ box-sizing: border-box;
+
+}
+
+.dateLabel {
+ color: #94bab3;
+ display: block;
+ text-align: end;
+ font-size: x-small;
+}
+
+.sk .bold {
+ color: rgba(219, 154, 33, 0.822);
+}
+
+.resumeThumbnail {
+ width: 100%;
+ border-radius: 10px 10px 0px 0px;
+}
+
+.downloadSpace {
+ background-color: #1d282f;
+ display: flex;
+ width: 100%;
+}
+
+.downloadSpace .pdfname {
+ display: flex;
+ width: 100%;
+}
+
+.pdfname label {
+ margin: auto 0px;
+}
+
+.downloadSpace img {
+ width: 30px;
+ cursor: pointer;
+ margin: 5px;
+}
+
+.bold {
+ font-weight: bold;
+}
+
+.alink {
+ color: goldenrod;
+ transition: all 600ms ease;
+ text-decoration: none;
+}
+
+.alink:hover {
+ text-decoration: none;
+ color: green;
+}
+
+.social {
+ padding: 10px;
+}
+
+.social .socialItem {
+ width: 100%;
+ border-radius: 10px;
+ background-color: lightsalmon;
+ cursor: pointer;
+ display: flex;
+ margin-bottom: 10px;
+ transition: all 500ms ease-in-out;
+}
+
+.social .socialItemI {
+ margin: auto;
+ padding: 10px;
+ flex-direction: column;
+}
+
+.social .socialItem:hover {
+ background-color: rgba(58, 170, 58, 0.863);
+}
+
+#call {
+ flex-direction: column;
+ text-align: center;
+}
+
+.number {
+ display: none;
+}
+
+.scrollable .fullScreenDP {
+ transition: all 700ms ease-in-out;
+ position: absolute;
+ width: 100%;
+ height: 100%;
+ display: none;
+ flex-direction: column;
+ background-color: #2f2f2fec;
+ z-index: 1000;
+}
+
+.scrollable .fullScreenDP .insideDP {
+ display: flex;
+ margin: auto;
+ scrollbar-width: 0px;
+ box-sizing: border-box;
+
+}
+
+
+.closeBTN {
+ width: 30px;
+ height: 30px;
+ display: block;
+ position: absolute;
+ margin-left: 6%;
+ margin-top: 5px;
+ cursor: pointer;
+}
+
+.btnColor {
+ fill: rgba(0, 0, 0, 0.692);
+ transition: all 400ms ease-in-out;
+}
+
+.closeBTN:hover .btnColor {
+ fill: red;
+}
+
+.scrollable .fullScreenDP .insideDP .dp {
+ width: 90%;
+ margin: auto;
+ border-radius: 10px;
+}
+
+footer {
+ position: relative;
+ left: 0;
+ bottom: 0;
+ width: 100%;
+ color: white;
+ text-align: center;
+ height: auto;
+ background-color: #202c33;
+ text-align: center;
+}
+
+.sendBar {
+ display: flex;
+ height: 100%;
+ width: 100%;
+ margin: auto;
+}
+
+.sendBar svg {
+ margin: auto;
+ height: 40%;
+ min-height: 40%;
+}
+
+.sendBar input[type='text'] {
+ margin: auto;
+ margin: 5px;
+ border-radius: 10px;
+ padding: 10px;
+ color: #fff;
+ float: left;
+ width: 80%;
+ height: 100%;
+ outline-color: transparent;
+ accent-color: transparent;
+ background-color: #2a3942;
+ outline: none;
+ border-color: transparent;
+}
+
+.sendBar input[type='text']::placeholder {
+ color: #8696a0;
+ opacity: 1;
+}
+
+.sendBar input[type='text']:-ms-input-placeholder {
+ color: #8696a0;
+}
+
+.sendBar input[type='text']::-ms-input-placeholder {
+ color: #8696a0;
+}
+
+/* Updated styles for the form */
+.grey form,
+.green form {
+ margin: 0;
+ padding: 10px;
+ width: auto;
+ max-width: 80%;
+ background-color: #202c33;
+ border-radius: 10px;
+ box-sizing: border-box;
+}
+
+.grey form input,
+.green form input {
+ width: 100%;
+ padding: 8px;
+ margin-bottom: 8px;
+ border-radius: 5px;
+ border: 1px solid #ccc;
+ box-sizing: border-box;
+}
+
+.grey form button,
+.green form button {
+ width: 100%;
+ padding: 8px;
+ border: none;
+ border-radius: 5px;
+ background-color: #005c4b;
+ color: #fff;
+ cursor: pointer;
+ box-sizing: border-box;
+
+}
+
+.grey form button:hover,
+.green form button:hover {
+ background-color: #003e33;
+}
+
+@media screen and (min-width: 1024px) {
+ body {
+ margin: auto;
+ width: 50vw;
+ box-sizing: border-box;
+
+ }
+
+ .sendBar {
+ width: 85%;
+ }
+
+ .scrollable {
+ -ms-overflow-style: none;
+ scrollbar-width: none;
+ position: relative;
+ overflow: hidden;
+ }
+
+ .scrollable .fullScreenDP {
+ display: none;
+ width: 100%;
+ height: 100%;
+ overflow-y: scroll;
+ }
+
+ .scrollable .fullScreenDP .insideDP {
+ display: flex;
+ width: 70%;
+ }
+
+ .scrollable .fullScreenDP .dp {
+ width: 50%;
+ margin: auto;
+ }
+
+ .scrollable .closeBTN {
+ margin-top: 15px;
+ }
+
+ #call:hover .number {
+ display: block;
+ height: auto;
+ }
+}
+
+.select-start{
+ padding: 10px;
+ font-weight: 900;
+ font-family: Arial, Helvetica, sans-serif;
+ background-color: brown;
+ color: wheat;
+}
+
+.select-start option{
+ font-family: Arial, Helvetica, sans-serif;
+ font-weight: 900;
+ background-color: brown;
+ position: fixed;
+}
\ No newline at end of file
diff --git a/bot/swl.sql b/bot/swl.sql
new file mode 100644
index 0000000000000000000000000000000000000000..99dd5644b7a5d9405d97b31c08c45158796a6308
--- /dev/null
+++ b/bot/swl.sql
@@ -0,0 +1,13 @@
+CREATE TABLE applicants (
+ id INT AUTO_INCREMENT PRIMARY KEY,
+ firstName VARCHAR(255) NOT NULL,
+ lastName VARCHAR(255) NOT NULL,
+ middleName VARCHAR(255),
+ age INT,
+ email VARCHAR(255) NOT NULL,
+ phoneNumber VARCHAR(20) NOT NULL,
+ address TEXT,
+ code VARCHAR(20) NOT NULL,
+ timestamp TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
+ status ENUM('active', 'reviewed', 'initial_interview', 'assessment', 'final_interview', 'passed') DEFAULT 'active'
+);
diff --git a/bot/telegram.svg b/bot/telegram.svg
new file mode 100644
index 0000000000000000000000000000000000000000..4f9e951b04dfb6dc259b88e3d5809b0ecb6a47ab
--- /dev/null
+++ b/bot/telegram.svg
@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="24px" height="24px" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;"><path id="telegram-1" d="M18.384,22.779c0.322,0.228 0.737,0.285 1.107,0.145c0.37,-0.141 0.642,-0.457 0.724,-0.84c0.869,-4.084 2.977,-14.421 3.768,-18.136c0.06,-0.28 -0.04,-0.571 -0.26,-0.758c-0.22,-0.187 -0.525,-0.241 -0.797,-0.14c-4.193,1.552 -17.106,6.397 -22.384,8.35c-0.335,0.124 -0.553,0.446 -0.542,0.799c0.012,0.354 0.25,0.661 0.593,0.764c2.367,0.708 5.474,1.693 5.474,1.693c0,0 1.452,4.385 2.209,6.615c0.095,0.28 0.314,0.5 0.603,0.576c0.288,0.075 0.596,-0.004 0.811,-0.207c1.216,-1.148 3.096,-2.923 3.096,-2.923c0,0 3.572,2.619 5.598,4.062Zm-11.01,-8.677l1.679,5.538l0.373,-3.507c0,0 6.487,-5.851 10.185,-9.186c0.108,-0.098 0.123,-0.262 0.033,-0.377c-0.089,-0.115 -0.253,-0.142 -0.376,-0.064c-4.286,2.737 -11.894,7.596 -11.894,7.596Z"/></svg>
\ No newline at end of file
diff --git a/bot/update_status.php b/bot/update_status.php
new file mode 100644
index 0000000000000000000000000000000000000000..130a9f7b6a7e340a93aaa1956abceb24115cf074
--- /dev/null
+++ b/bot/update_status.php
@@ -0,0 +1,33 @@
+<?php
+
+// Establish connection to MySQL$servername = "localhost";
+$username = "username";
+$password = "password";
+$dbname = "your_database";
+
+// Create connection
+$conn = new mysqli($servername, $username, $password, $dbname);
+
+// Check connection
+if ($conn->connect_error) {
+ die("Connection failed: " . $conn->connect_error);
+}
+
+if ($_SERVER["REQUEST_METHOD"] == "POST") {
+ $applicant_code = $_POST["applicant_code"];
+ $status = $_POST["status"];
+ $schedule = $_POST["schedule"];
+
+ // Update status in applicants table
+ $update_query = "UPDATE applicants SET status = '$status' WHERE code = '$applicant_code'";
+ mysqli_query($conn, $update_query);
+
+ // Update interview schedule in interviews table
+ $insert_query = "INSERT INTO interviews (code, schedule) VALUES ('$applicant_code', '$schedule')";
+ mysqli_query($conn, $insert_query);
+
+ // Redirect back to admin panel
+ header("Location: admin_panel.php");
+ exit();
+}
+?>
diff --git a/bot/whatsapp.svg b/bot/whatsapp.svg
new file mode 100644
index 0000000000000000000000000000000000000000..afeca9d9514c391bf4c5cd7ee223e53e69b0f544
--- /dev/null
+++ b/bot/whatsapp.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M.057 24l1.687-6.163c-1.041-1.804-1.588-3.849-1.587-5.946.003-6.556 5.338-11.891 11.893-11.891 3.181.001 6.167 1.24 8.413 3.488 2.245 2.248 3.481 5.236 3.48 8.414-.003 6.557-5.338 11.892-11.893 11.892-1.99-.001-3.951-.5-5.688-1.448l-6.305 1.654zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981zm11.387-5.464c-.074-.124-.272-.198-.57-.347-.297-.149-1.758-.868-2.031-.967-.272-.099-.47-.149-.669.149-.198.297-.768.967-.941 1.165-.173.198-.347.223-.644.074-.297-.149-1.255-.462-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.297-.347.446-.521.151-.172.2-.296.3-.495.099-.198.05-.372-.025-.521-.075-.148-.669-1.611-.916-2.206-.242-.579-.487-.501-.669-.51l-.57-.01c-.198 0-.52.074-.792.372s-1.04 1.016-1.04 2.479 1.065 2.876 1.213 3.074c.149.198 2.095 3.2 5.076 4.487.709.306 1.263.489 1.694.626.712.226 1.36.194 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.695.248-1.29.173-1.414z"/></svg>
\ No newline at end of file
diff --git a/content.js b/content.js
new file mode 100644
index 0000000000000000000000000000000000000000..26da68be714c8b07e029af13070e5144b4ceb4ab
--- /dev/null
+++ b/content.js
@@ -0,0 +1,69 @@
+const start = () => {
+ const elems = [];
+ const ids = [];
+ const datasets = () => {
+ const data = () => {
+ // pushing
+ ids.push(document.getElementById('home'), document.getElementById('search'),document.getElementById(''));
+ elems.push();
+
+ console.log(ids);
+
+ // end of data
+ }
+ data();
+ // end of datasets
+ }
+
+datasets();
+}
+
+function searchh(){
+ const val = document.getElementById('search').value;
+
+ if (val.includes('chat')){
+
+ if(val.includes('bot')){
+ alert('chat bot search met')
+ return;
+ }
+ if (val.includes('system')) {
+ alert('chat system search met')
+ return;
+ }
+ return;
+ } else if(val.includes('blog')){
+ if (val.includes('')) {
+ return;
+ }
+ } else if(val.includes('system')){
+ if (val.includes('order')) {
+ alert('order system search met');
+ return
+ }
+ if (val.includes('transport')) {
+ alert('transport system search met');
+ return
+ }
+ if (val.includes('school')) {
+ alert('school system search met');
+ return
+ }
+ if (val.includes('complete')) {
+ alert('complete system search met');
+ return
+ }
+ return
+ } else if(val.includes('files')){
+ alert('files met');
+ return;
+ } else if (val.includes('niczip')){
+ location.assign('nic.zip');
+ return;
+ } else {
+ alert('try again')
+ }
+
+}
+
+start();
\ No newline at end of file
diff --git a/form.html b/form.html
new file mode 100644
index 0000000000000000000000000000000000000000..861670761ef78fe46c087d08cc762c92f67f5d5a
--- /dev/null
+++ b/form.html
@@ -0,0 +1,91 @@
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <meta http-equiv="X-UA-Compatible" content="IE=7">
+ <style>
+
+ *{
+ font-family: 'Trebuchet MS';
+ }
+ body::-webkit-scrollbar{
+ display:none;
+ }
+ body{
+ width: auto;
+ max-width: 100dvw;
+ background: rgba(0, 0, 0, 0.218);
+ color: cyan;
+ margin: 0px auto;
+ box-sizing: border-box;
+ height: 80dvh;
+ }
+
+ #logsec{
+ display: flex;
+ flex-direction: column;
+ text-align: center;
+ justify-content: center;
+ height: 80dvh;
+ animation: fade-in 1s ease;
+ }
+
+ #full_name , #password{
+ margin-top: 12px;
+ border-radius: 8px;
+ padding: 6px;
+ background: black;
+ color: lavender;
+ font-size: 11pt;
+ }
+
+ #full_name::placeholder{
+ color: wheat;
+ font-size: 12pt;
+ }
+
+ #password::placeholder{
+ color: wheat;
+ font-size: 12pt;
+ }
+
+ #logsec label{
+ font-size: 13pt;
+ font-weight: 400;
+ }
+
+ @keyframes fade-in{
+ from{
+ opacity: 0;
+ }
+ to{
+ opacity: 1;
+ }
+ }
+ </style>
+</head>
+<body id="logsec">
+ <div>
+ <label for="full_name">Login, or create an account with our chatbot!</label><br>
+ <input type="text" name="full_name" id="full_name" placeholder="Enter username..."><br>
+ <input type="password" name="password" id="password" placeholder="Enter username..." required><br>
+ <span id="datas"></span><br>
+ <p id="showpw" onclick="showpw()">Show password.</p>
+ <button id="submit" onclick="form_submit()">SUBMIT </button>
+ </div>
+<script>
+const f_name = document.getElementById('full_name');
+const data_s = document.getElementById('datas');
+
+function form_submit(z) {
+ z = f_name.value;
+
+ setTimeout(() => {
+ data_s.innerHTML =`<br> ${z}`;
+}, 2000);
+
+}
+
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..b7b72ba6c3e30cbba3f3c14e0981f3ef21506a40
--- /dev/null
+++ b/index.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Ok Softwares And Web Development</title>
+
+ <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+ <div class="container" id="container">
+
+ <nav class="navbar">
+ <div class="burger">☰</div>
+ <ul class="nav-links">
+ <li><a onclick="home()">Home</a></li>
+ <li><a onclick="hosting()">Hosting Services</a></li>
+ <li><a onclick="chatbots()">Chatbots</a></li>
+ <li><a onclick="systems()">Systems</a></li>
+ <li><a onclick="softwares()">Softwares</a></li>
+ <li><a onclick="contact()">Contact</a></li>
+ </ul>
+ </nav>
+
+ <div class="main-content" id="main-content">
+
+ <section id="home" class="intro-section">
+ <div class="searchie">
+ <input type="search" name="search" id="search" placeholder="Search projects...">
+ <button type="button" id="btn-search" onclick="searchh()"> 🔍 </button>
+ </div>
+ <h1>Welcome</h1><h1>to</h1><h1>OK Softwares & Web Development</h1>
+
+ </section>
+
+ <footer class="footer">
+
+ <p>© 2024 OK Softwares & Web Development. All Rights Reserved.</p>
+ </footer>
+ </div>
+ </div>
+ <div class="chatbot-bubble">
+ <p class="pup" id="pup">Need assistance?</p>
+ <img src="assets/shrug.png" alt="Chatbot">
+ </div>
+
+ <div class="chatbot-window">
+ <button class="chatbot-close">Close</button>
+ <iframe src="bot/index.html" frameborder="0"></iframe>
+ </div>
+ <script src="scripts.js"></script>
+ <script src="content.js"></script>
+</body>
+</html>
diff --git a/projects,md b/projects,md
new file mode 100644
index 0000000000000000000000000000000000000000..b0388156a4110b82a5252943b6d6b04db27a2da2
--- /dev/null
+++ b/projects,md
@@ -0,0 +1,30 @@
+1. Portfolio Website
+Description: Create a personal portfolio showcasing your skills, projects, resume, and contact information.
+Tech Stack: HTML, CSS, JavaScript (Optional: React, Vue.js, or Angular for interactivity)
+2. Blogging Platform
+Description: Develop a platform where users can create, edit, and publish blog posts with comments and categories.
+Tech Stack: MERN Stack (MongoDB, Express.js, React, Node.js)
+3. E-commerce Website
+Description: Build an online store with product listings, cart functionality, checkout, and payment integration.
+Tech Stack: MEAN Stack (MongoDB, Express.js, Angular, Node.js) or MERN Stack
+4. Task Management App
+Description: Create an application for managing tasks, setting priorities, due dates, and user authentication.
+Tech Stack: Django (Python), React/Vue.js, PostgreSQL
+5. Event Management System
+Description: Develop a platform for organizing events, RSVPs, ticketing, and event details.
+Tech Stack: Ruby on Rails, React, PostgreSQL
+6. Online Learning Platform
+Description: Build a website where users can enroll in courses, watch videos, and track their progress.
+Tech Stack: Laravel (PHP), Vue.js, MySQL
+7. Real Estate Listings Website
+Description: Create a platform for real estate listings with property details, images, search filters, and contact forms.
+Tech Stack: ASP.NET Core, React, SQL Server
+8. Recipe Sharing App
+Description: Develop an application where users can share recipes, rate them, add ingredients, and save favorites.
+Tech Stack: Flask (Python), React, SQLite
+9. Social Media Dashboard
+Description: Build a dashboard that aggregates social media feeds, analytics, and scheduling tools.
+Tech Stack: Node.js, React, MongoDB
+10. Fitness Tracker
+Description: Create a platform where users can log workouts, track progress, set goals, and view statistics.
+Tech Stack: Firebase (NoSQL), React Native (for mobile app), Redux
\ No newline at end of file
diff --git a/scripts.js b/scripts.js
new file mode 100644
index 0000000000000000000000000000000000000000..7f3288384cd8a8b48b97a47660049e8bdcb3a766
--- /dev/null
+++ b/scripts.js
@@ -0,0 +1,66 @@
+// Set different background images for different screen sizes
+function setBodyBackground() {
+ const body = document.querySelector('body');
+ const mobileBg = 'url("assets/background2.jpg") no-repeat center center/cover';
+ const tabletBg = 'url("assets/background1.jpg") no-repeat center center/cover';
+
+ const screenWidth = window.innerWidth;
+
+ if (screenWidth < 768) {
+ body.style.background = mobileBg;
+ location.replace('v/m/index.html');
+
+ } else if (screenWidth >= 768 && screenWidth < 992) {
+ body.style.background = tabletBg;
+
+ } else {
+ body.style.background = 'url("assets/bgmain.gif") no-repeat center center/cover'; // Reset background for desktop
+ body.style.transform = ''; // Reset rotation for desktop
+ }
+}
+
+// Call the function initially and on window resize
+setBodyBackground();
+
+window.addEventListener('resize', setBodyBackground);
+
+// Navbar Toggle
+const burger = document.querySelector('.burger');
+const navLinks = document.querySelector('.nav-links');
+const navLinksList = document.querySelectorAll('.nav-links li');
+
+burger.addEventListener('click', () => {
+ navLinks.classList.toggle('active');
+ burger.classList.toggle('active');
+
+ // Close navLinks when a link is clicked
+ navLinksList.forEach((link) => {
+ link.addEventListener('click', () => {
+ navLinks.classList.remove('active');
+ burger.classList.remove('active');
+ });
+ });
+});
+
+// Chatbot Window
+const chatbotBubble = document.querySelector('.chatbot-bubble');
+const chatbotWindow = document.querySelector('.chatbot-window');
+const chatbotCloseBtn = document.querySelector('.chatbot-close');
+chatbotCloseBtn.style.display = 'none';
+chatbotBubble.addEventListener('click', () => {
+ chatbotWindow.style.display = 'block';
+ chatbotWindow.style.animation = 'sasa 0.5s';
+ chatbotBubble.style.display = 'none';
+ setTimeout(() => {
+ chatbotCloseBtn.style.display = 'block';
+ }, 600);
+});
+
+chatbotCloseBtn.addEventListener('click', () => {
+ chatbotWindow.style.animation = 'asas 0.5s';
+ chatbotBubble.style.display = 'block';
+ chatbotCloseBtn.style.display = 'none';
+ setTimeout(() => {
+ chatbotWindow.style.display = 'none';
+ }, 500);
+});
diff --git a/styles.css b/styles.css
new file mode 100644
index 0000000000000000000000000000000000000000..f1d64f6e3d07d82dd487ac4ba10845df5fa798e2
--- /dev/null
+++ b/styles.css
@@ -0,0 +1,370 @@
+/* Resetting default margin and padding */
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+root::-webkit-scrollbar{
+ display:none;
+}
+
+body {
+ font-family: Arial, sans-serif;
+ margin: 0;
+}
+
+body::-webkit-scrollbar{
+ display: none;
+}
+
+.container {
+ position: relative;
+}
+
+.navbar {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ background-color: rgba(0, 0, 0, 0.8); /* Semi-transparent background */
+ backdrop-filter: blur(10px); /* Adding blur effect */
+ z-index: 1000;
+ padding: 20px;
+}
+
+.nav-links {
+ display: flex;
+ justify-content: center;
+ list-style: none;
+ padding: 0;
+}
+
+.nav-links li {
+ margin: 0 15px;
+}
+
+.nav-links li a {
+ color: #fff;
+ text-decoration: none;
+ padding: 10px 15px;
+ display: block;
+ transition: all 0.6s ease-in-out;
+}
+
+.nav-links li a:hover {
+ color: #ffc107;
+ transform: translateY(4px) scale(1.225) rotateX(360deg);
+ background-color: #007bff;
+ border-radius: 10px 30px 10px 30px;
+}
+
+.burger {
+ display: none;
+ cursor: pointer;
+}
+
+.main-content {
+ padding-top: 80px; /* Adjust according to navbar height */
+}
+
+.intro-section {
+ text-align: center;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ height: 100vh;
+ padding: 20px;
+ margin-top: -100px;
+}
+
+.intro-section #search{
+ padding: 14px;
+ background: rgba(0, 0, 0, 0.3);
+ border-radius: 4px;
+ color: whitesmoke;
+ font-size: 12pt;
+ transition: all 0.3s ease;
+}
+
+#search:focus{
+ background-color: lavender;
+ color: black;
+}
+
+
+#btn-search{
+ border: none;
+ background: none;
+ font-size: 20pt;
+ margin-left: 10px;
+}
+
+.searchie{
+ display: flex;
+ flex-direction: row;
+ margin-top: -70px;
+ margin-bottom: 50px;
+}
+
+#search::placeholder{
+ font-size:13pt;
+}
+
+.intro-section h1{
+ font-size: 32pt;
+
+}
+
+.intro-section h1:first-child{
+ color: red;
+}
+
+.intro-section h1, .intro-section h2, .intro-section h3 {
+ margin: 10px 0;
+}
+
+.intro-section p {
+ margin: 20px 0;
+}
+
+.learn-more-btn {
+ display: inline-block;
+ padding: 10px 20px;
+ background-color: #007bff;
+ color: #fff;
+ text-decoration: none;
+ border-radius: 5px;
+ transition: background-color 0.3s;
+}
+
+.learn-more-btn:hover {
+ background-color: #0056b3;
+}
+
+.services-section {
+ display: none;
+ padding: 20px;
+}
+
+.services-list {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+}
+
+.card {
+ width: 250px;
+ background: #fff;
+ padding: 20px;
+ margin: 10px;
+ border-radius: 5px;
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+ transition: transform 0.3s;
+}
+
+.card:hover {
+ transform: translateY(-5px);
+}
+
+.card h4 {
+ margin: 0 0 10px;
+ color: #333;
+}
+
+.card p {
+ margin: 0;
+ color: #666;
+}
+
+.footer {
+ position: fixed;
+ bottom: 0px;
+ max-width: 4000px;
+ width: 100%;
+ text-align: center;
+ padding: 20px;
+ background-color: #333;
+ color: #fff;
+}
+
+.chatbot-bubble {
+ position: fixed;
+ bottom: 30px;
+ right: 40px;
+ background: transparent;
+ color: #fff;
+ width: 60px;
+ height: 60px;
+ border-radius: 50%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ z-index: 1000;
+ transition: background-color 0.3s;
+}
+
+.pup{
+ position: fixed;
+ bottom: 88px;
+ right: 20px;
+ animation: pupe 1s infinite alternate;
+ text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.8);
+ font-size: 13pt;
+ font-weight: 400;
+}
+
+@keyframes pupe {
+ from{
+ transform: translateY(0px);
+ } to {
+ transform: translateY(-20px);
+ }
+}
+
+.chatbot-bubble img {
+ width: 60px;
+ height: 60px;
+ border-radius: 50%;
+ background-blend-mode:screen;
+}
+
+.chatbot-window iframe::-webkit-scrollbar{
+ display: none;
+}
+
+.chatbot-window {
+ position: fixed;
+ bottom: 30px;
+ right: 40px;
+ width: 30dvw;
+ height: 80dvh;
+ border: none;
+ background-color: #fff;
+ z-index: 999;
+ border-radius: 10px;
+
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+ display: none;
+
+}
+
+.chatbot-window iframe {
+ width: 30dvw;
+ height: 100%;
+ border: none;
+}
+
+@keyframes sasa {
+ from{
+ width: 0px;
+ height: 0px;
+ }
+
+ to {
+ width: 400px;
+ height: 600px;
+ }
+}
+
+@keyframes asas {
+ from{
+ width: 400px;
+ height: 600px;
+
+ }
+
+ to {
+ width: 0px;
+ height: 0px;
+ }
+}
+
+@media (max-width: 768px) {
+ .burger {
+ display: block;
+ position: absolute;
+ top: 20px;
+ right: 20px;
+ color: #fff;
+ font-size: 24px;
+ }
+
+ .nav-links {
+ display: none;
+ flex-direction: column;
+ position: absolute;
+ top: 60px;
+ left: 0;
+ width: 100%;
+ background-color: rgba(0, 0, 0, 0.8);
+ backdrop-filter: blur(10px);
+ padding: 20px;
+ }
+
+ .nav-links.active {
+ display: flex;
+ }
+
+ .nav-links li {
+ margin: 10px 0;
+ }
+
+ .main-content {
+ padding-top: 140px; /* Adjust according to navbar height */
+ }
+
+ .chatbot-bubble {
+ bottom: 80px;
+ right: 20px;
+ }
+
+ .chatbot-window {
+ width: calc(100% - 40px);
+ height: calc(100% - 100px);
+ bottom: 80px;
+ }
+}
+
+.spinny{
+ border-top-color: cyan;
+ width:70px;
+ height:70px;
+ border-radius:50%;
+ border: double 6px black;
+ animation: spinny linear infinite 2s;
+}
+
+@keyframes spinny {
+ from{
+ transform: rotate(0deg);border-top-color: cyan;
+ } to {
+ transform: rotate(360deg);border-top-color: cyan;
+ }
+}
+
+.chatbot-close{
+ display: block;
+ right: 50px;
+ top: 165px;
+ position: fixed;
+ font-size: 14pt;
+ font-weight: 100;
+ color: red;
+ background: none;
+ border:none;
+ font-family: 'Trebuchet MS';
+ transition: 0.4s all ease;
+}
+
+.chatbot-close:hover{
+ scale: 1.195;
+ color: rgb(197, 32, 32);
+ transform: translateX( -10px);
+ background: wheat;
+ border-radius: 10px;
+ padding: 4px;
+}
+
diff --git a/tokyo.gif b/tokyo.gif
new file mode 100644
index 0000000000000000000000000000000000000000..30bc23a9f3d32f9c4b309954b75420c8c35a9a8a
Binary files /dev/null and b/tokyo.gif differ
diff --git a/tokyo.webp b/tokyo.webp
new file mode 100644
index 0000000000000000000000000000000000000000..30bc23a9f3d32f9c4b309954b75420c8c35a9a8a
Binary files /dev/null and b/tokyo.webp differ
diff --git a/v/m/asset/background.gif b/v/m/asset/background.gif
new file mode 100644
index 0000000000000000000000000000000000000000..3109b220b9900eebb83275904b6f5fa9f6875d35
--- /dev/null
+++ b/v/m/asset/background.gif
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:7f64ee66076696ffd23580629896f2d600250d6c73f39f64741b56073eb5afbd
+size 6446788
diff --git a/v/m/asset/comments.png b/v/m/asset/comments.png
new file mode 100644
index 0000000000000000000000000000000000000000..77a344ae8e2a5bae47dd4aaae94033648a4c13d8
Binary files /dev/null and b/v/m/asset/comments.png differ
diff --git a/v/m/content.js b/v/m/content.js
new file mode 100644
index 0000000000000000000000000000000000000000..4b4c835bf5fb514c8a8d2f65d05db9ea188d5f0a
--- /dev/null
+++ b/v/m/content.js
@@ -0,0 +1,54 @@
+const start = () => {
+ const elems = [];
+ const ids = [];
+ const datasets = () => {
+ const data = () => {
+ // pushing
+ ids.push(document.getElementById('home'), document.getElementById('search'));
+ console.log(ids);
+ // end of data
+ }
+ data();
+ // end of datasets
+ }
+
+datasets();
+}
+const val = document.getElementById('search').value;
+
+function searchh(){
+
+ // Used switch statements for generic searching.
+ switch (val) {
+ case "":
+ alert('Invalid input, try again.');
+ break;
+
+ default:
+ alert('No found projects.')
+ break;
+ };
+
+ // String methods for more logical handling of search.
+
+ if (val.includes('chat')){
+ if(val.includes('bot')){
+ alert('chat bot search met')
+ }
+ if (val.includes('system')) {
+ alert('chat system search met')
+ }
+
+ } else if(val.includes('')){
+
+ } else if(val.includes('')){
+
+ } else if(val.includes('')){
+
+ } else {
+ alert('Please try again');
+ }
+
+}
+
+start();
\ No newline at end of file
diff --git a/v/m/index.html b/v/m/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..ddf474a0b11d31c50c3a363dede39666262ff3e6
--- /dev/null
+++ b/v/m/index.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Ok Softwares And Web Development</title>
+
+ <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+ <div class="container" id="container">
+
+ <nav class="navbar">
+ <h2>OK SOFT</h2>
+ <div class="burger">☰</div>
+ <ul class="nav-links">
+ <li><a onclick="home()">Home</a></li>
+ <li><a onclick="about()">About</a></li>
+ <li><a onclick="contact()">Contact</a></li>
+ </ul>
+ </nav>
+
+ <div class="main-content" id="main-content">
+ <section id="home" class="intro-section">
+ <h2 style="margin-top: 20px; background-clip: content-box;" >Welcome to OK Softwares & Web Development</h2>
+ <div class="wrap">
+ <input type="search" name="search" id="search" placeholder="Search projects...">
+ <button type="button" id="btn-search" onclick="searchh()"> Search </button>
+ </div>
+ </section>
+
+ <footer class="footer">
+ <p>© 2024 OK Softwares & Web Development. All Rights Reserved.</p>
+ </footer>
+ </div>
+ </div>
+ <div class="chatbot-bubble">
+ <p class="pup" id="pup">Need assistance?</p>
+ <img src="/assets/shrug.png" alt="Chatbot">
+ </div>
+ <div class="chatbot-window">
+ <button class="chatbot-close">Close</button>
+ <iframe src="/bot/index.html" frameborder="0"></iframe>
+ </div>
+ <script src="scripts.js"></script>
+ <script src="content.js"></script>
+</body>
+</html>
diff --git a/v/m/scripts.js b/v/m/scripts.js
new file mode 100644
index 0000000000000000000000000000000000000000..3d75603b32ccaff5de429f873c2676d38295e000
--- /dev/null
+++ b/v/m/scripts.js
@@ -0,0 +1,65 @@
+// Set different background images for different screen sizes
+function setBodyBackground() {
+ const body = document.querySelector('body');
+ const mobileBg = 'url("/assets/bgmain.gif") no-repeat center center/cover';
+ const tabletBg = 'url("assets/background1.jpg") no-repeat center center/cover';
+
+ const screenWidth = window.innerWidth;
+
+ if (screenWidth < 768) {
+ body.style.background = mobileBg;
+ } else if (screenWidth >= 768 && screenWidth < 992) {
+ body.style.background = tabletBg;
+
+ } else if (screenWidth > 768) {
+ body.style.background = 'url("assets/bgmain.gif") no-repeat center center/cover'; // Reset background for desktop
+ location.assign('/index.html');
+ }
+}
+
+// Call the function initially and on window resize
+setBodyBackground();
+
+window.addEventListener('resize', setBodyBackground);
+
+// Navbar Toggle
+const burger = document.querySelector('.burger');
+const navLinks = document.querySelector('.nav-links');
+const navLinksList = document.querySelectorAll('.nav-links li');
+
+burger.addEventListener('click', () => {
+ navLinks.classList.toggle('active');
+ navLinksList.classList.add('anime');
+ burger.classList.toggle('active');
+
+ // Close navLinks when a link is clicked
+ navLinksList.forEach((link) => {
+ link.addEventListener('click', () => {
+ navLinks.classList.remove('active');
+ burger.classList.remove('active');
+ });
+ });
+});
+
+// Chatbot Window
+const chatbotBubble = document.querySelector('.chatbot-bubble');
+const chatbotWindow = document.querySelector('.chatbot-window');
+const chatbotCloseBtn = document.querySelector('.chatbot-close');
+
+chatbotBubble.addEventListener('click', () => {
+ chatbotWindow.style.display = 'block';
+ chatbotWindow.style.animation = 'sasa 0.5s';
+ chatbotBubble.style.display = 'none';
+});
+
+chatbotCloseBtn.addEventListener('click', () => {
+
+ chatbotWindow.style.animation = 'asas 0.5s';
+ chatbotBubble.style.display = 'block';
+
+ setTimeout(() => {
+ chatbotWindow.style.display = 'none';
+ }, 500);
+
+});
+
diff --git a/v/m/styles.css b/v/m/styles.css
new file mode 100644
index 0000000000000000000000000000000000000000..2f316436c8893251093bba6cb3e38cfb15c98129
--- /dev/null
+++ b/v/m/styles.css
@@ -0,0 +1,398 @@
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+body::-webkit-scrollbar{
+ display: none;
+}
+
+body {
+ font-family: Arial, sans-serif;
+ margin: 0;
+ backdrop-filter: blur(8px);
+ height: 100vh;
+}
+
+.container {
+ position: relative;
+}
+
+.navbar {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ z-index: 1000;
+ padding: 20px;
+ background: url('/assets/bgmain.gif');
+}
+
+.nav-links{
+ margin: 2px auto;
+ text-align: center;
+ background: none;
+}
+
+.nav-links li {
+ margin: 2px auto;
+ text-align: center;
+ background: none;
+}
+
+.nav-links li a {
+ background: none;
+ color: #fff;
+ text-decoration: none;
+ padding: 10px 15px;
+ margin: 2px auto;
+ text-align: center;
+ transition: all 0.6s ease-in-out;
+}
+
+.nav-links li a:hover {
+ color: #ffc107;
+ transform: translateY(4px) scale(1.225) rotateX(360deg);
+ background-color: #007bff;
+ border-radius: 10px 30px 10px 30px;
+}
+
+.burger {
+ display: none;
+ cursor: pointer;
+}
+
+.main-content {
+ padding-top: 80px; /* Adjust according to navbar height */
+ display: flex;
+ flex-direction: column;
+ margin:1px auto;
+ text-align: center;
+}
+
+.intro-section {
+ margin: 40px auto;
+ text-align: center;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ height: 50vh;
+}
+
+.intro-section h1, .intro-section h2, .intro-section h3 {
+ margin: 10px 0;
+}
+
+.intro-section p {
+ margin: 20px 0;
+}
+
+.learn-more-btn {
+ display: inline-block;
+ padding: 10px 20px;
+ background-color: #007bff;
+ color: #fff;
+ text-decoration: none;
+ border-radius: 5px;
+ transition: background-color 0.3s;
+}
+
+.learn-more-btn:hover {
+ background-color: #0056b3;
+}
+
+.services-section {
+ display: none;
+ padding: 20px;
+}
+
+.services-list {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+}
+
+.card {
+ width: 250px;
+ background: #fff;
+ padding: 20px;
+ margin: 10px;
+ border-radius: 5px;
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
+ transition: transform 0.3s;
+}
+
+.card:hover {
+ transform: translateY(-5px);
+}
+
+.card h4 {
+ margin: 0 0 10px;
+ color: #333;
+}
+
+.card p {
+ margin: 0;
+ color: #666;
+}
+
+.footer {
+ position: fixed;
+ bottom: -2px;
+ max-width: 4000px;
+ width: 100%;
+ text-align: center;
+ padding: 20px;
+ background-color: #333;
+ color: #fff;
+}
+
+.chatbot-bubble {
+ position: fixed;
+ bottom: 30px;
+ right: 40px;
+ background: transparent;
+ color: #fff;
+ width: 60px;
+ height: 60px;
+ border-radius: 50%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ cursor: pointer;
+ z-index: 1000;
+ transition: background-color 0.3s;
+}
+
+.pup{
+ position: fixed;
+ bottom: 140px;
+ right: 20px;
+ animation: pupe 1s infinite alternate;
+ text-shadow: 0px 0px 12px rgba(0, 0, 0, 0.8);
+ font-size: 13pt;
+ font-weight: 400;
+}
+
+@keyframes pupe {
+ from{
+ transform: translateY(0px);
+ } to {
+ transform: translateY(-10px);
+ }
+}
+
+.chatbot-bubble img {
+ width: 60px;
+ height: 60px;
+ border-radius: 50%;
+ background-blend-mode:screen;
+ animation: 1s alternate-reverse infinite cbi;
+}
+
+@keyframes cbi {
+ from{
+ transform: translateY(0)rotate(-5deg);
+ } to {
+ transform: translateY(-10px)rotate(5deg);
+
+; }
+}
+
+.chatbot-window {
+ position: fixed;
+ bottom: 30px;
+ right: 30px;
+ width: max-content;
+ height: 70dvh;
+ border: none;
+ background-color: #fff;
+ z-index: 999;
+ border-radius: 10px;
+ overflow: hidden;
+ box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
+ display: none;
+}
+
+.chatbot-window::-webkit-scrollbar{
+ display: none;
+}
+
+.chatbot-window iframe {
+ width: 100%;
+ height: 100%;
+ border: none;
+ padding: 1px;
+}
+.chatbot-window iframe::-webkit-scrollbar{
+ display:hidden;
+}
+
+
+iframe::-webkit-scrollbar{
+ display: none
+}
+
+@keyframes sasa {
+ from{
+ width: 0px;
+ height: 0px;
+ }
+
+ to {
+ width: 400px;
+ height: 600px;
+ }
+}
+
+@keyframes asas {
+ from{
+ width: 400px;
+ height: 600px;
+
+ }
+
+ to {
+ width: 0px;
+ height: 0px;
+ }
+}
+
+@media (max-width: 768px) {
+ .footer {
+ position: fixed;
+ bottom: -2px;
+ max-width: 4000px;
+ width: 100%;
+ text-align: center;
+ padding: 20px;
+ background-color: #333;
+ color: #fff;
+ }
+
+ .burger {
+ display: block;
+ position: absolute;
+ top: 20px;
+ right: 20px;
+ color: #fff;
+ font-size: 24px;
+ }
+
+ .nav-links {
+ display: none;
+ flex-direction: row;
+ position: absolute;
+ top: 52px;
+ left: 0;
+ width: 100%;
+ backdrop-filter: blur(100px);
+ padding: 16px;
+ list-style: none;
+ border-radius: 40px;
+ }
+
+
+ .nav-links.active {
+ display: flex;
+
+ }
+
+ .nav-links li {
+ margin: 10px auto;
+ padding: 10px;
+ border: solid 2px silver;
+ background: dimgray;
+ }
+
+ .main-content {
+ padding-top: 120px;
+
+ }
+
+ .chatbot-bubble {
+ bottom: 80px;
+ right: 20px;
+ }
+
+ .chatbot-window {
+ width: calc(100% - 40px);
+ height: calc(100% - 100px);
+ bottom: 20px;
+ right: 20px;
+ }
+}
+
+.spinny{
+ border-top-color: cyan;
+ width:70px;
+ height:70px;
+ border-radius:50%;
+ border: double 6px black;
+ animation: spinny linear infinite 2s;
+}
+
+@keyframes spinny {
+ from{
+ transform: rotate(0deg);border-top-color: cyan;
+ } to {
+ transform: rotate(360deg);border-top-color: cyan;
+ }
+}
+
+#search{
+ background: black;
+ font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
+ padding: 12px;
+ width: 75%;
+ border: double 4px silver;
+ transition: 0.6s ease all;
+ border-radius: 10px;
+ background: linen;
+}
+
+#search::placeholder{
+ font-size: 12pt;
+ padding:12px;
+ margin:10 px auto;
+}
+
+#search:hover{
+ border-radius: 28px;
+ color:lime;
+ background: black;
+ backdrop-filter: blur(20px);
+}
+
+.wrap{
+ display: flex;
+}
+#btn-search{
+ background: none;
+ border: none;
+ font-size: 14pt;
+ margin-left: 10px;
+}
+#btn-search:hover{
+ color:lime;
+ text-shadow: 0 0 4px black;
+ backdrop-filter: blur(20px);
+ font-weight: 100;
+}
+
+.chatbot-close{
+ display:block;
+ position: relative;
+ border:none;
+ font-size:12pt;
+ text-align:right;
+ left: 400px;
+ top: 10px;
+ color: red;
+}
+
+.chatbot-close:hover{
+ font-weight: 100;
+ scale: 1.12;
+}
\ No newline at end of file
diff --git a/v/t/index.html b/v/t/index.html
new file mode 100644
index 0000000000000000000000000000000000000000..728a2998e413e383a0d9d759767e496f99376469
--- /dev/null
+++ b/v/t/index.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Ok Softwares And Web Development</title>
+ <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+ <div class="container" id="container">
+
+ <nav class="navbar">
+ <div class="burger">☰</div>
+ <ul class="nav-links">
+ <li><a href="#home">Home</a></li>
+ <li><a onclick="hosting()">Hosting Services</a></li>
+ <li><a onclick="chatbots()">Chatbots</a></li>
+ <li><a onclick="systems()">Systems</a></li>
+ <li><a onclick="softwares()">Softwares</a></li>
+ <li><a onclick="contact()">Contact</a></li>
+ </ul>
+ </nav>
+ <div class="main-content" id="main-content">
+ <section id="home" class="intro-section">
+ <h2 style="margin-top: -500px;" >Welcome to OK Softwares & Web Development</h2>
+ </section>
+
+ <section id="services" class="services-section">
+ </section>
+
+ <footer class="footer">
+ <p>© 2024 OK Softwares & Web Development. All Rights Reserved.</p>
+ </footer>
+ </div>
+ </div>
+ <div class="chatbot-bubble">
+ <img src="comments.png" alt="Chatbot">
+ </div>
+ <div class="chatbot-window">
+ <button class="chatbot-close">Close</button>
+ <iframe src="bot/index.html" frameborder="0"></iframe>
+ </div>
+
+ <script src="scripts.js"></script>
+ <script src="content.js"></script>
+</body>
+</html>