Add initial JS files

core/src/main/resources/lib/layout/layout.jelly

@@ -255,6 +255,8 @@ THE SOFTWARE.
     </footer>
     </j:if>
 
+    <script src="${resURL}/jsbundles/tooltips.js" type="text/javascript" />
+
     <!-- SVG sprite polyfill for IE 11.
          Loaded at the end in order to not make modern browsers wait for it. This causes a flash-of-no-icons on IE 11  -->
     <script src="${resURL}/scripts/svgxuse.min.js" type="text/javascript" async="true" />

war/src/main/js/tooltips.js

@@ -0,0 +1,37 @@
+import tippy from "tippy.js"
+
+tippy("[tooltip]", {
+  content: element => element.getAttribute("tooltip"),
+  arrow: false,
+  theme: "tooltip",
+  animation: "tooltip"
+})
+
+tippy("[html-tooltip]", {
+  content: element => element.getAttribute("html-tooltip"),
+  allowHTML: true,
+  arrow: false,
+  theme: "tooltip",
+  animation: "tooltip"
+})
+
+function hoverNotification(text, element) {
+  let tooltip = tippy(element, {
+    interactive: true,
+    trigger: "hover",
+    followCursor: "initial",
+    arrow: false,
+    theme: "tooltip",
+    offset: [0, 0],
+    animation: "tooltip",
+    content: text,
+    onShow(instance) {
+      setTimeout(() => {
+        instance.hide()
+      }, 3000)
+    },
+  })
+  tooltip.show()
+}
+
+window.hoverNotification = hoverNotification

war/webpack.config.js

@@ -29,6 +29,7 @@ module.exports = (env, argv) => ({
       path.join(__dirname, "src/main/js/config-tabbar.js"),
       path.join(__dirname, "src/main/js/config-tabbar.less"),
     ],
+    "tooltips": [path.join(__dirname, "src/main/js/tooltips.js")],
     "sortable-drag-drop": [path.join(__dirname, "src/main/js/sortable-drag-drop.js")],
     "section-to-tabs": [path.join(__dirname, "src/main/js/section-to-tabs.js")],
     "filter-build-history": [path.join(__dirname, "src/main/js/filter-build-history.js")],