add hikes/map pulls hikes out of db and renders

This commit is contained in:
Berkeley Martinez
2015-07-13 00:25:01 -07:00
parent 8f738fb1d0
commit de1d931b82
13 changed files with 161 additions and 54 deletions

View File

@ -3,20 +3,23 @@ import React from 'react';
import { Router } from 'react-router';
import { history } from 'react-router/lib/BrowserHistory';
import debugFactory from 'debug';
import { Cat } from 'thundercats';
import { Render } from 'thundercats-react';
import { app$ } from '../common/app';
const debug = debugFactory('fcc:client');
const DOMContianer = document.getElementById('fcc');
const fcc = new Cat();
Rx.longStackSupport = !!debug.enabled;
// returns an observable
app$(history)
.flatMap(([ initialState ]) => {
return fcc.render(React.createElement(Router, initialState), DOMContianer);
.flatMap(({ initialState, AppCat }) => {
return Render(
AppCat(),
React.createElement(Router, initialState),
DOMContianer
);
})
.subscribe(
() => {

9
common/app/Cat.js Normal file
View File

@ -0,0 +1,9 @@
import { Cat } from 'thundercats';
import { HikesActions, HikesStore } from './routes/Hikes/flux';
export default Cat()
.init(({ instance }) => {
instance.register(HikesActions);
instance.register(HikesStore, null, instance);
});

View File

@ -2,6 +2,7 @@ import Rx from 'rx';
import assign from 'object.assign';
import { Router } from 'react-router';
import App from './App.jsx';
import AppCat from './Cat';
import childRoutes from './routes';
@ -10,5 +11,8 @@ const router$ = Rx.Observable.fromNodeCallback(Router.run, Router);
const routes = assign({ components: App }, childRoutes);
export default function app$(location) {
return router$(routes, location);
return router$(routes, location)
.map(([initialState, transistion]) => {
return { initialState, transistion, AppCat };
});
}

View File

@ -1,19 +1,31 @@
import React from 'react';
import React, { PropTypes } from 'react';
import stampit from 'react-stampit';
import { Link } from 'react-router';
import { contain } from 'thundercats-react';
import { ListGroup, ListGroupItem, Panel } from 'react-bootstrap';
import videos from '../videos.json';
export default stampit(React, {
export default contain(
{
store: 'hikesStore',
fetchAction: 'hikesActions.fetchHikes'
},
stampit(React, {
displayName: 'HikesMap',
render() {
propTypes: {
hikes: PropTypes.array
},
const vidElements = videos.map(({ title, id }) => {
render() {
const {
hikes
} = this.props;
const vidElements = hikes.map(({ name, id }) => {
return (
<ListGroupItem key={ id }>
<Link to={ `/hikes/${id}` }>
<h3>{ title }</h3>
<h3>{ name }</h3>
</Link>
</ListGroupItem>
);
@ -30,4 +42,5 @@ export default stampit(React, {
</div>
);
}
});
})
);

View File

@ -0,0 +1,34 @@
import { Actions } from 'thundercats';
import debugFactory from 'debug';
import Fetchr from 'fetchr';
const debug = debugFactory('freecc:hikes:actions');
const service = new Fetchr({
xhrPath: '/services'
});
export default Actions({
// start fetching hikes
fetchHikes: null,
// set hikes on store
setHikes: null,
getHike(id) {
return { id };
}
})
.refs({ displayName: 'HikesActions' })
.init(({ instance }) => {
// set up hikes fetching
// TODO(berks): check if store is already primed
instance.fetchHikes.subscribe(
() => {
service.read('hikes', null, null, (err, hikes) => {
if (err) {
debug('an error occured fetching hikes', err);
}
instance.setHikes({ hikes });
});
}
);
});

View File

@ -0,0 +1,19 @@
import { Store } from 'thundercats';
const initialValue = {
hikes: [],
isPrimed: false
};
export default Store(initialValue)
.refs({ displayName: 'HikesStore'})
.init(({ instance, args }) => {
const [cat] = args;
let {
setHikes
// getHike
} = cat.getActions('hikesActions');
instance.register(Store.setter(setHikes));
return instance;
});

View File

@ -0,0 +1,2 @@
export { default as HikesActions } from './Actions';
export { default as HikesStore } from './Store';

View File

@ -51,7 +51,7 @@
"express-session": "~1.9.2",
"express-state": "^1.2.0",
"express-validator": "~2.8.0",
"fetchr": "^0.4.16",
"fetchr": "^0.5.12",
"font-awesome": "~4.3.0",
"forever": "~0.14.1",
"frameguard": "^0.2.2",
@ -97,7 +97,8 @@
"rx": "^2.5.3",
"sanitize-html": "~1.6.1",
"source-map-support": "^0.3.2",
"thundercats": "^2.0.0-rc6",
"thundercats": "^2.0.0-rc8",
"thundercats-react": "0.0.3",
"twit": "~1.1.20",
"uglify-js": "~2.4.15",
"validator": "~3.22.1",

View File

@ -3,7 +3,7 @@ import Router from 'react-router';
import Location from 'react-router/lib/Location';
import debugFactory from 'debug';
import { app$ } from '../../common/app';
import { Cat } from 'thundercats';
import { RenderToString } from 'thundercats-react';
const debug = debugFactory('freecc:servereact');
@ -25,23 +25,23 @@ export default function reactSubRouter(app) {
app.use(router);
function serveReactApp(req, res, next) {
const fcc = new Cat();
const location = new Location(req.path, req.query);
// returns a router wrapped app
app$(location)
// if react-router does not find a route send down the chain
.filter(function([ initialState ]) {
.filter(function({ initialState }) {
if (!initialState) {
debug('tried to find %s but got 404', location.pathname);
return next();
}
return !!initialState;
})
.flatMap(function([ initialState ]) {
.flatMap(function({ initialState, AppCat }) {
// call thundercats renderToString
// prefetches data and sets up it up for current state
return fcc.renderToString(
return RenderToString(
AppCat(),
React.createElement(Router, initialState)
);
})

View File

@ -0,0 +1,8 @@
import Fetchr from 'fetchr';
import getHikesService from '../services/hikes';
export default function bootServices(app) {
const hikesService = getHikesService(app);
Fetchr.registerFetcher(hikesService);
app.use('/services', Fetchr.middleware());
}

View File

@ -270,8 +270,7 @@ module.exports = function(app) {
2: 'coursewares/showVideo',
3: 'coursewares/showZiplineOrBasejump',
4: 'coursewares/showZiplineOrBasejump',
5: 'coursewares/showBonfire',
6: 'coursewares/showHike'
5: 'coursewares/showBonfire'
};
saveUser(req.user)

View File

@ -6,6 +6,14 @@ var utils = require('../utils');
var allFieldGuideNamesAndIds = utils.allFieldGuideNamesAndIds();
// order here determine order on all-articles page
const categories = [
'orientation',
'FYI',
'outreach',
'contact'
];
module.exports = function(app) {
var router = app.loopback.Router();
var FieldGuide = app.models.FieldGuide;
@ -88,14 +96,6 @@ module.exports = function(app) {
completedFieldGuides = req.user.completedFieldGuides;
}
// order here determine order on page
const categories = [
'orientation',
'FYI',
'outreach',
'contact'
];
// produces an array of arrays of field guides ordered by the above
// i.e. [[...orientFieldGuides][...FYIfieldGuides]...]
const orderFieldGuides = categories

15
server/services/hikes.js Normal file
View File

@ -0,0 +1,15 @@
export default function hikesService(app) {
const Challenge = app.models.Challenge;
return {
name: 'hikes',
read: (req, resource, params, config, cb) => {
Challenge.find({ where: { challengeType: '6' } }, (err, hikes) => {
if (err) {
return cb(err);
}
cb(null, hikes);
});
}
};
}