Initial commit
This commit is contained in:
commit
91f31c9df7
15
README.md
Normal file
15
README.md
Normal file
@ -0,0 +1,15 @@
|
|||||||
|
# Deactivate WA Web Auto Emojis
|
||||||
|
|
||||||
|
This is a small browser addon, that deactivates the auto replacement of smileys with emojis in WhatsApp Web.
|
||||||
|
When typing `:D` in WhatsApp Web, instead of just keeping it as text `😀` will be injected.
|
||||||
|
I don't like that.
|
||||||
|
|
||||||
|
This extensions disables it, by putting an zero-width-space between `:` and `D`.
|
||||||
|
|
||||||
|
There is an option page where you can toggle the behaviour for individual emojis.
|
||||||
|
|
||||||
|
## Known issues
|
||||||
|
As WhatsApp Web does not use an HTML `<input>` but had the "great idea" to have some div listening to keypresses, it is hard to inject stuff.
|
||||||
|
|
||||||
|
* It does only work, when you are typing at the end of the text. Adding a smiley in the middle of the text will not be disabled.
|
||||||
|
* It does not work when pasting text.
|
||||||
18
manifest.json
Normal file
18
manifest.json
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
{
|
||||||
|
"manifest_version": 3,
|
||||||
|
"name": "No Auto Emojis in WA Web",
|
||||||
|
"version": "0.0.1",
|
||||||
|
"description": "Disable WhatsApp Web Auto Emojis",
|
||||||
|
"author": "Daniel Kluge",
|
||||||
|
"content_scripts": [{
|
||||||
|
"matches": ["https://web.whatsapp.com/*"],
|
||||||
|
"js": ["no-auto-emoji.js"]
|
||||||
|
}],
|
||||||
|
"permissions": [
|
||||||
|
"storage"
|
||||||
|
],
|
||||||
|
"options_ui": {
|
||||||
|
"page": "options.html",
|
||||||
|
"open_in_tab": false
|
||||||
|
}
|
||||||
|
}
|
||||||
75
no-auto-emoji.js
Normal file
75
no-auto-emoji.js
Normal file
@ -0,0 +1,75 @@
|
|||||||
|
function prepareTable(deactivated) {
|
||||||
|
deactivated = deactivated || [];
|
||||||
|
const emojiTable = {
|
||||||
|
"(y)": "👍",
|
||||||
|
"(Y)": "👍",
|
||||||
|
"(n)": "👎",
|
||||||
|
"(N)": "👎",
|
||||||
|
":-)": "🙂",
|
||||||
|
":)": "🙂",
|
||||||
|
":-(": "🙁",
|
||||||
|
":(": "🙁",
|
||||||
|
":-p": "😛",
|
||||||
|
":-P": "😛",
|
||||||
|
":P": "😛",
|
||||||
|
":-\\": "😕",
|
||||||
|
":\\": "😕",
|
||||||
|
":-D": "😀",
|
||||||
|
":D": "😀",
|
||||||
|
":-o": "😮",
|
||||||
|
":O": "😮",
|
||||||
|
";-)": "😉",
|
||||||
|
";)": "😉",
|
||||||
|
":-*": "😘",
|
||||||
|
":-|": "😐",
|
||||||
|
":'(": "😢",
|
||||||
|
"^_^": "😁",
|
||||||
|
"<3": "❤️",
|
||||||
|
">_<": "😆",
|
||||||
|
"8)": "😎"
|
||||||
|
};
|
||||||
|
|
||||||
|
for (const d of deactivated) {
|
||||||
|
delete emojiTable[d];
|
||||||
|
}
|
||||||
|
|
||||||
|
return emojiTable;
|
||||||
|
}
|
||||||
|
|
||||||
|
let emojiTable = prepareTable([]);
|
||||||
|
chrome.storage.sync.get("deactivated", (result) => {
|
||||||
|
emojiTable = prepareTable(result.deactivated);
|
||||||
|
});
|
||||||
|
chrome.storage.onChanged.addListener((changes, _areaName) => {
|
||||||
|
if (changes.deactivated?.newValue) emojiTable = prepareTable(changes.deactivated.newValue);
|
||||||
|
});
|
||||||
|
|
||||||
|
function fakeInput(input, data) {
|
||||||
|
input.innerText = data;
|
||||||
|
input.dispatchEvent(new InputEvent('input', {
|
||||||
|
inputType: 'insertText',
|
||||||
|
data,
|
||||||
|
bubbles: true,
|
||||||
|
cancelable: false,
|
||||||
|
composed: true,
|
||||||
|
detail: 0,
|
||||||
|
}));
|
||||||
|
}
|
||||||
|
|
||||||
|
new MutationObserver(() => {
|
||||||
|
const divInput = document.querySelector("[data-testid=conversation-compose-box-input]");
|
||||||
|
if (!divInput || divInput.getAttribute("data-noautoemote")) return;
|
||||||
|
|
||||||
|
divInput.setAttribute("data-noautoemote", "true");
|
||||||
|
|
||||||
|
divInput.parentElement.addEventListener("beforeinput", e => {
|
||||||
|
const textField = divInput.querySelector("span");
|
||||||
|
const text = (textField?.innerHTML || "") + e.data;
|
||||||
|
|
||||||
|
if (text.substring(text.length - 2) in emojiTable || text.substring(text.length - 3) in emojiTable) {
|
||||||
|
e.preventDefault();
|
||||||
|
fakeInput(divInput, "\u200B");
|
||||||
|
fakeInput(divInput, e.data);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}).observe(document, { childList: true, subtree: true });
|
||||||
12
options.html
Normal file
12
options.html
Normal file
@ -0,0 +1,12 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<title>No Auto Emoji Options</title>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h3>Select which auto emojis should be blocked:</h3>
|
||||||
|
<ul id="list"></ul>
|
||||||
|
<script src="options.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
63
options.js
Normal file
63
options.js
Normal file
@ -0,0 +1,63 @@
|
|||||||
|
async function updateDeactivated(element, isDeactivated) {
|
||||||
|
console.log(element, isDeactivated);
|
||||||
|
|
||||||
|
let { deactivated } = await chrome.storage.sync.get("deactivated");
|
||||||
|
deactivated = deactivated || [];
|
||||||
|
|
||||||
|
if (isDeactivated) {
|
||||||
|
if (!deactivated.includes(element)) deactivated.push(element);
|
||||||
|
} else {
|
||||||
|
if (deactivated.includes(element)) deactivated.splice(deactivated.indexOf(element), 1);
|
||||||
|
}
|
||||||
|
await chrome.storage.sync.set({deactivated})
|
||||||
|
}
|
||||||
|
|
||||||
|
(async () => {
|
||||||
|
const listE = document.getElementById("list");
|
||||||
|
const emojiTable = {
|
||||||
|
"(y)": "👍",
|
||||||
|
"(Y)": "👍",
|
||||||
|
"(n)": "👎",
|
||||||
|
"(N)": "👎",
|
||||||
|
":-)": "🙂",
|
||||||
|
":)": "🙂",
|
||||||
|
":-(": "🙁",
|
||||||
|
":(": "🙁",
|
||||||
|
":-p": "😛",
|
||||||
|
":-P": "😛",
|
||||||
|
":P": "😛",
|
||||||
|
":-\\": "😕",
|
||||||
|
":\\": "😕",
|
||||||
|
":-D": "😀",
|
||||||
|
":D": "😀",
|
||||||
|
":-o": "😮",
|
||||||
|
":O": "😮",
|
||||||
|
";-)": "😉",
|
||||||
|
";)": "😉",
|
||||||
|
":-*": "😘",
|
||||||
|
":-|": "😐",
|
||||||
|
":'(": "😢",
|
||||||
|
"^_^": "😁",
|
||||||
|
"<3": "❤️",
|
||||||
|
">_<": "😆",
|
||||||
|
"8)": "😎"
|
||||||
|
};
|
||||||
|
let { deactivated } = await chrome.storage.sync.get("deactivated");
|
||||||
|
deactivated = deactivated || [];
|
||||||
|
for (const [key, value] of Object.entries(emojiTable)) {
|
||||||
|
const li = document.createElement("li");
|
||||||
|
const checkbox = document.createElement("input");
|
||||||
|
checkbox.type = "checkbox";
|
||||||
|
checkbox.id = key;
|
||||||
|
checkbox.checked = !deactivated.includes(key);
|
||||||
|
checkbox.addEventListener("change", (e) => {
|
||||||
|
updateDeactivated(key, !e.target.checked);
|
||||||
|
});
|
||||||
|
const label = document.createElement("label");
|
||||||
|
label.htmlFor = key;
|
||||||
|
label.innerText = `${key} → ${value}`;
|
||||||
|
li.appendChild(checkbox);
|
||||||
|
li.appendChild(label);
|
||||||
|
listE.appendChild(li);
|
||||||
|
}
|
||||||
|
})();
|
||||||
Loading…
Reference in New Issue
Block a user