Merge pull request #4667 from TDT-AG/pr/20201218-luci-base-tooltip
luci-base: add generic tooltip handling
This commit is contained in:
commit
4f3934172c
4 changed files with 70 additions and 0 deletions
|
@ -236,7 +236,19 @@ return view.extend({
|
|||
o.modalonly = false;
|
||||
o.default = o.enabled;
|
||||
o.editable = true;
|
||||
o.tooltip = function(section_id) {
|
||||
var weekdays = uci.get('firewall', section_id, 'weekdays');
|
||||
var monthdays = uci.get('firewall', section_id, 'monthdays');
|
||||
var start_time = uci.get('firewall', section_id, 'start_time');
|
||||
var stop_time = uci.get('firewall', section_id, 'stop_time');
|
||||
var start_date = uci.get('firewall', section_id, 'start_date');
|
||||
var stop_date = uci.get('firewall', section_id, 'stop_date');
|
||||
|
||||
if (weekdays || monthdays || start_time || stop_time || start_date || stop_date )
|
||||
return _('Time restritions are enabled for this rule');
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
o = s.taboption('advanced', form.ListValue, 'direction', _('Match device'));
|
||||
o.modalonly = true;
|
||||
|
|
|
@ -158,6 +158,14 @@ return view.extend({
|
|||
|
||||
o = s.taboption('general', form.Flag, 'masq', _('Masquerading'));
|
||||
o.editable = true;
|
||||
o.tooltip = function(section_id) {
|
||||
var masq_src = uci.get('firewall', section_id, 'masq_src')
|
||||
var masq_dest = uci.get('firewall', section_id, 'masq_dest')
|
||||
if (masq_src || masq_dest)
|
||||
return _('Limited masquerading enabled');
|
||||
|
||||
return null;
|
||||
};
|
||||
|
||||
o = s.taboption('general', form.Flag, 'mtu_fix', _('MSS clamping'));
|
||||
o.modalonly = true;
|
||||
|
|
|
@ -3602,13 +3602,47 @@ 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
|
||||
*/
|
||||
|
||||
/**
|
||||
* Set a tooltip icon.
|
||||
*
|
||||
* If set, this icon will be shown for the default one.
|
||||
* This could also be a png icon from the resources directory.
|
||||
*
|
||||
* @name LuCI.form.TypedSection.prototype#tooltipicon
|
||||
* @type string
|
||||
* @default 'ℹ️';
|
||||
*/
|
||||
|
||||
/** @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,
|
||||
tooltipicon: this.tooltipicon,
|
||||
disabled: (this.readonly != null) ? this.readonly : this.map.readonly
|
||||
});
|
||||
|
||||
|
|
|
@ -610,6 +610,22 @@ var UICheckbox = UIElement.extend(/** @lends LuCI.ui.Checkbox.prototype */ {
|
|||
|
||||
frameEl.appendChild(E('label', { 'for': id }));
|
||||
|
||||
if (this.options.tooltip != null) {
|
||||
var icon = "⚠️";
|
||||
|
||||
if (this.options.tooltipicon != null)
|
||||
icon = this.options.tooltipicon;
|
||||
|
||||
frameEl.appendChild(
|
||||
E('label', { 'class': 'cbi-tooltip-container' },[
|
||||
icon,
|
||||
E('div', { 'class': 'cbi-tooltip' },
|
||||
this.options.tooltip
|
||||
)
|
||||
])
|
||||
);
|
||||
}
|
||||
|
||||
return this.bind(frameEl);
|
||||
},
|
||||
|
||||
|
|
Loading…
Reference in a new issue