From 82c1aeb9ec1a219c1ec289b1215c36d6527df198 Mon Sep 17 00:00:00 2001
From: Isaac Godin <isaacggodin@gmail.com>
Date: Fri, 9 Jan 2026 13:21:39 -0500
Subject: [PATCH] Added a password gen feature and updated the ui a bit

---
 src/assets/ITThermal.js | 30 ++++++++++++++++++++++++++++++
 src/index.html          | 37 ++++++++++++++++++++++++-------------
 2 files changed, 54 insertions(+), 13 deletions(-)

diff --git a/src/assets/ITThermal.js b/src/assets/ITThermal.js
index eb3c2f8..fb6a923 100644
--- a/src/assets/ITThermal.js
+++ b/src/assets/ITThermal.js
@@ -299,6 +299,28 @@ function printPdf() {
     }, 100);
 }
 
+async function generatePassword(length = 12) {
+    const characters = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+-=[]{}|;:,.<>?";
+    let password = "";
+
+    for (let i = 0; i < length; i++) {
+        const randomIndex = Math.floor(Math.random() * characters.length);
+        password += characters[randomIndex];
+    }
+
+    const textareaElement = document.getElementById("tempPwPassword");
+    textareaElement.value = password;
+
+    try {
+        await navigator.clipboard.writeText(password);
+        console.log('text copied');
+    } catch (err) {
+        console.error('Failed: ', err);
+    }
+}
+
+
+
 // #############################################################
 // Event Listeners
 // #############################################################
@@ -317,6 +339,14 @@ document.getElementById('customNoteBtn').addEventListener('click', () => {
         alert(`An error occurred while generating the PDF: ${error.message}`);
     }
 });
+document.getElementById('genPassword').addEventListener('click', () => {
+    try {
+        generatePassword();
+    } catch (error) {
+        alert(`An error occurred while generating the PDF: ${error.message}`);
+    }
+});
+
 document.getElementById('deviceTrackerBtn').addEventListener('click', () => {
     try {
         deviceTrackerHandler();
diff --git a/src/index.html b/src/index.html
index 5fca5ad..d31a3c5 100644
--- a/src/index.html
+++ b/src/index.html
@@ -35,11 +35,11 @@
 							<!-- Username -->
 							<label for="tempPwUsername" class="dark:text-gray-300 block text-md font-medium text-gray-700">Username: (optional)</label>
 							<input type="text" id="tempPwUsername" name="tempPwUsername"
-								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1  block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
 							<!-- Password -->
 							<label for="tempPwPassword" class="dark:text-gray-300 block text-md font-medium text-gray-700">Password:</label>
 							<input type="text" id="tempPwPassword" name="tempPwPassword"
-								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1  block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
 						</div>
 						<!-- Submit Button -->
 						<div class="text-center">
@@ -50,6 +50,14 @@
 								Generate Receipt
 							</button>
 						</div>
+						<div class="text-center">
+							<button type="submit"
+								id="genPassword"
+								style="background-color: #4b7839;"
+								class="dark:bg-indigo-600 dark:hover:bg-indigo-700 w-full text-white py-2 px-4 rounded-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-opacity-50 mt-4">
+							Generate And Copy Password
+							</button>
+						</div>
 					</div>
 
 					<!-- Custom Note  -->
@@ -62,7 +70,7 @@
 							<!-- max size added and removed resizing -->
 							<label for="customNoteTextArea" class="dark:text-gray-300 block text-md font-medium text-gray-700">Notes:</label>
 							<textarea id="customNoteTextArea" name="customNoteTextArea" cols="35" rows="10" maxlength="1000" style="resize: none;"
-							class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"></textarea>
+							class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1  block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"></textarea>
 						</div>
 						<!-- Submit Button -->
 						<div class="text-center">
@@ -87,11 +95,11 @@
 							<!-- Ticket field -->
 							<label for="dtticket" class="dark:text-gray-300 block text-md font-medium text-gray-700">Ticket:</label>
 							<input type="text" id="dtticket" name="dtticket"
-								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1  block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
 							<!-- User field -->
 							<label for="dtuser" class="dark:text-gray-300 block text-md font-medium text-gray-700">User:</label>
 							<input type="text" id="dtuser" name="dtuser"
-								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
+								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1  block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
 							<!-- Radio buttons to pick from "Stock", "Deploy", "Image", "E-Waste", "Repair/Parts" and "Other" -->
 							<label for="dtservice" class="dark:text-gray-300 block text-md font-medium text-gray-700 mb-2">Service:</label>
 							<div class="flex flex-row space-x-20 pl-2">
@@ -99,41 +107,41 @@
 									<label class="inline-flex items-center">
 										<input type="radio" name="dtservice" value="Stock"
 											class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
-										<span class="ml-2 dark:text-gray-300">Stock</span>
+										<span class=" dark:text-gray-300">Stock</span>
 									</label>
 									<label class="inline-flex items-center">
 										<input type="radio" name="dtservice" value="Deploy"
 											class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
-										<span class="ml-2 dark:text-gray-300">Deploy</span>
+										<span class=" dark:text-gray-300">Deploy</span>
 									</label>
 									<label class="inline-flex items-center">
 										<input type="radio" name="dtservice" value="Image"
 											class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
-										<span class="ml-2 dark:text-gray-300">Image</span>
+										<span class=" dark:text-gray-300">Image</span>
 									</label>
 								</div>
 								<div class="flex flex-col space-y-2">
 									<label class="inline-flex items-center">
 										<input type="radio" name="dtservice" value="E-Waste"
 											class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
-										<span class="ml-2 dark:text-gray-300">E-Waste</span>
+										<span class=" dark:text-gray-300">E-Waste</span>
 									</label>
 									<label class="inline-flex items-center">
 										<input type="radio" name="dtservice" value="Repair/Parts"
 											class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
-										<span class="ml-2 dark:text-gray-300">Repair/Parts</span>
+										<span class=" dark:text-gray-300">Repair/Parts</span>
 									</label>
 									<label class="inline-flex items-center">
 										<input type="radio" name="dtservice" value="Other"
 											class="dark:bg-gray-700 dark:border-gray-700 dark:text-white text-indigo-600 focus:ring-indigo-500">
-										<span class="ml-2 dark:text-gray-300">Other</span>
+										<span class=" dark:text-gray-300">Other</span>
 									</label>
 								</div>
 							</div>
 							<!-- Notes field -->
 							<label for="dtnotes" class="dark:text-gray-300 block text-md font-medium text-gray-700">Notes: (optional)</label>
 							<textarea id="dtnotes" name="dtnotes" cols="35" rows="6" maxlength="500" style="resize: none;"
-								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1 ml-2 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"></textarea>
+								class="dark:border-gray-700 dark:bg-gray-700 dark:text-white mt-1  block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"></textarea>
 						</div>
 						<!-- Submit Button -->
 						<div class="text-center">
@@ -167,4 +175,7 @@
 			<script src="./assets/ITThermal.js"></script>
 			<script src="https://cdn.tailwindcss.com"></script>
 		</body>
-	</html>
\ No newline at end of file
+	</html>
+
+
+	
\ No newline at end of file