We Keep Coding

Detect if Android or iPhone and show something based on results

I'm trying to display a link based whether a website visitor is use an Android or iPhone mobile device. But I can't seem to get this code I've been working on to actually work. Any help is much appreciated.
I've search Stackoverflow and Google for a solution and all I can find are partial solutions - but nothing I have found has proved successful as of yet.
Here's the code I've been trying to make work.
<p class="iphone">iphoneclass</p>
<p class="android">androidclass</p>
$(document).ready(function() {
if (navigator.userAgent.match(/(iPhone|iPad)/)) {
$('.android').hide();
}
if (navigator.userAgent.match(/(Android)/)) {
$('.iphone').hide();
}
});

here how i check for users' device. maybe this works for you too.
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
if (/android/i.test(userAgent)) {
// android users
$('.iphone').hide();
} else if (/iphone/i.test(userAgent) || /ipad/i.test(userAgent)) {
// ios users
$('.android').hide();
}

A simple but inelegant way is to try and detect the user-agent string.
https://developer.mozilla.org/en-US/docs/Web/API/Navigator/userAgent
So, something like
const agent = window.navigator.userAgent;
And then you can try and match it against the device by doing some sort of regex search
https://deviceatlas.com/blog/mobile-browser-user-agent-strings

Best way to know if a web page contains only media (only image or only video) content using javascript?

I have a webview object (windows universal) which renders few media content like mp4,images(jpg,png etc). What I wanna do is, I should show up a download button if such media shows up in the browser.
My javascript function below is invoked by the webview and based on the retVal I'm deciding if its media content or not
function()
{
var retVal = '1';
if(document.doctype == null)
{
retVal = '0';
}
return retVal;
}
//Doctype null => media content is present.
if tag is present, I would consider it as a normal page.
This works fine for many pages. But still I'm not comfortable with this. Is there any better way?

You can also check the content type of the media being displayed, at least gecko, webkit, blink support this property.
function isHtml () {
return document.contentType === 'text/html'
}

One button -- 3 App stores -- how to redirect the user to the appropriate appstore?

I am wanting to create a simple button which redirects mobile users to the appropriate app store link depending on which mobile os they are running (ios, android or wp8) - or if not on a mobile then offers to send an email containing the appropriate link...Any ideas?

Well... This is actually pretty straightforward. To begin with, you must detect the device the user is currently using by means of their user agent string. And then use jQuery to simply set the href attribute of the anchor element correctly. The following code illustrates.
var operatingSystem, userAgentString = navigator.userAgent;
var link = $("#store");
if (userAgentString.indexOf("iPhone") > -1 || userAgentString.indexOf("iPod") > -1 || userAgentString.indexOf("iPad") > -1) {
operatingSystem = "iOS";
link.attr("href", "http://store.apple.com/us/browse/app");
} else if (/Android/.test(userAgentString)) {
operatingSystem = "Android";
link.attr("href", "https://play.google.com/store/apps?hl=en");
} else if (/Windows Phone/.test(userAgentString)) {
operatingSystem = "Windows Phone";
link.attr("href", "http://www.windowsphone.com/en-us/store");
}
http://jsfiddle.net/5g0zqm0s/

Check the user agent to determine what OS is being run and based on result route link appropriately.

Using php, you can detect which mobile device the user is on. There are several plugins for this. You could then echo out the href of the link accordingly. Sorry, cant comment. Spent too much bounty!

What is the best way to detect websocket support using Javascript?

I'm trying to use Javascript to detect if a web browser supports websockets, but using only feature-based detection, I'm getting false positives, so I added a user agent test to throw out Android devices instead, which I'm not happy about. I have a Samsung Galaxy Tab 2, and here's my detection code:
var isSupported = (("WebSocket" in window && window.WebSocket != undefined) ||
("MozWebSocket" in window));
/* This line exists because my Galaxy Tab 2 would otherwise appear to have support. */
if (isSupported && navigator.userAgent.indexOf("Android") > 0)
isSupported = false;
if (isSupported)
document.write("Your browser supports websockets");
else
document.write("Your browser does not support websockets");
This code seems to work with IE, Firefox, Safari (including iPhone/iPad), and Chrome. However, the feature-based check is returning true when I use the default browser of my Samsung Galaxy Tab 2, which is incorrect because that browser does not actually support websockets. Furthermore, I don't know how many other Android devices have this same issue, so at the moment, this is the best solution I'm aware of for detection.
Is there a better way to detect websocket support other than what I'm doing? I do realize that workarounds exist for Android, such as using a different browser, which means my user agent detection code as-is would not be a good thing. My goal is to not have to rely on the user agent in the first place.
Any suggestions?

This is the shortest solution and is used by Modernizr. Simply add this to your code
supportsWebSockets = 'WebSocket' in window || 'MozWebSocket' in window;
then you can use it by running
if (supportsWebSockets) {
// run web socket code
}

I think the Modernizr library is what you are looking for: http://modernizr.com/
Once you include the library on your page, you can use a simple check like:
if(Modernizr.websockets){
// socket to me baby
}

This page comes on top in google search.
In year 2016 cutting the mustard for modern WebSockets implementation (no prefixes such as MozWebSocket) would be
if (
'WebSocket' in window && window.WebSocket.CLOSING === 2
) {
// supported
}
http://www.w3.org/TR/websockets/#the-websocket-interface

after reading #gzost's response.. I started tinkering.. since nothing else can properly detect WS's on my android phone... even websocket.org says i have it, but then fails to connect.
Anyways, try this workaround.. seems to properly detect it on/off with chrome, FF, safari and the default android browser.
var has_ws=0;
function checkWebSocket(){
try{
websocket = new WebSocket("ws:websocket.org");
websocket.close('');
}catch(e){ //throws code 15 if has socket to me babies
has_ws=1;
}
}
$(document).ready(function(){
checkWebSocket();
});

None of the above answers by itself was sufficient in my tests. The following code seems to be working fine:
function nll( o ) { return CS.undefined === typeof o || null === o; }
// ...
function check_ws_object() {
try {
var websocket = new WebSocket( "wss://echo.websocket.org" );
return true;
} catch ( e ) { ; }
return false;
}
//
function check_support() {
if ( !( WebSocket in window ) ) {
if ( nll( window.WebSocket) ) {
if ( !this.check_ws_object() ) {
alert( "This browser doesn't support HTML5 Web Sockets!" );
return false;
}
}
}
return true;
},
The above tests are sorted, so that the faster ones come first.

How To Remove Skype Call Tool From Browsers? Specifically Chrome?

If you view my page below:
http://www.noxinnovations.com/portfolio/nue/
... In Google Chrome (Specifically, maybe others as well?).
You will notice that there is some Skype Extension that allows users to do a Click-And-Call from the Browser. Which is messing up my design pretty bad...
How do I come across getting rid of this feature/function?
Is there some JavaScript? jQuery? HTML?
Thank you so much!
Aaron

following jQuery Extension will return whether skype extension is installed or not. if it is installed you can remove the wraped link placed plain text.
jQuery.extend({
skype : function(failureFunction) {
var $ = jQuery;
if ($.browser.safari || $.browser.opera) {
return true;
} else if ($.browser.msie) {
try {
if (new ActiveXObject("Skype.Detection")) return true;
} catch(e) { }
} else {
if (typeof(navigator.mimeTypes["application/x-skype"]) == "object") {
return true;
}
}
$('a[href^="skype:"]').click(function() {
failureFunction();
return false;
});
return false;
}
});

The solution is putting this meta into the section of the page/s.
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
Hope this help

Go to "Tools -> Extensions" and uncheck the "Enable" box beside the "Skype Links" extension

How can you be sure that users browsing your site won't have this plugin installed? You'll need to handle this possibility in your code, so that your page does not break.

Yes, go to your Add-ons or Extensions and just get them disabled and you won't be disturbed anymore