MobileFirst iOS app longpress gesture trigger a system context menu - html

I've found that while holding on any anchor links of our MobileFirst iOS app (more than 2 or 3 seconds), iOS will trigger its build-in menu which shows internal path of current html page.
I don't know if this feature is related to PhoneGap, cordova, MobileFirst or HTML5 apps but can I disable it when users hold on anchors ?

An IBM MobileFirst app at the end of the day is made up of web code, so just like in Mobile Safari where after long-pressing you'd get a menu of some sort this is the case here as well.
There are many results on a google search how to disable the long-press context menu in iOS. See one such result here: Preventing default context menu on longpress / longclick in mobile Safari (iPad / iPhone)
Attempt to add this code (with proper modifications) in your app.
If it doesn't work for you, create an isolated demo app that this can be reproduced in and provide it for debugging.

Related

Windows Phone 8 navigation

I just started developing wp8 apps coming from android. What is the equivalent UI control for an app drawer (android) to be able to quickly change from page to page? I'm looking for the control used to change from page to page in OneNote
EDIT: I found out that Windows phone 8.1 offers flyouts which can be made to look like an app drawer.
The equivalent to the android app drawer is probably the windows phone appbar, but the appbar in windows phone is not used for navigation - only settings like actions.
In windows phone, navigation is done primarily through your own interface, with heavy use of the BACK button to go to previous pages. The main class you use in windows phone is the NavigationService
I don't believe the OneNote uses standard UI components, so you would probably have to create your own
There are plenty of solid resources online that should help. Start here:
http://msdn.microsoft.com/en-us/library/windowsphone/develop/ff626521(v=vs.105).aspx

Getting chrome to go full screen, programmatically

When I view the impress.js website in chrome on iOS, the tab bar slides up and disappears. How do I do that?
Note: doesn't happen in safari on iOS.
A simple Google search would suffice for this question.
http://updates.html5rocks.com/2011/10/Let-Your-Content-Do-the-Talking-Fullscreen-API
https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Using_full_screen_mode
http://davidwalsh.name/fullscreen
All are excellent resources (and the top three Google links!).
Essentially, there's a new API which allows JS to request fullscreen access. That's about it.

A universal cross-platform way (mobile) to show alerts to a user

I have a task to create a client application which can show notifications to a user with a high probability of notifications being noticed.
The application should work on Android (2.0+)/iOS/WP.
Here is the use case:
The user starts the Application and performs some Action. Then he switches to the home screen/another application.
The response to the Action makes the Application to issue a notification. The notification is noticed by the user disregarding of what another application (or home screen) he uses on his mobile device at the moment.
There is no requirement for the application to be a native app or to be a web browser-based mobile app. The notification could be a sound or a vibration on the device, but I know that accessing the vibrations from within a browser is still tricky.
Here are my research results of making universal sound/vibro notification mechanism so far:
it seems that making a mobile device vibrate from a browser works only in mobile Firefox (no iOS, no WP);
the support of the audio html5 tag is still experimental, it doesn't work on each and every browser/device;
the sound alert from this example works only in mobile Firefox (asks for a plugin to play an mp3 sound), the Android browser just remains silent.
So, the question is:
Is there any way to force a user of a mobile device (Android 2.0+/iOS/WP) to view a notification from a mobile application? Is the only way to do this is to write a native app for each mobile platform?
I would propose PhoneGap for that particular problem.
Among other things it features cross-platform alert, sound and vibrator notifications.
Only quirk for Windows Phone 7 is that the Cordova lib includes a generic beep file that is used. You should consult the Notification reference page to make sure if it can help you.

Debug Ipad web app on Windows

I've got site that is correctly displayed on desktop version but has few bugs on iPad. What's the simplest way to detect problems if my OS is Windows?
Option 1 - Free, local machine debugging
You may use Safari browser for Windows (download Safari 5.1.7).
Steps
Enabling Develop menu in menu bar (Press 'Alt' key to open menu bar. Then follow to Edit menu > Preferences > Advanced tab. Find this option at the bottom.)
Then, follow through Develop menu > User Agent. Select iPad, iPhone etc.
There are more options in the Develop menu (e.g. Show Web Inspector) to help with your JavaScript etc debugging.
Credits to How to debug iPhone and iPad web applications, using Safari.
Option 2 - Paid, browser-based access to target browser/OS/machine
I've personally used http://www.browserstack.com/ and it lets you test the functionality on a wide combination. However debugging may not be as convenient here as it would be on a local machine.
There may be more companies providing similar services.
Beware of basic online emulators
As mentioned in a comment, be wary of 'emulator' websites. Example: A website I ran into claimed to emulate iPhone, with a picture of iPhone, and inside it was an iframe, being dutifully rendered by the browser I opened that website in (Firefox).
The best way I can think of(depending of your implementation) is to use the firefox plugin
https://addons.mozilla.org/en-US/firefox/addon/user-agent-switcher/
It allows you to switch to all sort of devices and see how they would appear on another device.
Here http://www.ampercent.com/test-website-design-iphone-ipad-mobile-devices/7075/ is a quick guide on getting you started.
There are also user-agent switchers for other browsers than FF like Chrome. Do a google search and try for yourself which one you like.

Does mobile Google Chrome support browser extensions?

Can I create a plugin or an extension for Google Chrome MOBILE (Android Google Chrome)?
If not, can I create an extension for Google Chrome (desktop), which will add a button in Google Chrome bar. This button will open the page in another web browser (in my own web browser), so, this button should launch my own web browser.
Extensions are not supported, see: https://developers.google.com/chrome/mobile/docs/faq .
Specifically:
Does Chrome for Android now support the embedded WebView for a hybrid native/web app?
A Chrome-based WebView is included in Android 4.4 (KitKat) and later. See the WebView overview for details.
Does Chrome for Android support apps and extensions?
Chrome apps and extensions are currently not supported on Chrome for
Android. We have no plans to announce at this time.
Can I write and deploy web apps on Chrome for Android?
Though Chrome apps are not currently supported, we would love to see great interactive web sites accessible by URL.
You can use bookmarklets (javascript code in a bookmark) - this also means they sync across devices.
I have loads - I prefix the name with zzz, so they are eazy to type in to the address bar and show in drop down predictions.
To get them to operate on a page you need to go to the page and then in the address bar type the bookmarklet name - this will cause the bookmarklet to execute in the context of the page.
edit
Just to highlight - for this to work, the bookmarklet name must be typed into the address bar while the page you want to operate in is being displayed - if you go off to select the bookmarklet in some other way the page context gets lost, and the bookmarklet operates on a new empty page.
I use
zzzpocket - send to pocket.
zzztwitter tweet this page
zzzmail email this page
zzzpressthis send this page to wordpress
zzztrello send this page to trello
and more...
and it works in chrome whatever platform I am currently logged on to.
Some extensions like blocksite use the accessibility service API to deploy extension like features to Chrome on Android. Might be worth a look through the play store. Otherwise, Firefox is your best bet, though many extensions don't work on mobile for some reason.
https://play.google.com/store/apps/details?id=co.blocksite&hl=en_US
Just use a different browser.
Follow the steps given below to install Chrome extensions on your Android device.
Step 1: Open Google Play Store and download Yandex Browser. Install the browser on your phone.
Step 2: In the URL box of your new browser, open 'chrome.google.com/webstore’ by entering the same in the URL address.
Step 3: Look for the Chrome extension that you want and once you have it, tap on 'Add to Chrome.’
The added Chrome extension will now be automatically added to the Yandex browser.
I imagine that there are not many browsers supporting extension. Indeed, I have been interested in this question for the last year and I only found Dolphin supporting add-ons and other cool features announced few days ago. I want to test it soon.