Discussion Forums  >  WebViews and HTML for Mobile

Replies: 12    Views: 209

Rohan
Veteran developer
Profile
Posts: 79
Reg: Mar 12, 2011
London
10,040
05/27/13 04:42 PM (10 years ago)

Another cool html trick to detect if your apps online

Hi fellow Buzztouchers, thought I'd share the results of another days work with you as I know it might help someone in the future. PROBLEM: Your loading an html file from inside your Xcode app, but part of it is being pulled from an external source. But what if the app isn't online and as a result the external data doesn't show up? Your app user will be clueless as to what's happening and Apple might well have a problem too. SOLUTION: This little javascript code will replicate a native pop up modal window displaying an error message. <script type="text/javascript"> var a=navigator.onLine; if(a){ alert('online'); }else{ alert('offline'); } </script> Cool, we have a little pop up window which tells the user that they aren't online, and also satisfies Apples requirements to show an error message. Lets refine this a bit more, because as it stands the code also shows the html pages title at the top of the box, i.e. "mypagename.html" , which looks unprofessional. So lets fix this by adding the following code which uses the same wording as that used in the Buzztouch code... <script type="text/javascript"> var a=navigator.onLine; if(a){ } else{ var iframe = document.createElement("IFRAME"); iframe.setAttribute("src", 'data:text/plain,'); document.documentElement.appendChild(iframe); window.frames[0].window.alert('There was a problem downloading some data. Check your internet connection then try again'); iframe.parentNode.removeChild(iframe); } </script> If you try this the error message is to all intents and purposes seamless with the native Xcode error message. Also the code could be further hacked to run any function you want, not just a modal window. So for example you could swap out a picture in your html saying 'online' or 'offline' , or create your own custom modal dialogue styled which ever way you want, ala lightbox. Have fun!
 
SmugWimp
Smugger than thou...
Profile
Posts: 6316
Reg: Nov 07, 2012
Tamuning, GU
81,410
like
05/27/13 05:59 PM (10 years ago)
If you'd rather do it in the code, you can always do this (in each plugin) For Xcode: -(void) canReach { Reachability *r = [Reachability reachabilityWithHostName:@"m.google.com"]; NetworkStatus internetStatus = [r currentReachabilityStatus]; if(internetStatus == NotReachable){ // no connection canReachNetwork = FALSE; }else{ // connection canReachNetwork = TRUE; } } for Android... private boolean canReach() { ConnectivityManager connectivityManager = (ConnectivityManager) getSystemService(Context.CONNECTIVITY_SERVICE); NetworkInfo activeNetworkInfo = connectivityManager.getActiveNetworkInfo(); BT_debugger.showIt(activityName + ":canReach = " + activeNetworkInfo); return activeNetworkInfo != null; } Then in your code you just ask "If canReach { .... code... }" Cheers! -- Smug
 
ianJamesPiano
Code is Art
Profile
Posts: 2661
Reg: Feb 13, 2011
Palm Springs, C...
37,010
like
05/27/13 10:22 PM (10 years ago)
cool trick guys. Love these types of posts!
 
fusionsch
I hate code!
Profile
Posts: 516
Reg: Dec 28, 2010
Montreux Switze...
11,610
like
05/28/13 12:02 AM (10 years ago)
Great trick, thanks a lot!
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
05/28/13 02:56 AM (10 years ago)
Cool. I'll think about doing this for my apps! @Rohan - The next meet is next Tuesday. www.buzztouchoxford.com
 
farcat
buzztouch Evangelist
Profile
Posts: 1008
Reg: Jan 27, 2012
France
13,230
like
05/29/13 04:48 AM (10 years ago)
Thanks @Rohan / @Smug!
 
farcat
buzztouch Evangelist
Profile
Posts: 1008
Reg: Jan 27, 2012
France
13,230
like
06/08/13 06:03 AM (10 years ago)
Hi @Rohan, I just tried your script, thanks again. A question though. In your second snippet shouldn't there be something after "if(a){" ? I don't know anything about Javacript but it looks like we are not indicating the first set of condition. I assume the code should be "if(a){alert('online');" like in the first snippet. I wonder if the process could be automated, so if it is online the browser would just open the page without having to tap OK? Thanks, Farcat
 
Rohan
Veteran developer
Profile
Posts: 79
Reg: Mar 12, 2011
London
10,040
like
06/08/13 06:30 AM (10 years ago)
Hi Farcat, the open brackets can be used as is. It basically says: if app is online { do nothing } else { do this code } It could be rewritten to exclude this step, but I felt it was neat to leave this option in so that for example other code could be executed, like displaying an ' online graphic or similar. cheers
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
06/08/13 06:34 AM (10 years ago)
Hi Rohan, You could make this into a Self-Hosted mod. I'm not sure how, but I'm sure Kittsy could give you a helping hand.
 
farcat
buzztouch Evangelist
Profile
Posts: 1008
Reg: Jan 27, 2012
France
13,230
like
06/08/13 12:59 PM (10 years ago)
Hi @Rohan, Thanks for the precision but I must be missing something. If I use the code as it is the url does not open if online.... puzzled. Farcat
 
Rohan
Veteran developer
Profile
Posts: 79
Reg: Mar 12, 2011
London
10,040
like
06/08/13 02:09 PM (10 years ago)
Hi Farcat, The script just intercepts if the html page is connected to the internet or not, and if not displays a pop up saying not connected. Without knowing what your html code is its difficult to work out why the url is not opening for you. If you want please PM me with your html code and I'll see if I can help figure it out for you. Hi @Annandale, self hosted mod. Why not, will have to set up a self hosted account first though. As a note Kittsy is the man, he rocks, absolute code genius, as well as a very decent chap. He's helped me and so many others, couldn't have made it this far without him :-)
 
farcat
buzztouch Evangelist
Profile
Posts: 1008
Reg: Jan 27, 2012
France
13,230
like
06/08/13 02:14 PM (10 years ago)
Hi Rohan, OK, sending you an PM - thanks for offering. Re Kittsy, totally second that, he is THE MAN! I wonder how he gets any of his own work done at all, I owe him a lot as well. :) Cheers, Farcat
 
tb
buzztouch Evangelist
Profile
Posts: 2050
Reg: Nov 03, 2011
Oxford
32,300
like
06/08/13 04:00 PM (10 years ago)
Rohan, If you want a head-start with the Self-Hosted, I can provide you with an account to my Self-Hosted. I can set up a user for you if you wish.
 

Login + Screen Name Required to Post

pointerLogin to participate so you can start earning points. Once you're logged in (and have a screen name entered in your profile), you can subscribe to topics, follow users, and start learning how to make apps like the pros.