\u062c\u062f\u0648\u0644 \u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0645\u0630\u064a\u0639\u064a\u0646 - Devils 4 Talents<\/title>\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;600;700;800&display=swap\" rel=\"stylesheet\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n \r\n <style>\r\n :root {\r\n --brand-burgundy: #7f1d1d; \/* \u0627\u0644\u0644\u0648\u0646 \u0627\u0644\u0646\u0628\u064a\u062a\u064a \u0627\u0644\u0645\u0633\u062a\u0648\u062d\u0649 \u0645\u0646 \u0627\u0644\u0644\u0648\u062c\u0648 *\/\r\n --brand-black: #111827; \/* \u0627\u0644\u0623\u0633\u0648\u062f \u0627\u0644\u0641\u062d\u0645\u064a *\/\r\n --bg-light: #f9fafb; \/* \u062e\u0644\u0641\u064a\u0629 \u0631\u0645\u0627\u062f\u064a\u0629 \u0641\u0627\u062a\u062d\u0629 \u062c\u062f\u0627\u064b *\/\r\n }\r\n\r\n body {\r\n font-family: 'Cairo', sans-serif;\r\n background-color: var(--bg-light);\r\n color: var(--brand-black);\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n .header-gradient {\r\n background: linear-gradient(135deg, var(--brand-black) 0%, #310000 100%);\r\n }\r\n\r\n .burgundy-border {\r\n border-top: 4px solid var(--brand-burgundy);\r\n }\r\n\r\n .search-focus:focus {\r\n border-color: var(--brand-burgundy);\r\n box-shadow: 0 0 0 3px rgba(127, 29, 29, 0.1);\r\n outline: none;\r\n }\r\n\r\n .table-row-hover:hover {\r\n background-color: rgba(127, 29, 29, 0.02);\r\n }\r\n\r\n .badge-burgundy {\r\n background-color: rgba(127, 29, 29, 0.1);\r\n color: var(--brand-burgundy);\r\n }\r\n\r\n \/* \u062a\u062e\u0635\u064a\u0635 \u0627\u0644\u0633\u0643\u0631\u0648\u0644 \u0628\u0627\u0631 *\/\r\n ::-webkit-scrollbar { width: 6px; }\r\n ::-webkit-scrollbar-track { background: #f1f1f1; }\r\n ::-webkit-scrollbar-thumb { background: var(--brand-burgundy); border-radius: 10px; }\r\n <\/style>\r\n<\/head>\r\n<body class=\"min-h-screen pb-10\">\r\n\r\n <header class=\"header-gradient text-white pt-12 pb-24 px-4 text-center relative overflow-hidden\">\r\n <div class=\"absolute inset-0 opacity-10\">\r\n <svg width=\"100%\" height=\"100%\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\">\r\n <path d=\"M0 100 L100 0 L100 100 Z\" fill=\"white\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"max-w-4xl mx-auto relative z-10\">\r\n \r\n <img decoding=\"async\" src=\"https:\/\/images.squarespace-cdn.com\/content\/v1\/6406e9365e9f89311b590e8e\/08851493-2771-460d-8386-35368a0a187b\/D4T+LOGO.png\" \r\n alt=\"Devils 4 Talents Logo\" \r\n onerror=\"this.src='https:\/\/placehold.co\/200x80\/000000\/ffffff?text=D4T+LOGO'\"\r\n class=\"h-20 md:h-24 mx-auto mb-6 drop-shadow-2xl\">\r\n \r\n <h1 class=\"text-3xl md:text-4xl font-extrabold tracking-tight mb-2\">\u062c\u062f\u0648\u0644 \u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0645\u0630\u064a\u0639\u064a\u0646<\/h1>\r\n <p class=\"text-gray-300 font-light text-lg\">\u0645\u0646\u0635\u0629 \u0627\u0644\u0645\u0648\u0627\u0647\u0628 \u0627\u0644\u0623\u0648\u0644\u0649 - \u062f\u064a\u0641\u0644\u0632 4 \u062a\u0627\u0644\u0646\u062a\u0633<\/p>\r\n <\/div>\r\n <\/header>\r\n\r\n <main class=\"max-w-5xl mx-auto -mt-16 px-4 relative z-20\">\r\n \r\n \r\n <div class=\"bg-white rounded-2xl shadow-xl p-4 md:p-6 mb-6 flex flex-col md:flex-row gap-4 items-center justify-between border border-gray-100\">\r\n <div class=\"relative w-full md:w-2\/3\">\r\n <i class=\"fas fa-search absolute right-4 top-1\/2 -translate-y-1\/2 text-gray-400\"><\/i>\r\n <input type=\"text\" id=\"searchInput\" onkeyup=\"filterTable()\" \r\n placeholder=\"\u0627\u0628\u062d\u062b \u0639\u0646 \u0627\u0633\u0645 \u0627\u0644\u0645\u0630\u064a\u0639 \u0623\u0648 \u0645\u0648\u0639\u062f \u0627\u0644\u062a\u0642\u062f\u064a\u0645...\" \r\n class=\"w-full pr-12 pl-4 py-4 rounded-xl border border-gray-200 search-focus transition-all text-gray-700\">\r\n <\/div>\r\n <div id=\"statusIndicator\" class=\"flex items-center gap-2 text-sm font-medium text-gray-500\">\r\n <span class=\"w-2 h-2 rounded-full bg-green-500 animate-pulse\"><\/span>\r\n \u0645\u062d\u062f\u062b \u0644\u062d\u0638\u064a\u0627\u064b\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"bg-white rounded-2xl shadow-xl overflow-hidden border border-gray-100 burgundy-border\">\r\n <div class=\"overflow-x-auto\">\r\n <table class=\"w-full text-right\" id=\"broadcastersTable\">\r\n <thead>\r\n <tr class=\"bg-gray-50 border-b border-gray-100\">\r\n <th class=\"py-5 px-6 text-sm font-bold text-gray-600 uppercase\">\u0627\u0644\u0645\u0630\u064a\u0639<\/th>\r\n <th class=\"py-5 px-6 text-sm font-bold text-gray-600 text-center\">\u0627\u0644\u0645\u0639\u0631\u0641 (ID)<\/th>\r\n <th class=\"py-5 px-6 text-sm font-bold text-gray-600\">\u062a\u0648\u0642\u064a\u062a \u0627\u0644\u0638\u0647\u0648\u0631<\/th>\r\n <\/tr>\r\n <\/thead>\r\n <tbody id=\"tableBody\" class=\"divide-y divide-gray-50\">\r\n <tr id=\"loadingRow\">\r\n <td colspan=\"3\" class=\"py-32 text-center\">\r\n <div class=\"flex flex-col items-center\">\r\n <div class=\"w-12 h-12 border-4 border-gray-100 border-t-red-900 rounded-full animate-spin mb-4\"><\/div>\r\n <p class=\"text-gray-400 font-medium\">\u062c\u0627\u0631\u064a \u062c\u0644\u0628 \u062c\u062f\u0648\u0644 \u0627\u0644\u0645\u0648\u0627\u0639\u064a\u062f \u0645\u0646 \u0627\u0644\u0633\u064a\u0631\u0641\u0631...<\/p>\r\n <\/div>\r\n <\/td>\r\n <\/tr>\r\n <\/tbody>\r\n <\/table>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <footer class=\"mt-10 text-center text-gray-400 text-sm\">\r\n <p>\u00a9 2024 DEVILS 4 TALENTS | \u062c\u0645\u064a\u0639 \u0627\u0644\u062d\u0642\u0648\u0642 \u0645\u062d\u0641\u0648\u0638\u0629<\/p>\r\n <\/footer>\r\n <\/main>\r\n\r\n <script>\r\n \/\/ \u062a\u0645 \u0627\u0633\u062a\u062e\u062f\u0627\u0645 \u0627\u0644\u0631\u0627\u0628\u0637 \u0627\u0644\u0630\u064a \u0632\u0648\u062f\u062a\u0646\u064a \u0628\u0647 \u0645\u0628\u0627\u0634\u0631\u0629\r\n const rawUrl = 'https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vTp8lFLwzkYxoHPwvdxkQtpCixdb-OIxQP2585jD1OukO0KTwugXFuKJW4myc8ANkEn26A3RvOx7R6p\/pubhtml';\r\n const csvUrl = rawUrl.replace('\/pubhtml', '\/pub?output=csv');\r\n\r\n async function fetchBroadcasters() {\r\n const tableBody = document.getElementById('tableBody');\r\n \r\n try {\r\n const response = await fetch(csvUrl);\r\n const data = await response.text();\r\n \r\n \/\/ \u062a\u062d\u0648\u064a\u0644 \u0627\u0644\u0646\u0635 \u0625\u0644\u0649 \u0645\u0635\u0641\u0648\u0641\u0629 \u0628\u064a\u0627\u0646\u0627\u062a\r\n const rows = data.split('\\n')\r\n .map(row => row.split(',').map(cell => cell.replace(\/\"\/g, '').trim()))\r\n .filter(row => row.length >= 3 && row[0] !== \"\");\r\n\r\n tableBody.innerHTML = '';\r\n \r\n \/\/ \u062a\u062e\u0637\u064a \u0627\u0644\u0631\u0623\u0633 \u0648\u0639\u0631\u0636 \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a\r\n for (let i = 1; i < rows.length; i++) {\r\n const [name, id, time] = rows[i];\r\n if(!name) continue;\r\n\r\n const tr = document.createElement('tr');\r\n tr.className = 'table-row-hover transition-colors';\r\n tr.innerHTML = `\r\n <td class=\"py-5 px-6\">\r\n <div class=\"flex items-center gap-4\">\r\n <div class=\"w-10 h-10 rounded-full bg-red-50 flex items-center justify-center text-red-900 font-bold border border-red-100\">\r\n <i class=\"fas fa-microphone text-xs\"><\/i>\r\n <\/div>\r\n <span class=\"font-bold text-gray-800 text-lg\">${name}<\/span>\r\n <\/div>\r\n <\/td>\r\n <td class=\"py-5 px-6 text-center\">\r\n <span class=\"badge-burgundy px-3 py-1 rounded-lg font-mono text-xs font-bold border border-red-200\/50\">\r\n #${id}\r\n <\/span>\r\n <\/td>\r\n <td class=\"py-5 px-6\">\r\n <div class=\"flex items-center gap-3 text-gray-600\">\r\n <i class=\"far fa-clock text-red-900\"><\/i>\r\n <span class=\"text-sm font-semibold\">${time}<\/span>\r\n <\/div>\r\n <\/td>\r\n `;\r\n tableBody.appendChild(tr);\r\n }\r\n\r\n } catch (error) {\r\n console.error('Error fetching data:', error);\r\n tableBody.innerHTML = `\r\n <tr>\r\n <td colspan=\"3\" class=\"py-20 text-center\">\r\n <div class=\"text-red-900 mb-2 font-bold italic\">\u0639\u0630\u0631\u0627\u064b\u060c \u0641\u0634\u0644 \u0627\u0644\u0627\u062a\u0635\u0627\u0644 \u0628\u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a<\/div>\r\n <p class=\"text-gray-500 text-sm\">\u062a\u0623\u0643\u062f \u0645\u0646 \u0646\u0634\u0631 \u0627\u0644\u0645\u0644\u0641 \u0643\u0640 CSV \u0648\u062d\u0627\u0648\u0644 \u0645\u0631\u0629 \u0623\u062e\u0631\u0649.<\/p>\r\n <\/td>\r\n <\/tr>\r\n `;\r\n }\r\n }\r\n\r\n function filterTable() {\r\n const query = document.getElementById('searchInput').value.toLowerCase();\r\n const rows = document.querySelectorAll('#tableBody tr:not(#loadingRow)');\r\n\r\n rows.forEach(row => {\r\n const text = row.textContent.toLowerCase();\r\n row.style.display = text.includes(query) ? '' : 'none';\r\n });\r\n }\r\n\r\n \/\/ \u062a\u0634\u063a\u064a\u0644 \u0627\u0644\u062c\u0644\u0628 \u0639\u0646\u062f \u0627\u0644\u062a\u062d\u0645\u064a\u0644\r\n window.onload = fetchBroadcasters;\r\n \/\/ \u062a\u062d\u062f\u064a\u062b \u062a\u0644\u0642\u0627\u0626\u064a \u0643\u0644 \u062f\u0642\u064a\u0642\u062a\u064a\u0646\r\n setInterval(fetchBroadcasters, 120000);\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u062c\u062f\u0648\u0644 \u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0645\u0630\u064a\u0639\u064a\u0646 – Devils 4 Talents \u062c\u062f\u0648\u0644 \u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0645\u0630\u064a\u0639\u064a\u0646 \u0645\u0646\u0635\u0629 \u0627\u0644\u0645\u0648\u0627\u0647\u0628 \u0627\u0644\u0623\u0648\u0644\u0649 – \u062f\u064a\u0641\u0644\u0632 4 \u062a\u0627\u0644\u0646\u062a\u0633 \u0645\u062d\u062f\u062b \u0644\u062d\u0638\u064a\u0627\u064b \u0627\u0644\u0645\u0630\u064a\u0639 \u0627\u0644\u0645\u0639\u0631\u0641 (ID) \u062a\u0648\u0642\u064a\u062a \u0627\u0644\u0638\u0647\u0648\u0631 \u062c\u0627\u0631\u064a \u062c\u0644\u0628 \u062c\u062f\u0648\u0644 \u0627\u0644\u0645\u0648\u0627\u0639\u064a\u062f \u0645\u0646 \u0627\u0644\u0633\u064a\u0631\u0641\u0631… \u00a9 2024 DEVILS 4 TALENTS | \u062c\u0645\u064a\u0639 \u0627\u0644\u062d\u0642\u0648\u0642 \u0645\u062d\u0641\u0648\u0638\u0629<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-43","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/pages\/43","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/comments?post=43"}],"version-history":[{"count":18,"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/pages\/43\/revisions"}],"predecessor-version":[{"id":180,"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/pages\/43\/revisions\/180"}],"wp:attachment":[{"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/media?parent=43"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n \u062c\u062f\u0648\u0644 \u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0645\u0630\u064a\u0639\u064a\u0646 - Devils 4 Talents<\/title>\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Cairo:wght@400;600;700;800&display=swap\" rel=\"stylesheet\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n \r\n <style>\r\n :root {\r\n --brand-burgundy: #7f1d1d; \/* \u0627\u0644\u0644\u0648\u0646 \u0627\u0644\u0646\u0628\u064a\u062a\u064a \u0627\u0644\u0645\u0633\u062a\u0648\u062d\u0649 \u0645\u0646 \u0627\u0644\u0644\u0648\u062c\u0648 *\/\r\n --brand-black: #111827; \/* \u0627\u0644\u0623\u0633\u0648\u062f \u0627\u0644\u0641\u062d\u0645\u064a *\/\r\n --bg-light: #f9fafb; \/* \u062e\u0644\u0641\u064a\u0629 \u0631\u0645\u0627\u062f\u064a\u0629 \u0641\u0627\u062a\u062d\u0629 \u062c\u062f\u0627\u064b *\/\r\n }\r\n\r\n body {\r\n font-family: 'Cairo', sans-serif;\r\n background-color: var(--bg-light);\r\n color: var(--brand-black);\r\n margin: 0;\r\n padding: 0;\r\n }\r\n\r\n .header-gradient {\r\n background: linear-gradient(135deg, var(--brand-black) 0%, #310000 100%);\r\n }\r\n\r\n .burgundy-border {\r\n border-top: 4px solid var(--brand-burgundy);\r\n }\r\n\r\n .search-focus:focus {\r\n border-color: var(--brand-burgundy);\r\n box-shadow: 0 0 0 3px rgba(127, 29, 29, 0.1);\r\n outline: none;\r\n }\r\n\r\n .table-row-hover:hover {\r\n background-color: rgba(127, 29, 29, 0.02);\r\n }\r\n\r\n .badge-burgundy {\r\n background-color: rgba(127, 29, 29, 0.1);\r\n color: var(--brand-burgundy);\r\n }\r\n\r\n \/* \u062a\u062e\u0635\u064a\u0635 \u0627\u0644\u0633\u0643\u0631\u0648\u0644 \u0628\u0627\u0631 *\/\r\n ::-webkit-scrollbar { width: 6px; }\r\n ::-webkit-scrollbar-track { background: #f1f1f1; }\r\n ::-webkit-scrollbar-thumb { background: var(--brand-burgundy); border-radius: 10px; }\r\n <\/style>\r\n<\/head>\r\n<body class=\"min-h-screen pb-10\">\r\n\r\n <header class=\"header-gradient text-white pt-12 pb-24 px-4 text-center relative overflow-hidden\">\r\n <div class=\"absolute inset-0 opacity-10\">\r\n <svg width=\"100%\" height=\"100%\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"none\">\r\n <path d=\"M0 100 L100 0 L100 100 Z\" fill=\"white\"><\/path>\r\n <\/svg>\r\n <\/div>\r\n <div class=\"max-w-4xl mx-auto relative z-10\">\r\n \r\n <img decoding=\"async\" src=\"https:\/\/images.squarespace-cdn.com\/content\/v1\/6406e9365e9f89311b590e8e\/08851493-2771-460d-8386-35368a0a187b\/D4T+LOGO.png\" \r\n alt=\"Devils 4 Talents Logo\" \r\n onerror=\"this.src='https:\/\/placehold.co\/200x80\/000000\/ffffff?text=D4T+LOGO'\"\r\n class=\"h-20 md:h-24 mx-auto mb-6 drop-shadow-2xl\">\r\n \r\n <h1 class=\"text-3xl md:text-4xl font-extrabold tracking-tight mb-2\">\u062c\u062f\u0648\u0644 \u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0645\u0630\u064a\u0639\u064a\u0646<\/h1>\r\n <p class=\"text-gray-300 font-light text-lg\">\u0645\u0646\u0635\u0629 \u0627\u0644\u0645\u0648\u0627\u0647\u0628 \u0627\u0644\u0623\u0648\u0644\u0649 - \u062f\u064a\u0641\u0644\u0632 4 \u062a\u0627\u0644\u0646\u062a\u0633<\/p>\r\n <\/div>\r\n <\/header>\r\n\r\n <main class=\"max-w-5xl mx-auto -mt-16 px-4 relative z-20\">\r\n \r\n \r\n <div class=\"bg-white rounded-2xl shadow-xl p-4 md:p-6 mb-6 flex flex-col md:flex-row gap-4 items-center justify-between border border-gray-100\">\r\n <div class=\"relative w-full md:w-2\/3\">\r\n <i class=\"fas fa-search absolute right-4 top-1\/2 -translate-y-1\/2 text-gray-400\"><\/i>\r\n <input type=\"text\" id=\"searchInput\" onkeyup=\"filterTable()\" \r\n placeholder=\"\u0627\u0628\u062d\u062b \u0639\u0646 \u0627\u0633\u0645 \u0627\u0644\u0645\u0630\u064a\u0639 \u0623\u0648 \u0645\u0648\u0639\u062f \u0627\u0644\u062a\u0642\u062f\u064a\u0645...\" \r\n class=\"w-full pr-12 pl-4 py-4 rounded-xl border border-gray-200 search-focus transition-all text-gray-700\">\r\n <\/div>\r\n <div id=\"statusIndicator\" class=\"flex items-center gap-2 text-sm font-medium text-gray-500\">\r\n <span class=\"w-2 h-2 rounded-full bg-green-500 animate-pulse\"><\/span>\r\n \u0645\u062d\u062f\u062b \u0644\u062d\u0638\u064a\u0627\u064b\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"bg-white rounded-2xl shadow-xl overflow-hidden border border-gray-100 burgundy-border\">\r\n <div class=\"overflow-x-auto\">\r\n <table class=\"w-full text-right\" id=\"broadcastersTable\">\r\n <thead>\r\n <tr class=\"bg-gray-50 border-b border-gray-100\">\r\n <th class=\"py-5 px-6 text-sm font-bold text-gray-600 uppercase\">\u0627\u0644\u0645\u0630\u064a\u0639<\/th>\r\n <th class=\"py-5 px-6 text-sm font-bold text-gray-600 text-center\">\u0627\u0644\u0645\u0639\u0631\u0641 (ID)<\/th>\r\n <th class=\"py-5 px-6 text-sm font-bold text-gray-600\">\u062a\u0648\u0642\u064a\u062a \u0627\u0644\u0638\u0647\u0648\u0631<\/th>\r\n <\/tr>\r\n <\/thead>\r\n <tbody id=\"tableBody\" class=\"divide-y divide-gray-50\">\r\n <tr id=\"loadingRow\">\r\n <td colspan=\"3\" class=\"py-32 text-center\">\r\n <div class=\"flex flex-col items-center\">\r\n <div class=\"w-12 h-12 border-4 border-gray-100 border-t-red-900 rounded-full animate-spin mb-4\"><\/div>\r\n <p class=\"text-gray-400 font-medium\">\u062c\u0627\u0631\u064a \u062c\u0644\u0628 \u062c\u062f\u0648\u0644 \u0627\u0644\u0645\u0648\u0627\u0639\u064a\u062f \u0645\u0646 \u0627\u0644\u0633\u064a\u0631\u0641\u0631...<\/p>\r\n <\/div>\r\n <\/td>\r\n <\/tr>\r\n <\/tbody>\r\n <\/table>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <footer class=\"mt-10 text-center text-gray-400 text-sm\">\r\n <p>\u00a9 2024 DEVILS 4 TALENTS | \u062c\u0645\u064a\u0639 \u0627\u0644\u062d\u0642\u0648\u0642 \u0645\u062d\u0641\u0648\u0638\u0629<\/p>\r\n <\/footer>\r\n <\/main>\r\n\r\n <script>\r\n \/\/ \u062a\u0645 \u0627\u0633\u062a\u062e\u062f\u0627\u0645 \u0627\u0644\u0631\u0627\u0628\u0637 \u0627\u0644\u0630\u064a \u0632\u0648\u062f\u062a\u0646\u064a \u0628\u0647 \u0645\u0628\u0627\u0634\u0631\u0629\r\n const rawUrl = 'https:\/\/docs.google.com\/spreadsheets\/d\/e\/2PACX-1vTp8lFLwzkYxoHPwvdxkQtpCixdb-OIxQP2585jD1OukO0KTwugXFuKJW4myc8ANkEn26A3RvOx7R6p\/pubhtml';\r\n const csvUrl = rawUrl.replace('\/pubhtml', '\/pub?output=csv');\r\n\r\n async function fetchBroadcasters() {\r\n const tableBody = document.getElementById('tableBody');\r\n \r\n try {\r\n const response = await fetch(csvUrl);\r\n const data = await response.text();\r\n \r\n \/\/ \u062a\u062d\u0648\u064a\u0644 \u0627\u0644\u0646\u0635 \u0625\u0644\u0649 \u0645\u0635\u0641\u0648\u0641\u0629 \u0628\u064a\u0627\u0646\u0627\u062a\r\n const rows = data.split('\\n')\r\n .map(row => row.split(',').map(cell => cell.replace(\/\"\/g, '').trim()))\r\n .filter(row => row.length >= 3 && row[0] !== \"\");\r\n\r\n tableBody.innerHTML = '';\r\n \r\n \/\/ \u062a\u062e\u0637\u064a \u0627\u0644\u0631\u0623\u0633 \u0648\u0639\u0631\u0636 \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a\r\n for (let i = 1; i < rows.length; i++) {\r\n const [name, id, time] = rows[i];\r\n if(!name) continue;\r\n\r\n const tr = document.createElement('tr');\r\n tr.className = 'table-row-hover transition-colors';\r\n tr.innerHTML = `\r\n <td class=\"py-5 px-6\">\r\n <div class=\"flex items-center gap-4\">\r\n <div class=\"w-10 h-10 rounded-full bg-red-50 flex items-center justify-center text-red-900 font-bold border border-red-100\">\r\n <i class=\"fas fa-microphone text-xs\"><\/i>\r\n <\/div>\r\n <span class=\"font-bold text-gray-800 text-lg\">${name}<\/span>\r\n <\/div>\r\n <\/td>\r\n <td class=\"py-5 px-6 text-center\">\r\n <span class=\"badge-burgundy px-3 py-1 rounded-lg font-mono text-xs font-bold border border-red-200\/50\">\r\n #${id}\r\n <\/span>\r\n <\/td>\r\n <td class=\"py-5 px-6\">\r\n <div class=\"flex items-center gap-3 text-gray-600\">\r\n <i class=\"far fa-clock text-red-900\"><\/i>\r\n <span class=\"text-sm font-semibold\">${time}<\/span>\r\n <\/div>\r\n <\/td>\r\n `;\r\n tableBody.appendChild(tr);\r\n }\r\n\r\n } catch (error) {\r\n console.error('Error fetching data:', error);\r\n tableBody.innerHTML = `\r\n <tr>\r\n <td colspan=\"3\" class=\"py-20 text-center\">\r\n <div class=\"text-red-900 mb-2 font-bold italic\">\u0639\u0630\u0631\u0627\u064b\u060c \u0641\u0634\u0644 \u0627\u0644\u0627\u062a\u0635\u0627\u0644 \u0628\u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a<\/div>\r\n <p class=\"text-gray-500 text-sm\">\u062a\u0623\u0643\u062f \u0645\u0646 \u0646\u0634\u0631 \u0627\u0644\u0645\u0644\u0641 \u0643\u0640 CSV \u0648\u062d\u0627\u0648\u0644 \u0645\u0631\u0629 \u0623\u062e\u0631\u0649.<\/p>\r\n <\/td>\r\n <\/tr>\r\n `;\r\n }\r\n }\r\n\r\n function filterTable() {\r\n const query = document.getElementById('searchInput').value.toLowerCase();\r\n const rows = document.querySelectorAll('#tableBody tr:not(#loadingRow)');\r\n\r\n rows.forEach(row => {\r\n const text = row.textContent.toLowerCase();\r\n row.style.display = text.includes(query) ? '' : 'none';\r\n });\r\n }\r\n\r\n \/\/ \u062a\u0634\u063a\u064a\u0644 \u0627\u0644\u062c\u0644\u0628 \u0639\u0646\u062f \u0627\u0644\u062a\u062d\u0645\u064a\u0644\r\n window.onload = fetchBroadcasters;\r\n \/\/ \u062a\u062d\u062f\u064a\u062b \u062a\u0644\u0642\u0627\u0626\u064a \u0643\u0644 \u062f\u0642\u064a\u0642\u062a\u064a\u0646\r\n setInterval(fetchBroadcasters, 120000);\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u062c\u062f\u0648\u0644 \u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0645\u0630\u064a\u0639\u064a\u0646 – Devils 4 Talents \u062c\u062f\u0648\u0644 \u0645\u0648\u0627\u0639\u064a\u062f \u0627\u0644\u0645\u0630\u064a\u0639\u064a\u0646 \u0645\u0646\u0635\u0629 \u0627\u0644\u0645\u0648\u0627\u0647\u0628 \u0627\u0644\u0623\u0648\u0644\u0649 – \u062f\u064a\u0641\u0644\u0632 4 \u062a\u0627\u0644\u0646\u062a\u0633 \u0645\u062d\u062f\u062b \u0644\u062d\u0638\u064a\u0627\u064b \u0627\u0644\u0645\u0630\u064a\u0639 \u0627\u0644\u0645\u0639\u0631\u0641 (ID) \u062a\u0648\u0642\u064a\u062a \u0627\u0644\u0638\u0647\u0648\u0631 \u062c\u0627\u0631\u064a \u062c\u0644\u0628 \u062c\u062f\u0648\u0644 \u0627\u0644\u0645\u0648\u0627\u0639\u064a\u062f \u0645\u0646 \u0627\u0644\u0633\u064a\u0631\u0641\u0631… \u00a9 2024 DEVILS 4 TALENTS | \u062c\u0645\u064a\u0639 \u0627\u0644\u062d\u0642\u0648\u0642 \u0645\u062d\u0641\u0648\u0638\u0629<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-43","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/pages\/43","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/comments?post=43"}],"version-history":[{"count":18,"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/pages\/43\/revisions"}],"predecessor-version":[{"id":180,"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/pages\/43\/revisions\/180"}],"wp:attachment":[{"href":"https:\/\/devils4talents.online\/en_us\/wp-json\/wp\/v2\/media?parent=43"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}