[{"id":"8c62581","elType":"container","settings":{"flex_direction":"column","content_width":"full","ha_cmc_text":"Happy Addons"},"elements":[{"id":"cba3f83","elType":"widget","settings":{"html":"    <link href=\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@5.3.0\/dist\/css\/bootstrap.min.css\" rel=\"stylesheet\">\n    <style>\n        table {\n            width: 100%;\n            border-collapse: collapse;\n            margin-top: 20px;\n        }\n        th, td {\n            border: 1px solid #ccc;\n            padding: 8px;\n            text-align: left;\n        }\n        th {\n            background-color: #f4f4f4;\n        }\n        input[type=\"text\"], select {\n            width: 100%;\n            box-sizing: border-box;\n        }\n    <\/style>\n\n<div class=\"container mt-5\">\n    <h1 class=\"mb-4\">Enter Athlete Data<\/h1>\n\n    <!-- Information Card -->\n    <div id=\"statusCard\" class=\"card d-none\">\n        <div class=\"card-body\">\n            <h5 id=\"statusTitle\" class=\"card-title\"><\/h5>\n            <p id=\"statusMessage\" class=\"card-text\"><\/p>\n        <\/div>\n    <\/div>\n\n    <!-- Form -->\n    <form id=\"dataForm\" onsubmit=\"submitTable(event)\">\n        <div class=\"mb-3\">\n            <label for=\"csvFileInput\" class=\"form-label\">Upload CSV File<\/label>\n            <input type=\"file\" id=\"csvFileInput\" class=\"form-control\" accept=\".csv\" onchange=\"handleCSVUpload(event)\">\n        <\/div>\n\n        <table class=\"table table-bordered\">\n            <thead class=\"table-light\">\n                <tr>\n                    <th>BIP<\/th>\n                    <th>First Name<\/th>\n                    <th>Last Name<\/th>\n                    <th>Gender<\/th>\n                    <th>FIS Code<\/th>\n                    <th>Licence Code<\/th>\n                    <th>Licence Type<\/th>\n                    <th>Klub<\/th>\n                    <th>Country<\/th>\n                    <th>Date of Birth<\/th>\n                    <th>Category<\/th>\n                    <th>Actions<\/th>\n                <\/tr>\n            <\/thead>\n            <tbody>\n                <!-- Rows will be dynamically added -->\n            <\/tbody>\n        <\/table>\n        <button type=\"button\" class=\"btn btn-primary mb-3\" onclick=\"addRow()\">Add Row<\/button>\n        <button type=\"submit\" class=\"btn btn-success\">Submit<\/button>\n    <\/form>\n<\/div>\n\n<script>\n    const genders = [\"Male\", \"Female\", \"Other\"];\n    const countries = [\"USA\", \"Canada\", \"UK\", \"Australia\", \"Germany\"];\n    const categories = [\"Junior\", \"Senior\", \"Adult\", \"Professional\"];\n\n    \/\/ Show status card\n    function showStatusCard(title, message, isSuccess) {\n        const statusCard = document.getElementById(\"statusCard\");\n        const statusTitle = document.getElementById(\"statusTitle\");\n        const statusMessage = document.getElementById(\"statusMessage\");\n\n        statusCard.className = `card ${isSuccess ? \"bg-success\" : \"bg-danger\"} text-white`;\n        statusTitle.textContent = title;\n        statusMessage.textContent = message;\n        statusCard.classList.remove(\"d-none\");\n    }\n\n    \/\/ Function to validate unique BIP\n    function isBipUnique(bip) {\n        const bips = Array.from(document.querySelectorAll('input[name=\"bip\"]')).map(input => input.value.trim());\n        const duplicateCount = bips.filter(existingBip => existingBip === bip).length;\n        return duplicateCount <= 1; \/\/ A BIP is unique if it appears only once\n    }\n\n    \/\/ Function to validate BIP and show a warning if duplicate\n    function validateBip(input) {\n        const bip = input.value.trim();\n        if (!isBipUnique(bip)) {\n            alert(\"BIP number must be unique!\");\n            input.value = \"\";\n        }\n    }\n\n    \/\/ Function to validate and format date as DD\/MM\/YYYY\n    function formatDate(input) {\n        const dateParts = input.split('\/');\n        if (dateParts.length === 3) {\n            const day = dateParts[0].padStart(2, '0');\n            const month = dateParts[1].padStart(2, '0');\n            const year = dateParts[2];\n            if (day <= 31 && month <= 12 && year.length === 4) {\n                return `${day}\/${month}\/${year}`;\n            }\n        }\n        alert(\"Invalid date format. Please use DD\/MM\/YYYY.\");\n        return \"\";\n    }\n\n    \/\/ Function to add a new row\n    function addRow(data = {}) {\n        const table = document.querySelector(\"table tbody\");\n        const newRow = document.createElement(\"tr\");\n        newRow.innerHTML = `\n            <td><input type=\"text\" name=\"bip\" placeholder=\"BIP\" value=\"${data.bip || ''}\" onchange=\"validateBip(this)\"><\/td>\n            <td><input type=\"text\" name=\"first_name\" placeholder=\"First Name\" value=\"${data.first_name || ''}\"><\/td>\n            <td><input type=\"text\" name=\"last_name\" placeholder=\"Last Name\" value=\"${data.last_name || ''}\"><\/td>\n            <td>\n                <select name=\"gender\">\n                    ${genders.map(g => `<option value=\"${g.toLowerCase()}\" ${data.gender === g.toLowerCase() ? 'selected' : ''}>${g}<\/option>`).join('')}\n                <\/select>\n            <\/td>\n            <td><input type=\"text\" name=\"fis_code\" placeholder=\"FIS Code\" value=\"${data.fis_code || ''}\"><\/td>\n            <td><input type=\"text\" name=\"licence_code\" placeholder=\"Licence Code\" value=\"${data.licence_code || ''}\"><\/td>\n            <td><input type=\"text\" name=\"licence_type\" placeholder=\"Licence Type\" value=\"${data.licence_type || ''}\"><\/td>\n            <td><input type=\"text\" name=\"klub\" placeholder=\"Klub\" value=\"${data.klub || ''}\"><\/td>\n            <td>\n                <select name=\"country\">\n                    ${countries.map(c => `<option value=\"${c}\" ${data.country === c ? 'selected' : ''}>${c}<\/option>`).join('')}\n                <\/select>\n            <\/td>\n            <td><input type=\"text\" name=\"date_of_birth\" placeholder=\"DD\/MM\/YYYY\" value=\"${data.date_of_birth || ''}\" onchange=\"this.value=formatDate(this.value)\"><\/td>\n            <td>\n                <select name=\"category\">\n                    ${categories.map(cat => `<option value=\"${cat}\" ${data.category === cat ? 'selected' : ''}>${cat}<\/option>`).join('')}\n                <\/select>\n            <\/td>\n            <td><button type=\"button\" class=\"btn btn-danger btn-sm\" onclick=\"deleteRow(this)\">Delete<\/button><\/td>\n        `;\n        table.appendChild(newRow);\n    }\n\n    \/\/ Function to delete a row\n    function deleteRow(button) {\n        const row = button.closest('tr');\n        row.remove();\n    }\n\n    \/\/ Submit table data via AJAX\n    async function submitTable(event) {\n        event.preventDefault();\n\n        const rows = [];\n        const tableRows = document.querySelectorAll(\"table tbody tr\");\n\n        tableRows.forEach(row => {\n            const rowData = {};\n            row.querySelectorAll(\"input, select\").forEach(input => {\n                rowData[input.name] = input.value.trim();\n            });\n            rows.push(rowData);\n        });\n\n        try {\n            const response = await fetch(\"https:\/\/live-biegi.sport-timing.pl\/app-functions\/enter-athlete-data\", {\n                method: \"POST\",\n                headers: {\n                    \"Content-Type\": \"application\/json\"\n                },\n                body: JSON.stringify({ athletes: rows })\n            });\n\n            if (response.ok) {\n                showStatusCard(\"Success\", \"Data submitted successfully!\", true);\n            } else {\n                showStatusCard(\"Error\", \"Failed to submit data.\", false);\n            }\n        } catch (error) {\n            showStatusCard(\"Error\", \"An error occurred: \" + error.message, false);\n        }\n    }\n\n    \/\/ Add an initial row on page load\n    document.addEventListener(\"DOMContentLoaded\", () => {\n        addRow();\n    });\n<\/script>","ha_cmc_text":"Happy Addons"},"elements":[],"widgetType":"html"}],"isInner":false}]