Execute Widgets with Change in Screen Orientation
The iPod Touch and iPhone have an accelerometer that adjusts the screen orientation (among other things). You can tap into the orientation and execute widgets depending on the orientation of the device by using a simple HTML file with some Javascript. Put an HTML file on a web server that you can get to on your iPod Touch or iPhone.
Part of the Apple Web Kit is the command “onorientationchange”. We will use that to detect the orientation change and call a script called “updateOrientation()”.
Add the following command to the BODY tag:
1 | onorientationchange="updateOrientation();" |
Place the following function in the HEAD of the document and call certain widgets at the specific orientation angles of 0°, -90°, and 90°. You can call any type of widget adjusting the position of a servo, controlling a digital output, or setting the state of an X10 widget.
1 2 3 4 5 6 7 8 9 10 | function updateOrientation(){ switch(window.orientation){ case 0: widgetExecute("Upright Widget ID"); break; case -90: widgetExecute("Right Widget ID"); break; case 90: widgetExecute("Left Widget ID"); break; } } |
Place the widgets referenced in the BODY of the document.
UPDATE:
The full iTurn web app is on the Wiki:
http://www.iobridge.net/wiki/projects/iturn
13. January 2009 at 1:13 am :
Lynn,
I picked up a book on javascript last week and have begun learning javascript/html but can’t figure out how to implement the orientation function on my iphone. I’m having trouble figuring out where to put everything in the html code and perhaps if I could see a fully coded page I might be able to figure it out from there. Any help would be greatly appreciated! FYI, I have a couple of ioBridges plus all the add-on boards and am playing with interfacing with my BASIC stamps – lots of fun!!
Thanks,
Joe
5. February 2009 at 9:46 pm :
Ditto. I’d really appreciate that too, just to get me started. Would you be able to share the whole HTML file? cheers!
24. March 2009 at 9:24 pm :
[...] knew when Steve aka “polymythic” posted his ioBridge project using iTurn to pour a real beer that it would get over 100k hits on YouTube and make it into print. Well, if you [...]
1. April 2009 at 9:11 pm :
OK, we put the whole project for “iTurn” on our Wiki:
http://www.iobridge.net/wiki/projects/iturn