-
11 | {this.props.locations.map((location, i) => {
12 | return (
13 |
- {location.name} 14 | ); 15 | })} 16 |
{this.props.errorMessage}
33 | );
34 | }
35 |
36 | if (LocationStore.isLoading()) {
37 | return (
38 |
39 | 
40 |
41 | )
42 | }
43 |
44 | return (
45 |
40 | -
46 | {this.props.locations.map((location, i) => {
47 | var faveButton = (
48 |
51 | );
52 |
53 | return (
54 |
- 55 | {location.name} {location.has_favorite ? '<3' : faveButton} 56 | 57 | ); 58 | })} 59 |
72 |
74 |
76 |
77 |
79 |
81 |
82 | );
83 | }
84 | });
85 |
86 | module.exports = Locations;
87 |
--------------------------------------------------------------------------------
/src/sources/LocationSource.js:
--------------------------------------------------------------------------------
1 | var LocationActions = require('../actions/LocationActions');
2 |
3 | var mockData = [
4 | { id: 0, name: 'Abu Dhabi' },
5 | { id: 1, name: 'Berlin' },
6 | { id: 2, name: 'Bogota' },
7 | { id: 3, name: 'Buenos Aires' },
8 | { id: 4, name: 'Cairo' },
9 | { id: 5, name: 'Chicago' },
10 | { id: 6, name: 'Lima' },
11 | { id: 7, name: 'London' },
12 | { id: 8, name: 'Miami' },
13 | { id: 9, name: 'Moscow' },
14 | { id: 10, name: 'Mumbai' },
15 | { id: 11, name: 'Paris' },
16 | { id: 12, name: 'San Francisco' }
17 | ];
18 |
19 | var LocationSource = {
20 | fetchLocations() {
21 | return {
22 | remote() {
23 | return new Promise(function (resolve, reject) {
24 | // simulate an asynchronous flow where data is fetched on
25 | // a remote server somewhere.
26 | setTimeout(function () {
27 |
28 | // change this to `false` to see the error action being handled.
29 | if (true) {
30 | // resolve with some mock data
31 | resolve(mockData);
32 | } else {
33 | reject('Things have broken');
34 | }
35 | }, 250);
36 | });
37 | },
38 |
39 | local() {
40 | // Never check locally, always fetch remotely.
41 | return null;
42 | },
43 |
44 | success: LocationActions.updateLocations,
45 | error: LocationActions.locationsFailed,
46 | loading: LocationActions.fetchLocations
47 | }
48 | }
49 | };
50 |
51 | module.exports = LocationSource;
52 |
--------------------------------------------------------------------------------
/src/stores/FavoritesStore.js:
--------------------------------------------------------------------------------
1 | var alt = require('../alt');
2 | var LocationActions = require('../actions/LocationActions');
3 |
4 | class FavoritesStore {
5 | constructor() {
6 | this.locations = [];
7 |
8 | this.bindListeners({
9 | addFavoriteLocation: LocationActions.FAVORITE_LOCATION
10 | });
11 | }
12 |
13 | addFavoriteLocation(location) {
14 | this.locations.push(location);
15 | }
16 | }
17 |
18 | module.exports = alt.createStore(FavoritesStore, 'FavoritesStore');
19 |
--------------------------------------------------------------------------------
/src/stores/LocationStore.js:
--------------------------------------------------------------------------------
1 | var alt = require('../alt');
2 | var LocationActions = require('../actions/LocationActions');
3 | var LocationSource = require('../sources/LocationSource');
4 | var FavoritesStore = require('./FavoritesStore');
5 |
6 | class LocationStore {
7 | constructor() {
8 | this.locations = [];
9 | this.errorMessage = null;
10 |
11 | this.bindListeners({
12 | handleUpdateLocations: LocationActions.UPDATE_LOCATIONS,
13 | handleFetchLocations: LocationActions.FETCH_LOCATIONS,
14 | handleLocationsFailed: LocationActions.LOCATIONS_FAILED,
15 | setFavorites: LocationActions.FAVORITE_LOCATION
16 | });
17 |
18 | this.exportPublicMethods({
19 | getLocation: this.getLocation
20 | });
21 |
22 | this.exportAsync(LocationSource);
23 | }
24 |
25 | handleUpdateLocations(locations) {
26 | this.locations = locations;
27 | this.errorMessage = null;
28 | }
29 |
30 | handleFetchLocations() {
31 | this.locations = [];
32 | }
33 |
34 | handleLocationsFailed(errorMessage) {
35 | this.errorMessage = errorMessage;
36 | }
37 |
38 | resetAllFavorites() {
39 | this.locations = this.locations.map((location) => {
40 | return {
41 | id: location.id,
42 | name: location.name,
43 | has_favorite: false
44 | };
45 | });
46 | }
47 |
48 | setFavorites(location) {
49 | this.waitFor(FavoritesStore);
50 |
51 | var favoritedLocations = FavoritesStore.getState().locations;
52 |
53 | this.resetAllFavorites();
54 |
55 | favoritedLocations.forEach((location) => {
56 | // find each location in the array
57 | for (var i = 0; i < this.locations.length; i += 1) {
58 |
59 | // set has_favorite to true
60 | if (this.locations[i].id === location.id) {
61 | this.locations[i].has_favorite = true;
62 | break;
63 | }
64 | }
65 | });
66 | }
67 |
68 | getLocation(id) {
69 | var { locations } = this.getState();
70 | for (var i = 0; i < locations.length; i += 1) {
71 | if (locations[i].id === id) {
72 | return locations[i];
73 | }
74 | }
75 |
76 | return null;
77 | }
78 | }
79 |
80 | module.exports = alt.createStore(LocationStore, 'LocationStore');
81 |
--------------------------------------------------------------------------------