1. #31
    Sencha User fangzhouxing's Avatar
    Join Date
    Mar 2007
    Posts
    466
    Vote Rating
    1
    fangzhouxing is on a distinguished road

      0  

    Default


    jbum,can you provide the actual code?

    By the way, anyone can explain to me what the variable newTools in following code means? (I think it is not necessary!)

    Code:
    Ext.ux.MaximizeTool = function() {
        this.init= function(ct) {
            var maximizeTool = {
                id: 'maximize', 
                handler: handleMaximize, 
                scope: ct, 
                qtip: 'Maximize'
            }; 
            ct.tools = ct.tools || [];
            var newTools = ct.tools.slice();
            ct.tools =newTools;
    ...
    Last edited by mystix; 23 Jul 2008 at 10:29 PM. Reason: post code in [code][/code] tags. refer to http://extjs.com/forum/misc.php?do=bbcode

  2. #32
    Sencha User
    Join Date
    Mar 2008
    Posts
    566
    Vote Rating
    0
    moegal is on a distinguished road

      0  

    Default


    Hi,

    This is really useful. Thanks!

    How would I call the minimize function? I have a grid in the portlet and when I click on a row I need to do an action and minimize the max window.

    I am calling the plugin like:

    plugins : new Ext.ux.MaximizeTool()

    Thanks, Marty

  3. #33
    Ext User
    Join Date
    Jul 2009
    Posts
    8
    Vote Rating
    0
    euphORIA is on a distinguished road

      0  

    Default


    this plug-in has been very helpful. Many thanks!

    Now I am trying to modify it a little bit to display some extra hidden columns in the maximized panel.

    PHP Code:
    function handleMaximize(eventtoolElpanel){
            
    panel.originalOwnerCt panel.ownerCt;
            
    panel.originalPosition panel.ownerCt.items.indexOf(panel);
            
    panel.originalSize=panel.getSize();
            
            
    // Display hidden Columns
            
    var columns panel.getColumnModel().getColumnsBy(function(c){
                return 
    c.hidden;
            });
            
            for(var 
    i=0len=columns.length;i<len;i++) {
                
    columns[i].hidden false;
            }
            
            
    panel.getView().fitColumns(false);
            
    panel.getView().updateAllColumnWidths();
            
    panel.doLayout();
            
    // End of modifications

            
    if (!toolEl.window) {
                var 
    defaultConfig = {
                    
    id: (panel.getId() + '-MAX'),
                    
    width: (Ext.getBody().getSize().width 100),
                    
    height: (Ext.getBody().getSize().height 100),
                    
    resizabletrue,
                    
    draggabletrue,
                    
    closabletrue,
                    
    closeAction'hide',
                    
    hideBorderstrue,
                    
    plaintrue,
                    
    layout'fit',
                    
    autoScrollfalse,
                    
    borderfalse,
                    
    bodyBorderfalse,
                    
    frametrue,
                    
    pinnedtrue,
                    
    bodyStyle'background-color: #ffffff;'
                
    };
                
    toolEl.window = new Ext.Window(defaultConfig);
                
    toolEl.window.on('hide'handleMinimizepanel);
            }
            if (!
    panel.dummyComponent) {
                var 
    dummyCompConfig = {
                    
    titlepanel.title,
                    
    widthpanel.getSize().width,
                    
    heightpanel.getSize().height,
                    
    html'&nbsp;'
                
    };
                
    panel.dummyComponent = new Ext.Panel(dummyCompConfig);
            }
            
            
    toolEl.window.add(panel);
            if (
    panel.tools['toggle']) panel.tools['toggle'].setVisible(false);
            
    panel.tools['maximize'].setVisible(false);

            
    panel.originalOwnerCt.insert(panel.originalPositionpanel.dummyComponent);
            
    panel.originalOwnerCt.doLayout();
            
    panel.dummyComponent.setSize(panel.originalSize);
            
    panel.dummyComponent.setVisible(true);
            
    panel.dummyComponent.getEl().mask('This is maximized.');
            
    toolEl.window.show(this);
        }; 
    Unfortunately the panel does not seems to get refreshed (take the new columns into account) and the previously hidden columns are not visible because its width is 0 or close to it.

    This is my panel grid code, which is inside a viewport with a fit layout:

    PHP Code:
    // create the Grid
                
    var grid = new Ext.grid.GridPanel({
                    
    storepagingProxyStore//2.3
                    
    itemId'maxTable',
                    
    columns: [
                        {
    id:'procId'header""width25fixedtruedataIndex'procId'rendererrenderSubtypeAndBasculement},
                        {
    header""width25fixedtruedataIndex'procId'rendererrenderClassIcon},
                        {
    header"Auteur"width50sortabletruedataIndex'auteur'},
                        {
    header"Référence Interne"width150sortabletruedataIndex'refDg'},
                        {
    header"Réceptionnée le"width100sortabletruedataIndex'modifDate'rendererExt.util.Format.dateRenderer('d/m/Y')},
                        {
    header"State"width100sortabletruedataIndex'state'hiddentrue},
                        {
    header""width25fixedtruedataIndex'procId'rendererrenderPrintLink},
                        {
    header""width25fixedtruedataIndex'procId'rendererrenderUseLink}
                    ],
                    
    stripeRowsfalse,
                    
    collapsibletrue,
                    
    autoHeighttrue,
                    
    iconCls'icon-page',
                    
    borderfalse,
                    
    plugins: [
                        new 
    Ext.ux.MaximizeTool(),
                        new 
    Ext.ux.grid.AutoSizeColumns()
                    ],
                    
    viewConfig: {
                        
    forceFittrue,
                        
    scrollOffset0,
                        
    getRowClass: function(recordindex){
                            return (
    record.data.procType '-row');
                        }
                    },
                    
    bbarpagingToolBar
                    
                
    }); 

    I have been searching in the forums and trying different suggestions but I did not find a solution.

    Please, help me. I am a newbie and still have a lot to learn

  4. #34
    Sencha User
    Join Date
    Mar 2008
    Posts
    566
    Vote Rating
    0
    moegal is on a distinguished road

      0  

    Default


    Anyone?

    Thanks, Marty

    Quote Originally Posted by moegal View Post
    Hi,

    This is really useful. Thanks!

    How would I call the minimize function? I have a grid in the portlet and when I click on a row I need to do an action and minimize the max window.

    I am calling the plugin like:

    plugins : new Ext.ux.MaximizeTool()

    Thanks, Marty

  5. #35
    Ext JS Premium Member
    Join Date
    Mar 2008
    Location
    Moscow
    Posts
    137
    Vote Rating
    0
    Chemist is on a distinguished road

      0  

    Default


    Did someone test this plugin on ExtJS 3.0?

  6. #36
    Ext JS Premium Member prakashpaudel's Avatar
    Join Date
    May 2009
    Location
    Kathmandu, Nepal
    Posts
    58
    Vote Rating
    0
    prakashpaudel is on a distinguished road

      0  

    Default


    Thanks Ram Krishna, It worked for me. I was doing maximizing in another way, but this is nice. I am switching to it. And thanks again.

  7. #37
    Ext JS Premium Member prakashpaudel's Avatar
    Join Date
    May 2009
    Location
    Kathmandu, Nepal
    Posts
    58
    Vote Rating
    0
    prakashpaudel is on a distinguished road

      0  

    Default


    Quote Originally Posted by Chemist View Post
    Did someone test this plugin on ExtJS 3.0?
    Worked for me on ExtJS 2.2 and 3.0

  8. #38
    Ext User
    Join Date
    May 2009
    Posts
    5
    Vote Rating
    0
    praveendh is on a distinguished road

      0  

    Default destroy dummycomponent for panel

    destroy dummycomponent for panel


    In the below pulgin, when I minimize the panel , I also want to destroy the dummy panel component. I have added this line to minimize handler, this.dummyComponent.destroy();
    But i still get an object in panel.dummyComponent when i try to maximize the panel for second time. is there any way i can get rid of this dummy component and recreate it everytime I maximize the panel.
    Code:
    Ext.ux.MaximizeTool = function() {
        this.init= function(ct) {
            var maximizeTool = {
                id: 'maximize', 
                handler: handleMaximize, 
                scope: ct, 
                qtip: 'Maximize'
            }; 
            ct.tools = ct.tools || [];
            var newTools = ct.tools.slice();
            ct.tools =newTools;
            for(var i=0, len=ct.tools.length;i<len;i++) {
                if (ct.tools[i].id=='maximize') return;
            }
            ct.tools[ct.tools.length] = maximizeTool;
        };
    
        function handleMaximize(event, toolEl, panel){
            panel.originalOwnerCt = panel.ownerCt;
            panel.originalPosition = panel.ownerCt.items.indexOf(panel);
            panel.originalSize=panel.getSize();
    
            if (!toolEl.window) {
                var defaultConfig = {
                    id: (panel.getId() + '-MAX'),
                    width: (Ext.getBody().getSize().width - 100),
                    height: (Ext.getBody().getSize().height - 100),
                    resizable: true,
                    draggable: true,
                    closable: true,
                    closeAction: 'hide',
                    hideBorders: true,
                    plain: true,
                    layout: 'fit',
                    autoScroll: false,
                    border: false,
                    bodyBorder: false,
                    frame: true,
                    pinned: true,
                    bodyStyle: 'background-color: #ffffff;'
                };
                toolEl.window = new Ext.Window(defaultConfig);
                toolEl.window.on('hide', handleMinimize, panel);
            }
            //alert(panel.dummyComponent);
            if (!panel.dummyComponent) {
                var dummyCompConfig = {
                    title: panel.title,
                    width: panel.getSize().width,
                    height: panel.getSize().height,
                    html: '&nbsp;'
                };
                panel.dummyComponent = new Ext.Panel(dummyCompConfig);
            }
            
            toolEl.window.add(panel);
            if (panel.tools['toggle']) panel.tools['toggle'].setVisible(false);
            panel.tools['maximize'].setVisible(false);
    
            panel.originalOwnerCt.insert(panel.originalPosition, panel.dummyComponent);
            panel.originalOwnerCt.doLayout();
            panel.dummyComponent.setSize(panel.originalSize);
            panel.dummyComponent.setVisible(true);
            panel.dummyComponent.getEl().mask('This is maximized.');
            toolEl.window.show(this);
        };
        
        function handleMinimize(window) {
            this.dummyComponent.getEl().unmask();
            this.dummyComponent.setVisible(false);
            this.originalOwnerCt.insert(this.originalPosition, this);
            this.originalOwnerCt.doLayout(); 
            this.setSize(this.originalSize);
            this.tools['maximize'].setVisible(true);
            if (this.tools['toggle']) this.tools['toggle'].setVisible(true);
            this.dummyComponent.destroy();
        }
        
        
    };
    Last edited by mystix; 5 Mar 2010 at 7:13 AM. Reason: POST CODE IN [code][/code] TAGS. see http://extjs.com/forum/misc.php?do=bbcode#code

  9. #39
    Touch Premium Member
    Join Date
    Apr 2007
    Posts
    24
    Vote Rating
    0
    cassebn is on a distinguished road

      0  

    Question Possible to use in TabPanel?

    Possible to use in TabPanel?


    Has anyone had success with this UX in a tab panel? Out of the box implementation inserts a new blank tab on minimize instead of adding the maximized grid back into the tab it was originally contained in.

  10. #40
    Ext User
    Join Date
    May 2010
    Location
    INDIA
    Posts
    4
    Vote Rating
    0
    RajaSelvaraj is on a distinguished road

      0  

    Default Data missing when we close the panel

    Data missing when we close the panel


    hi,

    Panel maximize is working for me. but If I click the close button the panel . panel closed and the data are missing.

    Thanks,
    Raja S

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..."