Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
WEBUI: add tooltips to form items
  • Loading branch information
perexg committed Dec 4, 2015
1 parent 3837f5f commit c35ef56
Show file tree
Hide file tree
Showing 4 changed files with 67 additions and 33 deletions.
1 change: 1 addition & 0 deletions src/dvr/dvr_config.c
Expand Up @@ -938,6 +938,7 @@ const idclass_t dvr_config_class = {
.type = PT_BOOL,
.id = "epg-running",
.name = N_("Use EPG running state"),
.desc = N_("Use EITp/f to decide event start / stop"),
.off = offsetof(dvr_config_t, dvr_running),
.opts = PO_ADVANCED,
.def.u32 = 1,
Expand Down
2 changes: 2 additions & 0 deletions src/prop.c
Expand Up @@ -415,6 +415,8 @@ prop_serialize_value

/* Metadata */
htsmsg_add_str(m, "caption", tvh_gettext_lang(lang, pl->name));
if (pl->desc)
htsmsg_add_str(m, "description", tvh_gettext_lang(lang, pl->desc));
if (pl->islist) {
htsmsg_add_u32(m, "list", 1);
if (pl->def.list)
Expand Down
3 changes: 2 additions & 1 deletion src/prop.h
Expand Up @@ -66,8 +66,9 @@ typedef enum {
* Property definition
*/
typedef struct property {
const char *id; ///< Property Key
const char *id; ///< Property Key
const char *name; ///< Textual description
const char *desc; ///< Verbose description (tooltip)
prop_type_t type; ///< Type
uint8_t islist; ///< Is a list
uint8_t group; ///< Visual group ID (like ExtJS FieldSet)
Expand Down
94 changes: 62 additions & 32 deletions src/webui/static/app/idnode.js
Expand Up @@ -235,6 +235,7 @@ tvheadend.IdNodeField = function(conf)
*/
this.id = conf.id;
this.text = conf.caption || this.id;
this.description = conf.description || null;
this.type = conf.type;
this.list = conf.list;
this.rdonly = conf.rdonly;
Expand Down Expand Up @@ -625,6 +626,7 @@ tvheadend.idnode_uilevel_menu = function(uilevel, handler)
*/
tvheadend.idnode_editor_field = function(f, conf)
{
var r = null;
var d = f.rdonly || false;
if (f.wronly && !conf.create)
d = false;
Expand All @@ -638,7 +640,7 @@ tvheadend.idnode_editor_field = function(f, conf)
var st = tvheadend.idnode_enum_store(f);
var fromst = tvheadend.idnode_enum_select_store(f, st, false);
var tost = tvheadend.idnode_enum_select_store(f, st, true);
return new Ext.ux.ItemSelector({
r = new Ext.ux.ItemSelector({
name: f.id,
fromStore: fromst,
toStore: tost,
Expand All @@ -660,7 +662,7 @@ tvheadend.idnode_editor_field = function(f, conf)
if (f.list)
cons = Ext.ux.form.LovCombo;
var st = tvheadend.idnode_enum_store(f);
var r = new cons({
r = new cons({
fieldLabel: f.caption,
name: f.id,
value: value,
Expand Down Expand Up @@ -692,7 +694,6 @@ tvheadend.idnode_editor_field = function(f, conf)
st.on('load', fn);
}

return r;
/* TODO: listeners for regexp?
listeners : {
keyup: function() {
Expand All @@ -710,28 +711,30 @@ tvheadend.idnode_editor_field = function(f, conf)
/* Singular */
switch (f.type) {
case 'bool':
return new Ext.ux.form.XCheckbox({
r = new Ext.ux.form.XCheckbox({
fieldLabel: f.caption,
name: f.id,
checked: value,
disabled: d
});
break;

case 'time':
if (!f.duration) {
if (d) {
var dt = new Date(value * 1000);
value = f.date ? dt.toLocaleDateString() :
dt.toLocaleString();
return new Ext.form.TextField({
r = new Ext.form.TextField({
fieldLabel: f.caption,
name: f.id,
value: value,
disabled: true,
width: 300
});
break;
}
return new Ext.ux.form.TwinDateTimeField({
r = new Ext.ux.form.TwinDateTimeField({
fieldLabel: f.caption,
name: f.id,
value: value,
Expand All @@ -749,6 +752,7 @@ tvheadend.idnode_editor_field = function(f, conf)
allowBlank: true
}
});
break;
}
/* fall thru!!! */

Expand All @@ -758,36 +762,39 @@ tvheadend.idnode_editor_field = function(f, conf)
case 's64':
case 'dbl':
if (f.hexa) {
return new Ext.form.TextField({
r = new Ext.form.TextField({
fieldLabel: f.caption,
name: f.id,
value: '0x' + value.toString(16),
disabled: d,
width: 300,
maskRe: /[xX0-9a-fA-F\.]/
});
break;
}
if (f.intsplit) {
/* this should be improved */
return new Ext.form.TextField({
r = new Ext.form.TextField({
fieldLabel: f.caption,
name: f.id,
value: value,
disabled: d,
width: 300,
maskRe: /[0-9\.]/
});
break;
}
return new Ext.form.NumberField({
r = new Ext.form.NumberField({
fieldLabel: f.caption,
name: f.id,
value: value,
disabled: d,
width: 300
});
break;

case 'perm':
return new Ext.form.TextField({
r = new Ext.form.TextField({
fieldLabel: f.caption,
name: f.id,
value: value,
Expand All @@ -798,11 +805,11 @@ tvheadend.idnode_editor_field = function(f, conf)
allowBlank: false,
blankText: _('You must provide a value - use octal chmod notation, e.g. 0664')
});

break;

default:
cons = f.multiline ? Ext.form.TextArea : Ext.form.TextField;
return new cons({
r = new cons({
fieldLabel: f.caption,
name: f.id,
value: value,
Expand All @@ -812,6 +819,29 @@ tvheadend.idnode_editor_field = function(f, conf)
});

}

if (f.description) {
r.on('render', function(c) {
Ext.QuickTips.register({
target: c.getEl(),
text: f.description
});
Ext.QuickTips.register({
target: c.wrap,
text: f.description
});
Ext.QuickTips.register({
target: c.label,
text: f.description
});
});
r.on('beforedestroy', function(c) {
Ext.QuickTips.unregister(c.getEl());
Ext.QuickTips.unregister(c.wrap);
Ext.QuickTips.unregister(c.label);
});
}
return r;
};

/*
Expand Down Expand Up @@ -1006,7 +1036,7 @@ tvheadend.idnode_editor = function(_uilevel, item, conf)
var uilevel = _uilevel;

function destroy() {
panel.removeAll();
panel.removeAll(true);
}

function build() {
Expand Down Expand Up @@ -2214,8 +2244,10 @@ tvheadend.idnode_form_grid = function(panel, conf)
}

function roweditor_destroy() {
if (current)
if (current && current.editor) {
mpanel.remove(current.editor);
current.editor.destroy();
}
current = null;
}

Expand All @@ -2233,21 +2265,19 @@ tvheadend.idnode_form_grid = function(panel, conf)
success: function(d) {
d = json_decode(d);
roweditor_destroy();
var editor = new tvheadend.idnode_editor(uilevel, d[0], {
title: _('Parameters'),
labelWidth: 300,
fixedHeight: true,
help: conf.help || null,
inTabPanel: true,
noButtons: true,
width: 730,
noautoWidth: true,
showpwd: conf.showpwd
});
current = {
uuid: d[0].id,
editor: editor
}
current = new Object();
current.uuid = d[0].id;
current.editor = new tvheadend.idnode_editor(uilevel, d[0], {
title: _('Parameters'),
labelWidth: 300,
fixedHeight: true,
help: conf.help || null,
inTabPanel: true,
noButtons: true,
width: 730,
noautoWidth: true,
showpwd: conf.showpwd
});
abuttons.save.setDisabled(false);
abuttons.undo.setDisabled(false);
if (abuttons.del)
Expand All @@ -2256,7 +2286,7 @@ tvheadend.idnode_form_grid = function(panel, conf)
abuttons.up.setDisabled(false);
abuttons.down.setDisabled(false);
}
mpanel.add(editor);
mpanel.add(current.editor);
mpanel.doLayout();
}
});
Expand Down Expand Up @@ -2286,7 +2316,7 @@ tvheadend.idnode_form_grid = function(panel, conf)
}
});

var mpanel = new Ext.Panel({
mpanel = new Ext.Panel({
tbar: buttons,
layout: 'hbox',
padding: 5,
Expand All @@ -2309,9 +2339,9 @@ tvheadend.idnode_form_grid = function(panel, conf)
return;
if (conf.comet)
tvheadend.comet.un(conf.comet, update);
mpanel = null;
dpanel.removeAll(true);
store.destroy();
mpanel = null;
store = null;
if (conf.destroyer)
conf.destroyer(conf);
Expand Down

0 comments on commit c35ef56

Please sign in to comment.