1. #1
    Sencha User metalinspired's Avatar
    Join Date
    Apr 2012
    Posts
    98
    Answers
    4
    Vote Rating
    4
    metalinspired is on a distinguished road

      0  

    Default Unanswered: Window deactivate event not firing

    Unanswered: Window deactivate event not firing


    Hi,

    While trying to implement a simple taskbar into my application I noticed that deactivate event doesn't fire.
    I create two windows and when I click on one of them it will fire activate event but the other one won't fire deactivate event.
    Is this a bug or am I missing something?

  2. #2
    Sencha User luisparada's Avatar
    Join Date
    Nov 2007
    Location
    Venezuela
    Posts
    95
    Answers
    2
    Vote Rating
    2
    luisparada is on a distinguished road

      0  

    Default


    Please post some code to see the what's going on... maybe you are missing something.
    ____________________________________
    do not make install, just compile it.!!!
    --------------------------------------------------
    //*************k4m1k4z3************\\

  3. #3
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,069
    Answers
    673
    Vote Rating
    467
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    You should use blur:

    Code:
    Ext.create('Ext.window.Window', {
        title: 'Window 1',
        height: 200,
        width: 400,
        layout: 'fit',
        html: 'click me to blur that other window!',
        listeners: {
            el: {
                blur: function() {
                    console.log('window 1 is all blurry')
                }
            }
        }
    }).show();
    
    Ext.create('Ext.window.Window', {
        title: 'Window 2',
        height: 200,
        width: 400,
        layout: 'fit',
        html: 'click me to blur that other window!',
        listeners: {
            el: {
                blur: function() {
                    console.log('window 2 is all blurry')
                }
            }
        }
    }).show();
    Scott.

  4. #4
    Sencha User metalinspired's Avatar
    Join Date
    Apr 2012
    Posts
    98
    Answers
    4
    Vote Rating
    4
    metalinspired is on a distinguished road

      0  

    Default


    I should have mentioned that i already tried blur and it didn't work either.
    Here is function that creates a button in taskbar and attaches needed events to button and window.

    Code:
    regWindow: function(win) {    
      var button = Ext.create('Ext.button.Button', {
        text: win.title,
        enableToggle: true,
        pressed: true,
        
        initComponent: function() {
          
          var me = this;
          
          me.on('toggle', function(el, pressed) {
            if (pressed) {
              win.show();
            } else {
              win.hide();
            }
          });
          
          win.on({
            close: function() {
              me.destroy();
            },
            hide: function() {
              me.toggle(false, true);
            },
            activate: function() {
              me.toggle(true, true);
              console.log('focus');
            },
            deactivate: function() {
              me.toggle(false, true);
              console.log('blur');
            },
          });
        }
      });
        
      this.add(button);
    },

  5. #5
    Sencha User metalinspired's Avatar
    Join Date
    Apr 2012
    Posts
    98
    Answers
    4
    Vote Rating
    4
    metalinspired is on a distinguished road

      0  

    Default


    I apologize for bumping the subject but des anyone have any advice?
    Is it a bug or I'm missing something in my code?
    Thank you

  6. #6
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,069
    Answers
    673
    Vote Rating
    467
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    See where you use deactivate, but not blur. Are you focusing anything in the window?
    Hard to tell since you only provided a snippet. Does my example work and can you provide a working test case of you setup?

    Scott.

  7. #7
    Sencha User metalinspired's Avatar
    Join Date
    Apr 2012
    Posts
    98
    Answers
    4
    Vote Rating
    4
    metalinspired is on a distinguished road

      0  

    Default


    I have just tried and, unfortunately, doesn't work.
    Still just fires focus.
    I did manage to get what I want by adding for() to deactivate buttons for all other windows besides the one receiving the focus.

    Code:
        regWindow: function(win) {        
            // Create button to represent window in taskbar
            var button = Ext.create('Ext.button.Button', {
                text: win.title,
                win: win,
                enableToggle: true,
                reorderable: true,
                
                initComponent: function() {
                    
                    var me = this;
                    
                    // Button events
                    me.on({
                        click: function(el, e, opt) {
                            // pressed is inverted since it is set before click event
                            if (!el.pressed) {
                                el.win.hide();
                            } else {
                                if (el.win.isHidden()) {
                                    el.win.show();
                                } else if (el.win != Ext.WindowManager.getActive()) {
                                    el.win.show();
                                } else {
                                    el.win.hide();
                                }
                            }
                            return false;
                        },
                        toggle: function() {
                            return false;
                        },
                    });
                    
                    // Window events
                    win.on({
                        close: function() {
                            me.destroy();
                        },
                        hide: function() {
                            me.toggle(false, true);
                        },
                        activate: function(el) {
                            me.toggle(true, true);
                            
                            /*
                             * Since deactivate event isn't firing this loop will emulate the behavior
                             */
                            for (var i=0; i < me.ownerCt.activeButtons.length; i++) {
                                if (me.ownerCt.activeButtons[i] != me) {
                                    me.ownerCt.activeButtons[i].toggle(false, true);
                                }
                            }
                        },/*
                        deactivate: function() {
                            me.toggle(false, true);
                            console.log('blur');
                        },*/
                    });
                }
            });
            
            /*
             * Array of buttons that represent windows in taskbar
             */
            this.activeButtons.push(button);
            
            // Add button to taskbar
            this.add(button);
        },

  8. #8
    Sencha User metalinspired's Avatar
    Join Date
    Apr 2012
    Posts
    98
    Answers
    4
    Vote Rating
    4
    metalinspired is on a distinguished road

      0  

    Default


    One more thing.
    Don't know if it's going to be of any help, but I'm not using controllers to manage any of components being created.

  9. #9
    Sencha User metalinspired's Avatar
    Join Date
    Apr 2012
    Posts
    98
    Answers
    4
    Vote Rating
    4
    metalinspired is on a distinguished road

      0  

    Default


    I just noticed that deactivate event is firing when window is being hidden by hide() method.

  10. #10
    Ext JS Premium Member Nigel's Avatar
    Join Date
    Nov 2008
    Location
    Hampshire, England
    Posts
    57
    Vote Rating
    2
    Nigel is on a distinguished road

      0  

    Default


    I've just noticed this problem as well while converting our app from v3.4 to v4.1.3. We are using Ext.WindowManager to manage windows in a desktop-like application. Previously (in v3.4), when a new window was added with its manager set, then its 'toFront' method (called from within its show method) would call the bringToFront method of the manager:

    Code:
        toFront : function(e){
            if(this.manager.bringToFront(this)){
                if(!e || !e.getTarget().focus){
                    this.focus();
                }
            }
            return this;
        },
    Ultimately, the WindowManager's setActiveWin method gets triggered, which calls setActive(false) on the current 'front' window, which results in the deactivate event being fired. It then sets the 'front' window to the passed window and calls its setActive(true), which fires the activate event.

    In ExtJS v4, Ext.WindowManager is different - it is just an instance of the new ZIndexManager, which doesn't include all the same methods as the old WindowManager (it has more generic use managing z-indexes in components including combo-boxes etc, but now lacks specific logic for managing windows).

    I'd argue that it's a bug that the behaviour is not the same as in v3.4 - specifically that there is no actual WindowManager class that is specifically designed to manage multiple windows, including triggering the activate/deactivate events as per the equivalent in v3.4).

    I'm looking at figuring out a manual workaround to get the deactivate event to fire - I'll update this thread if/when I figure that out.