This commit is contained in:
Mirco Wittrien 2018-12-08 10:59:51 +01:00
parent b51b0ee87d
commit 66ec74744b
2 changed files with 29 additions and 39 deletions

View File

@ -40,7 +40,7 @@ class GoogleTranslateOption {
</div>
</div>`;
this.optionButtonMarkup =
this.optionButtonMarkup =
`<div class="${BDFDB.disCN.optionpopoutbutton} btn-googletranslateoption"></div>`;
this.optionsPopoutMarkup =
@ -54,9 +54,13 @@ class GoogleTranslateOption {
</button>`;
this.translateButtonMarkup =
`<svg version="1.1" xmlns="http://www.w3.org/2000/svg" class="translate-button" width="22" height="30" fill="currentColor">
<path d="M 19.794, 3.299 H 9.765 L 8.797, 0 h -6.598 C 0.99, 0, 0, 0.99, 0, 2.199 V 16.495 c 0, 1.21, 0.99, 2.199, 2.199, 2.199 H 9.897 l 1.1, 3.299 H 19.794 c 1.21, 0, 2.199 -0.99, 2.199 -2.199 V 5.498 C 21.993, 4.289, 21.003, 3.299, 19.794, 3.299 z M 5.68, 13.839 c -2.48, 0 -4.492 -2.018 -4.492 -4.492 s 2.018 -4.492, 4.492 -4.492 c 1.144, 0, 2.183, 0.407, 3.008, 1.171 l 0.071, 0.071 l -1.342, 1.298 l -0.066 -0.06 c -0.313 -0.297 -0.858 -0.643 -1.671 -0.643 c -1.441, 0 -2.612, 1.193 -2.612, 2.661 c 0, 1.468, 1.171, 2.661, 2.612, 2.661 c 1.507, 0, 2.161 -0.962, 2.337 -1.606 h -2.43 v -1.704 h 4.344 l 0.016, 0.077 c 0.044, 0.231, 0.06, 0.434, 0.06, 0.665 C 10.001, 12.036, 8.225, 13.839, 5.68, 13.839 z M 11.739, 9.979 h 4.393 c 0, 0 -0.374, 1.446 -1.715, 3.008 c -0.588 -0.676 -0.995 -1.336 -1.254 -1.864 h -1.089 L 11.739, 9.979 z M 13.625, 13.839 l -0.588, 0.583 l -0.72 -2.452 C 12.685, 12.63, 13.13, 13.262, 13.625, 13.839 z M 20.893, 19.794 c 0, 0.605 -0.495, 1.1 -1.1, 1.1 H 12.096 l 2.199 -2.199 l -0.896 -3.041 l 1.012 -1.012 l 2.953, 2.953 l 0.803 -0.803 l -2.975 -2.953 c 0.99 -1.138, 1.759 -2.474, 2.106 -3.854 h 1.397 V 8.841 H 14.697 v -1.144 h -1.144 v 1.144 H 11.398 l -1.309 -4.443 H 19.794 c 0.605, 0, 1.1, 0.495, 1.1, 1.1 V 19.794 z"/>
</svg>`;
`<div class="${BDFDB.disCNS.textareabuttonwrapper + BDFDB.disCNS.button + BDFDB.disCNS.buttonlookblank + BDFDB.disCNS.buttoncolorbrand + BDFDB.disCN.buttongrow} translate-button-wrapper">
<div class="${BDFDB.disCN.textareabutton} translate-button">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" class="${BDFDB.disCN.textareaicon}" viewBox="0 0 25 25" fill="currentColor">
<path d="M 19.794, 3.299 H 9.765 L 8.797, 0 h -6.598 C 0.99, 0, 0, 0.99, 0, 2.199 V 16.495 c 0, 1.21, 0.99, 2.199, 2.199, 2.199 H 9.897 l 1.1, 3.299 H 19.794 c 1.21, 0, 2.199 -0.99, 2.199 -2.199 V 5.498 C 21.993, 4.289, 21.003, 3.299, 19.794, 3.299 z M 5.68, 13.839 c -2.48, 0 -4.492 -2.018 -4.492 -4.492 s 2.018 -4.492, 4.492 -4.492 c 1.144, 0, 2.183, 0.407, 3.008, 1.171 l 0.071, 0.071 l -1.342, 1.298 l -0.066 -0.06 c -0.313 -0.297 -0.858 -0.643 -1.671 -0.643 c -1.441, 0 -2.612, 1.193 -2.612, 2.661 c 0, 1.468, 1.171, 2.661, 2.612, 2.661 c 1.507, 0, 2.161 -0.962, 2.337 -1.606 h -2.43 v -1.704 h 4.344 l 0.016, 0.077 c 0.044, 0.231, 0.06, 0.434, 0.06, 0.665 C 10.001, 12.036, 8.225, 13.839, 5.68, 13.839 z M 11.739, 9.979 h 4.393 c 0, 0 -0.374, 1.446 -1.715, 3.008 c -0.588 -0.676 -0.995 -1.336 -1.254 -1.864 h -1.089 L 11.739, 9.979 z M 13.625, 13.839 l -0.588, 0.583 l -0.72 -2.452 C 12.685, 12.63, 13.13, 13.262, 13.625, 13.839 z M 20.893, 19.794 c 0, 0.605 -0.495, 1.1 -1.1, 1.1 H 12.096 l 2.199 -2.199 l -0.896 -3.041 l 1.012 -1.012 l 2.953, 2.953 l 0.803 -0.803 l -2.975 -2.953 c 0.99 -1.138, 1.759 -2.474, 2.106 -3.854 h 1.397 V 8.841 H 14.697 v -1.144 h -1.144 v 1.144 H 11.398 l -1.309 -4.443 H 19.794 c 0.605, 0, 1.1, 0.495, 1.1, 1.1 V 19.794 z"/>
</svg>
</div>
</div>`;
this.reverseButtonMarkup =
`<svg class="reverse-button ${BDFDB.disCN.flexchild}" type="REPLACETYPE" version="1.1" xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="currentColor" style="flex: 0 0 auto;">
@ -303,35 +307,18 @@ class GoogleTranslateOption {
}.call(this);
this.css = `
.chat form textarea {
padding-right: 0 !important;
}
.translate-button {
position: absolute;
right: 46px;
top: 11px;
opacity: 0.2;
transition: all 200ms ease;
}
${BDFDB.dotCN.themedark} .translate-button {
fill: #fff;
}
${BDFDB.dotCN.themelight} .translate-button {
fill: #4f545c;
}
.translate-button.active {
fill: #F04747;
${BDFDB.dotCN.textareabutton}.translate-button.active {
color: #F04747;
opacity: 1;
}
.translate-button:hover {
cursor: pointer;
opacity: 1;
transform: scale(1.1);
${BDFDB.dotCN.textareabutton}.translate-button ${BDFDB.dotCN.textareaicon} {
height: 28px;
width: 28px;
}
${BDFDB.dotCN.textareabutton}.translate-button.active ${BDFDB.dotCN.textareaicon} {
transform: scale(1);
}
.reverse-button {
@ -369,7 +356,7 @@ class GoogleTranslateOption {
getDescription () {return "Adds a Google Translate option to your context menu, which shows a preview of the translated text and on click will open the selected text in Google Translate. Also adds a translation button to your textareas, which will automatically translate the text for you before it is being send. DeepLApi written by square. Thanks ;)";}
getVersion () {return "1.5.1";}
getVersion () {return "1.5.2";}
getAuthor () {return "DevilBro, square";}
@ -503,8 +490,7 @@ class GoogleTranslateOption {
this.resetMessage(message);
});
document.querySelectorAll(".translate-button").forEach(button => {button.remove();});
document.querySelectorAll(BDFDB.dotCNS.chat + "form textarea").forEach(textarea => {textarea.parentElement.style.paddingRight = "0px";});
document.querySelectorAll(".translate-button-wrapper").forEach(button => {button.remove();});
BDFDB.unloadMessage(this);
}
@ -685,11 +671,12 @@ class GoogleTranslateOption {
addTranslationButton (textarea) {
if (!textarea) return;
var textareaWrap = textarea.parentElement;
if (textareaWrap && !textareaWrap.classList.contains(BDFDB.disCN.textareainnerdisabled) && !textareaWrap.querySelector(".translate-button")) {
if (textareaWrap && !textareaWrap.classList.contains(BDFDB.disCN.textareainnerdisabled) && !textareaWrap.querySelector(".translate-button-wrapper")) {
var textareaInstance = BDFDB.getOwnerInstance({"node":textarea, "props":["handlePaste","saveCurrentText"], "up":true});
if (textareaInstance && textareaInstance.props && textareaInstance.props.type) {
var buttoncontainer = textareaWrap.querySelector(BDFDB.dotCN.textareapickerbuttons);
var button = $(this.translateButtonMarkup)[0];
$(button).appendTo(textareaWrap)
$(button)
.on("click." + this.getName(), () => {
this.openTranslatePopout(button);
})
@ -697,11 +684,10 @@ class GoogleTranslateOption {
this.translating = !this.translating;
document.querySelectorAll(BDFDB.dotCNS.textareawrapchat + ".translate-button").forEach(btn => {btn.classList.toggle("active", this.translating);});
});
if (buttoncontainer) buttoncontainer.insertBefore(button, buttoncontainer.firstElementChild);
else textareaWrap.appendChild(button);
button.classList.add(textareaInstance.props.type);
button.classList.toggle("active", this.translating);
var sendButtonEnabled = BDFDB.isPluginEnabled("SendButton");
if (sendButtonEnabled) button.style.marginRight = "40px";
textareaWrap.style.paddingRight = sendButtonEnabled ? "110px" : "70px";
$(textarea)
.off("input." + this.getName())
.on("input." + this.getName(), () => {

View File

@ -958,6 +958,10 @@ img[src="/assets/bfffd518c76d3f6bc5e96eb52e4ae2cf.svg"],
stroke: rgb(var(--vaccentcolor)) !important;
}
.result-3w1ZcL:hover:after {
box-shadow: inset 0 0 0 3px rgb(var(--vaccentcolor)), inset 0 0 0 4px #2f3136 !important;
}
.callAvatarBorder-1D_KaE.video-3GgX2M.selected-2esnyn:not(.speaking-oCqYMI) {
box-shadow: inset 0 0 0 2px rgb(var(--vaccentcolor)) !important;
}