luci-base: add tooltip handling
authorFlorian Eckert <fe@dev.tdt.de>
Fri, 18 Dec 2020 14:33:52 +0000 (15:33 +0100)
committerFlorian Eckert <fe@dev.tdt.de>
Wed, 13 Jan 2021 10:59:02 +0000 (11:59 +0100)
Signed-off-by: Florian Eckert <fe@dev.tdt.de>
modules/luci-base/htdocs/luci-static/resources/form.js
modules/luci-base/htdocs/luci-static/resources/ui.js

index 1588bc7bfb71e49c4a5857718c5ace688c02ed18..4a4536bb9415d1008560e17a212d24dd29f46fe8 100644 (file)
@@ -3602,13 +3602,35 @@ var CBIFlagValue = CBIValue.extend(/** @lends LuCI.form.FlagValue.prototype */ {
         * @default 0
         */
 
+       /**
+        * Set a tooltip for the flag option.
+        *
+        * If set to a string, it will be used as-is as a tooltip.
+        *
+        * If set to a function, the function will be invoked and the return
+        * value will be shown as a tooltip. If the return value of the function
+        * is `null` no tooltip will be set.
+        *
+        * @name LuCI.form.TypedSection.prototype#tooltip
+        * @type string|function
+        * @default null
+        */
+
        /** @private */
        renderWidget: function(section_id, option_index, cfgvalue) {
+               var tooltip = null;
+
+               if (typeof(this.tooltip) == 'function')
+                       tooltip = this.tooltip.apply(this, [section_id]);
+               else if (typeof(this.tooltip) == 'string')
+                       tooltip = (arguments.length > 1) ? ''.format.apply(this.tooltip, this.varargs(arguments, 1)) : this.tooltip;
+
                var widget = new ui.Checkbox((cfgvalue != null) ? cfgvalue : this.default, {
                        id: this.cbid(section_id),
                        value_enabled: this.enabled,
                        value_disabled: this.disabled,
                        validate: L.bind(this.validate, this, section_id),
+                       tooltip: tooltip,
                        disabled: (this.readonly != null) ? this.readonly : this.map.readonly
                });
 
index e35a26a8baed201b4b9f14161f4b912ec50cf8ce..81e0b8182008959a958c3f4a3b6d5dd486174c90 100644 (file)
@@ -610,6 +610,17 @@ var UICheckbox = UIElement.extend(/** @lends LuCI.ui.Checkbox.prototype */ {
 
                frameEl.appendChild(E('label', { 'for': id }));
 
+               if (this.options.tooltip != null) {
+                       frameEl.appendChild(
+                               E('label', { 'class': 'cbi-tooltip-container' },[
+                                       "⚠️",
+                                       E('div', { 'class': 'cbi-tooltip' },
+                                               this.options.tooltip
+                                       )
+                               ])
+                       );
+               }
+
                return this.bind(frameEl);
        },