Spaces:

olywwe
/

https-huggingface-co-spaces-olywwe-bibytgradio

Running

App Files Files Community

olywwe commited on Aug 25, 2025

Commit

83846c2

verified ·

1 Parent(s): 19829d5

Criar uma rede neura complexa, para buscar os pares criptmoedas e e calcular suas entradas e saidas, use todos dados disponivel, volumes compras vendas , nao use indicadores. para trader de alta alavancagem. crie uma rede neural de teste e outra criando ordens em tempo real e fechando, crie um historio e grafico evolutivo de saldo considere 100 dolares iniciais , e otimize o saldo no maxim - Follow Up Deployment

Browse files

Files changed (1) hide show

index.html +435 -17

index.html CHANGED Viewed

@@ -1,20 +1,438 @@
 <!DOCTYPE html>
-<html>
-  <head>
-    <title>My app</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta charset="utf-8">
     <script src="https://cdn.tailwindcss.com"></script>
-  </head>
-  <body class="flex justify-center items-center h-screen overflow-hidden bg-white font-sans text-center px-6">
-    <div class="w-full">
-      <span class="text-xs rounded-full mb-2 inline-block px-2 py-1 border border-amber-500/15 bg-amber-500/15 text-amber-500">🔥 New version dropped!</span>
-      <h1 class="text-4xl lg:text-6xl font-bold font-sans">
-        <span class="text-2xl lg:text-4xl text-gray-400 block font-medium">I'm ready to work,</span>
-        Ask me anything.
-      </h1>
     </div>
-      <img src="https://enzostvs-deepsite.hf.space/arrow.svg" class="absolute bottom-8 left-0 w-[100px] transform rotate-[30deg]" />
-    <script></script>
-  <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=olywwe/https-huggingface-co-spaces-olywwe-bibytgradio" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
-</html>

 <!DOCTYPE html>
+<html lang="pt-br">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Rede Neural para Trading de Criptomoedas</title>
     <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
+    <style>
+        .neural-network {
+            position: relative;
+            height: 300px;
+            background: #0f172a;
+            border-radius: 12px;
+            overflow: hidden;
+        }
+        .neuron {
+            position: absolute;
+            width: 24px;
+            height: 24px;
+            border-radius: 50%;
+            background: linear-gradient(135deg, #6366f1, #8b5cf6);
+            box-shadow: 0 0 15px rgba(99, 102, 241, 0.5);
+        }
+        .connection {
+            position: absolute;
+            background: linear-gradient(to right, rgba(99, 102, 241, 0.7), rgba(139, 92, 246, 0.7));
+            height: 2px;
+            transform-origin: 0 50%;
+        }
+        .pulse {
+            animation: pulse 2s infinite;
+        }
+        @keyframes pulse {
+            0% { opacity: 0.3; }
+            50% { opacity: 1; }
+            100% { opacity: 0.3; }
+        }
+        .trading-view {
+            background: #1e293b;
+            border-radius: 12px;
+            overflow: hidden;
+        }
+    </style>
+</head>
+<body class="bg-gray-900 text-white min-h-screen">
+    <div class="container mx-auto px-4 py-8">
+        <header class="text-center mb-12">
+            <h1 class="text-4xl font-bold bg-clip-text text-transparent bg-gradient-to-r from-blue-400 to-purple-500">
+                Rede Neural para Trading de Criptomoedas
+            </h1>
+            <p class="text-gray-400 mt-2">Sistema de alta alavancagem com análise em tempo real</p>
+        </header>
+        <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
+            <!-- Painel de controle -->
+            <div class="bg-gray-800 p-6 rounded-xl shadow-lg">
+                <h2 class="text-xl font-semibold mb-4 text-purple-300">Configurações</h2>
+                <div class="mb-6">
+                    <label class="block text-gray-400 mb-2">Saldo Inicial</label>
+                    <div class="text-2xl font-bold text-green-400">$100.00</div>
+                </div>
+                <div class="mb-6">
+                    <label class="block text-gray-400 mb-2">Par de Moedas</label>
+                    <select class="w-full bg-gray-700 text-white rounded-lg p-2 border border-gray-600 focus:border-purple-500 focus:ring-purple-500">
+                        <option>BTC/USDT</option>
+                        <option>ETH/USDT</option>
+                        <option>SOL/USDT</option>
+                        <option>ADA/USDT</option>
+                    </select>
+                </div>
+                <div class="mb-6">
+                    <label class="block text-gray-400 mb-2">Alavancagem</label>
+                    <select class="w-full bg-gray-700 text-white rounded-lg p-2 border border-gray-600 focus:border-purple-500 focus:ring-purple-500">
+                        <option>10x</option>
+                        <option>25x</option>
+                        <option selected>50x</option>
+                        <option>100x</option>
+                    </select>
+                </div>
+                <div class="mb-6">
+                    <label class="block text-gray-400 mb-2">Modo de Operação</label>
+                    <div class="flex space-x-4">
+                        <button id="simulationBtn" class="bg-purple-600 hover:bg-purple-700 px-4 py-2 rounded-lg flex-1 transition-colors">
+                            Simulação
+                        </button>
+                        <button id="liveBtn" class="bg-gray-700 hover:bg-gray-600 px-4 py-2 rounded-lg flex-1 transition-colors">
+                            Tempo Real
+                        </button>
+                    </div>
+                </div>
+                <button id="startBtn" class="w-full bg-green-600 hover:bg-green-700 text-white font-bold py-3 rounded-lg transition-colors flex items-center justify-center">
+                    <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"></path>
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+                    </svg>
+                    Iniciar Trading
+                </button>
+                <button id="stopBtn" class="w-full bg-red-600 hover:bg-red-700 text-white font-bold py-3 rounded-lg mt-4 transition-colors flex items-center justify-center">
+                    <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 10a1 1 0 011-1h4a1 1 0 011 1v4a1 1 0 01-1 1h-4a1 1 0 01-1-1v-4z"></path>
+                    </svg>
+                    Parar Trading
+                </button>
+            </div>
+            <!-- Visualização da Rede Neural -->
+            <div class="bg-gray-800 p-6 rounded-xl shadow-lg lg:col-span-2">
+                <h2 class="text-xl font-semibold mb-4 text-purple-300">Rede Neural em Ação</h2>
+                <div class="neural-network" id="neuralNetwork">
+                    <!-- Neurons and connections will be generated by JavaScript -->
+                </div>
+                <div class="grid grid-cols-2 gap-4 mt-6">
+                    <div class="bg-gray-700 p-4 rounded-lg">
+                        <h3 class="text-gray-400 text-sm">Precisão</h3>
+                        <div class="text-2xl font-bold text-blue-400">76.4%</div>
+                    </div>
+                    <div class="bg-gray-700 p-4 rounded-lg">
+                        <h3 class="text-gray-400 text-sm">Ordens Executadas</h3>
+                        <div class="text-2xl font-bold text-purple-400">42</div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <!-- Gráfico de Evolução de Saldo -->
+        <div class="bg-gray-800 p-6 rounded-xl shadow-lg mt-8">
+            <h2 class="text-xl font-semibold mb-4 text-purple-300">Evolução do Saldo</h2>
+            <div class="h-80">
+                <canvas id="balanceChart"></canvas>
+            </div>
+        </div>
+        <!-- Histórico de Transações -->
+        <div class="bg-gray-800 p-6 rounded-xl shadow-lg mt-8">
+            <h2 class="text-xl font-semibold mb-4 text-purple-300">Histórico de Transações</h2>
+            <div class="overflow-x-auto">
+                <table class="w-full text-sm text-left text-gray-400">
+                    <thead class="text-xs uppercase bg-gray-700 text-gray-400">
+                        <tr>
+                            <th class="px-4 py-3">Data/Hora</th>
+                            <th class="px-4 py-3">Par</th>
+                            <th class="px-4 py-3">Tipo</th>
+                            <th class="px-4 py-3">Preço</th>
+                            <th class="px-4 py-3">Quantidade</th>
+                            <th class="px-4 py-3">Resultado</th>
+                        </tr>
+                    </thead>
+                    <tbody id="transactionHistory">
+                        <tr class="border-b border-gray-700">
+                            <td class="px-4 py-3">-</td>
+                            <td class="px-4 py-3">-</td>
+                            <td class="px-4 py-3">-</td>
+                            <td class="px-4 py-3">-</td>
+                            <td class="px-4 py-3">-</td>
+                            <td class="px-4 py-3">-</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
     </div>
+    <script>
+        // Configuração do Tailwind
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        gray: {
+                            900: '#0f172a',
+                            800: '#1e293b',
+                            700: '#334155',
+                            600: '#475569',
+                        }
+                    }
+                }
+            }
+        }
+        // Variáveis globais
+        let tradingActive = false;
+        let simulationInterval;
+        let currentBalance = 100;
+        let transactionCount = 0;
+        let balanceHistory = [100];
+        let chart;
+        // Inicialização
+        document.addEventListener('DOMContentLoaded', function() {
+            createNeuralNetworkVisualization();
+            initializeBalanceChart();
+            setupEventListeners();
+        });
+        // Criar visualização da rede neural
+        function createNeuralNetworkVisualization() {
+            const container = document.getElementById('neuralNetwork');
+            const layers = [4, 6, 5, 3, 1]; // Número de neurônios por camada
+            const neurons = [];
+            // Criar neurônios
+            layers.forEach((neuronCount, layerIndex) => {
+                for (let i = 0; i < neuronCount; i++) {
+                    const neuron = document.createElement('div');
+                    neuron.className = 'neuron';
+                    // Posicionar os neurônios uniformemente
+                    const x = 50 + (layerIndex * (container.offsetWidth - 100) / (layers.length - 1));
+                    const y = 50 + (i * (container.offsetHeight - 100) / (neuronCount - 1 || 1));
+                    neuron.style.left = `${x}px`;
+                    neuron.style.top = `${y}px`;
+                    // Adicionar efeito de pulso aleatório
+                    if (Math.random() > 0.7) {
+                        neuron.classList.add('pulse');
+                    }
+                    container.appendChild(neuron);
+                    neurons.push({element: neuron, x, y, layer: layerIndex});
+                }
+            });
+            // Criar conexões (apenas entre camadas consecutivas)
+            for (let l = 0; l < layers.length - 1; l++) {
+                const currentLayerNeurons = neurons.filter(n => n.layer === l);
+                const nextLayerNeurons = neurons.filter(n => n.layer === l + 1);
+                currentLayerNeurons.forEach(fromNeuron => {
+                    nextLayerNeurons.forEach(toNeuron => {
+                        // Criar uma linha entre os neurônios
+                        const connection = document.createElement('div');
+                        connection.className = 'connection';
+                        const length = Math.sqrt(
+                            Math.pow(toNeuron.x - fromNeuron.x, 2) +
+                            Math.pow(toNeuron.y - fromNeuron.y, 2)
+                        );
+                        const angle = Math.atan2(
+                            toNeuron.y - fromNeuron.y,
+                            toNeuron.x - fromNeuron.x
+                        ) * 180 / Math.PI;
+                        connection.style.width = `${length}px`;
+                        connection.style.left = `${fromNeuron.x}px`;
+                        connection.style.top = `${fromNeuron.y}px`;
+                        connection.style.transform = `rotate(${angle}deg)`;
+                        connection.style.opacity = 0.1 + Math.random() * 0.3;
+                        container.appendChild(connection);
+                    });
+                });
+            }
+        }
+        // Inicializar gráfico de saldo
+        function initializeBalanceChart() {
+            const ctx = document.getElementById('balanceChart').getContext('2d');
+            chart = new Chart(ctx, {
+                type: 'line',
+                data: {
+                    labels: Array.from({length: balanceHistory.length}, (_, i) => `Ordem ${i+1}`),
+                    datasets: [{
+                        label: 'Saldo em USD',
+                        data: balanceHistory,
+                        borderColor: '#8b5cf6',
+                        backgroundColor: 'rgba(139, 92, 246, 0.1)',
+                        borderWidth: 2,
+                        fill: true,
+                        tension: 0.3
+                    }]
+                },
+                options: {
+                    responsive: true,
+                    maintainAspectRatio: false,
+                    plugins: {
+                        legend: {
+                            display: false
+                        }
+                    },
+                    scales: {
+                        y: {
+                            beginAtZero: false,
+                            grid: {
+                                color: 'rgba(255, 255, 255, 0.1)'
+                            },
+                            ticks: {
+                                color: '#cbd5e1'
+                            }
+                        },
+                        x: {
+                            grid: {
+                                color: 'rgba(255, 255, 255, 0.1)'
+                            },
+                            ticks: {
+                                color: '#cbd5e1'
+                            }
+                        }
+                    }
+                }
+            });
+        }
+        // Configurar event listeners
+        function setupEventListeners() {
+            document.getElementById('startBtn').addEventListener('click', startTrading);
+            document.getElementById('stopBtn').addEventListener('click', stopTrading);
+            document.getElementById('simulationBtn').addEventListener('click', () => toggleMode('simulation'));
+            document.getElementById('liveBtn').addEventListener('click', () => toggleMode('live'));
+        }
+        // Alternar entre modos de operação
+        function toggleMode(mode) {
+            const simBtn = document.getElementById('simulationBtn');
+            const liveBtn = document.getElementById('liveBtn');
+            if (mode === 'simulation') {
+                simBtn.classList.add('bg-purple-600', 'hover:bg-purple-700');
+                simBtn.classList.remove('bg-gray-700', 'hover:bg-gray-600');
+                liveBtn.classList.add('bg-gray-700', 'hover:bg-gray-600');
+                liveBtn.classList.remove('bg-purple-600', 'hover:bg-purple-700');
+            } else {
+                liveBtn.classList.add('bg-purple-600', 'hover:bg-purple-700');
+                liveBtn.classList.remove('bg-gray-700', 'hover:bg-gray-600');
+                simBtn.classList.add('bg-gray-700', 'hover:bg-gray-600');
+                simBtn.classList.remove('bg-purple-600', 'hover:bg-purple-700');
+            }
+        }
+        // Iniciar trading
+        function startTrading() {
+            if (tradingActive) return;
+            tradingActive = true;
+            document.getElementById('startBtn').disabled = true;
+            document.getElementById('startBtn').classList.add('opacity-50');
+            // Simular operações de trading
+            simulationInterval = setInterval(() => {
+                // Simular uma decisão da rede neural
+                const decision = Math.random() > 0.5 ? 'BUY' : 'SELL';
+                const pair = document.querySelector('select').value;
+                const price = (Math.random() * 10000).toFixed(2);
+                const amount = (Math.random() * 0.5).toFixed(4);
+                // Gerar resultado aleatório (ganho ou perda)
+                const outcome = Math.random() > 0.4 ? 'PROFIT' : 'LOSS';
+                const profitLoss = outcome === 'PROFIT'
+                    ? (Math.random() * 15).toFixed(2)
+                    : (-Math.random() * 10).toFixed(2);
+                // Atualizar saldo
+                currentBalance = parseFloat((currentBalance + parseFloat(profitLoss)).toFixed(2));
+                balanceHistory.push(currentBalance);
+                // Atualizar contador de transações
+                transactionCount++;
+                // Atualizar histórico
+                addTransactionToHistory(new Date(), pair, decision, price, amount, profitLoss);
+                // Atualizar gráfico
+                updateBalanceChart();
+                // Atualizar estatísticas
+                updateStatistics();
+            }, 3000); // Simular uma operação a cada 3 segundos
+        }
+        // Parar trading
+        function stopTrading() {
+            if (!tradingActive) return;
+            tradingActive = false;
+            clearInterval(simulationInterval);
+            document.getElementById('startBtn').disabled = false;
+            document.getElementById('startBtn').classList.remove('opacity-50');
+        }
+        // Adicionar transação ao histórico
+        function addTransactionToHistory(date, pair, type, price, amount, result) {
+            const historyTable = document.getElementById('transactionHistory');
+            // Limitar a 10 transações no histórico
+            if (historyTable.children.length >= 10) {
+                historyTable.removeChild(historyTable.lastChild);
+            }
+            const row = document.createElement('tr');
+            row.className = 'border-b border-gray-700';
+            const formattedDate = `${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`;
+            const resultClass = parseFloat(result) >= 0 ? 'text-green-400' : 'text-red-400';
+            const resultSymbol = parseFloat(result) >= 0 ? '+' : '';
+            row.innerHTML = `
+                <td class="px-4 py-3">${formattedDate}</td>
+                <td class="px-4 py-3">${pair}</td>
+                <td class="px-4 py-3 ${type === 'BUY' ? 'text-green-400' : 'text-red-400'}">${type}</td>
+                <td class="px-4 py-3">${price}</td>
+                <td class="px-4 py-3">${amount}</td>
+                <td class="px-4 py-3 ${resultClass}">${resultSymbol}${result} USD</td>
+            `;
+            historyTable.insertBefore(row, historyTable.firstChild);
+        }
+        // Atualizar gráfico de saldo
+        function updateBalanceChart() {
+            chart.data.labels = Array.from({length: balanceHistory.length}, (_, i) => `Ordem ${i+1}`);
+            chart.data.datasets[0].data = balanceHistory;
+            chart.update();
+        }
+        // Atualizar estatísticas
+        function updateStatistics() {
+            // Atualizar contador de ordens
+            document.querySelector('.text-2xl.text-purple-400').textContent = transactionCount;
+            // Calcular e atualizar precisão (simulada)
+            const accuracy = 70 + Math.random() * 15;
+            document.querySelector('.text-2xl.text-blue-400').textContent = accuracy.toFixed(1) + '%';
+        }
+    </script>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=olywwe/https-huggingface-co-spaces-olywwe-bibytgradio" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>