Javascript reverse device detection - mobile

I'm using the code from detectmobilebrowsers to redirect mobile users to an optimized page. However, if they copy that url and send it to a desktop user, it won't look right.
So... I want to reverse the code on the mobile page to say if NOT (one of these mobile devices) redirect to desktop page. I just can't figure out where the exclamation goes.
Thanks.

Sorry, I was being lazy, and not reading where the regex started. Here's what I was looking for:
(function(a,b){if(!(/(android|bb\d+|meego).+mobile...more stuff here... |zte-/i.test(a.substr(0,4))))window.location=b})(navigator.userAgent||navigator.vendor||window.opera,'http://myRedirect.com');

Related

CocoonJS webview: Going back a page

I'm just trying out a simple app in the CocoonJS launcher which contains some links that open some external page.
This works fine, but the problem is that I can't identify a way to go back a page (i.e. history back). The launcher app just displays the page in fullscreen, no user controls visible at all. This is troublesome, because when my users tap on an ad, I want them to be able to go back to the game.
Am I missing something or is this simply not supported?
I do not know of any way to display a navigation bar or something similar.
Nevertheless, you can open your external urls via Cocoon.App.openURL(url); which will enable the user to open it via a normal browser where you can navigate back.
Regards.
I agree with the solution proposed by Scdev. Also, interstitials or fullscreen ads usually have a dismiss button themselves. I might be misunderstanding something.
Regards,
Iker.

Hashtag urls in mobile devices? How do they work?

Ok, probably a stupid question. But here goes... I know on regular websites a hashtag is an anchor to an element on the page, however, how does this work in mobile devices? It seems to me that mobile devices can use hashtags to slide to another section on the same page, sort of like another page.
How do urls work like that in mobile devices?? I've been to the jquerymobile.com site and noticed the webapp builder on the homepage, offers the ability to change features to slide, slideup, slidedown, fade, pop, etc. etc., however, the only URL to choose from is always "HOME" for these features. And home points to #page1, which is odd that it has a hashtag in it. How do mobile devices work with these hashtags? More importantly, how do I add the ability to slide to that hashtag, as in the way jquerymobile.com implies in the webapp builder?
I've tried doing my own research on this via google, but no luck, as mobile hashtags keeps bringing up other results, not what I am asking for here.
There's no difference between handling of the hash parts of URL in desktop vs. mobile browsers. The key point is that Javascript has access to the URL, including the hash part, and can do any programmatic thing based on the contents of the URL. So if the page author wants to slide in another section in response to changing the hash part of the URL, they can do that. People do the same thing on "desktop" sites, too.

Is there a URI scheme for opening a QR code app?

I have a project that requires the browser to open a qr code reader app from a link. Is that possible? I know URI schemes are useful for this kind of situation, but I don't know where to look.
There is no general solution, but, in specific cases, apps can register to handle certain links.
For example, Barcode Scanner on Android responds to zxing:// links. So does the iOS app. See https://code.google.com/p/zxing/wiki/ScanningFromWebPages for details.
(It will also let you send back the results to a web page.)
It's possible that other apps also set up to follow this quasi-standard URI scheme, but it is not at all guaranteed.
It really depends on the exact app you want to open. There's no generic way.
QR Droid allows websites to use a link to open the app to scan, decode or generate a QR Code.
You can read more here:
http://qrdroid.com/web-masters.php
But as I said, you need to decide which app to use and then read the documentation for that specific app.

Prompt user to install/view app on mobile site

Does there exist some kind of plugin or lightweight method of determining whether
A. A user is using a mobile device
B. The user has a particular app
C. The user does not have a particular app.
And depending on what criteria the user satisfies, display a prompt (modal, overlay, pop-up) that allows the user to view the app (if installed) or to install it (if they do not have it installed).
I realize "A" can be achieved by using media queries but I am not sure how to configure the others.
I've seen this done on many many sites so I know that it is not uncommon (view screenshot). Ideally I just want to implement some quick solution. I'm looking for something similar to "Hello Bar" for mobile only, I suppose.
Any help will be appreciated.
Example: http://i.imgur.com/VkWKu.png (the prompt at the top of the browser)
I ended up finding this:
http://developer.apple.com/library/ios/#documentation/AppleApplications/Reference/SafariWebContent/PromotingAppswithAppBanners/PromotingAppswithAppBanners.html
Which is exactly what I was looking for and will work in tandem with the other solutions.
I would try this approach if you really need to know if a user has your app installed.
When your app is installed and first run have it create a cookie. The only thing you have to remember to use is the CookieSyncManager because the set Cookies are stored in RAM and not storage, CookieSyncManager will sync these two.
CookieSyncManager.createInstance(context)
CookieSyncManager.getInstance().sync()
Once you've set the cookie you can then read the Cookie with the website, if its there show popup etc. Oh and only show this popup only if its a mobile device: http://www.quirksmode.org/js/detect.html
Android Developer On CookieSyncManager: http://developer.android.com/reference/android/webkit/CookieSyncManager.html
Bolg Post Explaining the Usage of the CookieSyncManager:
http://blog.tacticalnuclearstrike.com/2010/05/using-cookiesyncmanager/
I know how to do this with android not iOS or Windows...
There's no standard way to do this.
See the end of this post: http://blogs.msdn.com/b/ieinternals/archive/2011/07/14/url-protocols-application-protocols-and-asynchronous-pluggable-protocols-oh-my.aspx for one mechanism available to JavaScript in IE10.
IE10's Metro environment offers this: http://blogs.msdn.com/b/ie/archive/2011/10/20/connect-your-web-site-to-your-windows-8-app.aspx but I don't think that exists for the mobile browser.

Facebook and share buttons on a mobile-enabled website that open the mobile app instead of a browser window?

One of the big flaws in Android webphones (and probably other Operating Systems for phones): You are surfing some website, and want to use the site's embedded share button for say Twitter. You want to use the embedded Twitter share because it pre-populates the tweet based on how the site designed it: namely, it has the title of the page and the link and maybe a relevant Twitter hashtag. If you were to use your mobile browser's share feature, you only get the link, and have to attempt to type in the title and guess relevant hashtags--not ideal. The same is the case with other social media shares, like facebook.
So, from the above, you understand why users would prefer to use a given website's own embedded share features, rather than that built into the mobile browser.
However, if a user clicks the site's embedded social media share button, it opens a new browser window for that social media. Ideally, this would not happen, as typical users do not log into these social tools using the mobile browser, and the resulting pop-up share is clunky to use on a small mobile screen. Instead, ideally, you would click on the site's embedded share button and it would attempt to open at least the official twitter (or whatever) app on your phone instead. This is ideal because users tend to use the apps to use their social media, and so would already be logged in. Moreover, such an app is obviously optimized for mobile use, and thus not as clunky.
And yet, this apparently does not exist... am I right?
That is, as a web designer, there is nothing I can do on my embedded Twitter and Facebook share buttons to prompt mobile phone users to use the official app to share (rather than through the mobile browser). Is that right?
Thanks,
Derek
At least on my iPhone the twitter url-scheme does work.
the following opens the twitter app:
twitter://post?message=hello%20world
And facebook is fb://
Haven't tested it on android.
(via: http://wiki.akosma.com/IPhone_URL_Schemes )
What about open a pop up box (not window)- when we click a link to share the URL site/page we are in, without have to go through the mobile browser ?
just a pop up box.
do you think it is possible? or any social media link would automatically opened in a browser?

Resources