1. #1
    Sencha User
    Join Date
    Oct 2013
    Posts
    5
    Vote Rating
    1
    madvas is on a distinguished road

      1  

    Default Ext.ux.panel.RegionTool

    Ext.ux.panel.RegionTool


    Hey guys,

    This panel plugin is based on ExtJS Kitchen Sink example. I made it into panel plugin so anyone can easily add it into their app. Plugin can be added into any panel, which is in border layout.

    The plugin adds 'gear' icon into a panel header, which user can use to dynamically change region of the panel in border layout.
    Add to panel as plugins property:
    plugins : ["regiontool"]

    https://github.com/madvas/extjs-ux-regiontool

    Code:
    Ext.define("Ext.ux.panel.RegionTool", {
        alias : 'plugin.regiontool',
        init  : function(parent) {
            this.parent = parent;
            this.parent.on({
                render : this.onParentRender,
                scope  : this
            });
        },
    
    
        onParentRender : function() {
            this.parent.addTool({
                type       : 'gear',
                callback   : function(panel, tool) {
                    var regionMenu = panel.regionMenu || (panel.regionMenu =
                        Ext.widget({
                            xtype : 'menu',
                            items : [
                                {
                                    text    : 'Top',
                                    checked : panel.region === 'north',
                                    group   : 'mainregion',
                                    handler : function() {
                                        panel.setBorderRegion('north');
                                    }
                                },
                                {
                                    text    : 'Bottom',
                                    checked : panel.region === 'south',
                                    group   : 'mainregion',
                                    handler : function() {
                                        panel.setBorderRegion('south');
                                    }
                                },
                                {
                                    text    : 'Right',
                                    checked : panel.region === 'east',
                                    group   : 'mainregion',
                                    handler : function() {
                                        panel.setBorderRegion('east');
                                    }
                                },
                                {
                                    text    : 'Left',
                                    checked : panel.region === 'west',
                                    group   : 'mainregion',
                                    handler : function() {
                                        panel.setBorderRegion('west');
                                    }
                                }
                            ]
                        }));
                    regionMenu.showBy(tool.el);
                }
            });
        }
    
    });


  2. #2
    Sencha User Misiu's Avatar
    Join Date
    Jun 2012
    Location
    Poland
    Posts
    241
    Vote Rating
    58
    Misiu is a jewel in the rough Misiu is a jewel in the rough Misiu is a jewel in the rough

      0  

    Default


    @madvas thanks for sharing.
    Could You also provide demo?

  3. #3
    Sencha - Support Team
    Join Date
    Feb 2013
    Location
    California
    Posts
    3,854
    Vote Rating
    66
    Gary Schlosberg has a spectacular aura about Gary Schlosberg has a spectacular aura about Gary Schlosberg has a spectacular aura about

      0  

    Default


    Thanks for sharing your work with the community! Yes, a demo or some images would be nice.
    Get on the Fast Track with Sencha Training http://sencha.com/training

  4. #4
    Sencha User
    Join Date
    Oct 2013
    Posts
    5
    Vote Rating
    1
    madvas is on a distinguished road

      0  

Thread Participants: 2

Tags for this Thread