3/13/2014

JavaScript - Direction and Show Map on SmartPhone Native App

Hi,

Here is the code I used on the new Mobile version of www.belle-campagne.be

The first method is used to detect whether or not the accessing device is a Computer or a Smartphone (only the size of the screen is considered)

The 2 other method launch the native maps application in Windows Phone, IOS 6-7, Android.

Have fun and keep coding!

Christophe



 function redirect()  
 {  
      if ( (screen.width > 1024) && (screen.height > 768) )   
      {   
       window.location = 'http://www.belle-campagne.be/index.html';  
      }   
 }  
 function openInMap()  
 {  
   if( (navigator.platform.indexOf("iPhone") != -1)   
     || (navigator.platform.indexOf("iPod") != -1))  
     window.open("http://maps.apple.com/maps?q=50.3258755,5.593183&z=11");  
   else if (navigator.platform.indexOf("Win32") != -1)   
     window.open("explore-maps://v2.0/show/place/?latlon=50.3258755,5.593183&zoom=11");  
      else  
      {  
           var ua = navigator.userAgent.toLowerCase();  
           var isAndroid = ua.indexOf("android") > -1;  
           if(isAndroid)   
                window.open('http://maps.google.com/maps?q=50.3258755,5.593183&z=2');  
           else  
                window.open("comgooglemaps://?center=50.3258755,5.593183&zoom=11&views=traffic");  
      }  
 }  
 function showRouteInMap()  
 {  
   if( (navigator.platform.indexOf("iPhone") != -1)   
     || (navigator.platform.indexOf("iPod") != -1))  
     window.open("http://maps.apple.com/maps?daddr=50.3258755,5.593183");  
   else if (navigator.platform.indexOf("Win32") != -1)   
     window.open("directions://v2.0/route/destination/?latlon=50.3258755,5.593183");  
      else  
      {  
           var ua = navigator.userAgent.toLowerCase();  
           var isAndroid = ua.indexOf("android") > -1;  
           if(isAndroid)   
                window.open('http://maps.google.com/?daddr=50.3258755,5.593183&directionsmode=transit');  
           else  
                window.open("comgooglemaps://?daddr=50.3258755,5.593183&directionsmode=transit");  
      }  
 }  

No comments:

Post a comment