Hugging Face's logo

Spaces:
Really-amin
/
Datasourceforcryptocurrency
Paused

App Files Community
Datasourceforcryptocurrency
File size: 4,166 Bytes 
b190b45
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
 
/**

 * Fear & Greed Index Fix for Dashboard

 * Add this to fix the loading issue

 */

export async function loadFearGreedIndex() {
  try {
    console.log('[Fear & Greed] Loading index...');
    
    // Try primary API
    let response = await fetch('https://api.alternative.me/fng/?limit=1');
    
    if (!response.ok) {
      console.warn('[Fear & Greed] Primary API failed, trying fallback...');
      // Try our backend API
      response = await fetch('/api/sentiment/global');
    }
    
    if (!response.ok) {
      throw new Error('All APIs failed');
    }
    
    const data = await response.json();
    
    // Parse response
    let value = 50;
    let timestamp = new Date().toISOString();
    
    if (data.data && data.data[0]) {
      // Alternative.me format
      value = parseInt(data.data[0].value);
      timestamp = data.data[0].timestamp;
    } else if (data.fear_greed_index) {
      // Our backend format
      value = data.fear_greed_index;
    }
    
    console.log('[Fear & Greed] Loaded value:', value);
    
    // Render the gauge
    renderFearGreedGauge(value);
    
    // Update text elements
    updateFearGreedText(value, timestamp);
    
    return { value, timestamp };
  } catch (error) {
    console.error('[Fear & Greed] Load error:', error);
    
    // Use fallback value
    const fallbackValue = 50;
    renderFearGreedGauge(fallbackValue);
    updateFearGreedText(fallbackValue, new Date().toISOString());
    
    return { value: fallbackValue, timestamp: new Date().toISOString() };
  }
}

function renderFearGreedGauge(value) {
  const gauge = document.getElementById('sentiment-gauge');
  if (!gauge) {
    console.warn('[Fear & Greed] Gauge element not found');
    return;
  }

  let label = 'Neutral', color = '#eab308';
  if (value < 25) { label = 'Extreme Fear'; color = '#ef4444'; }
  else if (value < 45) { label = 'Fear'; color = '#f97316'; }
  else if (value < 55) { label = 'Neutral'; color = '#eab308'; }
  else if (value < 75) { label = 'Greed'; color = '#22c55e'; }
  else { label = 'Extreme Greed'; color = '#10b981'; }

  gauge.innerHTML = `

    <div class="gauge-container">

      <div class="gauge-bar">

        <div class="gauge-fill" style="width: ${value}%; background: ${color}; transition: width 0.5s ease;"></div>

        <div class="gauge-indicator" style="left: ${value}%; transition: left 0.5s ease;">

          <span class="gauge-value">${value}</span>

        </div>

      </div>

      <div class="gauge-labels">

        <span style="color: #ef4444;">Extreme Fear</span>

        <span style="color: #eab308;">Neutral</span>

        <span style="color: #10b981;">Extreme Greed</span>

      </div>

      <div class="gauge-result" style="color: ${color}; font-size: 1.25rem; font-weight: 700; margin-top: 1rem;">

        ${label}

      </div>

    </div>

  `;
}

function updateFearGreedText(value, timestamp) {
  // Update value display
  const valueEl = document.getElementById('fng-value');
  if (valueEl) {
    valueEl.textContent = value;
    valueEl.style.fontSize = '2rem';
    valueEl.style.fontWeight = '700';
  }
  
  // Update sentiment text
  const sentimentEl = document.getElementById('fng-sentiment');
  if (sentimentEl) {
    let label = 'Neutral';
    if (value < 25) label = 'Extreme Fear';
    else if (value < 45) label = 'Fear';
    else if (value < 55) label = 'Neutral';
    else if (value < 75) label = 'Greed';
    else label = 'Extreme Greed';
    
    sentimentEl.textContent = label;
  }
  
  // Update timestamp
  const timeEl = document.getElementById('fng-timestamp');
  if (timeEl) {
    const date = new Date(timestamp);
    timeEl.textContent = `Updated: ${date.toLocaleTimeString()}`;
  }
}

// Auto-refresh every 5 minutes
export function startFearGreedAutoRefresh() {
  loadFearGreedIndex();
  setInterval(() => {
    loadFearGreedIndex();
  }, 5 * 60 * 1000); // 5 minutes
}

// Export for use in dashboard
window.loadFearGreedIndex = loadFearGreedIndex;
window.startFearGreedAutoRefresh = startFearGreedAutoRefresh;