Detect use of mobile phone by JavaScript - javascript

I have a web page. When I running the web page on my mobile phone, in that web page, the usage of mobile phone should be identified. If someone touch the display or use the phone in any way, the page should say that you used your phone.
I used JQuery blur focus method to check whether the browser tab is active or inactive. At anytime I use the phone, the tab will be gone to the background and detect that I used it but, Same thing happens for incoming calls. I need a way to prove that I didn't use the phone and it was an incoming call. So basically I need a way to keep someone away from the mobile phone for a certain time and notify if the person used the phone if he used it.
Anyone can help?

Can't take credit for this, I've seen it somewhere before.
function mobileCheck() {
try {
document.createEvent("TouchEvent");
return true;
}
catch(e) { return false; }
}
if (mobileCheck()) {
alert('mobile');
} else {
alert('not mobile');
}

So this is not JQuery but it does get the job done. Uses regexp for this.
let mobile = navigator.appVersion;
var testForMobile = /Mobile|mini|Fennec|Android|iP(ad|od|hone)/.test(mobile);
document.write(testForMobile)

Mobile can be detected by this simple one liner.
var isMobile = navigator.userAgent.match(/(mobi)/i) ? true : false;
isMobile would return true for mobile devices.

Related

Shopify page keep refreshing after being redirected by javascript code

I am trying to create a website https://fone-kase-plus.myshopify.com/ that will detect what device model it's being accessed from (for example GALAXY A40) so it will immediately redirect the user to a corresponding page.
It seems to be working, but it will reload the page multiple times after redirecting. If I try to redirect it to non-shopify page (eg stackoverflow.com) this problem doesn't occur.
function deviceAPIcallback(result){
if(result.deviceName == "desktop"){
window.location.href = "https://fone-kase-plus.myshopify.com/pages/galaxy-a40";
}
else{
alert(result.deviceName);
}
}
Can you please tell me what the problem can be or at least how I can detect it by dev tools?
Thanks
When I go to the site from both my macOS laptop and my iPhone I only get the alert aspect of your function. What does result.deviceName return? You might need to add a third '=' to your first 'if' statement.
function deviceAPIcallback(result) {
if(result.deviceName === "desktop") {
window.location.href = 'https...';
} else {
alert(result.deviceName);
}
}

How to stop Webpage from coming out of fullscreen in React?

I'm trying to create an online exam portal, Here in the exam window, I want My users to force into fullscreen, and not get out of it until the exam is complete.
I've used the Fullscreen API here to achieve the Fullscreen.
goFullScreen = () => {
if(document.documentElement.requestFullscreen) {
document.documentElement.requestFullscreen(); // W3C spec
}
else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen(); // Firefox
}
else if (document.documentElement.webkitRequestFullscreen) {
document.documentElement.webkitRequestFullscreen(); // Safari
}
else if(document.documentElement.msRequestFullscreen) {
document.documentElement.msRequestFullscreen(); // IE/Edge
}
}
I've basically copied the code from W3schools.
I want to know how to prevent them to get out of fullscreen? I can return false on 'Esc' Keypress, but there are other ways. Also, I don't want them to open developer window (i.e the console).
What methods should I approach ??
P.S. I'm using React, if that matters.
You cannot prevent exit from fullscreen until you make an electron app or you have access to their computer.
Something which you want to do is against the privacy of the user. You can catch the esc key but, you cannot override the browser. You can do one thing, catch the esc key and end the test if the esc key is pressed.
(I used JQuery, you can use vanilla JS also)
if(document.fullscreenEnabled) {
// browser is almost certainly fullscreen
//Execute end test code here
}
Request to accept if this answer helps...

Why isnt window.location.href= not forwarding to page using Safari?

My site lets users login via the Fb button, I'm using the FB / Parse.com JDK for this https://parse.com/docs/js/guide#users-facebook-users
Once the user has been identified, the below code logs the user in and forwards them onto a url. This works as expected under Chrome, but will not work using Safari, the page just stays on the fb.html page which is blank
I've seen that there were some historic issues with
window.location.href=
But, can't find a fix that works for my solution. Does anyone know a way around this?
Parse.FacebookUtils.logIn(null, {
success: function(user) {
if (!user.existed()) {
} else {
window.location.href="user_home.html";
}
},
error: function(user, error) {
}
});
Best way work in all browsers:
setTimeout(function(){document.location.href = "user_home.html";},250);
I had this happening to me as well on safari and found this post but found another solution I wanted to add with lots of browser support. Instead of replacing the current location use the method that is on the location object called assign()
document.location.assign(document.location.origin + "/user_home.html")
This also works
location.assign(location.origin + "/user_home.html")
Tested in Chrome and safari on desktop and mobile iOS devices
reference:
https://www.w3schools.com/jsref/met_loc_assign.asp
I think you need to use...
window.location = 'user_home.html';
When I stack to this problem, I made function what working well on any Safari and also all browsers including mobile browsers:
function windowLocation(url){
var X = setTimeout(function(){
window.location.replace(url);
return true;
},300);
if( window.location = url ){
clearTimeout(X);
return true;
} else {
if( window.location.href = url ){
clearTimeout(X);
return true;
}else{
clearTimeout(X);
window.location.replace(url);
return true;
}
}
return false;
};
Is a bit "dirty" solution but give you ability to redirect your page in any case.
Probably because you are doing something before it. In other words, the first step in your click event handler must be window.location.href = "https://example.com";.
I wanted to detect home page but faced same problems for iphone and safari.
I simply added a class called "home" in landing page then just check this class as
if (document.querySelector('.home') !== null) {
// the conditions comes here
}
Details in http://toihid.com/how-to-detect-home-page-in-iphone-and-safari/

Javascript onclick not called on some computers

I have an VB.NET web page that calls a javascript function when a checkbox in a datagrid view is checked or unchecked. The code works fine on my computer and for a few more people. But for most of the people the javascript function is not called at all when they check or uncheck a checkbox. All of these computers are Windows 7 and using IE 9. I also checked the IE->Internet Options->Advanced tab and the settings are the same on these machines. At this point I am out of ideas on this and google doesn't return any helpful results. I would really appreciate if someone can help me resolve this issue. Here is the code for the javascript function if that helps.
function SelectLineItem(pRowIndex)
{
var vGridView=document.getElementById('dgvFSOView');
var vLen=vGridView.rows.length;
var i=parseInt(pRowIndex)+1;
var intcount;
var vtxtFcheckbox=vGridView.rows[parseInt(pRowIndex)].cells[0].getElementsByTagName("input")[0].id;
var vFCheckbox=document.getElementById(vtxtFcheckbox);
var browser=navigator.appName;
for(intcount=i;intcount<=vLen-1;intcount++)
{
if ((document.getElementById('hifCheck').value=="ALL") || (document.getElementById('hifCheck').value=="-1"))
{
var vtxtSONO=vGridView.rows[intcount].cells[3].innerText;
}
else if((document.getElementById('hifCheck').value!="ALL") || (document.getElementById('hifCheck').value=="-1"))
{
var vtxtSONO=vGridView.rows[intcount].cells[2].innerText;
}
if(vtxtSONO=="")
{
if ((document.getElementById('hifCheck').value=="ALL") || (document.getElementById('hifCheck').value=="-1"))
{
var vtxttocheckbox=vGridView.rows[intcount].cells[14].getElementsByTagName("input")[0].id;
}
else
{
var vtxttocheckbox=vGridView.rows[intcount].cells[13].getElementsByTagName("input")[0].id;
}
var vTCheckbox=document.getElementById(vtxttocheckbox);
if(vFCheckbox.checked==true)
{
vTCheckbox.checked=true;
}
else
{
vTCheckbox.checked=false;
}
}
else
{
return false;
}
}
}
This could potentially be an issues with the permissions the users have on their computers. Security settings have different levels of permissions which vary depending on how the user set up their machine.
If you are running the code locally (IE: double clicking a local .html file) you often need to enable Javascript before any javascript can run at all on the page. If it's hosted on a website (IE: www.example.com/mypage.asp) then this shouldn't be a problem.
How are you calling this function? You may also want to try using the developer tools built into IE to see if any errors are occurring, which would prevent your script from completing.
Utilizing a cross browser compatible framework like jQuery might help your checkbox change event trigger, but could be overkill depending on what how complicated your project is.
Checkboxes do not reliably trigger the click event. Bind your function to the checkboxes' change event instead.

How can I load a new page when the iPhone/Android browser is reopened?

Okay, so I don't exactly even know how to word this question properly as you can probably tell. Hence I couldn't find any solution on Google, so I came here.
Basically, the process unfolds like this:
1.) The user logs into my site.
2.) The user uses my site, then leaves the browser and does whatever else, without killing the browser.
3.) The user opens up the browser again to check my site again.
When 3.) triggers, I want my site to detect that and forward the browser to some other page.
Does this make any sense? If you need clarification, just let me know. I believe there has to be a way to do this with jQuery or maybe just plain JS.
Thanks!
function onBlur() {
document.body.className = 'blurred';
};
function onFocus(){
document.body.className = 'focused';
};
if (/*#cc_on!#*/false) { // check for Internet Explorer
document.onfocusin = onFocus;
document.onfocusout = onBlur;
} else {
window.onfocus = onFocus;
window.onblur = onBlur;
}
Reference: Is there a way to detect if a browser window is not currently active?

Categories

Resources