File size: 2,468 Bytes
f69fe96
 
 
 
 
 
 
 
 
 
e581869
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
91f79fb
e581869
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
91f79fb
f69fe96
 
 
 
 
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
let tweets = [];

function updateStats() {
    document.getElementById('active-disasters').textContent = 
        tweets.filter(t => t.isDisaster).length;
    document.getElementById('urgent-cases').textContent = 
        tweets.filter(t => t.sentiment === 'Urgent').length;
    document.getElementById('total-tweets').textContent = tweets.length;
}

function getSentimentClass(sentiment) {
    switch(sentiment) {
        case 'Urgent': return 'sentiment-urgent';
        case 'Neutral': return 'sentiment-neutral';
        case 'Not Urgent': return 'sentiment-not-urgent';
        default: return '';
    }
}

function formatTimestamp(timestamp) {
    return new Date(timestamp).toLocaleTimeString();
}

function renderTweets() {
    const feed = document.getElementById('tweet-feed');
    if (tweets.length === 0) {
        feed.innerHTML = '<p>No new tweets available. This may be due to rate limiting or no recent disaster-related tweets.</p>';
    } else {
        feed.innerHTML = tweets.map(tweet => `
            <div class="tweet">
                <div class="tweet-header">
                    <strong>${tweet.isDisaster ? 'Disaster Alert' : 'Tweet'}</strong>
                    <span class="sentiment-badge ${getSentimentClass(tweet.sentiment)}">
                        ${tweet.sentiment.toUpperCase()}
                    </span>
                </div>
                <div class="tweet-content">
                    ${tweet.text}
                </div>
                <div class="tweet-footer">
                    <div class="location">
                        πŸ“ ${tweet.location}
                    </div>
                    <div style="margin-left: auto">
                        ${formatTimestamp(tweet.timestamp)}
                    </div>
                </div>
            </div>
        `).join('');
    }
}

function fetchTweets() {
    fetch('/api/predict')
        .then(response => response.json())
        .then(data => {
            if (data.error) {
                console.error('Error:', data.error);
                return;
            }
            const newTweets = JSON.parse(data.data);
            tweets = [...newTweets, ...tweets].slice(0, 100);  // Keep only the latest 100 tweets
            updateStats();
            renderTweets();
        })
        .catch(error => console.error('Error:', error));
}

// Fetch tweets every 5 minutes (300000 ms)
setInterval(fetchTweets, 300000);

// Initial fetch
fetchTweets();