add hikes/map pulls hikes out of db and renders
This commit is contained in:
@ -3,20 +3,23 @@ import React from 'react';
|
|||||||
import { Router } from 'react-router';
|
import { Router } from 'react-router';
|
||||||
import { history } from 'react-router/lib/BrowserHistory';
|
import { history } from 'react-router/lib/BrowserHistory';
|
||||||
import debugFactory from 'debug';
|
import debugFactory from 'debug';
|
||||||
import { Cat } from 'thundercats';
|
import { Render } from 'thundercats-react';
|
||||||
|
|
||||||
import { app$ } from '../common/app';
|
import { app$ } from '../common/app';
|
||||||
|
|
||||||
const debug = debugFactory('fcc:client');
|
const debug = debugFactory('fcc:client');
|
||||||
const DOMContianer = document.getElementById('fcc');
|
const DOMContianer = document.getElementById('fcc');
|
||||||
const fcc = new Cat();
|
|
||||||
|
|
||||||
Rx.longStackSupport = !!debug.enabled;
|
Rx.longStackSupport = !!debug.enabled;
|
||||||
|
|
||||||
// returns an observable
|
// returns an observable
|
||||||
app$(history)
|
app$(history)
|
||||||
.flatMap(([ initialState ]) => {
|
.flatMap(({ initialState, AppCat }) => {
|
||||||
return fcc.render(React.createElement(Router, initialState), DOMContianer);
|
return Render(
|
||||||
|
AppCat(),
|
||||||
|
React.createElement(Router, initialState),
|
||||||
|
DOMContianer
|
||||||
|
);
|
||||||
})
|
})
|
||||||
.subscribe(
|
.subscribe(
|
||||||
() => {
|
() => {
|
||||||
|
9
common/app/Cat.js
Normal file
9
common/app/Cat.js
Normal 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);
|
||||||
|
});
|
@ -2,6 +2,7 @@ import Rx from 'rx';
|
|||||||
import assign from 'object.assign';
|
import assign from 'object.assign';
|
||||||
import { Router } from 'react-router';
|
import { Router } from 'react-router';
|
||||||
import App from './App.jsx';
|
import App from './App.jsx';
|
||||||
|
import AppCat from './Cat';
|
||||||
|
|
||||||
import childRoutes from './routes';
|
import childRoutes from './routes';
|
||||||
|
|
||||||
@ -10,5 +11,8 @@ const router$ = Rx.Observable.fromNodeCallback(Router.run, Router);
|
|||||||
const routes = assign({ components: App }, childRoutes);
|
const routes = assign({ components: App }, childRoutes);
|
||||||
|
|
||||||
export default function app$(location) {
|
export default function app$(location) {
|
||||||
return router$(routes, location);
|
return router$(routes, location)
|
||||||
|
.map(([initialState, transistion]) => {
|
||||||
|
return { initialState, transistion, AppCat };
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
@ -1,19 +1,31 @@
|
|||||||
import React from 'react';
|
import React, { PropTypes } from 'react';
|
||||||
import stampit from 'react-stampit';
|
import stampit from 'react-stampit';
|
||||||
import { Link } from 'react-router';
|
import { Link } from 'react-router';
|
||||||
|
import { contain } from 'thundercats-react';
|
||||||
import { ListGroup, ListGroupItem, Panel } from 'react-bootstrap';
|
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',
|
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 (
|
return (
|
||||||
<ListGroupItem key={ id }>
|
<ListGroupItem key={ id }>
|
||||||
<Link to={ `/hikes/${id}` }>
|
<Link to={ `/hikes/${id}` }>
|
||||||
<h3>{ title }</h3>
|
<h3>{ name }</h3>
|
||||||
</Link>
|
</Link>
|
||||||
</ListGroupItem>
|
</ListGroupItem>
|
||||||
);
|
);
|
||||||
@ -30,4 +42,5 @@ export default stampit(React, {
|
|||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
|
);
|
||||||
|
34
common/app/routes/Hikes/flux/Actions.js
Normal file
34
common/app/routes/Hikes/flux/Actions.js
Normal 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 });
|
||||||
|
});
|
||||||
|
}
|
||||||
|
);
|
||||||
|
});
|
@ -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;
|
||||||
|
});
|
||||||
|
2
common/app/routes/Hikes/flux/index.js
Normal file
2
common/app/routes/Hikes/flux/index.js
Normal file
@ -0,0 +1,2 @@
|
|||||||
|
export { default as HikesActions } from './Actions';
|
||||||
|
export { default as HikesStore } from './Store';
|
@ -51,7 +51,7 @@
|
|||||||
"express-session": "~1.9.2",
|
"express-session": "~1.9.2",
|
||||||
"express-state": "^1.2.0",
|
"express-state": "^1.2.0",
|
||||||
"express-validator": "~2.8.0",
|
"express-validator": "~2.8.0",
|
||||||
"fetchr": "^0.4.16",
|
"fetchr": "^0.5.12",
|
||||||
"font-awesome": "~4.3.0",
|
"font-awesome": "~4.3.0",
|
||||||
"forever": "~0.14.1",
|
"forever": "~0.14.1",
|
||||||
"frameguard": "^0.2.2",
|
"frameguard": "^0.2.2",
|
||||||
@ -97,7 +97,8 @@
|
|||||||
"rx": "^2.5.3",
|
"rx": "^2.5.3",
|
||||||
"sanitize-html": "~1.6.1",
|
"sanitize-html": "~1.6.1",
|
||||||
"source-map-support": "^0.3.2",
|
"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",
|
"twit": "~1.1.20",
|
||||||
"uglify-js": "~2.4.15",
|
"uglify-js": "~2.4.15",
|
||||||
"validator": "~3.22.1",
|
"validator": "~3.22.1",
|
||||||
|
@ -3,7 +3,7 @@ import Router from 'react-router';
|
|||||||
import Location from 'react-router/lib/Location';
|
import Location from 'react-router/lib/Location';
|
||||||
import debugFactory from 'debug';
|
import debugFactory from 'debug';
|
||||||
import { app$ } from '../../common/app';
|
import { app$ } from '../../common/app';
|
||||||
import { Cat } from 'thundercats';
|
import { RenderToString } from 'thundercats-react';
|
||||||
|
|
||||||
const debug = debugFactory('freecc:servereact');
|
const debug = debugFactory('freecc:servereact');
|
||||||
|
|
||||||
@ -25,23 +25,23 @@ export default function reactSubRouter(app) {
|
|||||||
app.use(router);
|
app.use(router);
|
||||||
|
|
||||||
function serveReactApp(req, res, next) {
|
function serveReactApp(req, res, next) {
|
||||||
const fcc = new Cat();
|
|
||||||
const location = new Location(req.path, req.query);
|
const location = new Location(req.path, req.query);
|
||||||
|
|
||||||
// returns a router wrapped app
|
// returns a router wrapped app
|
||||||
app$(location)
|
app$(location)
|
||||||
// if react-router does not find a route send down the chain
|
// if react-router does not find a route send down the chain
|
||||||
.filter(function([ initialState ]) {
|
.filter(function({ initialState }) {
|
||||||
if (!initialState) {
|
if (!initialState) {
|
||||||
debug('tried to find %s but got 404', location.pathname);
|
debug('tried to find %s but got 404', location.pathname);
|
||||||
return next();
|
return next();
|
||||||
}
|
}
|
||||||
return !!initialState;
|
return !!initialState;
|
||||||
})
|
})
|
||||||
.flatMap(function([ initialState ]) {
|
.flatMap(function({ initialState, AppCat }) {
|
||||||
// call thundercats renderToString
|
// call thundercats renderToString
|
||||||
// prefetches data and sets up it up for current state
|
// prefetches data and sets up it up for current state
|
||||||
return fcc.renderToString(
|
return RenderToString(
|
||||||
|
AppCat(),
|
||||||
React.createElement(Router, initialState)
|
React.createElement(Router, initialState)
|
||||||
);
|
);
|
||||||
})
|
})
|
||||||
|
8
server/boot/a-services.js
Normal file
8
server/boot/a-services.js
Normal 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());
|
||||||
|
}
|
@ -108,7 +108,7 @@ module.exports = function(app) {
|
|||||||
app.use(router);
|
app.use(router);
|
||||||
|
|
||||||
function returnNextChallenge(req, res, next) {
|
function returnNextChallenge(req, res, next) {
|
||||||
var completed = req.user.completedChallenges.map(function (elem) {
|
var completed = req.user.completedChallenges.map(function(elem) {
|
||||||
return elem.id;
|
return elem.id;
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -157,12 +157,12 @@ module.exports = function(app) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function returnCurrentChallenge(req, res, next) {
|
function returnCurrentChallenge(req, res, next) {
|
||||||
var completed = req.user.completedChallenges.map(function (elem) {
|
var completed = req.user.completedChallenges.map(function(elem) {
|
||||||
return elem.id;
|
return elem.id;
|
||||||
});
|
});
|
||||||
|
|
||||||
req.user.uncompletedChallenges = utils.allChallengeIds()
|
req.user.uncompletedChallenges = utils.allChallengeIds()
|
||||||
.filter(function (elem) {
|
.filter(function(elem) {
|
||||||
if (completed.indexOf(elem) === -1) {
|
if (completed.indexOf(elem) === -1) {
|
||||||
return elem;
|
return elem;
|
||||||
}
|
}
|
||||||
@ -227,12 +227,12 @@ module.exports = function(app) {
|
|||||||
challengeName: challenge.name,
|
challengeName: challenge.name,
|
||||||
dashedName: challenge.dashedName,
|
dashedName: challenge.dashedName,
|
||||||
challengeBlock: R.head(R.flatten(Object.keys(challengeMapWithIds)
|
challengeBlock: R.head(R.flatten(Object.keys(challengeMapWithIds)
|
||||||
.map(function (key) {
|
.map(function(key) {
|
||||||
return challengeMapWithIds[key]
|
return challengeMapWithIds[key]
|
||||||
.filter(function (elem) {
|
.filter(function(elem) {
|
||||||
return elem === ('' + challenge.id);
|
return elem === ('' + challenge.id);
|
||||||
})
|
})
|
||||||
.map(function () {
|
.map(function() {
|
||||||
return key;
|
return key;
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
@ -263,15 +263,14 @@ module.exports = function(app) {
|
|||||||
environment: utils.whichEnvironment()
|
environment: utils.whichEnvironment()
|
||||||
};
|
};
|
||||||
|
|
||||||
//TODO Berkeley
|
// TODO Berkeley
|
||||||
var challengeView = {
|
var challengeView = {
|
||||||
0: 'coursewares/showHTML',
|
0: 'coursewares/showHTML',
|
||||||
1: 'coursewares/showJS',
|
1: 'coursewares/showJS',
|
||||||
2: 'coursewares/showVideo',
|
2: 'coursewares/showVideo',
|
||||||
3: 'coursewares/showZiplineOrBasejump',
|
3: 'coursewares/showZiplineOrBasejump',
|
||||||
4: 'coursewares/showZiplineOrBasejump',
|
4: 'coursewares/showZiplineOrBasejump',
|
||||||
5: 'coursewares/showBonfire',
|
5: 'coursewares/showBonfire'
|
||||||
6: 'coursewares/showHike'
|
|
||||||
};
|
};
|
||||||
|
|
||||||
saveUser(req.user)
|
saveUser(req.user)
|
||||||
|
@ -6,6 +6,14 @@ var utils = require('../utils');
|
|||||||
|
|
||||||
var allFieldGuideNamesAndIds = utils.allFieldGuideNamesAndIds();
|
var allFieldGuideNamesAndIds = utils.allFieldGuideNamesAndIds();
|
||||||
|
|
||||||
|
// order here determine order on all-articles page
|
||||||
|
const categories = [
|
||||||
|
'orientation',
|
||||||
|
'FYI',
|
||||||
|
'outreach',
|
||||||
|
'contact'
|
||||||
|
];
|
||||||
|
|
||||||
module.exports = function(app) {
|
module.exports = function(app) {
|
||||||
var router = app.loopback.Router();
|
var router = app.loopback.Router();
|
||||||
var FieldGuide = app.models.FieldGuide;
|
var FieldGuide = app.models.FieldGuide;
|
||||||
@ -88,14 +96,6 @@ module.exports = function(app) {
|
|||||||
completedFieldGuides = req.user.completedFieldGuides;
|
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
|
// produces an array of arrays of field guides ordered by the above
|
||||||
// i.e. [[...orientFieldGuides][...FYIfieldGuides]...]
|
// i.e. [[...orientFieldGuides][...FYIfieldGuides]...]
|
||||||
const orderFieldGuides = categories
|
const orderFieldGuides = categories
|
||||||
|
15
server/services/hikes.js
Normal file
15
server/services/hikes.js
Normal 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);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
Reference in New Issue
Block a user