-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
e8cc389
commit 33c0851
Showing
3 changed files
with
104 additions
and
97 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,75 +1,84 @@ | ||
// Your Firebase configuration | ||
// Firebase Configuration (restricted key) | ||
const firebaseConfig = { | ||
apiKey: "your-public-api-key", | ||
authDomain: "your-project.firebaseapp.com", | ||
projectId: "your-project-id", | ||
storageBucket: "your-project.appspot.com", | ||
messagingSenderId: "your-messaging-sender-id", | ||
appId: "your-app-id", | ||
measurementId: "your-measurement-id" | ||
apiKey: "AIzaSyAcyNJq5x-HRsaBewFcfe0cix96fEgDcfY", | ||
authDomain: "goanonymous-8126e.firebaseapp.com", | ||
projectId: "goanonymous-8126e", | ||
storageBucket: "goanonymous-8126e.appspot.com", | ||
messagingSenderId: "334767869045", | ||
appId: "1:334767869045:web:cb64e9d39c577df87fbc3c", | ||
measurementId: "G-WLEFD6NJF2" | ||
}; | ||
|
||
// Initialize Firebase | ||
import { initializeApp } from "firebase/app"; | ||
import { getAnalytics } from "firebase/analytics"; | ||
import { getFirestore, collection, addDoc, onSnapshot, orderBy, query, doc, getDoc, updateDoc } from "firebase/firestore"; | ||
firebase.initializeApp(firebaseConfig); | ||
const db = firebase.firestore(); | ||
|
||
const app = initializeApp(firebaseConfig); | ||
const analytics = getAnalytics(app); | ||
const db = getFirestore(app); | ||
|
||
const messagesContainer = document.getElementById('messagesContainer'); | ||
// DOM Elements | ||
const messageForm = document.getElementById('messageForm'); | ||
const messageInput = document.getElementById('messageInput'); | ||
const messagesContainer = document.getElementById('messagesContainer'); | ||
const toggleSort = document.getElementById('toggleSort'); | ||
const toggleLabel = document.getElementById('toggleLabel'); | ||
|
||
let sortByLatest = true; | ||
let sortByLatest = true; // Default sorting by latest | ||
|
||
// Add a new message | ||
messageForm.addEventListener('submit', async (e) => { | ||
e.preventDefault(); | ||
|
||
const messageText = messageInput.value; | ||
if (messageText) { | ||
await addDoc(collection(db, 'messages'), { | ||
text: messageText, | ||
upvotes: 0, | ||
timestamp: new Date() | ||
}); | ||
messageInput.value = ''; | ||
} | ||
}); | ||
if (messageText.trim() === '') return; | ||
|
||
const fetchMessages = async () => { | ||
const q = query(collection(db, 'messages'), orderBy(sortByLatest ? 'timestamp' : 'upvotes', sortByLatest ? 'desc' : 'desc')); | ||
onSnapshot(q, (snapshot) => { | ||
messagesContainer.innerHTML = ''; | ||
snapshot.forEach(doc => { | ||
const data = doc.data(); | ||
const messageDiv = document.createElement('div'); | ||
messageDiv.classList.add('message'); | ||
messageDiv.innerHTML = ` | ||
<p>${data.text}</p> | ||
<button class="upvote" data-id="${doc.id}">Upvote (${data.upvotes})</button> | ||
`; | ||
messagesContainer.appendChild(messageDiv); | ||
}); | ||
// Add message to Firestore | ||
await db.collection('messages').add({ | ||
text: messageText, | ||
upvotes: 0, | ||
timestamp: firebase.firestore.FieldValue.serverTimestamp() | ||
}); | ||
}; | ||
|
||
fetchMessages(); | ||
|
||
messagesContainer.addEventListener('click', async (e) => { | ||
if (e.target.classList.contains('upvote')) { | ||
const id = e.target.getAttribute('data-id'); | ||
const messageRef = doc(db, 'messages', id); | ||
const docSnap = await getDoc(messageRef); | ||
const newUpvotes = docSnap.data().upvotes + 1; | ||
await updateDoc(messageRef, { upvotes: newUpvotes }); | ||
} | ||
messageInput.value = ''; | ||
fetchMessages(); // Refresh messages | ||
}); | ||
|
||
// Toggle between Latest and Most Upvoted | ||
toggleSort.addEventListener('change', () => { | ||
sortByLatest = !sortByLatest; | ||
toggleLabel.textContent = `Sort by: ${sortByLatest ? 'Latest' : 'Most Upvoted'}`; | ||
fetchMessages(); | ||
}); | ||
|
||
// Fetch and display messages | ||
async function fetchMessages() { | ||
let query = db.collection('messages'); | ||
if (sortByLatest) { | ||
query = query.orderBy('timestamp', 'desc'); | ||
} else { | ||
query = query.orderBy('upvotes', 'desc'); | ||
} | ||
|
||
const snapshot = await query.get(); | ||
messagesContainer.innerHTML = ''; // Clear previous messages | ||
|
||
snapshot.forEach(doc => { | ||
const message = doc.data(); | ||
const messageElement = document.createElement('div'); | ||
messageElement.classList.add('message'); | ||
messageElement.innerHTML = ` | ||
<p>${message.text}</p> | ||
<button class="upvote-btn" data-id="${doc.id}">Upvote (${message.upvotes})</button> | ||
`; | ||
messagesContainer.appendChild(messageElement); | ||
}); | ||
|
||
// Attach upvote event listeners | ||
document.querySelectorAll('.upvote-btn').forEach(btn => { | ||
btn.addEventListener('click', async (e) => { | ||
const id = e.target.getAttribute('data-id'); | ||
const messageRef = db.collection('messages').doc(id); | ||
const message = await messageRef.get(); | ||
const newUpvotes = (message.data().upvotes || 0) + 1; | ||
await messageRef.update({ upvotes: newUpvotes }); | ||
fetchMessages(); // Refresh after upvoting | ||
}); | ||
}); | ||
} | ||
|
||
// Initial fetch | ||
fetchMessages(); |