oracle-quickstart
diff --git a/‎Dockerfile
Lines changed: 2 additions & 35 deletions b/‎Dockerfile
Lines changed: 2 additions & 35 deletions
diff --git a/‎crud_options.html
Lines changed: 40 additions & 8 deletions b/‎crud_options.html
Lines changed: 40 additions & 8 deletions
diff --git a/‎crud_options.html.bak
Lines changed: 0 additions & 55 deletions b/‎crud_options.html.bak
Lines changed: 0 additions & 55 deletions
@@ -1,46 +1,13 @@
 FROM ghcr.io/oracle/oraclelinux:8
 
-RUN yum install -y oracle-release-el8 \
-    && yum-config-manager --enable ol8_oracle_instantclient \
-    && yum install -y oracle-instantclient19.10-basic
-
-
 RUN dnf -y module disable python36 && \
     dnf -y module enable python39 && \
     dnf -y install python39 python39-pip python39-setuptools python39-wheel && \
     rm -rf /var/cache/dnf
 
-RUN yum install -y postgresql-devel
-
-RUN yum install -y gcc \
-    && yum install -y libaio-devel
-
-ADD requirements.txt .
-COPY requirements.txt ./requirements.txt
+WORKDIR /myapp
+COPY requirements.txt main.py key.pem cert.pem add_employee.html get_employees.html update_employee.html confirm_delete_employee.html crud_options.html search_employee.html employee_not_found.html /myapp
 RUN pip3 install -r requirements.txt
 
 
-# Set the environment variable for LD_LIBRARY_PATH
-ENV LD_LIBRARY_PATH /usr/lib/oracle/19.10/client64/lib/
-
-ADD main.py .
-
-ADD key.pem .
-
-ADD cert.pem .
-
-ADD add_employee.html .
-
-ADD get_employees.html .
-
-ADD update_employee.html .
-
-ADD confirm_delete_employee.html .
-
-ADD crud_options.html .
-
-ADD search_employee.html .
-
-ADD employee_not_found.html .
-
 CMD ["python3", "./main.py"]
@@ -4,6 +4,30 @@
     <title>EMS Main Page</title>
     <!-- Use Bootstrap for styling -->
     <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
+    <style>
+        .search-container {
+            position: fixed;
+            top: 20px;
+            right: 10px;
+            display: flex;
+            align-items: center;
+        }
+
+        .search-container .search-icon {
+            cursor: pointer;
+        }
+
+        .search-container .search-input {
+            display: none;
+            margin-right: 20px;
+            transition: width 0.5s ease-in-out;
+        }
+
+        .search-container .search-input.visible {
+            display: block;
+            width: 300px;
+        }
+    </style>
     <script>
         function updateEmployee() {
             var id = prompt("Enter ID:");
@@ -19,15 +43,28 @@
             }
         }
 
+        function toggleSearchBar() {
+            var searchBar = document.querySelector('.search-input');
+            searchBar.classList.toggle('visible');
+            searchBar.focus();
+        }
+
         function searchEmployee() {
-            var id = prompt("Enter ID:");
-            if (id != null) {
-                window.location.href = "/api/search_employee/" + id;
+            var search_query = document.querySelector('.search-input').value;
+            if (search_query) {
+                window.location.href = "/api/search_employee?search_query=" + encodeURIComponent(search_query);
             }
         }
     </script>
 </head>
 <body>
+    <div class="search-container">
+        <span class="search-icon" onclick="toggleSearchBar()">
+            <img src="https://img.icons8.com/small/16/000000/search.png" alt="Search">
+        </span>
+        <input type="text" class="search-input" onkeydown="if (event.key === 'Enter') searchEmployee()" placeholder="Search (ID, Name, Email, or Department)">
+    </div>
+
     <!-- Create a banner -->
     <div class="jumbotron">
         <h1 class="display-4">Employee Management System</h1>
@@ -50,11 +87,6 @@ <h1 class="display-4">Employee Management System</h1>
                 <button class="btn btn-primary btn-block" onclick="deleteEmployee()">Delete</button>
             </div>
         </div>
-        <div class="row mt-3">
-            <div class="col-md-3">
-                <button class="btn btn-primary btn-block" onclick="searchEmployee()">Search</button>
-            </div>
-        </div>
     </div>
 </body>
 </html>