How to build a Runkeeper-style GPS log on map?

I'm trying to build a mobile application using Ionic Framework and Angular.js. Part of this app will be a view where you start logging your GPS position on a map. When you finish logging it you should see the route you took and be informed of the distance and time it took. Pretty much Runkeeper / Endomondo style, but simpler.

Is this even possible in Ionic / Angular? Or is Native iOS / Android needed? If it is possible somehow, can you help me get started? My searches here on Stackoverflow seem to indicate it is possible somehow but all questions are too advanced, the author's are already in the middle of it. I need help finding the starting point.

I've asked this question in Ionic's forum (http://forum.ionicframework.com/t/can-i-build-gps-logging-on-map-in-ionic/9296/2) but it's been over 12 hours now without a reply so I'm placing my hopes on you guys here at Stackoverflow. I'm new to programming so please be patient and don't assume I know too much. Thanks!

I don't have any map preferences. I would go with Google Maps unless someone says differently. I'm working on a Mac. I have Ionic, cordova, angular.js and node.js installed.

Update Sep 9, 09:43 CET: I've gotten a tip to look into ng-cordova's plugin "$cordovaGeolocation". I'm doing that now and I'll report here later.

Update Sep 9, 10:50 CET Ok I've installed ngCordova and the $cordovaGeolocation plugin. I'm getting the location correct, it seems. But now how do I start saving these locations over time? A button should start this and end it. (and then show each datapoint on a map, or ideally draw a line between them from start to finish)

Update Sep 10, 11:15 CET I now have this code in a controller. It's from the ngCordova $cordovaGeolocation plugin. It seems to only run once. How do I keep feeding an array with the position over time?

        $cordovaGeolocation
        .getCurrentPosition()
        .then(function (position) {
            var lat  = position.coords.latitude
            var long = position.coords.longitude
        }, function(err) {
            // error
            alert('code: '    + err.code    + '\n' +
                'message: ' + err.message + '\n');
        });

    // begin watching
    var watch = $cordovaGeolocation.watchPosition({ frequency: 1000 });
    watch.promise.then(function() { /* Not  used */ },
        function(err) {
            // An error occurred.
            alert('code: '    + err.code    + '\n' +
                'message: ' + err.message + '\n');
        },
        function(position) {
            // Active updates of the position here
            // position.coords.[ latitude / longitude]
            var element = document.getElementById('geolocation');
            element.innerHTML = 'Latitude: '  + position.coords.latitude      + '<br />' +
                'Longitude: ' + position.coords.longitude     + '<br />' +
                'Timestamp: ' + position.timestamp + '<br />' +
            '<hr />'      + element.innerHTML;
        });
    // clear watch
    $cordovaGeolocation.clearWatch(watch.watchID)