1 /** 2 * @auhtor : Tarek Salah 3 * 4 * this java script code used to use GeoLoaction API of the PhoneGap library to 5 * get the current location to show it on the map with marker 6 * 7 */ 8 9 // This is an event that fires when PhoneGap is fully loaded. 10 // then we can begin to run GPS to get the position 11 document.addEventListener("deviceready", onDeviceReady, false); 12 window.addEventListener("orientationchange", orientationChange, true); 13 14 /** hold reference to google map object */ 15 var map; 16 /** hold reference to information window object */ 17 var infoWindow; 18 19 /** 20 * Jason object used to hold the information about the stores 21 * and its title and its locations 22 */ 23 var JasonObj = { 24 "Locations" : [ { 25 "title" : "Store 1", 26 "longitude" : 29.9517070, 27 "latitude" : 31.2260669, 28 }, { 29 "title" : "Store 2", 30 "longitude" : 29.9598065, 31 "latitude" : 31.2243669, 32 }, { 33 "title" : "Store 3", 34 "longitude" : 29.9586080, 35 "latitude" : 31.2290669, 36 }, { 37 "title" : "Store 4", 38 "longitude" : 29.9508075, 39 "latitude" : 31.2296670, 40 } ] 41 } 42 43 /** 44 * called when the orientation change 45 * @function 46 * @return {void} 47 */ 48 function orientationChange(e) { 49 var orientation = window.orientation; 50 switch (orientation) { 51 } 52 } 53 54 /** 55 * Called when the event "device ready" is fired".<br> 56 * <u><b> Description </b></u><br> 57 * call navigator to get the current position if the device succeed to 58 * get the location then call {@link onSuceess} method else call {@link onError} method 59 * @function 60 * @return {void} 61 */ 62 function onDeviceReady() { 63 // nessecary to enable this option 64 // when working with android 2.x 65 var options = { 66 enableHighAccuracy : true 67 }; 68 // activate the GPS 69 navigator.geolocation.getCurrentPosition(onSuccess, onError, options); 70 } 71 72 /** 73 * called in case of success to get the current location.<br> 74 * <u><b> Description </b></u><br> 75 * this method take parameter position that contain <b>coords</b> to get longitude and latitude<br> 76 * create Gmap object and give the longitude and latitude.<br> 77 * show it in div with id = map1.<br> 78 * create marker with the current position coordinates.<br> 79 * 80 * @function 81 * @param {Object} position contains a lot of information about the current location such as:<br> 82 * latitude, longitude , altitude, accuracy , speed 83 * @return {void} 84 */ 85 function onSuccess(position) { 86 // create Gmap object with longtiude and latitude 87 var latlng = new google.maps.LatLng(position.coords.latitude, 88 position.coords.longitude); 89 // setting its options 90 var myOptions = { 91 zoom : 15, // level of zoom 92 center : latlng, 93 mapTypeId : google.maps.MapTypeId.ROADMAP 94 // road map 95 }; 96 // set the map to div with id map1 97 map = new google.maps.Map(document.getElementById("map1"), myOptions); 98 // making map marker to some the location point 99 var marker = new google.maps.Marker({ 100 position : latlng, 101 title : "My Google Map", 102 clickable : true 103 }); 104 infoWindow = new google.maps.InfoWindow(); 105 google.maps.event.addListenerOnce(map, 'tilesloaded', addMarkers); 106 107 marker.setMap(map); 108 google.maps.event.addListener(marker, 'click', function() { 109 infoWindow.setContent("you are here"); 110 infoWindow.open(map, marker); 111 }); 112 // alert(position.coords.latitude + " " + position.coords.longitude); 113 // 31.2290669 29.9548075 114 getShortDistance(position.coords.latitude, position.coords.longitude); 115 } 116 117 /** 118 * used to add markers to map at specific points determined by Jason Object 119 * @return {void} 120 */ 121 function addMarkers() { 122 /** 123 * @inner 124 */ 125 function createMarker(map, position, i) { 126 var marker = new google.maps.Marker( 127 { 128 position : position, 129 map : map, 130 icon : "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=" 131 + (i + 1) + "|6495ED|000000" 132 }); 133 134 google.maps.event.addListener(marker, 'click', function() { 135 var myHtml = JasonObj.Locations[i].title + '<br>' 136 + '<a href="http://www.google.com">Google</a>'; 137 infoWindow.setContent(myHtml); 138 infoWindow.open(map, marker); 139 }); 140 } 141 142 for ( var i = 0; i < JasonObj.Locations.length; i++) { 143 var latLng = new google.maps.LatLng(JasonObj.Locations[i].latitude, 144 JasonObj.Locations[i].longitude); 145 createMarker(map, latLng, i); 146 } 147 } 148 149 /** 150 * @function 151 * @description called in case of error in getting the current location.<br> 152 * <u><b> Description </b></u><br> 153 * printing the error code and the type of it 154 * @param {Object} e error code and type 155 * @return {void} 156 */ 157 function onError(error) { 158 navigator.notification.alert('code: ' + error.code + '\n' + 'message: ' 159 + error.message + '\n'); 160 } 161 162 /** 163 * Get the shortest path from the current location to some points determined 164 * by the points in Jason object. <br> 165 * <u><b> Description </b></u><br> 166 * Looping through Jason object and calculate the distance 167 * between current location and specific store <br> 168 * Then viewing on HTML div determined by id=nearestLoc 169 * @function 170 * @param {Object}lat latitude of current location 171 * @param {Object}lon longitude of the current location 172 * @return {void} 173 */ 174 function getShortDistance(lat, lon) { 175 var min = 999999999; 176 var index = 0; 177 for ( var i = 0; i < JasonObj.Locations.length; i++) { 178 var length = calculateDistance(lat, lon, 179 JasonObj.Locations[i].latitude, JasonObj.Locations[i].longitude); 180 if (length < min) { 181 min = length; 182 index = i; 183 } 184 } 185 document.getElementById("nearestLoc").innerHTML = "Store " + (index + 1) 186 + " is the nearest to you<br>( " + (min * 1000).toFixed(2) + " M)"; 187 } 188 189 /** 190 * 191 * calculate distance method used to get the distance between two points using 192 * longitude and latitude the first point (lat1,lon1) the second point 193 * (lat2,lon2). 194 * 195 * @function 196 * @param {Object} lat1 latitude of the first point 197 * @param {Object} lon1 longitude of the first point 198 * @param {Object} lat2 latitude of the second point 199 * @param {Object} lon2 longitude of the second point 200 * @return {Object} d distance between points(lat1,lon1) and (lat2,lon2). 201 */ 202 function calculateDistance(lat1, lon1, lat2, lon2) { 203 var R = 6371; 204 // Radius of the earth in km 205 var dLat = ((lat2 - lat1) * Math.PI) / 180; 206 // Javascript functions in radians 207 var dLon = ((lon2 - lon1) * Math.PI) / 180; 208 var a = Math.sin(dLat / 2) * Math.sin(dLat / 2) 209 + Math.cos((lat1 * Math.PI) / 180) 210 * Math.cos((lat1 * Math.PI) / 180) * Math.sin(dLon / 2) 211 * Math.sin(dLon / 2); 212 var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a)); 213 var d = R * c; 214 // Distance in km 215 return d; 216 217 } 218