sencha button stop

Question

Can someone please help me? I have a map in sencha that can track my current location and it draws lines. But I also want a button to stop tracking. So I want to set autoUpdate: false;But I seriously dont know how to do this...

This is my code

Ext.application({
name: 'Applicatie3.',
launch: function() {
    var view = Ext.create('Ext.NavigationView', {
        fullscreen: true,
        items: [{
            title: "I'm lost",
            xtype: 'tabpanel',
            items:[{
                title               : 'Home',
                xtype               : 'map',
                iconCls             : 'home',
                mapOptions          : { zoom: 20  },
                useCurrentLocation  : true,
                listeners           : {
                    maprender: function(comp, map){
                        var marker = new google.maps.Marker({
                            position    : new google.maps.LatLng( ),
                            map         : map
                        }),
                        infowindow = new google.maps.InfoWindow({
                            content     : '........'
                        }),
                        route = [ ],
                        geo = Ext.create('Ext.util.Geolocation', {
                            frequency         : 3000,
                            autoUpdate        : true,
                            allowHighAccuracy : true,
                            listeners         : {
                                locationupdate : function(geo) {
                                    polyline = new google.maps.Polyline({
                                        path : route,
                                        strokeColor: "red",
                                        strokeOpacity: 1.0,
                                        strokeWeight: 5
                                    });
                                    polyline.setMap(map),

                                    //alert(route);
                                    route.push( new google.maps.LatLng( geo.getLatitude(),geo.getLongitude() ) );

                                    marker.setPosition(new google.maps.LatLng( geo.getLatitude(),geo.getLongitude() ) );

                                    google.maps.event.addListener(marker, 'click', function() {
                                         infowindow.open(map, marker);
                                    });

                                },
                                locationerror: function(geo, bTimeout, bPermissionDenied, bLocationUnavailable, message) {
                                    if(bTimeout){
                                        alert('Timeout occurred.');
                                    } else {
                                        alert('Error occurred.');
                                    }
                                }
                            } 
                        });
                        geo.updateLocation();
                    }                   
                } 
            } ]
        }]
    });
}

});

Answer 1

I solved this problem with a global variable which is set false and when I press the start button then the variable change to true. In the function I have a if(true) {do location update}, when the variable is set false then the location update don't work.

Answer 2

Looking for the setAutoUpdate() method? - http://docs.sencha.com/touch/2-1/#!/api/Ext.util.Geolocation-method-setAutoUpdate

Answer 3

You need a listener of some sort to fire an event.

Either add a Toolbar with a Button (note the 'handler' config) or add a listener for an event from the google.maps.Map (see getMap(0 to get that object and this to add the listener).

However you decide to do it, in the handler function do a Ext.ComponentQuery('map') for the map and call setUserCurrentLocation(false).

Hope this helps.