Page 36 Example never fires in my emulator

[RollOn2]

Hi everyone. Question. I am using the latest ADK with an emulator to Android 2.1. I've only managed to get to page 37 but the example will not populate any values because the method never fires. I am assuming by the syntax that the "$(window).bind(canDetect ? "orientationchange" : "resize", function(evt) {" requires the emulator to rotate or resize, both of which I have no idea how to do on the emulator. So the example code never trips the function call which I tested with a simple alert() statement inside the function.

so, how do I get the emulator to rotate or resize? I cant drag to resize it and can not find any menu options to rotate the emulator.

Also, how does one debug android development? Javascript in FireFox is easy with FireBug but how does one know when there is a syntax or something wrong in the JS in android land?

Thanks.

Elijah

[RollOn2]

Okay. part of issue found. Page 13 specifies that 2.1 will primarily be used as the emulator. When running emulator 2.1 canDetect returns false, while emulator 2.2 returns true. Don't see anything for the example I'm stuck on that says I need to use 2.2.

[RollOn2]

Another issue is that it appears the emulator is caching the data.

How do I disable the cacheing? Menu --> reload is not clearing it.

[Damon Oehlman]

Hey Elijah,

I'll have a look into both of these things and get back to you as soon as possible.  As far as I'm aware you aren't able to rotate the Android emulator - which is a pain in the neck.  If you have worked with the iPhone emulator in the past you will be even more frustrated by this limitation.

As far as debugging goes, I tend to spend most of my time in either Google Chrome (or Chromium) or Safari.  The reason I prefer these browsers over Firefox is that the Android browser is a mobile webkit browser so is closely related to both Chrome and Safari.  Firefox uses it's own rendering engine (Gecko, I think) which tends to yield different results and these become especially obvious once you start getting into the CSS3 styling that we talk about later in the book.

Additionally, I would recommend having a look at the Appendix on debugging as it walks you through how to use "adb logcat" to capture javascript errors that are encountered in the emulator. This is where Android is a bit stronger than iOS development tools.  

Another tool that is showing a bit of promise but is only in very early release stages is: 

http://pmuellr.github.com/weinre/

It's something I intend to use in the future....

Cheers,

Damon.

--
Damon Oehlman
http://distractable.net/

[RollOn2]

I think caching was part of the issue on my emulator. So initial loading of the example will not cause the values to populate, however by clicking on the menu button it triggers the resize event or something which will then cause the function to trip. But, when i had an alert statement in there it just kept getting executed in an infinite call. Not sure if it was due to the alert popping or that the menu was up causing a constant evt.

So I modified the code slightly to include at the top of the page a var called.

var lastRotationText = null;

and then at the end of the example put a conditional in place. If you can tell me, would this conditional fire when the rotation toggles between portrait and landscape?

if(lastRotationText != rotationText){

alert('lastRotationText: ' + lastRotationText);

lastRotationText = rotationText;

        // I'm not sure how this line actually works but reads to me as tell the window to fire some jquery function reorient 

        // which will in turn cause the $(window).bind(canDetect ? "orientationchange" : "resize", function(evt) {

        // to fire once again.

$(window).trigger("reorient", [orientation, rotationText]);

}

Please correct me if I am incorrect.

[Damon Oehlman]

Elijah,

My understanding is that alert boxes trigger resize events (for some reason) both when they are displayed and then also when they are dismissed.  I believe this is probably causing your infinite loop and I found this out myself while working with the emulator.

Unfortunately I think the best way to test device orientation is to grab a device.  I know this is a real pain and not something that everyone can afford, but the Android emulator really does have the potential to drive you completely crazy.

As far as your code goes, it would probably help me if you put it into a gist (gist.github.com) or pastie (pastie.org) and I could have a closer look for you.

All the code from the book is available on github also.  This particular example can be found here:

https://github.com/sidelab/prowebapps-code/blob/master/snippets/02/orientation-monitor.js

My intention is to try and keep this up-to-date with patches so if there is a better solution to the orientation detection then I would be happy to integrate that.

Cheers,

Damon.