-
Who's Online (See full list)
-
Posts
-
By ImAlreadyForsaken · Posted
Was this a bug or is this just torture trying to understand this all … -
By ImAlreadyForsaken · Posted
On the link, if you go to just https://sloth-academy.webflow.io/, you will stumble upon this: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>Sloth Chat Room - Live Multi-User Chat</title> <style> @import url('https://fonts.googleapis.com/css2?family=Coming+Soon&family=Indie+Flower&display=swap'); body { margin: 0; padding: 0; font-family: 'Coming Soon', cursive, 'Indie Flower', cursive, serif; background: linear-gradient(135deg, #2f422f, #466146); color: #d0e6c2; display: flex; flex-direction: column; height: 100vh; } header { background: #4a6b4a; padding: 10px 20px; display: flex; align-items: center; gap: 15px; color: #b8e0a1; box-shadow: inset 0 -3px 8px rgba(0,0,0,0.6); } header img { height: 50px; width: auto; } header h1 { font-size: 1.8rem; margin: 0; } #user-section { margin-left: auto; display: flex; align-items: center; gap: 15px; } #user-section button, #user-section span { background: #3a553a88; border: none; border-radius: 8px; padding: 5px 12px; color: #b8e0a1; cursor: pointer; font-weight: 600; } #user-section button:hover { background: #5a7a5aaa; } main { flex: 1; display: flex; flex-direction: column; padding: 15px; max-width: 900px; margin: 0 auto; } #chat-window { flex: 1; background: #3a553a; border-radius: 14px; padding: 15px; overflow-y: auto; box-shadow: inset 4px 4px 12px #2a3a2a, inset -4px -4px 12px #4a6b4a; } .chat-message { margin-bottom: 12px; padding: 6px 10px; background: #4a6b4a88; border-radius: 12px; max-width: 75%; word-wrap: break-word; } .chat-message.self { background: #5f8a44cc; margin-left: auto; color: #e9f7c0; } .chat-username { font-weight: 700; margin-bottom: 2px; color: #cde5b9; } #chat-input-container { margin-top: 10px; display: flex; gap: 10px; } #chat-input { flex: 1; padding: 10px; font-size: 1rem; border: none; border-radius: 12px; background: #3a553a; color: #d0e6c2; } #chat-input::placeholder { color: #a4b287; } #chat-input:focus { outline: 2px solid #3a6b3a; } #send-btn { background: #4a6b4a; border: none; border-radius: 12px; color: #e9f7c0; font-weight: 700; cursor: pointer; padding: 0 18px; transition: background-color 0.25s ease; } #send-btn:hover { background: #5f8a44; } /* User forms modal */ #modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.7); display: none; justify-content: center; align-items: center; z-index: 2000; } #modal { background: #3a553a; border-radius: 14px; padding: 20px 30px; max-width: 400px; width: 90%; box-shadow: 0 0 25px #5a855aee; } #modal h2 { margin-bottom: 15px; color: #b8e0a1; } #modal form { display: flex; flex-direction: column; gap: 12px; } #modal label { font-weight: 600; font-size: 1rem; color: #a4c07f; } #modal input[type="text"], #modal input[type="password"], #modal input[type="email"] { padding: 8px 10px; font-size: 1rem; border: 2px solid #4a6b4a; border-radius: 8px; background: #2f452f; color: #d0e6c2; } #modal input::placeholder { color: #a4b287; } #modal button { margin-top: 10px; background: #4a6b4a; border: none; padding: 10px 0; font-weight: 700; border-radius: 12px; color: #e9f7c0; cursor: pointer; transition: background-color 0.25s ease; } #modal button:hover { background: #5f8a44; } #modal .close-btn { background: transparent; border: none; color: #d0e6c2; font-size: 1.2rem; position: absolute; top: 12px; right: 18px; cursor: pointer; } /* Responsive */ @media (max-width: 600px) { #chat-window { font-size: 0.9rem; } header h1 { font-size: 1.4rem; } #modal { max-width: 95%; } } </style> </head> <body> <header> <img src="https://i.imgur.com/7nZ2zTr.png" alt="Sloth Chat Logo" /> <h1>Sloth Chat Room</h1> <div id="user-section"> <span id="welcome-msg" hidden></span> <button id="login-btn">Log In</button> <button id="signup-btn">Sign Up</button> <button id="logout-btn" hidden>Log Out</button> </div> </header> <main> <div id="chat-window" aria-live="polite" aria-label="Chat messages"></div> <div id="chat-input-container" aria-label="Send message"> <input type="text" id="chat-input" placeholder="Type your message..." aria-label="Message input" disabled /> <button id="send-btn" disabled>Send</button> </div> </main> <!-- Modal for login/signup --> <div id="modal-overlay" role="dialog" aria-modal="true" aria-labelledby="modal-title" tabindex="-1"> <div id="modal"> <button class="close-btn" aria-label="Close modal">×</button> <h2 id="modal-title"></h2> <form id="modal-form"> <!-- Form fields inserted dynamically --> </form> </div> </div> <!-- Firebase SDK --> <script src="https://www.gstatic.com/firebasejs/9.22.1/firebase-app-compat.js"></script> <script src="https://www.gstatic.com/firebasejs/9.22.1/firebase-auth-compat.js"></script> <script src="https://www.gstatic.com/firebasejs/9.22.1/firebase-database-compat.js"></script> <script> // Your Firebase config - Replace with your own project's config from Firebase Console const firebaseConfig = { apiKey: "YOUR_API_KEY_HERE", authDomain: "YOUR_PROJECT_ID.firebaseapp.com", databaseURL: "https://YOUR_PROJECT_ID-default-rtdb.firebaseio.com", projectId: "YOUR_PROJECT_ID", storageBucket: "YOUR_PROJECT_ID.appspot.com", messagingSenderId: "YOUR_SENDER_ID", appId: "YOUR_APP_ID" }; firebase.initializeApp(firebaseConfig); const auth = firebase.auth(); const db = firebase.database(); // Elements const loginBtn = document.getElementById('login-btn'); const signupBtn = document.getElementById('signup-btn'); const logoutBtn = document.getElementById('logout-btn'); const welcomeMsg = document.getElementById('welcome-msg'); const chatInput = document.getElementById('chat-input'); const sendBtn = document.getElementById('send-btn'); const chatWindow = document.getElementById('chat-window'); const modalOverlay = document.getElementById('modal-overlay'); const modal = document.getElementById('modal'); const modalTitle = document.getElementById('modal-title'); const modalForm = document.getElementById('modal-form'); const modalCloseBtn = modal.querySelector('.close-btn'); // Show modal with dynamic form function showModal(type) { modalForm.innerHTML = ''; modalTitle.textContent = type; modalOverlay.style.display = 'flex'; if (type === 'Log In') { modalForm.innerHTML = ` <label for="login-email">Email</label> <input type="email" id="login-email" name="email" required autocomplete="email" /> <label for="login-password">Password</label> <input type="password" id="login-password" name="password" required autocomplete="current-password" /> <button type="submit">Log In</button> `; } else if (type === 'Sign Up') { modalForm.innerHTML = ` <label for="signup-email">Email</label> <input type="email" id="signup-email" name="email" required autocomplete="email" /> <label for="signup-password">Password</label> <input type="password" id="signup-password" name="password" required autocomplete="new-password" /> <button type="submit">Sign Up</button> `; } modalForm.querySelector('input').focus(); } // Close modal function closeModal() { modalOverlay.style.display = 'none'; modalForm.reset?.(); } // Render chat message function renderMessage(msg) { const msgDiv = document.createElement('div'); msgDiv.classList.add('chat-message'); const currentUser = auth.currentUser; if (currentUser && msg.uid === currentUser.uid) { msgDiv.classList.add('self'); } const userSpan = document.createElement('div'); userSpan.classList.add('chat-username'); userSpan.textContent = msg.email || 'Anonymous'; const textSpan = document.createElement('div'); textSpan.textContent = msg.text; msgDiv.appendChild(userSpan); msgDiv.appendChild(textSpan); chatWindow.appendChild(msgDiv); chatWindow.scrollTop = chatWindow.scrollHeight; } // Load chat messages function subscribeMessages() { chatWindow.innerHTML = ''; const messagesRef = db.ref('messages').limitToLast(100); messagesRef.off(); messagesRef.on('child_added', snapshot => { const msg = snapshot.val(); renderMessage(msg); }); } // Update UI on auth state change auth.onAuthStateChanged(user => { if (user) { welcomeMsg.textContent = `Welcome, ${user.email}`; welcomeMsg.hidden = false; loginBtn.hidden = true; signupBtn.hidden = true; logoutBtn.hidden = false; chatInput.disabled = false; sendBtn.disabled = false; chatInput.focus(); subscribeMessages(); } else { welcomeMsg.hidden = true; loginBtn.hidden = false; signupBtn.hidden = false; logoutBtn.hidden = true; chatInput.disabled = true; sendBtn.disabled = true; chatWindow.innerHTML = ''; } }); // Event handlers loginBtn.addEventListener('click', () => showModal('Log In')); signupBtn.addEventListener('click', () => showModal('Sign Up')); logoutBtn.addEventListener('click', () => auth.signOut()); modalCloseBtn.addEventListener('click', closeModal); modalOverlay.addEventListener('click', e => { if (e.target === modalOverlay) closeModal(); }); modalForm.addEventListener('submit', e => { e.preventDefault(); const formData = new FormData(modalForm); const type = modalTitle.textContent; const email = formData.get('email').trim(); const password = formData.get('password'); if (type === 'Log In') { auth.signInWithEmailAndPassword(email, password) .then(() => closeModal()) .catch(err => alert(err.message)); } else if (type === 'Sign Up') { auth.createUserWithEmailAndPassword(email, password) .then(() => closeModal()) .catch(err => alert(err.message)); } }); sendBtn.addEventListener('click', () => { const text = chatInput.value.trim(); if (!text) return; const user = auth.currentUser; if (!user) { alert('Please log in to send messages.'); return; } const msg = { uid: user.uid, email: user.email, text: text, timestamp: Date.now() }; db.ref('messages').push(msg) .then(() => { chatInput.value = ''; }) .catch(err => alert('Failed to send message: ' + err.message)); }); chatInput.addEventListener('keydown', e => { if (e.key === 'Enter' && !e.shiftKey) { e.preventDefault(); sendBtn.click(); } }); </script> </body> </html> -
By BirbMonster · Posted
SALUTATIONS AND HAPPY HOLIDAYS NICHE FORUMS!!!! It is very much a yearly tradition for me to participate HOWEVER I have not been interested in niche in a long time so i have nichelingified my favourite fictional character of all time (Melinoe from Hades 2) mainly for this purpose im so captivated by her her genes if anyone needs them i am also just now realising i forgot to make her hind paws orange in the drawing -
shiny zoroark jumpscare i was doing a tera raid and i thought this zoroark looked kind of purple but i assumed it was just the lighting + terastallization making him look more purple than red and then the glass effect disappeared because he fainted. nope. whole ass shiny just randomly from a raid -
.thumb.png.fb334a8d229eb2e0bba53336ed96320e.png)
-