Hybrid View

  1. #1
    Ext JS Premium Member westy's Avatar
    Join Date
    Feb 2009
    Location
    Bath, UK
    Posts
    839
    Vote Rating
    39
    westy is a jewel in the rough westy is a jewel in the rough westy is a jewel in the rough

      0  

    Default Beta3 upgrade woes...

    Beta3 upgrade woes...


    Well, this is not going particularly well

    Have updated my application, and all controllers and models to not use their 'reg' methods, but be classes in their own right (with I think is a good idea btw, although would be nice to be able to include requires and statics in an application).

    Seems that 'pages' are no longer controlled by a controller though, apps have no 'defaultUrl', and there is no Router or Dispatch!
    What are you meant to do now then? The guide only has a single 'page' so that's not much use in this instance (although is a step in the right direction I think).

    For now am just putting my default page action into launch for now, just to get something on screen.
    Now hit an issue with 'layout.setOwner' is not a function... can see it getting called ok for lots of other layouts (after putting breakpoint on it), but the one it errors on is 'fit', i.e. a string and not an object.

    Not got time to come up with an example case at the moment, since my control structure is a little complex, but anyone else seen this, where a layout instance has not been created properly from the string?

    Appreciate any help.

    Cheers,
    Westy

  2. #2
    Sencha User steffenk's Avatar
    Join Date
    Jul 2007
    Location
    Haan, Germany
    Posts
    2,657
    Vote Rating
    6
    steffenk has a spectacular aura about steffenk has a spectacular aura about steffenk has a spectacular aura about

      0  

    Default


    i also have some problems to follow
    If i look to the nested loading examples, there are some magics inside, like:
    Code:
    me.getBookSideBar()
    or
    Code:
    me.getBookView().bind(record);
    me.getReviewList().bind(record, me.getReviewsStore());
    As these functions are not in code they are "magic" and not mentioned in the guide yet.
    Also the new syntax from the guide:
    Code:
    this.control({
        'viewport > panel': {
            render: this.onPanelRendered
        }
    });
    cool with component query, but normally you would prefer named ones.
    The nested loading use "selectors" in "refs", also not mentioned anywhere.

    Hard to get a complete picture without debugging example apps.

    westy, i think the control function is the one to use, also to change the views. it would be nice to have at least one example which uses different views in viewport, exchanging them etc.
    vg Steffen
    --------------------------------------
    Release Manager of TYPO3 4.5

  3. #3
    Ext JS Premium Member westy's Avatar
    Join Date
    Feb 2009
    Location
    Bath, UK
    Posts
    839
    Vote Rating
    39
    westy is a jewel in the rough westy is a jewel in the rough westy is a jewel in the rough

      0  

    Default


    Thanks for the reply.
    Yeah, suspect need to have a look at the control stuff, had enough for today though...

    Could those getters be like the automagic ones created by initConfig but for views and bbars perhaps?

  4. #4
    Sencha User
    Join Date
    Mar 2011
    Location
    Germany
    Posts
    198
    Vote Rating
    1
    Nickname is on a distinguished road

      0  

    Default


    A quick look into the sources and your good

    In the controller definition you have

    PHP Code:
    Ext.define('Books.controller.Books', {
        
    extend'Ext.app.Controller',
        
        
    models: ['Book'],
        
    stores: ['Books''Reviews'],  // <-- Reviews store => getReviewsStore()
        
        
    refs: [
            {
    ref'bookSideBar'selector'booksidebar'},
            {
    ref'bookView',    selector'bookview'},  //<--- ref: bookView => getBookView()
            
    {ref'reviewList',  selector'reviewlist'}
        ],
    /... 
    And in the Ext.app.Controller.js it takes the "refs" to generate the methods

    PHP Code:
            constructor: function(config) {
            
    this.mixins.observable.constructor.call(thisconfig);

            
    Ext.apply(thisconfig || {});

            
    this.createGetters('model'this.models);
            
    this.createGetters('store'this.stores);
            
    this.createGetters('view'this.views);

            if (
    this.refs) {
                
    this.ref(this.refs);       // <-- generate magic component query view ref
            
    }
        },
        
    createGetters: function(typerefs) {
            
    type Ext.String.capitalize(type);
            
    Ext.Array.each(refs, function(ref) {
                var 
    fn 'get',
                    
    parts ref.split('.');

                
    // Handle namespaced class names. E.g. feed.Add becomes getFeedAddView etc.
                
    Ext.Array.each(parts, function(part) {
                    
    fn += Ext.String.capitalize(part);
                });
                
    fn += type;

                if (!
    this[fn]) {
                    
    this[fn] = Ext.Function.pass(this['get' type], [ref], this);
                }
                
    // Execute it right away
                
    this[fn](ref);
            },
            
    this);
        },

        
    ref: function(refs) {
            var 
    me this;
            
    refs Ext.Array.from(refs);
            
    Ext.Array.each(refs, function(info) {
                var 
    ref info.ref,
                    
    fn 'get' Ext.String.capitalize(ref);
                if (!
    me[fn]) {
                    
    me[fn] = Ext.Function.pass(me.getRef, [refinfo], me);
                }
            });
        }, 
    In the createGetters() method the little nice comment, that namespaced stores, models and views are concatenated can be a pitfall.

    For the ComponentQuery: You can still use the xtype (or alias)

    PHP Code:
    this.control({".xtype_name"render: {}});
    this.control('.gridpanel'

  5. #5
    Ext JS Premium Member westy's Avatar
    Join Date
    Feb 2009
    Location
    Bath, UK
    Posts
    839
    Vote Rating
    39
    westy is a jewel in the rough westy is a jewel in the rough westy is a jewel in the rough

      0  

    Default


    Ok, after another hour of head scratching have got something on screen... changing a panel from a JSON object with an xtype to an Ext.create got around the layout string issue, although I have no idea why!

    Unfortunately nothing is laid out correctly now; two panels that should be in a border layout, with a split have only the top one showing; a very simple form panel for login now has no height!! Quite a mess!

    I really think the changes in beta3 are far too sweeping to warrant the fact we ever hit beta.
    I seem to remember the API was meant to be static once we got to beta?

    Oh well, guess I have to live with it and try and sort it out. Going to waste the best part of a day though where I should be wrestling with the new tree (or is that a table )!

    Frustrating....

  6. #6
    Ext JS Premium Member westy's Avatar
    Join Date
    Feb 2009
    Location
    Bath, UK
    Posts
    839
    Vote Rating
    39
    westy is a jewel in the rough westy is a jewel in the rough westy is a jewel in the rough

      0  

    Default


    Seems that setting bodyPadding on the form panel gives a height to it content... very odd...

Similar Threads

  1. GridPanel Woes...
    By Phunky in forum Ext.air for Adobe AIR
    Replies: 1
    Last Post: 8 May 2008, 1:58 AM
  2. autoScroll woes
    By junkzilla in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 5 May 2008, 12:21 PM
  3. template woes
    By FMIC_DEV in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 6 Feb 2008, 4:50 AM
  4. [2.0.1] Ext.urlEncode woes.
    By keithpitt in forum Ext 2.x: Bugs
    Replies: 1
    Last Post: 29 Jan 2008, 9:05 PM

Thread Participants: 8