loftest/barcode-beast

1// Inventory management system2let inventory = JSON.parse(localStorage.getItem('inventory')) || [];3 4// DOM elements5const scannerContainer = document.getElementById('scanner-container');6const startScanBtn = document.getElementById('start-scan');7const stopScanBtn = document.getElementById('stop-scan');8const barcodeResult = document.getElementById('barcode-result');9const barcodeInput = document.getElementById('barcode-input');10const nameInput = document.getElementById('name-input');11const quantityInput = document.getElementById('quantity-input');12const priceInput = document.getElementById('price-input');13const itemForm = document.getElementById('item-form');14const inventoryList = document.getElementById('inventory-list');15 16// Initialize Quagga barcode scanner17function initScanner() {18    Quagga.init({19        inputStream: {20            name: "Live",21            type: "LiveStream",22            target: document.querySelector('#interactive'),23            constraints: {24                width: 480,25                height: 320,26                facingMode: "environment"27            },28        },29        decoder: {30            readers: ["ean_reader", "ean_8_reader", "code_128_reader", "code_39_reader", "code_39_vin_reader", "codabar_reader", "upc_reader", "upc_e_reader"]31        },32    }, function(err) {33        if (err) {34            console.error(err);35            return;36        }37        console.log("Initialization finished. Ready to start");38        Quagga.start();39    });40 41    Quagga.onDetected(function(result) {42        const code = result.codeResult.code;43        barcodeResult.textContent = code;44        barcodeInput.value = code;45        stopScanner();46        47        // Check if item exists48        const existingItem = inventory.find(item => item.barcode === code);49        if (existingItem) {50            nameInput.value = existingItem.name;51            quantityInput.value = existingItem.quantity;52            priceInput.value = existingItem.price;53        } else {54            nameInput.value = '';55            quantityInput.value = 1;56            priceInput.value = '';57            nameInput.focus();58        }59    });60}61 62// Start scanner63function startScanner() {64    scannerContainer.classList.remove('hidden');65    initScanner();66    startScanBtn.disabled = true;67    stopScanBtn.disabled = false;68}69 70// Stop scanner71function stopScanner() {72    Quagga.stop();73    startScanBtn.disabled = false;74    stopScanBtn.disabled = true;75}76 77// Save item to inventory78function saveItem(barcode, name, quantity, price) {79    const existingIndex = inventory.findIndex(item => item.barcode === barcode);80    81    if (existingIndex >= 0) {82        // Update existing item83        inventory[existingIndex] = { barcode, name, quantity, price };84    } else {85        // Add new item86        inventory.push({ barcode, name, quantity, price });87    }88    89    localStorage.setItem('inventory', JSON.stringify(inventory));90    renderInventory();91}92 93// Delete item from inventory94function deleteItem(barcode) {95    inventory = inventory.filter(item => item.barcode !== barcode);96    localStorage.setItem('inventory', JSON.stringify(inventory));97    renderInventory();98}99 100// Render inventory list101function renderInventory() {102    inventoryList.innerHTML = '';103    104    inventory.forEach(item => {105        const row = document.createElement('tr');106        row.innerHTML = `107            <td class="px-6 py-4 whitespace-nowrap">${item.barcode}</td>108            <td class="px-6 py-4 whitespace-nowrap">${item.name}</td>109            <td class="px-6 py-4 whitespace-nowrap">${item.quantity}</td>110            <td class="px-6 py-4 whitespace-nowrap">$${item.price}</td>111            <td class="px-6 py-4 whitespace-nowrap">112                <button onclick="editItem('${item.barcode}')" class="text-blue-600 hover:text-blue-900 mr-3">Edit</button>113                <button onclick="deleteItem('${item.barcode}')" class="text-red-600 hover:text-red-900">Delete</button>114            </td>115        `;116        inventoryList.appendChild(row);117    });118}119 120// Edit item121function editItem(barcode) {122    const item = inventory.find(item => item.barcode === barcode);123    if (item) {124        barcodeInput.value = item.barcode;125        nameInput.value = item.name;126        quantityInput.value = item.quantity;127        priceInput.value = item.price;128        window.scrollTo({ top: 0, behavior: 'smooth' });129    }130}131 132// Event listeners133startScanBtn.addEventListener('click', startScanner);134stopScanBtn.addEventListener('click', stopScanner);135 136itemForm.addEventListener('submit', function(e) {137    e.preventDefault();138    const barcode = barcodeInput.value.trim();139    const name = nameInput.value.trim();140    const quantity = parseInt(quantityInput.value);141    const price = parseFloat(priceInput.value).toFixed(2);142    143    if (!barcode || !name) {144        alert('Please enter both barcode and product name');145        return;146    }147    148    saveItem(barcode, name, quantity, price);149    150    // Reset form151    barcodeInput.value = '';152    nameInput.value = '';153    quantityInput.value = 1;154    priceInput.value = '';155});156 157// Initialize158document.addEventListener('DOMContentLoaded', function() {159    stopScanBtn.disabled = true;160    renderInventory();161});162 163// Make functions available globally164window.deleteItem = deleteItem;165window.editItem = editItem;