refactor overrides.js

minor style tweaks
added overrides.js
manifest updated

manifest.json

@@ -1,8 +1,10 @@
 {
 	"manifest_version": 3,
 
-	"name": "ServiceHub Plus",
+	"name": "ServiceHub+",
-	"version": "0.1.2",
+	"author": "Charles Danesi",
+	"homepage_url": "https://charlesdanesi.net",
+	"version": "0.1.4",
 	"description": "Improvements to Service Hub for TRG techs",
 
 	"content_scripts": [
@@ -11,5 +13,21 @@
 			"js": ["script.js"],
 			"matches": ["https://portal.trgrepair.com/*"]
 		}
-	]
+	],
+
+	"web_accessible_resources": [
+		{
+			"resources": [
+				"fonts/MaterialIcons-Regular.ttf",
+				"fonts/MaterialIconsOutlined-Regular.otf",
+				"img/autorenew.png",
+				"overrides.js"
+			],
+			"matches": ["<all_urls>"],
+			"extensions": ["lmeeejhdmpakenhgdfmgjcbdmeppjpam"],
+			"run_at": "document_end"
+		}
+	],
+
+	"permissions": ["storage", "activeTab", "scripting", "nativeMessaging"]
 }

overrides.js

@@ -0,0 +1,23 @@
+// Fix that annoying BS where the ID takes focus CONSTANTLY
+
+console.log("Injection succeeded!");
+
+function checkLoc() {
+	var sLoc = document.getElementById("txtTRG_Loc").value;
+	var sUsr = document.getElementById("txtTRG_User").value;
+	if (sLoc.length == 0) {
+		alert("You need to enter a location.");
+    sLoc.focus();
+	} else {
+		if (sUsr.length == 0) {
+			//alert("We suck at writing proper code.");
+			console.log("Override successful");
+			document.getElementById("txtTRG_User").value = "20539";
+			// document.querySelectorAll["txtTRG_User"].focus();
+		}
+	}
+	resetTimeout();
+}
+
+var bfTest = document.getElementById("txtTRG_Bin");
+bfTest.onfocus();

script.js

@@ -0,0 +1,66 @@
+"use strict";
+
+/*
+	TODO style individual buttons
+	TODO options page (set UID)
+	TODO move parts list buttons top or bottom (form name='frmPartsSelection'), btnSave, btnCancel
+	NOTE color themes?
+	BUG close button on photo pages is styled along with the btnCancel
+	NOTE display tiny images next to parts list?
+	TODO shrink navbar/header/location on scroll
+	TODO fancy button animations
+	TODO choose file on upload window
+	TODO insert a reset button into search form
+	TODO style menubar and keep it sticky on the window
+	TODO style/move the location scan to float with the RO
+	TODO color bg to bin color
+*/
+
+// temporarily override stupid alerts that happen randomly all day long
+//document.getElementById("txtTRG_User").value = "20539";
+
+// Warranty Highlight
+const isWarranty = document.getElementById("chkWarrantee");
+if (isWarranty != null) {
+	isWarranty.addEventListener("change", updateBackground);
+	updateBackground();
+	function updateBackground() {
+		isWarranty.nextElementSibling.style.backgroundColor = isWarranty.checked
+			? "red"
+			: "transparent";
+		isWarranty.nextElementSibling.style.color = isWarranty.checked
+			? "white"
+			: "black";
+	}
+}
+
+// TODO highlight change case label if SN updated
+const newSN = document.getElementById("txtNewBoardSN"); // this is the new SN field
+const snWasUpdated = document.getElementById("chkCaseSNUpdate"); // this is the checkbox
+
+// if (newSN.length != null) {
+// 	newSN.addEventListener("change", updateSNBackground, false);
+// 	updateSNBackground();
+// }
+// function updateSNBackground() {
+// 	alert("test");
+// }
+
+// TODO add current location to a floating modal (or something)
+
+// Notification system
+// TODO implement facebook-style notifications
+// https://portal.trgrepair.com/task_manager.asp?rnd=0.9996227368620352
+
+// const notifCountStr = document.getElementById("lblTask").innerText;
+// const notifCount = parseInt(notifCountStr.split(" ")[2]); // Total task count
+// const notifCountNew = parseInt(notifCountStr.split(" ")[5].slice(1)); // New task count
+
+// Code injection
+var s = document.createElement("script");
+s.src = chrome.runtime.getURL("overrides.js");
+(document.head || document.documentElement).appendChild(s);
+
+s.onload = function () {
+	this.remove();
+};

style.css

@@ -1,19 +1,19 @@
-/* 
-
-	TODO float buttons on bottom of RO
-	TODO float location entry on RO (sidebar?)
-	TODO style individual buttons
-	TODO options page
-		- move parts list buttons top or bottom
-		- color themes?
-	BUG close button on photo pages is styled along with the btnCancel
-	HACK display tiny images next to parts list?
-	TODO shrink navbar/header/location on scroll
-	TODO fancy button animations
-*/
-
 @import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
 
+@font-face {
+	font-family: "Material Icons Outlined";
+	font-style: normal;
+	font-weight: 400;
+	src: url("chrome-extension://__MSG_@@extension_id__/fonts/MaterialIconsOutlined-Regular.otf");
+}
+
+@font-face {
+	font-family: "Material Icons";
+	font-style: normal;
+	font-weight: 700;
+	src: url("chrome-extension://__MSG_@@extension_id__/fonts/MaterialIcons-Regular.ttf");
+}
+
 :root {
 	--white: #f4f4f9;
 	--darkgray: #696969;
@@ -58,7 +58,7 @@ input[name="btnCancel"] + input[name="btnSave"] {
 }
 
 input[name="btnCancel"] {
-	background-color: lightcoral;
+	background-color: var(--lightblue);
 	color: var(--white);
 	position: fixed;
 	bottom: 20px;
@@ -73,7 +73,6 @@ input[id="btnSubmitForApproval"]:hover {
 input[value="Mark Complete"]:hover {
 	background-color: var(--green);
 	color: var(--darkgray);
-	/*font-weight: bolder;*/
 }
 
 input[name="btnParts"] {
@@ -83,13 +82,13 @@ input[name="btnParts"] {
 
 input[name="btnIssue4Eval"] {
 	background-color: var(--darkgreen);
-	color: var(--lightgray);
+	color: var(--green);
 }
 
 input[name="btnContract"] {
-	padding: .3em 0;
+	padding: 0.3em 0;
-	background-color: var(--green);
+	background-color: var(--darkgray);
-	color: var(--darkgray);
+	color: var(--white);
 }
 
 input[name="btnExpandRepairHistory"] {
@@ -114,12 +113,31 @@ input[value="Remove Repair"] {
 	padding: 4px 0;
 }
 
+label {
+	transition: background-color 250ms ease-in, color 250ms ease-in;
+}
+
+label[for="chkWarrantee"] {
+	padding: 0.35em;
+}
+
 /* Images */
 
 img[id="Img1"],
 img[id="Img2"] {
 	position: absolute;
-	content: url("https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/Plus_symbol.svg/500px-Plus_symbol.svg.png");
+	content: url("chrome-extension://__MSG_@@extension_id__/img/autorenew.png");
-	width: 20px;
+	width: 18px;
-	height: 20px;
+	height: 18px;
+	/* BUG: The below lines aren't working.. */
+	outline: none;
+	border: none;
+}
+
+img[id="Img3"] {
+	content: url("chrome-extension://__MSG_@@extension_id__/img/autorenew.png");
+	width: 16px;
+	height: 16px;
+	outline: none;
+	border: none;
 }