We Keep Coding

How to detect tapping on the phone's backside?

I would like to detect user tapping on the device's back, NOT screen
Since users cannot touch the screen wearing VR headset.
It would be great if I can use JS for this, neither android studio or swift IOS is fine too.
Kindly, share your ideas.
This is one of the ideas: http://mylifewithandroid.blogspot.kr/2013/06/tap-detection-supported-by-gyroscope.html
Thanks

If there are no sensors for that, so it is not directly possible. Some devices have fingerprint sensors on the back, but those are small and not directly accessible from the code.
You could try calculating this using the gyrometer, but it would not be too accurate I fear.

How can you move this buggy native crop box in a hybrid app?

We have an Ionic app that accesses $cordovaCamera like so:
$cordovaCamera.getPicture({ allowEdit: true });
There are more options passed in, etc., but the above is just showing that we're passing in the allowEdit flag. If anyone is unfamiliar, here's what the docs say:
allowEdit: Allow simple editing of image before selection. (Boolean)
This works perfectly. After I select a picture from the gallery or take a picture, it then goes to its native "edit" view, where the user can crop the image.
Here's the flow:
Take Photo > Edit (crop) > Upload to the interwebs
Select Photo > Edit (crop) > Upload to the interwebs
On Android, you can resize the crop field and move the crop field around.
On iOS, you can't move the crop field (unless you zoom in first), and you can't resize the crop field at all.
Is this just an iOS quirk we have to live with, or is there some way to get around this? This is happening in iOS 8.3.
Screenshots coming soon
Edit
Here's the video demonstrating the problem.
At 0:16 you'll see that it's impossible to move the crop box. (This is happening on an iPod Touch with iOS 8.2, but it is also happening on several iPhone 6 devices with both iOS 8.2 and 8.3). However, this does not occur on Android. Thus, it seems reasonable to believe this is native iOS issue rather than an Ionic/Cordova issue (or, it may be an issue with the way Ionic interacts with iOS).
At 0:22 you'll that once the user zooms in, then the user can actually move the crop box.
Another update (this is important)
Only when taking a photo does this bug occur. When you select an existing photo from your library, the crop tool works as expected...

iOS has a built in cropping tool if you enable allowsEditing on your UIImagePickerController
UIImagePickerController *imagePicker = [[UIImagePickerController alloc] init];
[imagePicker setAllowsEditing:YES];
If you want a different cropping tool you are going to have to make your own or use an open source project.
Here are some projects:
https://github.com/dzenbot/DZNPhotoPickerController
https://github.com/ruslanskorb/RSKImageCropper
https://github.com/kishikawakatsumi/PEPhotoCropEditor

In our company hybrid mobile app we use ng-image crop. https://github.com/jodonnell-broadsoft/JsImageCrop
It allows users to take photos of images in android and ios using the camera plugin and then lets them crop the image (we use it for documents). We then upload the image to our server.
Here is what our final version looks like. Also it is super smooth and easy to use.
Once you include the ng-image crop, then inject the dependencies this is all the code you use
<div class="cropArea" ng-style="cropHeight">
<img-Crop image="image.uncropped" result-image="image.cropped" result-image-format="image/png" area-type="rectangle" on-change="console.log($scope.image.cropped)">
</img-Crop>
</div>

Is deviceorientation supposed to work no matter the hardware of the phone?

I'm making an HTML5 mobile game for my company. It needs to use devicemotion and device orientation to detect respectively shake and tilt. The game is in a webview so worst case scenario I can call it from the native counterpart. Anyway, device orientation should work on all android devices starting 3.0 according to this canIuse page:
http://caniuse.com/#feat=deviceorientation
But it does not on at least one of the devices we got, a Huawei y300-0100 with android 4.1.1
The tilting feature works on native applications but does not on the browser, including the demos from HTML5 rocks and the first one linked in the canIuse page. Thoses sames demos work well on a 4.0 samsung device we have.
The window.DeviceOrientationEvent exists, and the event deviceorientation is call once, but all angles are at null instead of a value. And after this first call, you can move the device as you want, the event is not called again.
Are you aware of some device that do not work with JavaScript deviceOrientation? Or do you think there is something wrong with this particuliar device?

How to avoid swipe scrolling and double tap zooming on android 2.3.6 stock browser?

I have this tetris game I programmed with the intention of learning a bit more on javascript: elcodedocle.github.io/tetrominos
I can play it in most tablet/smartphone browsers, but on my Android 2.3.6 stock browser (Samsung Galaxy Ace ST5830) it has two problems:
Zoom events are not exactly canceled by user-scalable=no viewport property: double click and two-finger zooming still work. Sometimes.
The canvas freezes, also sometimes (I'm going mad trying to determine the cause: How the heck you debug a web app running on an android browser??). I'm guessing because of a swipe or drag event triggered that shouldn't be, so it's somehow related to the above. Tapping out of the canvas makes it work again.
I'm using Kineticjs to manipulate the canvas and bind the touch events, on top of jquery-ui for the dialogs and jQuery (not jQuery mobile).
Any suggestions/ideas?

the problem is with the device's processing speed.. evrery device has its own processing speed. canvas animations are based on javascript's setInterval and setTimeout methods..which performs as per the device's processing speed..thats why canvas games are sometimes laggy on handhelds.

Android: disable pinch zoom and pass event to Flash content

I have a flash application written in actionscript 2.0 that shows vector architectural maps and works perfectly on common web browsers. There are many interactions with javascript functions called by user events on the webpage, such as zooming to a certain x,y point. This event is usually accomplished via the mouse wheel.
Now I have to make sure that the thing works on tablet pc, in particular the Galaxy Tab. The first thing I have to fix is that, obviously, there is no mouse wheel and the user naturally tries to pinch zoom the flash application, with the result of zooming the entire web browser.
What I need is to listen to the multitouch gesture and, when a pinch zoom event is called, disable the default zooming event and call a javascript/flash function that allows my flash app to zoom only the objects that need to be zoomed: in few words, the browser stays still and only a part of the flash zooms in or out.
Consider that I am totally new to Android and that I already have working javascript functions to call flash object functions for the zooming purpose, so I just need to connect them to some android things that tell me when the user tries to pinch zoom in and when he tries to pinch zoom out (and possibly the x,y point of zoom).
Thanks a lot for your help!
Max (Italy)

Passing a JavaScript call from android to flash is a very very hard task as far as I know.
Not because of android (follow this tutorial http://code.google.com/p/openmobster/wiki/JavascriptBridge to pass a JavaScript call to a web page ), but because of flash securities for local content.
It is not too much of an issue on a local computer, but the flashplayer on android is very very buggy.
I think the best is to try to find an other solution if possible...