Hugging Face's logo

Spaces:
mgbam
/
CryptoSentinel_AI
Running

App Files Community
mgbam commited on
Commit
dc458f1
·
verified ·
1 Parent(s): 3271a8d

Update templates/index.html

Browse files
Files changed (1) hide show
  1. templates/index.html +18 -7
templates/index.html CHANGED
@@ -26,11 +26,13 @@
26
  .impact-low { border-left-color: #38BDF8; }
27
  .impact-medium { border-left-color: #FBBF24; }
28
  .impact-high { border-left-color: #F87171; }
 
29
  .sentiment-positive { color: #34D399; }
30
  .sentiment-negative { color: #F87171; }
31
  .sentiment-neutral { color: #9CA3AF; }
32
  .status { text-align: right; }
33
  .status-online { color: #34D399; font-weight: bold; }
 
34
  </style>
35
  </head>
36
  <body hx-ext="sse">
@@ -49,21 +51,30 @@
49
  <div><strong>Signal Stream</strong></div>
50
  <div class="status" id="signal-status">Status: CONNECTING... (Last Signal: <span id="last-signal-time">never</span>)</div>
51
  </header>
52
- <div class="signal-stream-container" sse-connect="/api/signals/stream" hx-swap="afterbegin">
53
  <!-- New signals will appear here -->
54
  </div>
55
  </article>
56
  </main>
57
 
 
58
  <script>
59
  document.body.addEventListener('htmx:sseOpen', function(evt) {
60
- document.querySelector('#signal-status .status-text')?.remove();
61
  const statusDiv = document.getElementById('signal-status');
62
- if (statusDiv.querySelector('.status-online')) return; // Already online
63
- const onlineSpan = document.createElement('span');
64
- onlineSpan.className = 'status-online';
65
- onlineSpan.textContent = 'ONLINE';
66
- statusDiv.prepend(onlineSpan, 'Status: ');
 
 
 
 
 
 
 
 
 
67
  });
68
  </script>
69
  </body>
 
26
  .impact-low { border-left-color: #38BDF8; }
27
  .impact-medium { border-left-color: #FBBF24; }
28
  .impact-high { border-left-color: #F87171; }
29
+ .impact-error { border-left-color: #4B5563; }
30
  .sentiment-positive { color: #34D399; }
31
  .sentiment-negative { color: #F87171; }
32
  .sentiment-neutral { color: #9CA3AF; }
33
  .status { text-align: right; }
34
  .status-online { color: #34D399; font-weight: bold; }
35
+ .status-offline { color: #F87171; font-weight: bold; }
36
  </style>
37
  </head>
38
  <body hx-ext="sse">
 
51
  <div><strong>Signal Stream</strong></div>
52
  <div class="status" id="signal-status">Status: CONNECTING... (Last Signal: <span id="last-signal-time">never</span>)</div>
53
  </header>
54
+ <div class="signal-stream-container" sse-connect="/api/signals/stream" hx-swap="afterbegin" id="signal-container">
55
  <!-- New signals will appear here -->
56
  </div>
57
  </article>
58
  </main>
59
 
60
+ <!-- This small script provides better user feedback for the connection status -->
61
  <script>
62
  document.body.addEventListener('htmx:sseOpen', function(evt) {
 
63
  const statusDiv = document.getElementById('signal-status');
64
+ const timeDiv = document.getElementById('last-signal-time');
65
+ if (statusDiv) {
66
+ // Clear the previous content and set the new ONLINE status.
67
+ statusDiv.innerHTML = 'Status: <span class="status-online">ONLINE</span> (Last Signal: <span id="last-signal-time">' + timeDiv.innerHTML + '</span>)';
68
+ }
69
+ });
70
+
71
+ document.body.addEventListener('htmx:sseError', function(evt) {
72
+ const statusDiv = document.getElementById('signal-status');
73
+ const timeDiv = document.getElementById('last-signal-time');
74
+ if (statusDiv) {
75
+ // Let the user know if the connection fails.
76
+ statusDiv.innerHTML = 'Status: <span class="status-offline">OFFLINE - Retrying...</span> (Last Signal: <span id="last-signal-time">' + timeDiv.innerHTML + '</span>)';
77
+ }
78
  });
79
  </script>
80
  </body>