[SOLVED] Changing the Valence title bar (spot with the login)

[ktoole]

This link:
http://cnxforum.com/showthread.php?2...ence-framework
was how to do this with version 1.1. This was just to change the information with fixed information. Really what I want to do is get some values that I put in as session values using vvUtility_saveSessVar, onto this screen so the user can see how their session values are set. Is there a way I can get at this spot?

If I can't get at this, can I get at the browser tab to put the add this information to this spot? The preferred location would be in the title bar area.

[robert.swanson]

Are you looking to make a one-time adjustment to the header in conjunction with the login process, or could the value(s) that show in the header change at some point after they're successfully logged in?

[ktoole]

Wanting to set the value at login, but also when they run a particular program, change the values that display. When this is done, all the tabs that are open are closed.

[sean.lanktree]

Hi Ken -

I would suggest using the "Hook.js" file for this. You can hook into the "componentrender" event for the xtype of "navtoolbar".

componentrender : function(cmp){
    if (cmp.xtype === 'navtoolbar'){
        // do something....retrieve the "item" in the navtoolbar that you want to change...or cmp.add({something});
    }
}

If you want to do something when a particular app is launched, use the "launchapp" event:

launchapp : function(app){
    if (app.app == '1001'){
        var navToolbar = Ext.ComponentQuery.query('navtoolbar')[0];
        navToolbar.doSomething();
    }
}

[robert.swanson]

Just to add to the thread, if your app needs to programmatically change the text you could also do something like this...

First, use Hook.js to add the initial text to the toolbar, i.e.:

    navtoolbarready : function(toolbar){
        toolbar.insert(3,{
            xtype:'tbtext',
            text: 'I am special',
            itemId: 'specialHeaderText'
        });
    }

Then when your app needs to change the text:

    var tbSpecialText=this.parent.Ext.ComponentQuery.query('#specialHeaderText')[0];
    tbSpecialText.setText('I am VERY special now');

[ktoole]

Okay, now I see why the hook.js file exists. Now the problem I have is that the data I want is back on the IBMi. How can I do an AJAX call in hook.js? I tried and it complains that the app parameter is not valid. That is correct, I don't have an app to get the two pieces of data I want to put on the screen. Do I need to create one and hide it from the users or is there some other way I can get at the data in the session file on the IBMi?

[sean.lanktree]

If you add the name of your back-end program to VVNAQ100, then vvcall will not validate the "app" and your ajax request should go through. VVNAQ100 holds a list of "no authority needed" programs.

[ktoole]

I added the program to VVNAQ100. I put in an alert on both componentrender and navtoolbarready. With just the alert there, it works as expected. When I add an AJAX call the alert does not fire and the AJAX call is not processed. Is something happening that is causing all the code for the two config options to be skipped when there is an AJAX call in there?

I missed a syntax error, that's why they AJAX call was not running. When you put something in here and the syntax is not right, the browser (firefox) just skips the error and does not tell you that you have a problem in firebug. Just not accustomed to that. Usually firebug stops on everything, including the try...catch statements.

[sean.lanktree]

Can you post the code?

[ktoole]

Here is the code and it works fine:

            navtoolbarready : function(toolbar){
    			Ext.Ajax.request({
    				url: 'vvcall.pgm',
        		    params: {
        		        action : 'getACL',
        		        pgm    : 'MLPACL'
        		    },
        		    success: function(response){
        		        var check = response.responseText;
        		        if (check) {
        		            var data = Ext.JSON.decode(response.responseText);
        		            if (data.SUCCESS == '1') {
        		            	toolbar.insert(3,{
        		                    xtype     : 'displayfield',
        		                    fieldLabel: '<b>Company</b>',
        		                    value     : '<p style="font-size:16px; color:red">'+data.COMPNAME+'</p>',
        		                    itemId    : 'headerCompanyName',
        		                    padding   : "0 5 0 125",
        		                    labelWidth: 60
        		                });
        		            	toolbar.insert(4,{
        		                    xtype     : 'displayfield',
        		                    fieldLabel: '<b>Location</b>',
        		                    value     : '<p style="font-size:16px; color:red">'+data.LOCNAME+'</p>',
        		                    itemId    : 'headerLocationName',
        		                    padding   : "0 5 0 5",
        		                    labelWidth: 60
        		                });
        		            } else if (data.SUCCESS == '0') {
        		                Valence.util.msg('<center>'+data.MSG+'</center>','');
        		            }
        		        }
        		    },
        		    failure: function(){
        		        Ext.getBody().unmask();
        		        Valence.util.msg('<center>Failed to receive a server response</center>','');
        		    }
        		});
            },

Now the problem I have is in the second instance of Valence we are running. I get a cryptic error of "app is not defined" when logging into the second instance. The Hook.js file works there, but this other error that shows up in firebug is causing other programs to fail.

The "app is not defined" is no longer a problem either. I used CTRL-SHIFT-DEL and erased the cache. This appears to have corrected the issue. The reload I was doing was not clearing all the source files out there. Just want you to know that all is working in both environments as expected. Thanks for the help.