From 1edeadb80daac3a0fcade94c2ffadbe6a41b6e67 Mon Sep 17 00:00:00 2001
From: Arkerthan <arkerthan@gmail.com>
Date: Sat, 29 May 2021 22:36:39 +0200
Subject: [PATCH] move css class based tooltips over to tippy.js
---
src/gui/options/options.js | 3 +-
src/gui/sideBar.js | 1 -
src/gui/tooltips.js | 101 +++++++++++++++++--------------------
src/js/eventHandlers.js | 1 +
4 files changed, 48 insertions(+), 58 deletions(-)
diff --git a/src/gui/options/options.js b/src/gui/options/options.js
index ee26f78f012..78d0300aa51 100644
--- a/src/gui/options/options.js
+++ b/src/gui/options/options.js
@@ -845,7 +845,8 @@ App.Intro.display = function(isIntro) {
options.addOption("Help tooltips are", "tooltipsEnabled")
.addValue("Enabled", 1).on().addValue("Disabled", 0).off()
- .addComment(`This is mostly for new players. <span class='exampleTooltip noteworthy'>Colored text</span> can have tooltips.`);
+ .addComment(`This is mostly for new players. <span class='exampleTooltip noteworthy'>Colored text</span> can have tooltips.`)
+ .addCallbackToEach(App.UI.GlobalTooltips.update);
options.addOption("Main menu slave tabs are", "useSlaveSummaryTabs")
.addValue("Enabled", 1).on().addValue("CardStyle", 2).on().addValue("Disabled", 0).off();
diff --git a/src/gui/sideBar.js b/src/gui/sideBar.js
index 9c1e8e3508a..07eb32e2ec9 100644
--- a/src/gui/sideBar.js
+++ b/src/gui/sideBar.js
@@ -8,7 +8,6 @@ App.Utils.scheduleSidebarRefresh = (function() {
function updateSidebar() {
refresh = false;
UIBar.update();
- App.UI.updateSidebarTooltips();
}
function schedule() {
diff --git a/src/gui/tooltips.js b/src/gui/tooltips.js
index dcb1e897e18..77d0c5e7201 100644
--- a/src/gui/tooltips.js
+++ b/src/gui/tooltips.js
@@ -1,63 +1,52 @@
-App.UI.updateSidebarTooltips = (function() {
- // The performance impact is around O(tooltips * nodes), with large passages (main, slave assignment report) adding
- // tooltips could potentially take a significant amount of time when there are many potential tooltips.
- const tooltips = {
- exampleTooltip: "I am a helpful tooltip. We are very rare because we are still in development.",
-
- devotion: "Devotion is a measure of a slave's love for you.",
- trust: "Trust is a measure of a slave's expectations of you and confidence to perform well.",
- defiant: "Defiant slaves will actively work against you.",
-
- flaw: "Flaws impend your slaves performance. Try removing or converting them into quirks.",
- intelligent: "More intelligent slaves tend to perform better.",
- stupid: "More intelligent slaves tend to perform better.",
- health: "The healthier your slaves, the better they perform.",
- libido: "Sex drive has various effects, generally higher is good.",
- positive: "This is good.",
- // noteworthy: "This is important.",
- warning: "This is very bad. Try removing the cause for this.",
-
- error: "Something just broke. Please report this.",
-
- cash: "Money. Always useful.",
- reputation: "Your reputation as a slaveowner. The more, the better.",
- /*
- red: "This is red, it's bad, if indicating a stat change it could be about money, reputation, mindbreak or flaw gain.",
- skill: "t",
- fetish: "t",
- relationship: "t",
- change: "t",
- virginity: "t",
- pregnant: "t",
- education: "t",
- */
- };
-
- /**
- * @param {Document|HTMLElement} container
- */
- function addTooltips(container) {
- if (V.tooltipsEnabled === 0) {
- return;
- }
- for (const tooltipsKey in tooltips) {
- const elements = container.getElementsByClassName(tooltipsKey);
- for (const element of elements) {
- element.title += `${tooltips[tooltipsKey]}\n`;
- }
+App.UI.GlobalTooltips = (function() {
+ let instances = [];
+
+ const tooltips = new Map([
+ [".exampleTooltip", "I am a helpful tooltip. We are very rare because we are still in development."],
+
+ [".devotion", "Devotion is a measure of a slave's love for you."],
+ [".trust", "Trust is a measure of a slave's expectations of you and confidence to perform well."],
+ [".defiant", "Defiant slaves will actively work against you."],
+
+ [".flaw", "Flaws impend your slaves performance. Try removing or converting them into quirks."],
+ [".intelligent", "More intelligent slaves tend to perform better."],
+ [".stupid", "More intelligent slaves tend to perform better."],
+ [".health", "The healthier your slaves, the better they perform."],
+ [".libido", "Sex drive has various effects, generally higher is better."],
+ [".positive", "This is good."],
+ [".warning", "This is very bad. Try removing the cause for this."],
+
+ [".error", "Something just broke. Please report this."],
+
+ [".cash", "Money. Always useful."],
+ [".reputation", "Your reputation as a slave owner. The higher, the better."],
+ ]);
+
+ function enable() {
+ disable();
+ instances = [];
+ for (const [identifier, tooltip] of tooltips.entries()) {
+ instances.push(tippy.delegate(document.body, {
+ target: identifier,
+ content: tooltip
+ }));
}
}
- function updateSidebar() {
- addTooltips(document.getElementById("story-caption"));
+ function disable() {
+ for (const instance of instances) {
+ instance.destroy();
+ }
+ instances = [];
}
- // passage
- $(document).on(":passagerender", e => addTooltips(e.content));
- // story caption
- $(document).on(":passageend", updateSidebar);
- // dialog
- $(document).on(":dialogopening", e => addTooltips(e.target));
+ function update() {
+ if (V.tooltipsEnabled === 1) {
+ enable();
+ } else {
+ disable();
+ }
+ }
- return updateSidebar;
+ return {update: update};
})();
diff --git a/src/js/eventHandlers.js b/src/js/eventHandlers.js
index eb50a55dcb8..ae5625cccbc 100644
--- a/src/js/eventHandlers.js
+++ b/src/js/eventHandlers.js
@@ -27,6 +27,7 @@ App.EventHandlers = function() {
function storyReady() {
App.UI.Theme.init();
App.UI.Hotkeys.init();
+ App.UI.GlobalTooltips.update();
}
function optionsChanged() {
--
GitLab