<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Anonymous Twitter</title>
</head>
<body>
<div>
<h2>Post a Tweet</h2>
<textarea id="tweetInput" rows="4" cols="50"></textarea>
<br>
<button onclick="postTweet()">Post</button>
</div>
<div>
<h2>Tweets</h2>
<ul id="tweetList"></ul>
</div>
<script>
const username = 'Dangrainage';
const repo = 'Urban';
const token = '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';
// GitHub API endpoint
const githubApiUrl = `https://api.github.com/repos/${username}/${repo}/contents/`;
// Fetch tweets from the GitHub repository
function fetchTweets() {
fetch(githubApiUrl)
.then(response => response.json())
.then(files => {
const tweetFiles = files.filter(file => file.name.endsWith('.json'));
// Display tweets
displayTweets(tweetFiles);
})
.catch(error => console.error('Error fetching tweets:', error));
}
// Display tweets on the page
function displayTweets(tweetFiles) {
const tweetList = document.getElementById('tweetList');
tweetList.innerHTML = '';
tweetFiles.forEach(file => {
const listItem = document.createElement('li');
// Fetch and display tweet content
fetch(`${githubApiUrl}${file.name}`)
.then(response => response.json())
.then(tweet => {
const tweetText = JSON.parse(atob(tweet.content)).text;
// Create a paragraph for each tweet
const paragraph = document.createElement('p');
paragraph.textContent = tweetText;
listItem.appendChild(paragraph);
})
.catch(error => console.error('Error fetching tweet content:', error));
tweetList.appendChild(listItem);
});
}
// Post a new tweet
function postTweet() {
const tweetInput = document.getElementById('tweetInput');
const tweetText = tweetInput.value;
if (tweetText.trim() !== '') {
const fileName = `tweet_${Date.now()}.json`;
const fileContent = JSON.stringify({ text: tweetText }, null, 2);
// Create a new tweet file
createFile(fileName, fileContent);
// Clear the input field
tweetInput.value = '';
}
}
// Create a new file in the GitHub repository
function createFile(fileName, fileContent) {
const apiUrl = `${githubApiUrl}${fileName}`;
const data = {
message: `Add tweet: ${fileName}`,
content: btoa(fileContent),
branch: 'main'
};
fetch(apiUrl, {
method: 'PUT',
headers: {
'Authorization': `token ${token}`,
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
})
.then(response => response.json())
.then(() => {
// Fetch and display the updated tweets
fetchTweets();
})
.catch(error => console.error('Error creating file:', error));
}
// Fetch and display tweets when the page loads
fetchTweets();
</script>
</body>
</html>