Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on Jun 14th, 2012  |  syntax: JavaScript  |  size: 5.80 KB  |  hits: 39  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. KortrijkApp.views.KaartPanel = Ext.extend(Ext.Panel, {
  2.     //fullscreen: true,
  3.     initComponent: function() {
  4.         KortrijkApp.instances = {};
  5.         KortrijkApp.instances.geoMap = new Ext.Map({
  6.             useCurrentLocation: true,
  7.             height: '306',
  8.             mapOptions: {
  9.                 zoom: 15
  10.             },
  11.             listeners: {
  12.                 afterrender: function() {
  13.                     var geoPos = new Ext.util.GeoLocation({
  14.                         timeout: 15000,
  15.                         listeners: {
  16.                             locationupdate: function(geo) {
  17.                                 directionsService = new google.maps.DirectionsService();
  18.                                 var rendererOptions = {
  19.                                     map: KortrijkApp.instances.geoMap['map']
  20.                                 };
  21.                                 directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);
  22.  
  23.                                 console.log('geopos: ' + geoPos['latitude'] + ',' + geoPos['longitude']);
  24.                                 var start = geoPos['latitude'] + ',' + geoPos['longitude'];
  25.                                 var end = huidigMonumentInfo['pos-lat'] + ',' + huidigMonumentInfo['pos-lng'];
  26.                                 var request = {
  27.                                     origin: start,
  28.                                     destination: end,
  29.                                     travelMode: google.maps.DirectionsTravelMode.WALKING
  30.                                 };
  31.  
  32.                                 // Route the directions and pass the response to a
  33.                                 // function to create markers for each step.
  34.                                 directionsService.route(request, function(response, status) {
  35.                                     if (status == google.maps.DirectionsStatus.OK) {
  36.                                         directionsDisplay.setDirections(response);
  37.                                     }
  38.                                 });
  39.  
  40.                                 var geocords = new google.maps.LatLng(geo.coords.latitude, geo.coords.longitude);
  41.                                 console.log('geocords: ' + geo.coords.latitude + ',' + geo.coords.longitude);
  42.  
  43.                                 if (KortrijkApp.instances.geoMap.rendered) {
  44.                                     var marker = new google.maps.Marker({
  45.                                         position: geocords,
  46.                                         icon: 'assets/images/icon.png',
  47.                                         map: KortrijkApp.instances.geoMap.map
  48.                                     });
  49.                                 }
  50.                             },
  51.                             locationerror: function(geo, bTimeout, bPermissionDenied, bLocationUnavailable , message) {
  52.                                 if (bTimeout) {
  53.                                     alert('Timeout occured');
  54.                                 } else {
  55.                                     alert('Error occured');
  56.                                 }
  57.                             }
  58.                         }
  59.                     });
  60.                 }
  61.             }
  62.         });
  63.  
  64.         this.items = [
  65.             new Ext.Panel({
  66.                 cls:'header',
  67.                 dockedItems:[{
  68.                     border: false,
  69.                     dock  : 'top',
  70.                     xtype : 'toolbar',
  71.                     title : 'Route Kortrijk', // display: none
  72.                     style : 'background-color:#ebe6dc;'
  73.                 }]
  74.             }),
  75.             KortrijkApp.instances.geoMap,
  76.             new Ext.Panel({
  77.                 cls: 'footerGame',
  78.                 height: 63,
  79.                 style: 'background-color:#ebe6dc;',
  80.                 items:[
  81.                     new Ext.Button({
  82.                         cls:'footerBtnSpel',
  83.                         ui: 'plain',
  84.                         width:73,
  85.                         height:61,
  86.                         listeners: {
  87.                             tap: function(){
  88.                                 Ext.dispatch({
  89.                                     controller: 'MainController',
  90.                                     action: 'changePanel',
  91.                                     displayObject: 'gamePanel'
  92.                                 });
  93.                             }
  94.                         }
  95.                     }),
  96.                     new Ext.Button({
  97.                         cls:'footerBtnScore',
  98.                         ui: 'plain',
  99.                         width:73,
  100.                         height:61,
  101.                         listeners: {
  102.                             tap: function(){
  103.                                 Ext.dispatch({
  104.                                     controller: 'MainController',
  105.                                     action: 'changePanel',
  106.                                     displayObject: 'scorePanel'
  107.                                 });
  108.                             }
  109.                         }
  110.                     }),
  111.                     new Ext.Button({
  112.                         cls:'footerBtnKaart',
  113.                         ui: 'plain',
  114.                         width:73,
  115.                         height:61,
  116.                         listeners: {
  117.                             tap: function(){
  118.                                 Ext.dispatch({
  119.                                     controller: 'MainController',
  120.                                     action: 'changePanel',
  121.                                     displayObject: 'kaartPanel'
  122.                                 });
  123.                             }
  124.                         }
  125.                     })
  126.                 ]
  127.             })
  128.         ];
  129.  
  130.         KortrijkApp.views.KaartPanel.superclass.initComponent.apply(this, arguments);
  131.     }
  132. });