Hook.js : how to access variables from an launched app

[ThierryC]

Hi,
i have a parent app which is launched from within the valence portal,

Depending on user actions, this parent app is opening a browser window outside of the portal.. (via window.open)

wid = 'w' + data.QUOTENR + data.VERSIE;  
QU10SET.config.arrWopen[wid] = window.open('vvcall.pgm?app=Comaker - DetailOfferte&pgm=vvinit&sid=' + sessionStorage.sid + '&versie=' + data.VERSIE + '&quotenr=' + data.QUOTENR, wid, 'width='+wwidth+', height=800, scrollbars=yes,resizable=yes,toolbar=no,menubar=no,top=180,left=30,location=no,statusbar=no');
QU10SET.config.arrWopen[wid].focus();

i keep track of all the openend 'child' windows in an array, and now i want to control those windows when i'm closing the tab from the parent app , or even when closing the portal totally..

i've added some logic in the hook.js in the beforecloseapp trigger, but i have the problem that my array which contains all of the opened child windows is not visible/known

how can i solve this ?

if (app.app === "1068") {
      var r=confirm("Other Windows from Comaker are still open!!\nclosing this app will also close the other windows!!");
      if (r==false) {return false;} 
      else {
        for (w in QU10SET.config.arrWopen) {
            if (!QU10SET.config.arrWopen[w].closed) {
               QU10SET.config.arrWopen[w].close();
            }    
        };
        return true;
     };
  }; 

[Johnny Major]

You could set the child windows directly on the parent.

if (!window.childWindows){
    window.childWindows = [];
}

//open window 
//
wid = 'w' + data.QUOTENR + data.VERSIE;
window.childWindows[wid] = window.open('vvcall.pgm?app=Comaker - DetailOfferte&pgm=vvinit&sid=' + sessionStorage.sid + '&versie=' + data.VERSIE + '&quotenr=' + data.QUOTENR, wid, 'width='+wwidth+', height=800, scrollbars=yes,resizable=yes,toolbar=no,menubar=no,top=180,left=30,location=no,statusbar=no');
window.childWindows[wid].focus();

Then get the reference to the parent when its closing and loop through those child windows

if (app.app === "1068") {
    var r=confirm("Other Windows from Comaker are still open!!\nclosing this app will also close the other windows!!");
    if (r==false) {return false;}
    else {
        var application = Valence.app.getReference(1068);
        if (!Ext.isEmpty(application) && !Ext.isEmpty(application.childWindows)){
            var childWindows = application.childWindows;
            for (w in childWindows) {
                if (!childWindows[w].closed) {
                    childWindows[w].close();
                }
            };
            return true;
        }
    };
}

[ThierryC]

Hi johnny,

thx for the quick reply.

i've learned something new.. didn't know that function (valence.app.getReference) even existed..

i've tried and it works like a charm!!

thx a lot..

thierry

[ThierryC]

Hi (again) johnny..
just one more question on this subject..
i've noticed that the hook.js is not launched when closing the whole browser... i expected that when closing the browser, which inevitably also closes the portal, the hook.js would be launched in cascade..

unless i did something wrong, but i don't see this happening...? is there a way to solve this also?

thx

thierry

[Johnny Major]

Thierry,

You could use the onbeforeunload/onunload on the portal to capture the closing of the portal.

In the Hook.js I would add the following code in the login method.

//get the Comaker Child Windows
//
var getComakerChildWindows = function(){
    var application = Valence.app.getReference(1068);
    if (!Ext.isEmpty(application) && !Ext.isEmpty(application.childWindows)){
        return application.childWindows;
    }
    return null;
};

//set the before unload to check if we have any Comaker child windows
// if we do alert the user with a custom message otherwise just 
// use the standard Valence Message
window.onbeforeunload = function(evt){
    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
        var childWindows = getComakerChildWindows();
        if (childWindows.length != 0){
            return Valence.lang.lit.valencePortal + '\n\nOther Windows from Comaker are still open!!\nclosing this app will also close the other windows!!';
        } else {
            return Valence.lang.lit.valencePortal;
        }
    }
};

//Check for an existing onunload so we can call it after our custom closing of Comaker windows
//
if (Ext.isEmpty(window.onunload)){
    window.defaultOnUnload = window.onunload;
}

window.onunload = function(){
    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
        //close any Comaker windows
        //
        var childWindows = getComakerChildWindows();
        for (w in childWindows) {
            if (!childWindows[w].closed) {
                childWindows[w].close();
            }
        };
    }

    //call default onunload
    //
    if (!Ext.isEmpty(window.defaultOnUnload) && typeof window.defaultOnUnload === 'function'){
        window.defaultOnUnload();
    }
};

[ThierryC]

Hi Johnny,

just tried out your suggestions.. but it does not seem to work.. maybe i misunderstood something..
was i right to add the code to the login event in the hook.js ? because it does not seem to work.. when i close the browser window, the familiar message : Valence Portal, are you sure you want to leave this page?
this is what i've made :

            login: function(user, sid) {
                
                var getComakerChildWindows = function() {
                    var application = Valence.app.getReference(1068);  
                    var childWindows = [];  //contains only opened windows
                    if (!Ext.isEmpty(application)) {
                        ww = application.QU10SET.config.arrWopen;
                        for (w in ww) {
                            if (!ww[w].closed) 
                            {
                                childWindows.push(ww[w]);
                            };
                        };
                    };
                    return childWindows;
                };
                //set the before unload to check if we have any Comaker child windows
                // if we do alert the user with a custom message otherwise just 
                // use the standard Valence Message
                window.onbeforeunload = function(evt){
                    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
                        var childWindows = getComakerChildWindows();
                        //check if elements
                        i=0; for (w in childWindows) {i++;};
                        if (i !== 0){
                            return Valence.lang.lit.valencePortal + '\n\nOther Windows from Comaker are still open!!\nclosing this app will also close the other windows!!';
                        } else {
                            return Valence.lang.lit.valencePortal;
                        }
                    }
                };
                
                //Check for an existing onunload so we can call it after our custom closing of Comaker windows
                //
                if (Ext.isEmpty(window.onunload)){
                    window.defaultOnUnload = window.onunload;
                }

                window.onunload = function(){
                    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
                        //close any Comaker windows
                        //
                        var childWindows = getComakerChildWindows();
                        for (w in childWindows) {
                            if (!childWindows[w].closed) {
                                childWindows[w].close();
                            }
                        };
                    }

                    //call default onunload
                    //
                    if (!Ext.isEmpty(window.defaultOnUnload) && typeof window.defaultOnUnload === 'function'){
                        window.defaultOnUnload();
                    }
                };
                
            },
            
            loginfailure: function(user) {},
            logout: function(user) {var r=confirm("Other Windows from Comaker are still open!!\nclosing this app will also close the other windows!!");},
            navtoolbarready: function(toolbar) {}, 

i've noticed that the portalhook also contains a winow.onunload... containing the standard message to confirm the closure of the window,
sure that i don't need to modify the code in the portalhook?

Thierry

[Johnny Major]

What version of Valence are your running? I assumed 3.2 and when looking at our 3.2 Development version I do not see anything in the Hook.js going after window.onunload.

[ThierryC]

getComakerChildWindows = function() {
    var childWindows = [];  //contains only opened windows
    var application = Valence.app.getReference(1068);  
    if (!Ext.isEmpty(application)) {
        ww = application.QU10SET.config.arrWopen;
        for (w in ww) {
            if (!ww[w].closed) 
            {
                childWindows.push(ww[w]);
            };
        };
    };
    return childWindows;
};

Ext.define('Portal.Hook', {
    singleton: true,
    constructor: function() {
        Portal.getApplication().on({
            scope: this,
            
            beforecloseapp: function(app) {
                // return false to prevent closing the app...
                var childWindows = getComakerChildWindows();  //contains open windows from app 1068
                i=0; for (w in childWindows) {i++;};
                if (i!==0) {
                    var r=confirm("Other Windows from Comaker are still open!!\nclosing this app will also close the other windows!!");
                    if (!r) {return false;} 
                    else {
                        for (w in childWindows)
                        {
                            if (!childWindows[w].closed) {childWindows[w].fnCancel();}   
                        };
                    };    
                };
                return true;
            },
        

            beforeenvironmentset: function(user, env) {
                // return false to prevent setting of environment...
            },
            beforelogin: function(params) {
                // return false to prevent login attempt...
            },
            beforelogout: function(user) {
                // return false to prevent logout...
//                alert('LOGOUT..' + sessionStorage.sid);
            },
            beforepoll: function(params) {},
            closeapp: function(app) {},
            componentrender: function(cmp) {},
            environmentset: function(user, env) {},
            launchapp: function(app) {},
            login: function(user, sid) {
                //set the before unload to check if we have any Comaker child windows
                // if we do alert the user with a custom message otherwise just 
                // use the standard Valence Message
                window.onbeforeunload = function(evt){
                    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
                        var childWindows = getComakerChildWindows();
                        //check if elements
                        i=0; for (w in childWindows) {i++;};
                        if (i !== 0){
                            return Valence.lang.lit.valencePortal + '\n\nOther Windows from Comaker are still open!!\nclosing this app will also close the other windows!!';
                        } else {
                            return Valence.lang.lit.valencePortal;
                        }
                    }
                };
                
                //Check for an existing onunload so we can call it after our custom closing of Comaker windows
                //
                if (!Ext.isEmpty(window.onunload)){
                    window.defaultOnUnload = window.onunload;
                }

                window.onunload = function(){
                    console.log('Hook.js- window.onunload');
                    alert('Hook.js- window.onunload');
                    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
                        //close any Comaker windows
                        //
                        var childWindows = getComakerChildWindows();
                        for (w in childWindows) {childWindows[w].close();}
                    };
                };

                //call default onunload
                //
                if (!Ext.isEmpty(window.defaultOnUnload) && typeof window.defaultOnUnload === 'function'){
                    window.defaultOnUnload();
                }
            },
            
            loginfailure: function(user) {},
            logout: function(user) {},
            navtoolbarready: function(toolbar) {},
            poll: function(rsp) {},
            settingsapplied: function() {
                Ext.apply(Portal.config.Settings, {});
            }
        });
    }
}); 

[Johnny Major]

I would put the method inside the hook.

Example

Ext.define('Portal.Hook', {
    singleton: true,
    constructor: function() {
        Portal.getApplication().on({
            scope: this,

            beforecloseapp: function(app) {
                var me = this;
                
                // return false to prevent closing the app...
                var childWindows = me.getComakerChildWindows();  //contains open windows from app 1068
                i=0; for (w in childWindows) {i++;};
                if (i!==0) {
                    var r=confirm("Other Windows from Comaker are still open!!\nclosing this app will also close the other windows!!");
                    if (!r) {return false;}
                    else {
                        for (w in childWindows)
                        {
                            if (!childWindows[w].closed) {childWindows[w].fnCancel();}
                        };
                    };
                };
                return true;
            },


            beforeenvironmentset: function(user, env) {
                // return false to prevent setting of environment...
            },
            beforelogin: function(params) {
                // return false to prevent login attempt...
            },
            beforelogout: function(user) {
                // return false to prevent logout...
//                alert('LOGOUT..' + sessionStorage.sid);
            },
            beforepoll: function(params) {},
            closeapp: function(app) {},
            componentrender: function(cmp) {},
            environmentset: function(user, env) {},
            launchapp: function(app) {},
            login: function(user, sid) {
                var me = this;
                //set the before unload to check if we have any Comaker child windows
                // if we do alert the user with a custom message otherwise just
                // use the standard Valence Message
                window.onbeforeunload = function(evt){
                    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
                        var childWindows = me.getComakerChildWindows();
                        //check if elements
                        i=0; for (w in childWindows) {i++;};
                        if (i !== 0){
                            return Valence.lang.lit.valencePortal + '\n\nOther Windows from Comaker are still open!!\nclosing this app will also close the other windows!!';
                        } else {
                            return Valence.lang.lit.valencePortal;
                        }
                    }
                };

                //Check for an existing onunload so we can call it after our custom closing of Comaker windows
                //
                if (!Ext.isEmpty(window.onunload)){
                    window.defaultOnUnload = window.onunload;
                }

                window.onunload = function(){
                    console.log('Hook.js- window.onunload');
                    alert('Hook.js- window.onunload');
                    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
                        //close any Comaker windows
                        //
                        var childWindows = me.getComakerChildWindows();
                        for (w in childWindows) {childWindows[w].close();}
                    };
                };

                //call default onunload
                //
                if (!Ext.isEmpty(window.defaultOnUnload) && typeof window.defaultOnUnload === 'function'){
                    window.defaultOnUnload();
                }
            },

            loginfailure: function(user) {},
            logout: function(user) {},
            navtoolbarready: function(toolbar) {},
            poll: function(rsp) {},
            settingsapplied: function() {
                Ext.apply(Portal.config.Settings, {});
            }
        });
    },

    getComakerChildWindows : function() {
        var childWindows = [];  //contains only opened windows
        var application = Valence.app.getReference(1068);
        if (!Ext.isEmpty(application)) {
            ww = application.QU10SET.config.arrWopen;
            for (w in ww) {
                if (!ww[w].closed)
                {
                    childWindows.push(ww[w]);
                };
            };
        };
        return childWindows;
    }
});

[ThierryC]

Thx Johnny ..

everything works ... thanks for the advice..

one last question (finally..i hope....)
I have a development and production environment where the app-id's unfortunately have a different number... (is there a way to retrieve the app-nbr by name.. or does the valence.app.getReference also accepts the name of the app..

(otherwise i have to keep and maintain 2 versions of the hook.js )

thx
thierry

[Johnny Major]

We do not have a helper method to get a app id from the apps name. I added a new method to your Hook to get the app id from the passed name "text". "getAppId" I updated the getComakerChildWindows method to use the new getAppId. You will just need to update the name passed to getAppId.

Ext.define('Portal.Hook', {
    singleton: true,
    constructor: function() {
        Portal.getApplication().on({
            scope: this,

            beforecloseapp: function(app) {
                var me = this;

                // return false to prevent closing the app...
                var childWindows = me.getComakerChildWindows();  //contains open windows from app 1068
                i=0; for (w in childWindows) {i++;};
                if (i!==0) {
                    var r=confirm("Other Windows from Comaker are still open!!\nclosing this app will also close the other windows!!");
                    if (!r) {return false;}
                    else {
                        for (w in childWindows)
                        {
                            if (!childWindows[w].closed) {childWindows[w].fnCancel();}
                        };
                    };
                };
                return true;
            },


            beforeenvironmentset: function(user, env) {
                // return false to prevent setting of environment...
            },
            beforelogin: function(params) {
                // return false to prevent login attempt...
            },
            beforelogout: function(user) {
                // return false to prevent logout...
//                alert('LOGOUT..' + sessionStorage.sid);
            },
            beforepoll: function(params) {},
            closeapp: function(app) {},
            componentrender: function(cmp) {},
            environmentset: function(user, env) {},
            launchapp: function(app) {},
            login: function(user, sid) {
                var me = this;
                //set the before unload to check if we have any Comaker child windows
                // if we do alert the user with a custom message otherwise just
                // use the standard Valence Message
                window.onbeforeunload = function(evt){
                    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
                        var childWindows = me.getComakerChildWindows();
                        //check if elements
                        i=0; for (w in childWindows) {i++;};
                        if (i !== 0){
                            return Valence.lang.lit.valencePortal + '\n\nOther Windows from Comaker are still open!!\nclosing this app will also close the other windows!!';
                        } else {
                            return Valence.lang.lit.valencePortal;
                        }
                    }
                };

                //Check for an existing onunload so we can call it after our custom closing of Comaker windows
                //
                if (!Ext.isEmpty(window.onunload)){
                    window.defaultOnUnload = window.onunload;
                }

                window.onunload = function(){
                    console.log('Hook.js- window.onunload');
                    alert('Hook.js- window.onunload');
                    if (!Portal.config.Runtime.getWithinLogout() && Portal.config.Runtime.getLoggedIn()){
                        //close any Comaker windows
                        //
                        var childWindows = me.getComakerChildWindows();
                        for (w in childWindows) {childWindows[w].close();}
                    };
                };

                //call default onunload
                //
                if (!Ext.isEmpty(window.defaultOnUnload) && typeof window.defaultOnUnload === 'function'){
                    window.defaultOnUnload();
                }
            },

            loginfailure: function(user) {},
            logout: function(user) {},
            navtoolbarready: function(toolbar) {},
            poll: function(rsp) {},
            settingsapplied: function() {
                Ext.apply(Portal.config.Settings, {});
            }
        });
    },

    getAppId : function(name){
        //get Valence application id from passed in name
        //
        var appsStore = (Portal) ? Portal.getApplication().getStore('Apps') : null,
            appId     = null;
        
        if (!Ext.isEmpty(appsStore)){
            appsStore.getRootNode().cascadeBy(function(node) {
                if (node.get('text') === name){
                    appId = node.get('misc2');
                    if (!Ext.isEmpty(appId)){
                        appId = parseInt(appId);
                    }
                }
            });
        }
        return appId;
    },

    getComakerChildWindows : function() {
        var me           = this,
            childWindows = [],
            appId        = me.getAppId('your apps name'),
            application  = null;
        
        if (!Ext.isEmpty(appId)){
            application = Valence.app.getReference(appId);
        }
        
        if (!Ext.isEmpty(application)) {
            ww = application.QU10SET.config.arrWopen;
            for (w in ww) {
                if (!ww[w].closed)
                {
                    childWindows.push(ww[w]);
                };
            };
        };
        return childWindows;
    }
});