Orientation changes for iPad - Secha & PhoneGap

I was working on a mobile application developed for iPhone. The application was built using Sencha Touch and PhoneGap. Its great what these guys have done to bridge the gap between Objective C and HTML/JavaScript/CSS. The application now wants to be run on iPad.

The orientation was something that caused a problem here. The call back for the orientation, onorientationchange, was not being called for some reason. I went through most of the content in the web which described the problem. Solutions were limited.

I tried putting window.onorientationchange, added event listeners for orientation and even added Objective C code ! Did not work ...

Thats when onWindowResize came into picture. The code started working. But just once. You change orientation and that works just once. The code goes something like :

var or = function(){ 
    // alert( Ext.getOrientation()); 
    var width = (Ext.getOrientation()=="landscape") ? window.innerWidth-1 : window.innerWidth; 
    panel.setOrientation( Ext.getOrientation() , width , window.innerHeight ); 
    panel.el.parent().setSize(width, window.innerHeight); 
    // return 0; 
    panel.doComponentLayout(); 
} 
Ext.EventManager.onWindowResize(or);

The alert function caused a lot of issues for me. Firstly it creates an exception on the Objective C side. Signal Exception of some kind which says arguments are expected of a different kind. The setOrientation call is necessary for the panel to know the orientation. This did not update the width and height of the panel for some odd reason. So I did it manually by calling the setSize and to make sure I called the doComponentLayout.

Well, the code works now. This is for reference for all those people who have not still got the answers for this question.

Kudos !