Extjs 4 - Application context help - find focused component

Question

I am thinking about implementing context help in my application and i wonder if it is possible to implement it the way i have in mind:

1. Register global shortcut to Ext.Body() ex. ctrl+h
2. Shortcut handler will find the focused component and call its showHelp method
3. If component have no showHelp method it will move to its parent and call showHelp method.

I wonder if step 2 is possible?. Or is there a better way to do this?

Answer 1

Ok i dig into it. At first i do the following to implement context help:

1. Created help plugin and added it to each component which should provide context help. The plugin register click listener to each component.
2. The fired click event registers its source into static HelpManager that holds reference to last focused component
3. Then after pressing shortcut i get the last component from HelpManager and fire context help using its help config.

Code:

    Ext.define('GSIP.core.help.GSIPHelp',{
        alias:'plugin.help',
        init: function(component) {
            //var me = this;
            component.on('afterrender',function(c) {
                //WHY FOCUS EVENT IS NOT WORKING?? ONLY CLICK.
                c.getEl().on('click',function() {
                    console.log('SHOUD REGISTER FOCUS');
                    GSIP.core.help.GSIPHelpMgr.registerFocus(component);
                });
            });
        }
    });

That solution had a serious flaw. If component has a parent and both of them got help plugin the click event is firing twice with parent as last.

During coding i found in docs Ext.FocusManager and that was it! Using it i am able to find focused component. Using simple function: if the component does not have help i scan through its parents to find one, if there is no parent i just show index, i was able to create context help.

    Ext.define('GSIP.core.help.Help',{
        mixins:{
            document:'GSIP.core.utils.Document'
        },
        url:'/GSIP/resources/gsip/core/help/html/',
        showHelp:function(comp) {

            if (comp.help != undefined) {
                this.showDocumentSrc(this.url + comp.help + '.html');
            }else{
                if (comp.ownerCt == undefined) {
                    this.showDocumentSrc(this.url + 'index.html');
                }else{
                    this.showHelp(comp.ownerCt);
                }
            }
        }
    });