Control panel for Chat World with themes, auto-messaging, name management, and random name colors
// ==UserScript==
// @name Chat World Control Panel
// @namespace http://tampermonkey.net/
// @version 1.3
// @description Control panel for Chat World with themes, auto-messaging, name management, and random name colors
// @author boxman123
// @match https://chatworldofficial.com/chat.html*
// @grant GM_addStyle
// @grant GM_setValue
// @grant GM_getValue
// @run-at document-idle
// @license MIT I dont care use it or skid it
// ==/UserScript==
(function() {
'use strict';
// Add custom styles for the control panel
GM_addStyle(`
#tmControlPanel {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 400px;
background: #ffffff;
border: 3px solid #3399ff;
border-radius: 15px;
padding: 20px;
z-index: 10000;
box-shadow: 0 8px 25px rgba(0,0,0,0.3);
font-family: Arial, sans-serif;
max-height: 80vh;
overflow-y: auto;
display: none;
}
#tmControlPanel.active {
display: block;
}
#tmTogglePanel {
position: fixed;
top: 20px;
right: 20px;
background: #3399ff;
color: white;
border: none;
border-radius: 50%;
width: 50px;
height: 50px;
cursor: pointer;
z-index: 10001;
font-weight: bold;
font-size: 18px;
box-shadow: 0 4px 12px rgba(51, 153, 255, 0.5);
transition: all 0.3s ease;
}
#tmTogglePanel:hover {
background: #2980b9;
transform: scale(1.1);
}
.tm-section {
margin: 15px 0;
padding: 15px;
background: #f8f9fa;
border-radius: 8px;
border-left: 4px solid #3399ff;
}
.tm-section h3 {
margin: 0 0 12px 0;
color: #3399ff;
font-size: 16px;
display: flex;
align-items: center;
gap: 8px;
}
.tm-input {
width: 100%;
padding: 10px;
margin: 6px 0;
border: 1px solid #ddd;
border-radius: 6px;
box-sizing: border-box;
font-size: 14px;
}
.tm-button {
background: #3399ff;
color: white;
border: none;
padding: 10px 15px;
margin: 3px;
border-radius: 6px;
cursor: pointer;
font-size: 13px;
transition: all 0.2s ease;
}
.tm-button:hover {
background: #2980b9;
transform: translateY(-2px);
}
.tm-button.danger {
background: #e74c3c;
}
.tm-button.danger:hover {
background: #c0392b;
}
.tm-button.success {
background: #27ae60;
}
.tm-button.success:hover {
background: #219a52;
}
#tmSpamStatus {
font-size: 12px;
margin-top: 8px;
padding: 5px;
border-radius: 4px;
text-align: center;
font-weight: bold;
}
.spamming {
background: #ffeaa7;
color: #d63031;
border: 1px solid #fdcb6e;
}
#tmColorStatus {
font-size: 12px;
margin-top: 8px;
padding: 8px;
border-radius: 4px;
text-align: center;
font-weight: bold;
}
`);
function initializeControlPanel() {
// Create toggle button
const toggleBtn = document.createElement('button');
toggleBtn.id = 'tmTogglePanel';
toggleBtn.innerHTML = '⚙️';
toggleBtn.title = 'Control Panel (Right Shift)';
// Create control panel
const controlPanel = document.createElement('div');
controlPanel.id = 'tmControlPanel';
controlPanel.innerHTML = `
<div style="text-align: center; margin-bottom: 20px; border-bottom: 2px solid #3399ff; padding-bottom: 15px;">
<h2 style="margin: 0; color: #3399ff; font-size: 22px;">🎮 Control Panel</h2>
<div style="font-size: 12px; color: #666; margin-top: 5px;">Press Right Shift to toggle</div>
</div>
<!-- Theme Section -->
<div class="tm-section">
<h3>🎨 Theme Customization</h3>
<div>
<div style="margin: 10px 0; text-align: center;">
<button class="tm-button" data-theme="default">Default</button>
<button class="tm-button" data-theme="dark">Dark Mode</button>
<button class="tm-button" data-theme="blue">Ocean Blue</button>
</div>
</div>
</div>
<!-- Name Management Section -->
<div class="tm-section">
<h3>👤 Name Management</h3>
<div>
<input type="text" id="tmCustomName" class="tm-input" placeholder="Enter custom name" maxlength="15">
<button class="tm-button" id="tmSetCustomName">Set Name</button>
<div style="margin: 10px 0;">
<button class="tm-button" data-name="Anonymous">Anonymous</button>
<button class="tm-button" data-name="Chatter">Chatter</button>
<button class="tm-button" data-name="User">User</button>
</div>
</div>
</div>
<!-- Random Name Color Section -->
<div class="tm-section">
<h3>🌈 Random Name Color</h3>
<div>
<input type="text" id="tmColorInterval" class="tm-input" placeholder="Cycle time (e.g., 3s, 10m)" value="3s">
<button class="tm-button success" id="tmStartColorCycle">Start Color Cycle</button>
<button class="tm-button danger" id="tmStopColorCycle">Stop Color Cycle</button>
<div style="font-size: 12px; color: #666; margin-top: 8px;">
Examples: "3s" for 3 seconds, "500ms" for 500 milliseconds, "10m" for 10 minutes.
</div>
<div id="tmColorStatus">Ready - Will click color dots automatically</div>
</div>
</div>
<!-- Automation Section -->
<div class="tm-section">
<h3>⚡ Auto Messages</h3>
<div>
<input type="text" id="tmAutoMessage" class="tm-input" placeholder="Message to send automatically">
<div style="display: flex; gap: 5px; margin: 8px 0;">
<input type="number" id="tmInterval" class="tm-input" placeholder="Interval (ms)" value="2000" min="500" style="flex: 1;">
<input type="number" id="tmCount" class="tm-input" placeholder="Count" value="5" min="1" style="flex: 1;">
</div>
<button class="tm-button success" id="tmStartSpam">Start</button>
<button class="tm-button danger" id="tmStopSpam">Stop</button>
<div id="tmSpamStatus">Ready</div>
</div>
</div>
<!-- Quick Actions Section -->
<div class="tm-section">
<h3>🚀 Quick Actions</h3>
<div>
<button class="tm-button" id="tmClearChat">Clear Chat</button>
<button class="tm-button" id="tmEnableSend">Always Enable Send</button>
</div>
</div>
<div style="text-align: center; margin-top: 15px;">
<button class="tm-button danger" id="tmClosePanel">Close</button>
</div>
`;
// Add elements to page
document.body.appendChild(toggleBtn);
document.body.appendChild(controlPanel);
// State variables
let spamInterval = null;
let spamCount = 0;
let totalSpam = 0;
let colorCycleInterval = null;
// Event Listeners
toggleBtn.addEventListener('click', togglePanel);
document.getElementById('tmClosePanel').addEventListener('click', togglePanel);
// Theme management
document.querySelectorAll('[data-theme]').forEach(btn => {
btn.addEventListener('click', function() {
applyTheme(this.dataset.theme);
});
});
// Name management
document.getElementById('tmSetCustomName').addEventListener('click', setCustomName);
document.querySelectorAll('[data-name]').forEach(btn => {
btn.addEventListener('click', function() {
document.getElementById('tmCustomName').value = this.dataset.name;
setCustomName();
});
});
// Random Name Color - Click color dots automatically
document.getElementById('tmStartColorCycle').addEventListener('click', startColorCycle);
document.getElementById('tmStopColorCycle').addEventListener('click', stopColorCycle);
// Automation
document.getElementById('tmStartSpam').addEventListener('click', startSpamming);
document.getElementById('tmStopSpam').addEventListener('click', stopSpamming);
// Quick actions
document.getElementById('tmClearChat').addEventListener('click', clearChat);
document.getElementById('tmEnableSend').addEventListener('click', enableSendButton);
// Right Shift key detection
document.addEventListener('keydown', function(event) {
if (event.key === 'Shift' && event.location === 2) { // Right Shift
togglePanel();
event.preventDefault();
}
});
// Functions
function togglePanel() {
const isActive = controlPanel.classList.contains('active');
controlPanel.classList.toggle('active', !isActive);
}
function applyTheme(theme) {
const styles = {
default: { bg: '#ffffff', text: '#000000', accent: '#3399ff' },
dark: { bg: '#1a1a1a', text: '#ffffff', accent: '#bb86fc' },
blue: { bg: '#e3f2fd', text: '#0d47a1', accent: '#2196f3' }
};
const style = styles[theme] || styles.default;
document.body.style.backgroundColor = style.bg;
document.body.style.color = style.text;
// Try to find and style the header if it exists
const header = document.querySelector('header');
if (header) {
header.style.backgroundColor = style.accent;
}
}
function setCustomName() {
const customName = document.getElementById('tmCustomName').value.trim();
if (customName) {
const usernameInput = document.getElementById('usernameInput');
const saveNameBtn = document.getElementById('saveNameBtn');
if (usernameInput && saveNameBtn) {
usernameInput.value = customName;
saveNameBtn.click();
} else {
console.log('Username input or save button not found');
}
}
}
function startColorCycle() {
// Stop any existing cycle first
stopColorCycle();
const intervalString = document.getElementById('tmColorInterval').value.trim();
const totalMilliseconds = parseInterval(intervalString);
if (isNaN(totalMilliseconds) || totalMilliseconds <= 0) {
updateColorStatus('Please enter a valid time (e.g., 3s, 2m, 1000ms).', 'error');
return;
}
// Available colors from the website's color dots
const availableColors = [
"#e74c3c", // Red
"#27ae60", // Green
"#f1c40f", // Yellow
"#2980b9", // Blue
"#e67e22", // Orange
"#8e44ad", // Purple
"#ff69b4" // Pink
];
let currentColorIndex = 0;
colorCycleInterval = setInterval(() => {
// Get all color dots from the website
const colorDots = document.querySelectorAll('#colorDots .color-dot:not(.none)');
if (colorDots.length > 0) {
// Cycle through available colors
const targetColor = availableColors[currentColorIndex];
// Find the dot that matches our target color
let targetDot = null;
for (let dot of colorDots) {
if (dot.style.backgroundColor === targetColor ||
dot.style.backgroundColor === rgbToHex(targetColor)) {
targetDot = dot;
break;
}
}
// If we found a matching dot, click it
if (targetDot) {
targetDot.click();
updateColorStatus(`Color changed to: ${targetColor}`, 'success');
} else {
// Fallback: click a random color dot
const randomIndex = Math.floor(Math.random() * colorDots.length);
colorDots[randomIndex].click();
updateColorStatus('Color changed randomly', 'success');
}
// Move to next color
currentColorIndex = (currentColorIndex + 1) % availableColors.length;
} else {
updateColorStatus('No color dots found on page', 'error');
stopColorCycle();
}
}, totalMilliseconds);
updateColorStatus(`Color cycle started! Changing every ${intervalString}`, 'success');
}
function stopColorCycle() {
if (colorCycleInterval) {
clearInterval(colorCycleInterval);
colorCycleInterval = null;
updateColorStatus('Color cycle stopped.', 'stopped');
}
}
function parseInterval(intervalString) {
const match = intervalString.match(/^(\d+(?:\.\d+)?)\s*(ms|s|m)?$/);
if (!match) return NaN;
const value = parseFloat(match[1]);
const unit = match[2] || 's'; // Default to seconds
switch (unit) {
case 'ms':
return value;
case 's':
return value * 1000;
case 'm':
return value * 1000 * 60;
default:
return NaN;
}
}
function rgbToHex(rgb) {
// Convert RGB color to hex format
if (rgb.startsWith('#')) return rgb;
const result = /^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/.exec(rgb);
if (!result) return rgb;
const r = parseInt(result[1]);
const g = parseInt(result[2]);
const b = parseInt(result[3]);
return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
}
function updateColorStatus(message, type) {
const statusEl = document.getElementById('tmColorStatus');
if (statusEl) {
statusEl.textContent = message;
statusEl.style.color = type === 'error' ? '#e74c3c' : type === 'success' ? '#27ae60' : '#666';
statusEl.style.fontWeight = 'bold';
statusEl.style.padding = '8px';
statusEl.style.borderRadius = '4px';
statusEl.style.backgroundColor = type === 'error' ? '#ffeaa7' : type === 'success' ? '#d4edda' : '#f8f9fa';
statusEl.style.border = type === 'error' ? '1px solid #fdcb6e' : type === 'success' ? '1px solid #c3e6cb' : '1px solid #ddd';
}
}
function startSpamming() {
const message = document.getElementById('tmAutoMessage').value;
const interval = parseInt(document.getElementById('tmInterval').value);
const count = parseInt(document.getElementById('tmCount').value);
if (!message) {
updateSpamStatus('Please enter a message', 'error');
return;
}
if (spamInterval) stopSpamming();
totalSpam = count;
spamCount = 0;
spamInterval = setInterval(() => {
if (spamCount >= totalSpam) {
stopSpamming();
return;
}
const chatInput = document.getElementById('chatInput');
const sendBtn = document.getElementById('sendBtn');
if (chatInput && sendBtn) {
// Enable button first if disabled
if (sendBtn.disabled) {
sendBtn.disabled = false;
}
chatInput.value = message;
sendBtn.click();
spamCount++;
updateSpamStatus(`Sending... ${spamCount}/${totalSpam}`, 'spamming');
} else {
updateSpamStatus('Chat input or send button not found', 'error');
stopSpamming();
}
}, interval);
updateSpamStatus('Started auto-messaging', 'spamming');
}
function stopSpamming() {
if (spamInterval) {
clearInterval(spamInterval);
spamInterval = null;
updateSpamStatus(`Stopped. Sent ${spamCount} messages`, 'stopped');
}
}
function updateSpamStatus(message, type) {
const statusEl = document.getElementById('tmSpamStatus');
statusEl.textContent = message;
statusEl.className = type === 'spamming' ? 'spamming' : '';
}
function clearChat() {
const messagesEl = document.getElementById('messages');
if (messagesEl) {
messagesEl.innerHTML = '';
}
}
function enableSendButton() {
const sendBtn = document.getElementById('sendBtn');
if (sendBtn) {
sendBtn.disabled = false;
// Set up continuous monitoring to keep it enabled
setInterval(() => {
if (sendBtn.disabled) {
sendBtn.disabled = false;
}
}, 1000);
updateSpamStatus('Send button always enabled', 'success');
} else {
updateSpamStatus('Send button not found', 'error');
}
}
}
// Wait for page to load completely before initializing
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', initializeControlPanel);
} else {
initializeControlPanel();
}
})();