Results 1 to 7 of 7

Thread: getOrientation

  1. #1
    Sencha User riyaad's Avatar
    Join Date
    Jul 2011
    Location
    Cape Town
    Posts
    245
    Answers
    6

    Default getOrientation

    Hi All,

    Could someone please tell me why I'm getting this error (below) after doing a "sencha app build" when navigating to ../build/myapp/production in my browser?

    Error evaluating http://localhost/myapp/build/myapp/production/app.js with message: TypeError: 'undefined' is not a function (evaluating 'Ext.viewport.Default.getOrientation()')

    Note I've also tried Ext.Viewport.getOrientation() - same issue =(

  2. #2
    Sencha Premium User mrsunshine's Avatar
    Join Date
    Sep 2008
    Location
    Germany - Darmstadt
    Posts
    693
    Answers
    21

    Default

    HTML Code:
    Ext.Viewport.getOrientation()
    is correct! Pleas post the context where you call the function.

  3. #3
    Sencha User riyaad's Avatar
    Join Date
    Jul 2011
    Location
    Cape Town
    Posts
    245
    Answers
    6

    Default

    Hi, thank you for your response ...

    This is in my form

    requires: [
    'Ext.field.Select',
    'Ext.form.FieldSet',
    'Ext.viewport.Default'
    ],

    ...

    Code:
                {
                    xtype: 'fieldset',
                    title: 'Showing on...',
                    items: {
                        xtype: 'selectfield',
                        labelAlign: 'left',
                        labelWidth: getLabelWidth(),
                        userClearIcon: true,
                        label: 'Bouquet:',
                        name : 'bouquet',
                        valueField  : 'bouquet_value',
                        displayField: 'bouquet_name',
                        store: 'BouquetSelect'
                    }
                }
    and ...

    Code:
    function getLabelWidth() {
    
    
        if (Ext.os.deviceType  == 'Phone') {
    
    
            if (Ext.Viewport.getOrientation() == 'portrait') { // portrait
                labelwidth = 100;
            }
    
    
            if (Ext.Viewport.getOrientation() == 'landscape') { // landscape
                labelwidth = 140
            }
        }
    
    
        if ((Ext.os.deviceType  == 'Tablet') || (Ext.os.deviceType == 'Desktop')){ // device not a phone
    
    
            if (Ext.Viewport.getOrientation() == 'portrait') { // portrait
                labelwidth = 160;
            }
    
    
            if (Ext.Viewport.getOrientation() == 'landscape') { // landscape
                labelwidth = 180;
            }
        }
        return labelwidth;
    }

  4. #4
    Sencha Premium User mrsunshine's Avatar
    Join Date
    Sep 2008
    Location
    Germany - Darmstadt
    Posts
    693
    Answers
    21

    Default

    Make sure that the function does not get called before App launch and Ext.Viewport exists, if you rn it directly in Ext.define it can be to early. try to set the label with after initialze

  5. #5
    Sencha User riyaad's Avatar
    Join Date
    Jul 2011
    Location
    Cape Town
    Posts
    245
    Answers
    6

    Default

    Hi
    The app runs correctly in the browser, it's the build version that doesn't fire up. Does the minifying and merging processes stuff around with the order of loading?

  6. #6
    Sencha Premium User mrsunshine's Avatar
    Join Date
    Sep 2008
    Location
    Germany - Darmstadt
    Posts
    693
    Answers
    21

    Default

    Most likely in you build file the Ext.define and you get labelWidth stuff get executed before Ext.Viewport exists.

    That why you should run you labelWidth stuff after you app got lunched. Most likely when you create a instance of your form

  7. #7
    Ext JS Premium Member Spenna's Avatar
    Join Date
    Apr 2008
    Posts
    68
    Answers
    2

    Default TypeError: Cannot read property 'getOrientation' of undefined

    I got the same error as you mention, this came up in Chromes console when trying to view the built version:
    Code:
    Error evaluating ... with message: TypeError: Cannot read property 'getOrientation' of undefined
    My issue was using Ext.Viewport.getOrientation() in the config part of a component, which was used to define the style of an image.
    Of course Ext.Viewport is not loaded at that time in the built app, so the solution was to add an initialize method to the component.

    I.e instead of:
    Code:
    // component definition
    config: {
        style: Ext.Viewport.getOrientation() == 'portrait' ? 'height:80px;margin:auto' : 'height:40px;margin:auto'
    }
    I did somethink like this:
    Code:
    config: {
    ...
    },
    initialize: function() {
        this.style = Ext.Viewport.getOrientation() == 'portrait' ? 'height:80px;margin:auto' : 'height:40px;margin:auto';
        this.callParent(arguments);
    }

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •