Skip to content

Commit 00c294b

Browse files
mclementemclemente
committed
V13 jQuery Deprecation
1 parent 7ccd66e commit 00c294b

File tree

2 files changed

+35
-34
lines changed

2 files changed

+35
-34
lines changed

‎src/module/hooks.js‎

Lines changed: 33 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -11,11 +11,7 @@ export default class PolyglotHooks {
1111
const polyglotDiv = document.createElement("div");
1212
polyglotDiv.setAttribute("id", "polyglot");
1313
polyglotDiv.classList.add("polyglot", "polyglot-lang-select", "flexrow");
14-
polyglotDiv.innerHTML = `
15-
${input}
16-
<label for="polyglot-checkbox">${game.i18n.localize("POLYGLOT.LanguageLabel")}</label>
17-
<select name='polyglot-language'></select>
18-
`;
14+
polyglotDiv.innerHTML = `${input}<select id='polyglot-language' name='polyglot-language'></select>`;
1915
html.querySelector(".chat-controls").insertAdjacentElement("afterend", polyglotDiv);
2016
html.querySelector(".polyglot-lang-select select").addEventListener("change", (ev) => {
2117
const lang = ev.target.value;
@@ -65,7 +61,7 @@ export default class PolyglotHooks {
6561
*/
6662
static preCreateChatMessage(message, data, options, userId) {
6763
const isCheckboxEnabled = !game.settings.get("polyglot", "displayCheckbox")
68-
|| game.polyglot.chatElement.find("input[name=polyglot-checkbox]").prop("checked");
64+
|| game.polyglot.chatElement.querySelector("input#polyglot-checkbox").checked;
6965
const isMessageLink = game.polyglot._isMessageLink(data.content);
7066
const isMessageInlineRoll = /\[\[(.*?)\]\]/g.test(data.content);
7167
// Message preprended by /desc from either Cautious GM Tools or Narrator Tools modules
@@ -77,7 +73,7 @@ export default class PolyglotHooks {
7773
message.style === CONST.CHAT_MESSAGE_STYLES.IC
7874
|| (message.style === CONST.CHAT_MESSAGE_STYLES.OOC && game.polyglot._allowOOC())
7975
) {
80-
let lang = game.polyglot.chatElement.find("select[name=polyglot-language]").val();
76+
let lang = game.polyglot.chatElement.querySelector("select#polyglot-language").value;
8177
const language = data.lang || data.language;
8278
if (language) {
8379
if (game.polyglot.languageProvider.languages[language]) {
@@ -103,24 +99,24 @@ export default class PolyglotHooks {
10399
* and adding the indicators ("Translated From" text and the globe icon).
104100
*
105101
* @param {ChatMessage} message The ChatMessage document being rendered
106-
* @param {JQuery} html The pending HTML as a jQuery object
102+
* @param {HTMLElement} html The pending HTML as a HTMLElement object
107103
* @param {Object} data The input data provided for template rendering
108104
*
109105
* @var {Boolean} known Determines if the actor actually knows the language, rather than being affected by Comprehend Languages or Tongues
110106
*/
111-
static async renderChatMessage(message, html, data) {
107+
static async renderChatMessageHTML(message, html, data) {
112108
const lang = message.getFlag("polyglot", "language");
113109
if (!lang) return;
114110

115111
if (game.polyglot.languageProvider.requiresReady && !game.ready) {
116112
Hooks.once("polyglot.languageProvider.ready", async () => {
117-
await PolyglotHooks.renderChatMessage(message, html, data);
113+
await PolyglotHooks.renderChatMessageHTML(message, html, data);
118114
});
119115
return;
120116
}
121117
// Skip for inline rolls
122118
if (!game.polyglot.knownLanguages.size) game.polyglot.updateUserLanguages();
123-
const metadata = html.find(".message-metadata");
119+
const metadata = html.querySelector(".message-metadata");
124120
const language = game.polyglot.languageProvider.languages?.[lang]?.label || lang;
125121
const known = game.polyglot.isLanguageKnown(lang);
126122
const understood = game.polyglot.isLanguageUnderstood(lang);
@@ -134,24 +130,26 @@ export default class PolyglotHooks {
134130
!game.polyglot._isTruespeech(lang) && !known && (game.user.character || isGM ? !understood : true);
135131
}
136132
const forceTranslation = message.polyglot_force || !message.polyglot_unknown;
137-
const messageContent = html.find(".message-content");
138-
const innerText = messageContent.text().trim();
133+
const messageContent = html.querySelector(".message-content");
134+
const innerText = messageContent.innerText.trim();
139135

140-
const content = $("<div>")
141-
.addClass("polyglot-original-text")
142-
.css({ font: game.polyglot._getFontStyle(lang) })
143-
.html(game.polyglot.scrambleString(innerText, message.id, lang));
144-
const translation = $("<div>")
145-
.addClass("polyglot-translation-text")
146-
.attr("data-tooltip", language)
147-
.attr("data-tooltip-direction", "UP")
148-
.html(message.content);
136+
const content = document.createElement("div");
137+
content.classList.add("polyglot-original-text");
138+
content.style.font = game.polyglot._getFontStyle(lang);
139+
content.innerHTML = game.polyglot.scrambleString(innerText, message.id, lang);
140+
141+
const translation = document.createElement("div");
142+
translation.classList.add("polyglot-translation-text");
143+
translation.setAttribute("data-tooltip", language);
144+
translation.setAttribute("data-tooltip-direction", "UP");
145+
translation.innerHTML = message.content;
149146

150147
if (
151148
displayTranslated
152149
&& (lang !== game.polyglot.languageProvider.defaultLanguage || message.polyglot_unknown)
153150
) {
154-
messageContent.empty().append(content);
151+
messageContent.innerText = "";
152+
messageContent.append(content);
155153

156154
if (
157155
forceTranslation
@@ -167,18 +165,21 @@ export default class PolyglotHooks {
167165
let color = "red";
168166
if ((isGM && !runifyGM) || known) color = "green";
169167
else if (understood) color = "blue";
170-
const title =
171-
isGM || known || game.polyglot._isTruespeech(lang)
172-
? `data-tooltip="${language}" data-tooltip-direction="LEFT"`
173-
: "";
174168
const clickable = isGM && (runifyGM || !displayTranslated);
175-
const button = $(`<a class="polyglot-message-language ${clickable ? "" : "unclickable"}" ${title}>
176-
<i class="fas fa-globe" style="color:${color}"></i>
177-
</a>`);
178-
metadata.find(".polyglot-message-language").remove();
169+
const button = document.createElement("a");
170+
button.className = `polyglot-message-language ${clickable ? "" : "unclickable"}`;
171+
button.innerHTML = `<i class="fas fa-globe" style="color:${color}"></i>`;
172+
if (isGM || known || game.polyglot._isTruespeech(lang)) {
173+
button.dataset.tooltip = language;
174+
button.dataset.tooltipDirection = "LEFT";
175+
}
176+
177+
const existing = metadata.querySelector(".polyglot-message-language");
178+
if (existing) metadata.removeChild(existing);
179+
179180
metadata.append(button);
180181
if (clickable) {
181-
button.on("click", game.polyglot._onGlobeClick.bind(this));
182+
button.addEventListener("click", game.polyglot._onGlobeClick.bind(this));
182183
}
183184
}
184185
}

‎src/module/logic.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ export class Polyglot {
2121
Hooks.on("updateUser", PolyglotHooks.updateUser);
2222
Hooks.on("updateActiveEffect", PolyglotHooks.updateActiveEffect);
2323
Hooks.on("preCreateChatMessage", PolyglotHooks.preCreateChatMessage);
24-
Hooks.on("renderChatMessage", PolyglotHooks.renderChatMessage);
24+
Hooks.on("renderChatMessageHTML", PolyglotHooks.renderChatMessageHTML);
2525
Hooks.on("createChatMessage", PolyglotHooks.createChatMessage);
2626
Hooks.on("renderActorDirectoryPF2e", PolyglotHooks.renderActorDirectoryPF2e);
2727
Hooks.on("vinoPrepareChatDisplayData", PolyglotHooks.vinoPrepareChatDisplayData);
@@ -435,7 +435,7 @@ export class Polyglot {
435435
const IgnoreJournalFontSize = game.settings.get("polyglot", "IgnoreJournalFontSize");
436436
toggleButton.click((ev) => {
437437
ev.preventDefault();
438-
let button = ev.currentTarget.firstChild;
438+
let button = ev.currentTarget.firstElementChild;
439439
runes = !runes;
440440
button.className = runes ? "fas fa-link" : "fas fa-unlink";
441441
const spans = document.element.find("span.polyglot-journal");

0 commit comments

Comments
 (0)