I am creating an application where the user's location is found using HTML5 geolocation. As soon as their location is restored, their location will be mapped (parent route). They can then choose to view a list of tweets that have been placed around this location (child route).
So, I need to transfer the coordinates that I received on the parent route (which is stored on the controller) to the child route so that I can correctly request the Twitter API. However, I am not sure how to do this or even if I have chosen the best approach.
This is the index controller:
App.IndexController = Ember.ObjectController.extend({
coords: false,
getGeoLocation: function() {
if (navigator.geolocation) {
this.set('retrieving', true);
navigator.geolocation.getCurrentPosition(
this.locationRetrieved.bind(this),
this.locationFailed.bind(this),
{
timeout: 20000
}
);
} else {
this.set('geolocation', false);
}
},
locationRetrieved: function(position) {
this.set('coords', position.coords);
this.get('target').transitionTo('what-do-you-want-to-know');
}
});
The WhatDoYouWantToKnow controller "needs" an index controller:
App.WhatDoYouWantToKnowController = Ember.ObjectController.extend({
needs: 'index',
createMap: function() {
var coords = this.get('controllers.index').get('coords');
var pyrmont = new google.maps.LatLng(coords.latitude, coords.longitude);
var map = new google.maps.Map(document.getElementById('map'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: pyrmont,
zoom: 8
});
var marker = new google.maps.Marker({
map: map,
position: pyrmont
});
}
});
, '/what-do-you-want-to-know/tweets':
<p>Your location:</p>
<div id="map"></div>
<ul>
<li>{{#linkTo 'tweets'}}Tweets{{/linkTo}}</li>
</ul>
:
App.TweetsRoute = Ember.Route.extend({
model: function() {
return App.Tweet.find({coords:});
}
});
Ember Data.