init

LICENSE

+                   GNU LESSER GENERAL PUBLIC LICENSE
+                       Version 3, 29 June 2007
+
+ Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
+
+
+  This version of the GNU Lesser General Public License incorporates
+the terms and conditions of version 3 of the GNU General Public
+License, supplemented by the additional permissions listed below.
+
+  0. Additional Definitions.
+
+  As used herein, "this License" refers to version 3 of the GNU Lesser
+General Public License, and the "GNU GPL" refers to version 3 of the GNU
+General Public License.
+
+  "The Library" refers to a covered work governed by this License,
+other than an Application or a Combined Work as defined below.
+
+  An "Application" is any work that makes use of an interface provided
+by the Library, but which is not otherwise based on the Library.
+Defining a subclass of a class defined by the Library is deemed a mode
+of using an interface provided by the Library.
+
+  A "Combined Work" is a work produced by combining or linking an
+Application with the Library.  The particular version of the Library
+with which the Combined Work was made is also called the "Linked
+Version".
+
+  The "Minimal Corresponding Source" for a Combined Work means the
+Corresponding Source for the Combined Work, excluding any source code
+for portions of the Combined Work that, considered in isolation, are
+based on the Application, and not on the Linked Version.
+
+  The "Corresponding Application Code" for a Combined Work means the
+object code and/or source code for the Application, including any data
+and utility programs needed for reproducing the Combined Work from the
+Application, but excluding the System Libraries of the Combined Work.
+
+  1. Exception to Section 3 of the GNU GPL.
+
+  You may convey a covered work under sections 3 and 4 of this License
+without being bound by section 3 of the GNU GPL.
+
+  2. Conveying Modified Versions.
+
+  If you modify a copy of the Library, and, in your modifications, a
+facility refers to a function or data to be supplied by an Application
+that uses the facility (other than as an argument passed when the
+facility is invoked), then you may convey a copy of the modified
+version:
+
+   a) under this License, provided that you make a good faith effort to
+   ensure that, in the event an Application does not supply the
+   function or data, the facility still operates, and performs
+   whatever part of its purpose remains meaningful, or
+
+   b) under the GNU GPL, with none of the additional permissions of
+   this License applicable to that copy.
+
+  3. Object Code Incorporating Material from Library Header Files.
+
+  The object code form of an Application may incorporate material from
+a header file that is part of the Library.  You may convey such object
+code under terms of your choice, provided that, if the incorporated
+material is not limited to numerical parameters, data structure
+layouts and accessors, or small macros, inline functions and templates
+(ten or fewer lines in length), you do both of the following:
+
+   a) Give prominent notice with each copy of the object code that the
+   Library is used in it and that the Library and its use are
+   covered by this License.
+
+   b) Accompany the object code with a copy of the GNU GPL and this license
+   document.
+
+  4. Combined Works.
+
+  You may convey a Combined Work under terms of your choice that,
+taken together, effectively do not restrict modification of the
+portions of the Library contained in the Combined Work and reverse
+engineering for debugging such modifications, if you also do each of
+the following:
+
+   a) Give prominent notice with each copy of the Combined Work that
+   the Library is used in it and that the Library and its use are
+   covered by this License.
+
+   b) Accompany the Combined Work with a copy of the GNU GPL and this license
+   document.
+
+   c) For a Combined Work that displays copyright notices during
+   execution, include the copyright notice for the Library among
+   these notices, as well as a reference directing the user to the
+   copies of the GNU GPL and this license document.
+
+   d) Do one of the following:
+
+       0) Convey the Minimal Corresponding Source under the terms of this
+       License, and the Corresponding Application Code in a form
+       suitable for, and under terms that permit, the user to
+       recombine or relink the Application with a modified version of
+       the Linked Version to produce a modified Combined Work, in the
+       manner specified by section 6 of the GNU GPL for conveying
+       Corresponding Source.
+
+       1) Use a suitable shared library mechanism for linking with the
+       Library.  A suitable mechanism is one that (a) uses at run time
+       a copy of the Library already present on the user's computer
+       system, and (b) will operate properly with a modified version
+       of the Library that is interface-compatible with the Linked
+       Version.
+
+   e) Provide Installation Information, but only if you would otherwise
+   be required to provide such information under section 6 of the
+   GNU GPL, and only to the extent that such information is
+   necessary to install and execute a modified version of the
+   Combined Work produced by recombining or relinking the
+   Application with a modified version of the Linked Version. (If
+   you use option 4d0, the Installation Information must accompany
+   the Minimal Corresponding Source and Corresponding Application
+   Code. If you use option 4d1, you must provide the Installation
+   Information in the manner specified by section 6 of the GNU GPL
+   for conveying Corresponding Source.)
+
+  5. Combined Libraries.
+
+  You may place library facilities that are a work based on the
+Library side by side in a single library together with other library
+facilities that are not Applications and are not covered by this
+License, and convey such a combined library under terms of your
+choice, if you do both of the following:
+
+   a) Accompany the combined library with a copy of the same work based
+   on the Library, uncombined with any other library facilities,
+   conveyed under the terms of this License.
+
+   b) Give prominent notice with the combined library that part of it
+   is a work based on the Library, and explaining where to find the
+   accompanying uncombined form of the same work.
+
+  6. Revised Versions of the GNU Lesser General Public License.
+
+  The Free Software Foundation may publish revised and/or new versions
+of the GNU Lesser General Public License from time to time. Such new
+versions will be similar in spirit to the present version, but may
+differ in detail to address new problems or concerns.
+
+  Each version is given a distinguishing version number. If the
+Library as you received it specifies that a certain numbered version
+of the GNU Lesser General Public License "or any later version"
+applies to it, you have the option of following the terms and
+conditions either of that published version or of any later version
+published by the Free Software Foundation. If the Library as you
+received it does not specify a version number of the GNU Lesser
+General Public License, you may choose any version of the GNU Lesser
+General Public License ever published by the Free Software Foundation.
+
+  If the Library as you received it specifies that a proxy can decide
+whether future versions of the GNU Lesser General Public License shall
+apply, that proxy's public statement of acceptance of any version is
+permanent authorization for you to choose that version for the
+Library.

README.md

+# Tooltip Manager
\ No newline at end of file

index.js

+"use strict";
+
+class ToolTipsManager {
+    constructor(args = {}) {
+        if (!window.tooltip_manager_registered) {
+            this.init(args);
+        } else {
+            // Avoid having mutiple instances of this manager in the same window.
+            console.warn("A TooltipManager instance already exists in that window, this one will be cancelled.");
+            this.cancelled = true;
+        }
+    }
+
+    init(args) {
+        this.pop_tooltip_delay = Math.max(50, args.pop_tooltip_delay || 250);
+
+        const style = Object.assign({
+            backgroundColor: "#000c",
+            color: "white",
+            borderRadius: "8px",
+            padding: "15px 20px",
+            fontSize: "16px",
+            maxWidth: "300px",
+        }, args.style || {});
+
+        this.tooltip_maxwidth = parseInt(style.maxWidth.replace("px", ""));
+
+        this.state = {
+            tooltip_target: document.createElement("div"),
+            tooltip_text: "",
+            tooltip_element: (function () {
+                const el = document.createElement("div");
+                el.style.position = "absolute";
+                el.style.display = "none";
+                Object.entries(style).forEach(kv => {
+                    const [attr, value] = kv;
+                    el.style[attr] = value;
+                });
+                document.body.appendChild(el);
+                return el;
+            })()
+        };
+
+        this.on_mouseleave_tooltip_element_listener = () => {
+            this.state.tooltip_target.removeEventListener("mouseleave", this.on_mouseleave_tooltip_element_listener);
+            this.clear_tooltip();
+        };
+
+        this.on_mousestop_listener = e_target => {
+            if (e_target === this.state.tooltip_target) return;
+
+            let recursion_state = 4;
+            let tooltip_target = e_target;
+            const find_tooltip = function (node) {
+                if (!node) return undefined;
+
+                if (node.tooltip) {
+                    tooltip_target = node;
+                    return node.tooltip;
+                } else if (recursion_state > 0) {
+                    recursion_state--;
+                    const rec_find = find_tooltip(node.parentNode);
+
+                    if (rec_find) {
+                        return rec_find;
+                    }
+
+                } else return undefined
+            };
+
+            const tooltip = find_tooltip(e_target);
+
+            if (tooltip) {
+                this.state.tooltip_target = tooltip_target;
+                const target_bounds = tooltip_target.getBoundingClientRect();
+
+                if (target_bounds.left === 0 && target_bounds.top === 0) return;
+
+                this.state.tooltip_text = tooltip;
+                this.state.tooltip_element.innerHTML = this.state.tooltip_text;
+                this.state.tooltip_element.style.display = "block";
+                const el_bounds = this.state.tooltip_element.getBoundingClientRect();
+                const el_height = el_bounds.height;
+                const el_width = el_bounds.width;
+
+                const left = parseInt(target_bounds.left);
+                const top = parseInt(target_bounds.top - el_height - 5);
+                const right = left + el_width;
+                const window_width = document.documentElement.clientWidth;
+
+                this.state.tooltip_element.style.left = (
+                    window_width - right < 0 ?
+                        left + (window_width - right)
+                        : left
+                ).toString() + "px";
+
+                this.state.tooltip_element.style.top = parseInt(
+                    top < 0 ? target_bounds.bottom + 5 : target_bounds.top - el_height - 5
+                ).toString() + "px";
+
+                this.state.tooltip_target.addEventListener("mouseleave", this.on_mouseleave_tooltip_element_listener);
+            } else if (this.state.tooltip_text !== ""
+                && !Array.from(
+                    this.state.tooltip_target.getElementsByTagName('*')
+                ).slice(0, 4).includes(tooltip_target)) {
+
+                this.clear_tooltip();
+            }
+        };
+
+        this.listener_move = e => {
+            if (this.move_timeout_id) {
+                clearTimeout(this.move_timeout_id);
+            }
+            this.move_timeout_id = setTimeout(this.on_mousestop_listener.bind(this, e.target), this.pop_tooltip_delay);
+        };
+
+        window.addEventListener("mousemove", this.listener_move);
+        window.tooltip_manager_registered = true;
+    }
+
+    clear_tooltip() {
+        this.state.tooltip_target = document.createElement("div");
+        this.state.tooltip_element.style.display = "none";
+        this.state.tooltip_text = "";
+    }
+
+    clear() {
+        if (this.cancelled) return;
+
+        delete window.tooltip_manager_registered;
+
+        this.state.tooltip_element.remove();
+
+        if (this.move_timeout_id) {
+            clearTimeout(this.move_timeout_id);
+        }
+        window.removeEventListener("mousemove", this.listener_move);
+    }
+}
+
+module.exports = ToolTipsManager;
\ No newline at end of file

package-lock.json

+{
+  "name": "tooltips-manager",
+  "version": "0.1.0",
+  "lockfileVersion": 2,
+  "requires": true,
+  "packages": {
+    "": {
+      "version": "0.1.0",
+      "license": "LGPL-3.0"
+    }
+  }
+}

package.json

+{
+  "name": "tooltips-manager",
+  "version": "0.1.0",
+  "description": "A Javascript tool to provide a custom tooltip solution",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://gitlab.com/kuadrado-software.fr/tooltip-manager.git"
+  },
+  "keywords": [
+    "Javascript",
+    "tooltip",
+    "html5",
+    "web",
+    "tool",
+    "util"
+  ],
+  "author": "Kuadrado Software",
+  "license": "LGPL-3.0",
+  "bugs": {
+    "url": "https://gitlab.com/kuadrado-software.fr/tooltip-manager/issues"
+  },
+  "homepage": "https://gitlab.com/kuadrado-software.fr/tooltip-manager#readme"
+}