ngxson
74 lines
2.1 KiB
JavaScript
74 lines
2.1 KiB
JavaScript
const InputTools = {
|
|
isLoading: false,
|
|
|
|
init() {
|
|
const elements = InputTools.queryEmailInput();
|
|
for (const element of elements) {
|
|
if (element.querySelector('sl-input-wrapper')) {
|
|
continue; // ignore if already has SL button
|
|
} else {
|
|
InputTools.addSLButtonToInput(element);
|
|
}
|
|
}
|
|
},
|
|
|
|
addSLButtonToInput(inputElem) {
|
|
// create wrapper element
|
|
const wrapper = InputTools.newDiv('sl-input-wrapper');
|
|
inputElem.parentElement.insertBefore(wrapper, inputElem);
|
|
|
|
// create some space for SL button
|
|
inputElem.style.paddingRight = "50px";
|
|
wrapper.appendChild(inputElem);
|
|
const elementSize = getComputedStyle(inputElem);
|
|
|
|
// create wrapper for SL button
|
|
const btnWrapper = InputTools.newDiv('sl-button-wrapper');
|
|
btnWrapper.style.height = elementSize.height;
|
|
btnWrapper.style.top = elementSize.marginTop;
|
|
btnWrapper.style.bottom = elementSize.marginBottom;
|
|
wrapper.appendChild(btnWrapper);
|
|
|
|
// create the SL button
|
|
const slButton = InputTools.newDiv('sl-button');
|
|
slButton.addEventListener("click", function () {
|
|
InputTools.handleOnClickSLButton(inputElem, slButton);
|
|
});
|
|
btnWrapper.appendChild(slButton);
|
|
},
|
|
|
|
newDiv(classes) {
|
|
const div = document.createElement('div');
|
|
div.classList.add(classes);
|
|
return div;
|
|
},
|
|
|
|
queryEmailInput() {
|
|
return document.querySelectorAll("input[type='email']");
|
|
},
|
|
|
|
async handleOnClickSLButton(inputElem, slButton) {
|
|
if (InputTools.isLoading) {
|
|
return;
|
|
}
|
|
InputTools.isLoading = true;
|
|
slButton.classList.add("loading");
|
|
|
|
const res = await InputTools.sendMessageToBackground("NEW_RANDOM_ALIAS");
|
|
|
|
InputTools.isLoading = false;
|
|
slButton.classList.remove("loading");
|
|
|
|
inputElem.value = res.alias;
|
|
},
|
|
|
|
sendMessageToBackground(tag, data = null) {
|
|
return new Promise((resolve) => {
|
|
chrome.runtime.sendMessage({ tag, data }, function (response) {
|
|
resolve(response);
|
|
});
|
|
});
|
|
},
|
|
};
|
|
|
|
InputTools.init(); |