secure-trader/index.html at main · hackermankag/secure-trader · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <title>The Structured Trader</title>
  <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-50 min-h-screen font-sans">
  <div class="max-w-md mx-auto p-4 bg-white rounded-lg shadow mt-8">
    <h1 class="text-2xl font-bold text-gray-800 mb-3">The Structured Trader</h1>
    <form id="config-form" class="space-y-3 mb-6">
      <div>
        <label class="block text-gray-600 mb-1">Short MA Period:</label>
        <input type="number" min="1" id="short-ma" class="w-full p-2 border rounded" value="7" required>
      </div>
      <div>
        <label class="block text-gray-600 mb-1">Long MA Period:</label>
        <input type="number" min="1" id="long-ma" class="w-full p-2 border rounded" value="21" required>
      </div>
      <div>
        <label class="block text-gray-600 mb-1">Time Frame:</label>
        <select id="time-frame" class="w-full p-2 border rounded">
          <option value="4h">4h</option>
          <option value="1d">1D</option>
        </select>
      </div>
      <div>
        <label class="block text-gray-600 mb-1">Volume MA Period:</label>
        <input type="number" min="1" id="vol-ma" class="w-full p-2 border rounded" value="20">
      </div>
      <div>
        <label class="block text-gray-600 mb-1">Market Macro Phase:</label>
        <select id="macro-phase" class="w-full p-2 border rounded">
          <option value="bull">Bullish/Accumulation</option>
          <option value="bear">Bearish/FUD</option>
          <option value="neutral">Neutral</option>
        </select>
      </div>
      <div>
        <label class="block text-gray-600 mb-1">Asset:</label>
        <select id="asset" class="w-full p-2 border rounded">
          <option value="BTCUSDT">BTC/USDT</option>
          <option value="ETHUSDT">ETH/USDT</option>
          <option value="SOLUSDT">SOL/USDT</option>
          <option value="BNBUSDT">BNB/USDT</option>
        </select>
      </div>
      <button class="bg-blue-600 text-white rounded px-4 py-2 mt-2 w-full" type="submit">
        Save & Update
      </button>
    </form>
    <div id="signal-alert" class="p-4 rounded mb-3 text-center font-bold hidden"></div>
    <div id="current-state" class="bg-gray-100 p-3 rounded text-gray-800">
      <!-- Signal & parameters rendered here -->
    </div>
  </div>
  <script src="./main.js"></script>
</body>
</html>