Upload files to "Pricer Extension"

2026-08-03 20:21:13 +00:00
commit 01b1fd581e
4 changed files with 181 additions and 0 deletions
@@ -0,0 +1,128 @@
+// 1. Create the 'catcher' element (invisible to the user)
+const catcher = document.createElement('input');
+catcher.style.cssText = 'position:fixed; opacity:0; pointer-events:none; top:0;';
+document.body.appendChild(catcher);
+
+const ext = typeof browser !== "undefined" ? browser : chrome;
+
+ext.runtime.onMessage.addListener((request, sender, sendResponse) => {
+    if (request.action === "ARM_SCANNER") {
+        catcher.focus();
+        sendResponse({status: "ready"});
+    }
+});
+
+// 3. Handle the Scanner Input
+catcher.addEventListener('keydown', async (e) => {
+    if (e.key === 'Enter') {
+        e.preventDefault();
+            // Decode the Base64 string back into a JSON string
+            const decodedData = atob(catcher.value);
+            const data = JSON.parse(decodedData);
+            
+            await processHardwareData(data);
+            catcher.value = '';
+        
+    }
+});
+
+async function fillMatSelect(selectId, targetText) {
+    const selectEl = document.getElementById(selectId);
+    if (!selectEl) return;
+
+    selectEl.focus();
+    // 1. Open dropdown using mousedown (more reliable than click)
+    selectEl.dispatchEvent(new MouseEvent('mousedown', { bubbles: true }));
+
+    // 2. Wait for overlay panel to appear
+    let panel;
+    for (let i = 0; i < 10; i++) {
+        panel = document.querySelector('.cdk-overlay-pane');
+        if (panel) break;
+        await new Promise(r => setTimeout(r, 50));
+    }
+    if (!panel) return;
+
+    // 3. Find options inside overlay
+    const options = panel.querySelectorAll('mat-option, .mdc-list-item');
+
+    for (let option of options) {
+        const text = option.textContent.trim();
+        if (text.includes(targetText)) {
+            option.click();
+            return;
+        }
+    }
+}
+
+function triggerEnter(input) {
+    const enterDown = new KeyboardEvent('keydown', {
+        bubbles: true,
+        cancelable: true,
+        key: 'Enter',
+        code: 'Enter',
+        keyCode: 13
+    });
+
+    const enterUp = new KeyboardEvent('keyup', {
+        bubbles: true,
+        cancelable: true,
+        key: 'Enter',
+        code: 'Enter',
+        keyCode: 13
+    });
+
+    input.dispatchEvent(enterDown);
+    input.dispatchEvent(enterUp);
+}
+
+// 4. Fill the actual Angular/jQuery form
+async function processHardwareData(data) {
+
+	const group = 'input-product-group';
+	const sub = 'input-sub-group';
+	const cat = 'input-product-category';
+
+	const groupEl = document.getElementById(group);
+	groupEl.focus();
+	groupEl.value = "ELECTRONICS";
+	groupEl.dispatchEvent(new Event('input', { bubbles: true }));
+	triggerEnter(groupEl);
+
+	const subEl = document.getElementById(sub);
+	subEl.focus();
+	subEl.value = "COMPUTERS";
+	subEl.dispatchEvent(new Event('input', { bubbles: true }));
+	triggerEnter(subEl);
+
+	const catEl = document.getElementById(cat);
+	catEl.focus();
+	catEl.value = "MISC (COMPUTERS)";
+	catEl.dispatchEvent(new Event('input', { bubbles: true }));
+	triggerEnter(catEl);
+
+    const map = {
+        'b': 'input-brand',
+        'd': 'input-prodDescrip',
+        'n': 'text-condition-notes',
+        's': 'input-style',
+        'e': 'serial-tags'
+    };
+
+    for (const [key, id] of Object.entries(map)) {
+        const input = document.getElementById(id);
+        if (input && data[key]) {
+            input.value = data[key];
+            
+            // Trigger events so the webpage 'wakes up' to the new data
+            input.dispatchEvent(new Event('input', { bubbles: true }));
+            input.dispatchEvent(new Event('change', { bubbles: true }));
+        }
+    }
+
+    // Handle the special Angular Material dropdown
+    if (data['c']) {
+        await fillMatSelect('mat-select-10', data['c']);
+    }
+
+}