Your first link is using PhoneGap.Gesture
, which as far as I can see doesn't exist (at least for iphone) in 0.8. It's quite a recent post though so may have been added recently? I haven't used any later revision than 0.8
I have added shake gesture support to a phonegap app by 'extending' phonegap as follows. But first a warning:
Apple have deemed PhoneGap 0.8 as acceptable for submission to app store. As this is essentially an extension (albeit very simple) to PhoneGap 0.8 there may be a risk of rejection. The app I developed this for has not yet gone through the approval process, so I can't advise any further on this.
Also be aware that this only works on OS 3.0+ due to use of the new UIEventSubtypeMotionShake
API
Additionally this is iPhone specific. If you want the cross platform capabilities of PhoneGap, this answer may not be for you unless you are comfortable implementing the native side modification on the other platforms (android etc). In this case it may be better to just wait for an official phonegap release that supports this on the iphone.
Add the following code to PhoneGapViewController.m
- (void)motionEnded:(UIEventSubtype)motion withEvent:(UIEvent *)event
{
if (UIEventSubtypeMotionShake == motion)
{
[webView stringByEvaluatingJavaScriptFromString:@"navigator.myext.onShakeGesture();"];
}
}
Then add this as a javascript module myext.js
/* We need PhoneGap.js to be loaded to work properly before we can initialise so wait for it here */
(function()
{
var timer = setInterval(function()
{
if (typeof(PhoneGap == 'object'))
{
clearInterval(timer);
myExtInit();
}
}, 1);
})();
function MyExt()
{
// initialization
this.callbacks = {
onShakeGesture: []
};
}
/* Called by ObjectiveC side when a shake gesture is detected */
MyExt.prototype.onShakeGesture = function()
{
for (var i = 0; i < this.callbacks.onShakeGesture.length; i++)
{
var f = this.callbacks.onShakeGesture[i];
f();
}
};
MyExt.prototype.addShakeGestureListener = function(shakeCallback)
{
if (typeof(shakeCallback) == 'function')
{
this.callbacks.onShakeGesture.push(shakeCallback)
}
};
function myExtInit()
{
// Init phonegap extension specific objects using PhoneGap.addConstructor
PhoneGap.addConstructor(function() {
if (typeof navigator.myext == "undefined") navigator.myext = new MyExt();
});
}
Now include myext.js in your HTML content <head>
section just after the link to phonegap.js
<script type="text/javascript" charset="utf-8" src="myext.js"/>
and use from script (example causes an alert but do what you need to do):
function watchShake() {
var cb = function(){
navigator.notification.alert("Shake it!");
};
navigator.myext.addShakeGestureListener(cb);
}