Blurs inactive WhatsApp chats/messages, unblurs on hover, and enables messaging without saving numbers.
当前为
// ==UserScript==
// @name WhatsApp Web Blur & Quick Message
// @namespace http://tampermonkey.net/
// @version 1.2.8
// @description Blurs inactive WhatsApp chats/messages, unblurs on hover, and enables messaging without saving numbers.
// @author Noushad Bhuiyan
// @match https://web.whatsapp.com/*
// @icon https://www.google.com/s2/favicons?sz=64&domain=whatsapp.com
// @grant none
// @license MIT
// ==/UserScript==
(() => {
const applyBlur = el => !el.hasAttribute('is-blurred') && !el.hasAttribute('aria-selected') && (el.style.filter = 'blur(8px)', el.style.transition = 'filter 0.3s ease-in-out', el.setAttribute('is-blurred', 'true'), el.addEventListener('mouseenter', () => el.style.filter = 'none'), el.addEventListener('mouseleave', () => el.style.filter = 'blur(8px)'));
const clearBlurFromActiveChat = () => document.querySelectorAll('[aria-label="Chat list"] [aria-selected="true"]').forEach(el => {
const listItem = el.closest('[role="listitem"]');
if (listItem?.hasAttribute('is-blurred')) {
listItem.style.filter = 'none';
listItem.style.transition = 'none';
listItem.removeAttribute('is-blurred');
listItem.removeEventListener('mouseenter', () => {});
listItem.removeEventListener('mouseleave', () => {});
}
});
const blurElements = () => (document.querySelectorAll('[aria-label="Chat list"] [role="listitem"], [role="application"] [data-testid="conversation-panel-messages"]').forEach(applyBlur), clearBlurFromActiveChat());
const addMessageButton = () => {
const h1 = document.querySelector('h1');
if (h1 && !document.getElementById('quick-message-btn')) {
const btn = Object.assign(document.createElement('button'), { id: 'quick-message-btn', title: 'Send message to a number without saving', style: 'margin-left:10px;cursor:pointer;background:none;border:none;vertical-align:middle' });
btn.innerHTML = '<img src="data:image/jpeg;base64,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" alt="Message Icon" style="width:20px;height:20px">';
btn.onclick = showModal;
h1.parentElement.parentElement.insertBefore(btn, h1.parentElement.nextSibling);
}
};
const showModal = () => {
document.getElementById('quick-message-modal')?.remove();
const isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
const modal = Object.assign(document.createElement('div'), { id: 'quick-message-modal', style: 'position:fixed;top:0;left:0;width:100%;height:100%;background:' + (isDark ? 'rgba(0,0,0,0.7)' : 'rgba(0,0,0,0.5)') + ';backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:1000' });
const content = Object.assign(document.createElement('div'), { style: 'background:' + (isDark ? '#1a1a1a' : '#fff') + ';color:' + (isDark ? '#fff' : '#000') + ';padding:20px;border-radius:8px;max-width:400px;width:100%;box-shadow:0 4px 8px rgba(0,0,0,0.2)' });
content.onclick = e => e.stopPropagation();
const input = Object.assign(document.createElement('input'), { type: 'text', placeholder: 'Enter phone number', style: 'width:-webkit-fill-available;padding:10px;margin:10px 0;border-radius:4px;background:rgb(51,51,51);color:rgb(255,255,255)', autofocus: true });
const note = Object.assign(document.createElement('div'), { style: 'font-size:12px;color:' + (isDark ? '#bbb' : '#555') + ';margin-bottom:10px', innerHTML: 'Please include the country code (e.g., +1234567890)' });
const btnRow = Object.assign(document.createElement('div'), { style: 'display:flex;gap:10px' });
const checkBtn = Object.assign(document.createElement('button'), { textContent: 'Check Number', style: 'background:#25D366;color:#fff;padding:10px;border:none;border-radius:4px;cursor:pointer;flex:1' });
checkBtn.onclick = () => { const num = input.value.trim().replace(/[\s-+]/g, ''); num && (window.location.href = `https://web.whatsapp.com/send/?phone=${num}`); modal.remove(); };
const closeBtn = Object.assign(document.createElement('button'), { textContent: 'Close', style: 'background:' + (isDark ? '#444' : '#ccc') + ';color:' + (isDark ? '#fff' : '#000') + ';padding:10px;border:none;border-radius:4px;cursor:pointer;flex:1' });
closeBtn.onclick = () => modal.remove();
modal.onclick = e => e.target === modal && modal.remove();
btnRow.append(checkBtn, closeBtn);
content.append(input, note, btnRow);
modal.appendChild(content);
document.body.appendChild(modal);
};
blurElements();
addMessageButton();
const observer = new MutationObserver(mutations => mutations.forEach(m => m.addedNodes.length && (blurElements(), addMessageButton())));
const target = document.querySelector('body');
target && observer.observe(target, { childList: true, subtree: true });
window.addEventListener('unload', () => observer.disconnect());
})();