const { useState, useEffect, useRef, createContext, useContext, useCallback } = React;
// --- ÍCONES SVG ---
const Icons = {
Dice: ({ className }) => ,
Users: ({ className }) => ,
Copy: ({ className }) => ,
Check: ({ className }) => ,
Zap: ({ className }) => ,
Target: ({ className }) => ,
Refresh: ({ className }) => ,
Volume2: ({ className }) => ,
VolumeX: ({ className }) => ,
AlertCircle: ({ className }) => ,
Plus: ({ className }) => ,
X: ({ className }) => ,
Instagram: ({ className }) => ,
Tiktok: ({ className }) =>
};
// --- INTERNACIONALIZAÇÃO (i18n) ---
const translations = {
pt: {
appTitle: "LIVESHOP",
appTitleSpan: "TURBO",
tabNumbers: "Números",
tabNames: "Nomes",
drawBtn: "Sortear Agora",
drawAgain: "Novo Sorteio",
copy: "Copiar Resultado",
copied: "Copiado!",
min: "Mínimo",
max: "Máximo",
qty: "Quantidade a sortear",
noRepeat: "Sem repetição de resultados",
namesPlaceholder: "Digite um nome e pressione Enter",
addName: "Adicionar",
clearAll: "Limpar",
namesCount: "participantes adicionados",
namesQty: "Quantidade de ganhadores",
errorMaxMin: "O máximo não pode ser menor que o mínimo.",
errorInterval: "A quantidade ultrapassa o intervalo disponível.",
errorEmpty: "A lista de nomes está vazia.",
errorNamesQty: "A quantidade pedida ultrapassa o total de nomes na lista.",
errorMax100: "Por segurança, o limite máximo é de 100 resultados por vez.",
drawTime: "Sorteio realizado em",
loading: "Sorteando...",
lastWinners: "Últimos Ganhadores",
clearHistory: "Limpar Histórico",
importBtn: "Importar (Excel, Word, TXT)",
remaining: " (Restam ",
available: " disponíveis)",
drawWord: "Sorteio "
},
es: {
appTitle: "LIVESHOP",
appTitleSpan: "TURBO",
tabNumbers: "Números",
tabNames: "Nombres",
drawBtn: "Sortear Ahora",
drawAgain: "Nuevo Sorteo",
copy: "Copiar Resultado",
copied: "¡Copiado!",
min: "Mínimo",
max: "Máximo",
qty: "Cantidad a sortear",
noRepeat: "Sin repetición",
namesPlaceholder: "Escribe un nombre y presiona Enter",
addName: "Añadir",
clearAll: "Borrar",
namesCount: "participantes añadidos",
namesQty: "Cantidad de ganadores",
errorMaxMin: "El máximo no puede ser menor que el mínimo.",
errorInterval: "La cantidad supera el intervalo disponible.",
errorEmpty: "La lista de nombres está vacía.",
errorNamesQty: "La cantidad solicitada supera el total de nombres.",
errorMax100: "Por seguridad, el límite máximo es de 100 resultados a la vez.",
drawTime: "Sorteo realizado el",
loading: "Sorteando...",
lastWinners: "Últimos Ganadores",
clearHistory: "Borrar Historial",
importBtn: "Importar (Excel, Word, TXT)",
remaining: " (Quedan ",
available: " disponibles)",
drawWord: "Sorteo "
}
};
const I18nContext = createContext();
// --- HOOK DE ÁUDIO ---
const useAudioEffects = (enabled) => {
const audioCtx = useRef(null);
const initAudio = useCallback(() => {
if (!audioCtx.current) {
audioCtx.current = new (window.AudioContext || window.webkitAudioContext)();
}
if (audioCtx.current.state === 'suspended') {
audioCtx.current.resume();
}
}, []);
const playTick = useCallback(() => {
if (!enabled || !audioCtx.current) return;
const ctx = audioCtx.current;
const osc = ctx.createOscillator();
const gain = ctx.createGain();
osc.connect(gain);
gain.connect(ctx.destination);
osc.type = 'triangle';
osc.frequency.setValueAtTime(600, ctx.currentTime);
osc.frequency.exponentialRampToValueAtTime(1200, ctx.currentTime + 0.03);
gain.gain.setValueAtTime(0.05, ctx.currentTime);
gain.gain.exponentialRampToValueAtTime(0.001, ctx.currentTime + 0.03);
osc.start(ctx.currentTime);
osc.stop(ctx.currentTime + 0.03);
}, [enabled]);
const playSuccess = useCallback(() => {
if (!enabled || !audioCtx.current) return;
const ctx = audioCtx.current;
// Acorde Maj7 sintetizado: A4, C#5, E5, G#5
const frequencies = [440, 554.37, 659.25, 830.61];
frequencies.forEach((freq, index) => {
const osc = ctx.createOscillator();
const gain = ctx.createGain();
osc.connect(gain);
gain.connect(ctx.destination);
osc.type = 'sine';
osc.frequency.setValueAtTime(freq, ctx.currentTime);
gain.gain.setValueAtTime(0, ctx.currentTime);
gain.gain.linearRampToValueAtTime(0.1, ctx.currentTime + 0.05 + (index * 0.02));
gain.gain.exponentialRampToValueAtTime(0.001, ctx.currentTime + 1.5 + (index * 0.2));
osc.start(ctx.currentTime);
osc.stop(ctx.currentTime + 2);
});
}, [enabled]);
return { initAudio, playTick, playSuccess };
};
// --- COMPONENTES ---
const Header = ({ soundEnabled, setSoundEnabled }) => {
const { lang, setLang, t } = useContext(I18nContext);
return (
);
};
const TabsContainer = ({ active, onChange }) => {
const { t } = useContext(I18nContext);
return (
);
};
const FormNumbers = ({ pickedNumbers, onProcessDraw }) => {
const { t } = useContext(I18nContext);
const [min, setMin] = useState(1);
const [max, setMax] = useState(100);
const [qty, setQty] = useState(1);
const [noRepeat, setNoRepeat] = useState(true);
const [error, setError] = useState(null);
const handleSubmit = (e) => {
e.preventDefault();
setError(null);
const minVal = parseInt(min), maxVal = parseInt(max), qtyVal = parseInt(qty);
if (isNaN(minVal) || isNaN(maxVal) || isNaN(qtyVal)) return;
if (maxVal < minVal) {
setError(t.errorMaxMin);
return;
}
if (noRepeat) {
const remainingCount = (maxVal - minVal + 1) - pickedNumbers.filter(n => n >= minVal && n <= maxVal).length;
if (qtyVal > remainingCount) {
setError(t.errorInterval + t.remaining + remainingCount + t.available);
return;
}
}
if (qtyVal > 100) {
setError(t.errorMax100);
return;
}
onProcessDraw({ type: 'numbers', params: { min: minVal, max: maxVal, qty: qtyVal, noRepeat } });
};
return (
);
};
const FormNames = ({ namesList, setNamesList, onProcessDraw }) => {
const { t } = useContext(I18nContext);
const [currentName, setCurrentName] = useState("");
const [qty, setQty] = useState(1);
const [error, setError] = useState(null);
const handleAddName = (e) => {
e.preventDefault();
const trimmed = currentName.trim();
if (!trimmed) return;
setNamesList(prev => [...prev, trimmed]);
setCurrentName("");
setError(null);
};
const handleKeyDown = (e) => {
if (e.key === 'Enter') {
e.preventDefault();
handleAddName(e);
}
};
const handleRemoveName = (indexToRemove) => {
setNamesList(prev => prev.filter((_, idx) => idx !== indexToRemove));
};
const handleClearAll = () => setNamesList([]);
const addNamesToState = (lines) => {
if (lines.length === 0) return;
setNamesList(prev => {
const ignoreWords = ['nome', 'name', 'nombre', 'nomes', 'names', 'nombres'];
const validLines = lines.filter(item => !ignoreWords.includes(item.toLowerCase().trim()));
return Array.from(new Set([...prev, ...validLines]));
});
};
const handleFileUpload = (e) => {
const file = e.target.files[0];
if (!file) return;
const fileName = file.name.toLowerCase();
// XLSX / XLS
if (fileName.endsWith('.xlsx') || fileName.endsWith('.xls')) {
const reader = new FileReader();
reader.onload = (event) => {
try {
const data = new Uint8Array(event.target.result);
const workbook = XLSX.read(data, { type: 'array' });
const worksheet = workbook.Sheets[workbook.SheetNames[0]];
const jsonData = XLSX.utils.sheet_to_json(worksheet, { header: 1 });
const lines = jsonData.flat().filter(item => item != null).map(c => String(c).trim()).filter(c => c.length > 0);
addNamesToState(lines);
} catch (err) {
setError("Erro ao ler arquivo Excel.");
console.error(err);
}
e.target.value = null;
};
reader.readAsArrayBuffer(file);
}
// DOCX
else if (fileName.endsWith('.docx')) {
const reader = new FileReader();
reader.onload = (event) => {
mammoth.extractRawText({ arrayBuffer: event.target.result })
.then((result) => {
const lines = result.value.split(/\r?\n/).map(line => line.trim()).filter(line => line.length > 0);
addNamesToState(lines);
e.target.value = null;
})
.catch((err) => {
setError("Erro ao ler DOCX. Salve como .docx moderno (não .doc).");
console.error(err);
e.target.value = null;
});
};
reader.readAsArrayBuffer(file);
}
// TXT / CSV
else {
const reader = new FileReader();
reader.onload = (event) => {
const lines = event.target.result.split(/\r?\n/).map(line => line.trim()).filter(line => line.length > 0);
addNamesToState(lines);
e.target.value = null;
};
reader.readAsText(file);
}
};
const handleSubmit = (e) => {
e.preventDefault();
setError(null);
if (namesList.length === 0) {
setError(t.errorEmpty);
return;
}
const qtyVal = parseInt(qty);
if (isNaN(qtyVal) || qtyVal < 1) return;
if (qtyVal > namesList.length) {
setError(t.errorNamesQty);
return;
}
if (qtyVal > 100) {
setError(t.errorMax100);
return;
}
onProcessDraw({ type: 'names', params: { names: namesList, qty: qtyVal } });
};
return (
);
};
const ResultDisplay = ({ drawData, onReset, playTick, playSuccess }) => {
const { t, lang } = useContext(I18nContext);
const [isAnimating, setIsAnimating] = useState(true);
const [displayItems, setDisplayItems] = useState([]);
const [copied, setCopied] = useState(false);
const { results, type, source } = drawData;
useEffect(() => {
const startTime = Date.now();
const duration = 2500;
let lastTick = 0;
const updateFrame = () => {
const now = Date.now();
const elapsed = now - startTime;
if (elapsed < duration) {
// Throttle updates to ~16fps to reduce CPU and Audio API overhead
if (now - lastTick > 60) {
const randomPicks = [];
for (let i = 0; i < results.length; i++) {
if (type === 'numbers') {
randomPicks.push(Math.floor(Math.random() * (source.max - source.min + 1)) + source.min);
} else {
randomPicks.push(source.names[Math.floor(Math.random() * source.names.length)]);
}
}
setDisplayItems(randomPicks);
playTick();
lastTick = now;
}
requestAnimationFrame(updateFrame);
} else {
setDisplayItems(results);
setIsAnimating(false);
playSuccess();
}
};
requestAnimationFrame(updateFrame);
}, []);
const handleCopy = () => {
navigator.clipboard.writeText(results.join(', '));
setCopied(true);
setTimeout(() => setCopied(false), 2000);
};
return (
{isAnimating ? t.loading : 'Vencedor(es)! 🎉'}
{!isAnimating && (
)}
{displayItems.map((item, idx) => (
{item}
))}
{!isAnimating && (
{t.drawTime} {new Date().toLocaleString(lang === 'pt' ? 'pt-BR' : 'es-ES')}
)}
);
};
// --- APP ---
const App = () => {
const [lang, setLang] = useState(null);
const [activeTab, setActiveTab] = useState('numbers');
const [drawData, setDrawData] = useState(null);
const [soundEnabled, setSoundEnabled] = useState(true);
const [history, setHistory] = useState([]);
const [namesList, setNamesList] = useState([]);
const [pickedNumbers, setPickedNumbers] = useState([]);
const { initAudio, playTick, playSuccess } = useAudioEffects(soundEnabled);
if (!lang) {
return (
LiveShop Turbo
Escolha seu Idioma
Elige tu Idioma
);
}
const t = translations[lang];
const handleProcessDraw = ({ type, params }) => {
initAudio();
let results = [];
let sourceObj = {};
if (type === 'numbers') {
const { min, max, qty, noRepeat } = params;
sourceObj = { min, max };
if (noRepeat) {
// Array.from crashes the browser (OOM) for ranges > 100k — use Set-based sampling instead
if (max - min > 100000) {
const currentPicked = new Set(pickedNumbers);
let safety = 0;
while (results.length < qty && safety < 100000) {
const r = Math.floor(Math.random() * (max - min + 1)) + min;
if (!currentPicked.has(r)) {
currentPicked.add(r);
results.push(r);
}
safety++;
}
setPickedNumbers(Array.from(currentPicked));
} else {
let available = Array.from({ length: max - min + 1 }, (_, i) => min + i).filter(n => !pickedNumbers.includes(n));
const actualQty = Math.min(qty, available.length);
for (let i = 0; i < actualQty; i++) {
const idx = Math.floor(Math.random() * available.length);
results.push(available[idx]);
available.splice(idx, 1);
}
setPickedNumbers(prev => [...prev, ...results]);
}
} else {
for (let i = 0; i < qty; i++) {
results.push(Math.floor(Math.random() * (max - min + 1)) + min);
}
}
} else if (type === 'names') {
const { names, qty } = params;
sourceObj = { names };
let available = [...names];
for (let i = 0; i < qty; i++) {
const idx = Math.floor(Math.random() * available.length);
results.push(available[idx]);
available.splice(idx, 1);
}
setNamesList(available);
}
setDrawData({ type, results, source: sourceObj });
};
const handleReset = () => {
setHistory(prev => [
{ id: Date.now(), date: new Date(), items: drawData.results, type: drawData.type },
...prev
]);
setDrawData(null);
};
return (
{history.filter(h => h.type === activeTab).length > 0 && (
{t.lastWinners}
{history.filter(h => h.type === activeTab).map((record, index, arr) => (
{record.items.map((item, i) => (
{item}
))}
{record.date.toLocaleTimeString(lang === 'pt' ? 'pt-BR' : 'es-ES')}
{t.drawWord}{arr.length - index}
))}
)}
{drawData && (
)}
);
};
// --- RENDER ---
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render();
