Allow access only from mobile and tablet devices - javascript

My client has very specific request. He wants to block all "classic" computers (desktop/notebook).
So if I access the website from iPhone, Android or tablet it displays everything (the different resolutions I can hadle via responsive design). But when somebody from Mac or Windows or Linux (I know that Android is also based on gnu/linux ;) ) access the web, he gets only a message that "this web is only for mobile devices"or something like taht.
But I am not sure how to "ban" mac os, win, linux etc.
Could javascript(jQuery) library e.g. Modernizr or other do such specific condition "just mobile devices"?
What about Windows 8 :( ?
i am really thankful for any advice, because I have never had such request before?

I think you could do this in several ways.
Either you check via javascript, but then you if somebody would turn off javascript you would be screwed again because they could take a look at the website:
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent) ) {
// some code..
}
or you could check it via modernizr, but I don't know exactly how to do it in modernizr and you would also have the problem of turned off javascript code,
or you could download a script that is suitable for your case via:
http://detectmobilebrowsers.com/
another thing you could do is checking the screen resolution but, then we are back at the javascript case.

According to MSDN, Windows adds Tablet PC to the browser user agent if it is a tablet.
I suggest not doing this via javascript, because as states above: if javascript is disabled, people will be able to visit your site.

Related

Make Text Appear For Windows Viewers Only

I am trying to make a website for batch files. Since batch files only work on Windows computers I want to find a code that recognizes the difference from Windows and other devices. Once I have this code I tell it to display a check mark and the download link on windows and on other platforms (iPhones, Android phones, ChromeBooks, etc.) It will say your device is not compatible with this file. I haven't found anything on the web even similar to this.
This javascript checks if the user uses windows.
if(navigator.appVersion.indexOf("Win") != -1){document.write('using windows');};

Getting mobile device hardware information via javascript

via Javascript you can get a lot of information about your hardware and other components about your system, like shown here
With mobile devices you are not getting that much information. I'n not asking how to find out the mobile device name, that's easy, or even the udid. I want to know, if I can access some device characteristics, like some sort of installed plugins used by the browser, or new developments on this topic.
On this site I discovered, that I can access the battery status, Or with window.navigator.mozVibrate([200]); I can activate the vibrate function. So far both work only on firefox mobile (android).
An interesting information would be about the built in camera, something like how much megapixel does it have, or does it have a flash light? Or what kind of cpu (single-, dual-, or quad-core) is built in?
To sum it up: what hardware information can I get about a mobile device (iOS/Android/Windows Phone) via javascript?
Thanks for any hints!
You may be able to get a limited set of information about the device by using PhoneGap i.e. placing the PhoneGap script on your server and checking the appropriate values if the device is mobile. Check this link: http://docs.phonegap.com/en/2.0.0/cordova_device_device.md.html#Device

Not allow any other application to open except a browser

I am presently working on website (Java EE). One of the requirements is to not let the client to open anything else other than the browser. After a lot of search I got the following results :
Change the policy of the OS.
Write some batch/c/c++ program which will intercept all the keyboard and mouse events not letting the user open anything else.
PS : It should work on windows and IE 7 or above only. The other OS and browsers need not be considered. This software is made only for intranet, so I already have control on the client machines if I have to run something.
My question is .. is there anything else I can do which will reduce the work needed on the client side or on the program which I have to write??
This is very OS specific I'd say. Windows, I believe, has APIs related to finding open windows. You could find all open windows and close them. In your application's main loop you can detect if any windows are open then close them.
Perhaps mac and ubuntu have something similar.
This might be a good place to start looking: http://msdn.microsoft.com/en-us/library/ms633497%28VS.85%29.aspx
I have no idea how to use it though.
You'll need something more powerful than javascript to communicate with your application that is monitoring the user's desktop. You may want to look at connecting JS to Silverlight then having the client download something upon opening the browser that is also similar to silverlight or .net. Then you can have them all communicate possibly.
You can set IE to be the shell process (a registry key) instead of explorer.exe, and then run IE in kiosk mode, and then disable task manager via policy (to prevent new processes).

Detect tablet or desktop user

I plan to have a completely separate layout/design for a desktop Vs tablet user. My app is based on Java.
My questions are;
1. What is the best approach to detect whether the request is coming from desktop or tablet (iPad/Xoom, etc)
2. Can this be handled at server-side and not through JS user-agent string?
A live example of redirect is if one tries to access Yahoo. i.e. if the request comes from a desktop browser, we’ll be redirected to www.yahoo.com , while if the request comes from a tablet device like iPad, we’ll be redirected to www.yahoo.com/tablet
I am planning something along the Yahoo example. Not sure how they have implemented it.
I know some of you might be thinking that I should just control 2 separate CSS like desktop.css and tablet.css and detect through CSS media query OR JS user-agent. But the point is the layout/design is so different between the 2 that I just cannot control only via CSS and that is the reason, I plan to have a separate tablet version of my web app and do the redirection.
Please let me know as much suggestions that you can.
Thanks in advance for your help on this.
You have to check for the user-agent string within your HTTP request. Based on that you will be able to identify the device -- provided that the user has not altered the user-agent string sent from the device browser.
I've had to deal with pretty much the same issue, having to differantiate between Desktop or Not-Desktop. I went with a client-side detection using JavaScript. I'm using RequireJS in my solution, and here's my module:
define(function(){
var isTouchDevice = function() {  return window.screenX === 0 && 'ontouchstart' in window || 'onmsgesturechange' in window; };
var isDesktop = !isTouchDevice() ? true : false;
return isDesktop;
});
I've added the variable isDesktop for readability.

How can I redirect mobile devices to a different URL?

I want to check whether the user is viewing my site from a mobile device or PC. If it's a mobile device, I want to redirect my site URL like Google does...
If possible I would like to implement this in JavaScript. How can I do this?
You typically use the User-Agent header to detect the browser.
Here's JavaScript code that does basically that (only for mainstream browsers though, you'd have to add the Mobile User-Agents)
http://www.quirksmode.org/js/detect.html
And here's a list of mobile browser identifiers
http://www.zytrax.com/tech/web/mobile_ids.html
The list is not complete and will never be, given the rate new mobiles appear on the market, but what I did back when I did it is to store all received user agents in a database, and then look for them to classify them as mobile and which brand/model.
What you can't rely on though is JavaScript, it's better done in server code (not all mobile browsers execute JavaScript).
There is a related question here on SO but I couldn't find it.
See this existing question.
You will have better luck doing this server side, as many mobile browsers don't even support JavaScript. Basically you want to check the user agent and compare to a list of known mobile browsers.
Here is a simple answer for this query. This won't detect the mobile browser, but it redirects the page to our mobile.html page, through the following script;
Find out the browser window size and redirect it..
winWidth=document.all?document.body.clientwidth:window.innderwidth;
if (winwidth<800)
{
window.location.replace("mobile.html");
}

Categories

Resources