PhoneGap Build produces broken app after upgrading from ST 2.0.1 to ST 2.1.

**riyaad** · 19 Nov 2012 12:35 AM

Originally Posted by AndiDog

Hi everyone, on request I updated my article Packaging a Sencha Touch 2 application with PhoneGap for Android to explain how to make it work with 2.1. I did not read this whole thread but I got my simple PhoneGap example to work fine using 2.1 and the Sencha Command utility.

Hope that helps!

Thank you very much!

**tobia.zorzan** · 19 Nov 2012 7:37 AM

In our tests, problems seems to be around line 90679 sencha-touch-all-debug.js.

Code:

Code:

/** * @private
 */
Ext.define('Ext.device.device.PhoneGap', {
    extend: 'Ext.device.device.Abstract',


    constructor: function() {
        // We can't get the device details until the device is ready, so lets wait.
        if (Ext.Viewport.isReady) {
            this.onReady();
        } else {
            Ext.Viewport.on('ready', this.onReady, this, {single: true});
        }
    },


    onReady: function() {
        this.name = device.name;
        this.uuid = device.uuid;
        this.platform = device.platformName || Ext.os.name;
    }

});

Ext.Viewport.isReady is undefined and application crashes.

**mhousser** · 19 Nov 2012 9:37 AM

We have bascially figured it out. It's about the new Ext.device.* references in sencha-touch-all.js. It works like a charm if you take them out.

Come take a look at the latest posts in the thread that I linked you to in my previous post.

**mhousser** · 19 Nov 2012 1:46 PM

tobia.zorzan, you are correct: it is the Ext.device.* references in the sencha*all.js for ST2.1 that breaks compatibility with PhoneGap.

Some of us have removed all such references, and then everything works fine.

In fact, there is already an internal bug with the Sencha devs to remove the Ext.device.* references from the *all.js.

It appears that using *all.js with phonegap is fundamentally broken without either A) modifying the *all.js, or

not using the *all.js, and using the Loader to obtain individual library includes on an as-needed basis.

**riyaad** · 20 Nov 2012 12:17 AM

Hi Mat

Are you saying that one should comment/remove ever possible reference of Ext.device.* in the sencha*all.js file? This is not a solution, rather a temporary hack. I'm going to try the latter solution provided - the load as you go solution and see what happens. Hopefully Sencha will have a fix in place for this shortly. Thanks again.

-R

**mhousser** · 20 Nov 2012 12:46 AM

Yes, this is what I'm saying.

This has worked for several people, and many others have already tracked it down to Ext.device.* references causing the break.

It doesn't take that long to remove these references - they are all in 1 big block of code - but yes, it's not ideal.

I feel safe saying this: Ext.device.* references are certainly the cause of incompatibility with phonegap.js include.

The Sencha team has an internal bug to remove Ext.device.* reference: I have been told this privately by a Sencha staff member. It seems they know something we don't; I expect they released something hugely flawed and are waiting before they officially announce that it is broken.

**riyaad** · 20 Nov 2012 12:58 AM

Thanks for that.
Seems the latter method also results in the same white screen (unless I'm loading something wrong here)

Code:

Ext.application({


    launch: function () {
    
        requires: [
            'Ext.TabPanel',
        ],


        Ext.create('Ext.TabPanel', {
            fullscreen: true,
            tabBarPosition: 'bottom',
            


            defaults: {
                styleHtmlContent: true
            },


            items: [
                {
                    title: 'Home',
                    iconCls: 'home',
                    html: 'Home Screen'
                },
                {
                    title: 'Contact',
                    iconCls: 'user',
                    html: 'Contact Screen'
                }
            ]
        })


    }
});

And ..

Code:

<!DOCTYPE html>


<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />      
        <meta name="description" content="blah">
        <meta name="keywords" content="blah">
        <meta name="format-detection" content="telephone=no" />
        
        <title>Title</title>            
    
        <script type="text/javascript" src="lib/cordova-2.1.0.js"></script>
        


        <script type="text/javascript">
            document.addEventListener("deviceready", function () {
                console.log("Cordova is loaded");                         
            }, false);
            
            Ext.Loader.setConfig({
                    enabled: true
            });
        </script>
        
    
        <link href="css/sencha-touch.css" rel="stylesheet" type="text/css"/>
        
        <script type="text/javascript" src="lib/sencha-touch-bebug.js"></script>
        <script type="text/javascript" src="app/test.js"></script>
        
    </head>
    <body></body>
</html>

Am I loading this correctly?

**riyaad** · 20 Nov 2012 1:03 AM

There's 247 occurrences of Ext.device, removing or commenting out these like

Code:

Ext.define('Ext.device.Communicator', {
    requires: [
        'Ext.device.communicator.Default',
        'Ext.device.communicator.Android'
    ],


    singleton: true,


    constructor: function() {
        if (Ext.os.is.Android) {
            return new Ext.device.communicator.Android();
        }


        return new Ext.device.communicator.Default();
    }
});

to become ...

Code:

//Ext.define('Ext.device.Communicator', {
//    requires: [
//        'Ext.device.communicator.Default',
//        'Ext.device.communicator.Android'
//    ],
//
//    singleton: true,
//
//    constructor: function() {
//        if (Ext.os.is.Android) {
//            return new Ext.device.communicator.Android();
//        }
//
//        return new Ext.device.communicator.Default();
//    }
//});

will comment out almost the entire lib. Is that correct?

**mhousser** · 20 Nov 2012 1:03 AM

What is 'lib/sencha-touch-bebug.js'? =P

**mhousser** · 20 Nov 2012 1:04 AM

Yes, you are removing a *lot* of code. You don't need to comment it out, you can just delete all of it. It's many hundreds of lines of code, but the good thing is that it is all 1 big block.

PhoneGap Build produces broken app after upgrading from ST 2.0.1 to ST 2.1.

Thread Tools

Search Thread

Display

Debug info

Debug info

We have..

We have..

Correct

Correct

Unfortunately

Unfortunately

Hehe

Hehe

Removal

Removal

Tags for this Thread