diff --git a/browser/main/Components/PlanetArticleList.jsx b/browser/main/Components/PlanetArticleList.jsx index 809cc658..2fe6474b 100644 --- a/browser/main/Components/PlanetArticleList.jsx +++ b/browser/main/Components/PlanetArticleList.jsx @@ -8,11 +8,7 @@ var Markdown = require('../Mixins/Markdown') var PlanetArticleList = React.createClass({ mixins: [ReactRouter.Navigation, ReactRouter.State, ForceUpdate(60000), Markdown], propTypes: { - planet: React.PropTypes.shape({ - Snippets: React.PropTypes.array, - Blueprints: React.PropTypes.array, - Articles: React.PropTypes.array - }), + articles: React.PropTypes.array, onPressDown: React.PropTypes.func, onPressUp: React.PropTypes.func }, @@ -28,7 +24,7 @@ var PlanetArticleList = React.createClass({ } }, render: function () { - var articles = this.props.planet.Articles.map(function (article) { + var articles = this.props.articles.map(function (article) { var tags = article.Tags.length > 0 ? article.Tags.map(function (tag) { return ( #{tag.name} @@ -92,7 +88,7 @@ var PlanetArticleList = React.createClass({ return (
-
diff --git a/browser/main/Components/PlanetHeader.jsx b/browser/main/Components/PlanetHeader.jsx index c7e0b8bb..3de10cc6 100644 --- a/browser/main/Components/PlanetHeader.jsx +++ b/browser/main/Components/PlanetHeader.jsx @@ -3,13 +3,17 @@ var React = require('react/addons') var PlanetHeader = React.createClass({ propTypes: { currentPlanet: React.PropTypes.object, - currentUser: React.PropTypes.object + currentUser: React.PropTypes.object, + onSearchChange: React.PropTypes.func }, getInitialState: function () { return { isMenuDropDownOpen: false } }, + componentDidMount: function () { + React.findDOMNode(this.refs.search).focus() + }, toggleMenuDropDown: function () { this.setState({isMenuDropDownOpen: !this.state.isMenuDropDownOpen}, function () { if (this.state.isMenuDropDownOpen) { @@ -24,6 +28,10 @@ var PlanetHeader = React.createClass({ interceptClick: function (e) { e.stopPropagation() }, + handleChange: function (e) { + this.setState({search: e.target.value}) + this.props.onSearchChange(e.target.value) + }, render: function () { var currentPlanetName = this.props.currentPlanet.name @@ -40,7 +48,7 @@ var PlanetHeader = React.createClass({ - + Download Mac app diff --git a/browser/main/Containers/PlanetContainer.jsx b/browser/main/Containers/PlanetContainer.jsx index 55efd1a1..856bb92e 100644 --- a/browser/main/Containers/PlanetContainer.jsx +++ b/browser/main/Containers/PlanetContainer.jsx @@ -19,7 +19,8 @@ module.exports = React.createClass({ }, getInitialState: function () { return { - currentPlanet: null + currentPlanet: null, + filteredArticles: [] } }, componentDidMount: function () { @@ -35,13 +36,13 @@ module.exports = React.createClass({ var index = 0 if (this.isActive('snippets')) { - this.state.currentPlanet.Articles.some(function (_article, _index) { + this.state.filteredArticles.some(function (_article, _index) { if (_article.type === 'snippet' && _article.localId === parseInt(params.localId, 10)) { index = _index } }) } else if (this.isActive('blueprints')) { - this.state.currentPlanet.Articles.some(function (_article, _index) { + this.state.filteredArticles.some(function (_article, _index) { if (_article.type === 'blueprint' && _article.localId === parseInt(params.localId, 10)) { index = _index return true @@ -53,7 +54,7 @@ module.exports = React.createClass({ return index }, selectArticleByIndex: function (index) { - var article = this.state.currentPlanet.Articles[index] + var article = this.state.filteredArticles[index] var params = this.props.params if (article == null) { @@ -73,16 +74,16 @@ module.exports = React.createClass({ } }, selectNextArticle: function () { - if (this.state.currentPlanet == null || this.state.currentPlanet.Articles.length === 0) return + if (this.state.currentPlanet == null || this.state.filteredArticles.length === 0) return var index = this.getIndexOfCurrentArticle() - if (index < this.state.currentPlanet.Articles.length) { + if (index < this.state.filteredArticles.length) { this.selectArticleByIndex(index + 1) } }, selectPriorArticle: function () { - if (this.state.currentPlanet == null || this.state.currentPlanet.Articles.length === 0) return + if (this.state.currentPlanet == null || this.state.filteredArticles.length === 0) return var index = this.getIndexOfCurrentArticle() @@ -95,7 +96,7 @@ module.exports = React.createClass({ if (res.status === 'planetFetched') { var planet = res.data - this.setState({currentPlanet: planet}, function () { + this.setState({currentPlanet: planet, filteredArticles: planet.Articles}, function () { if (planet.Articles.length > 0) { if (this.isActive('snippets')) { this.transitionTo('snippets', { @@ -146,6 +147,37 @@ module.exports = React.createClass({ } } }, + handleSearchChange: function (search) { + var firstFiltered = this.state.currentPlanet.Articles.filter(function (article) { + if (search === '' || search == null) return true + + var first = article.type === 'snippet' ? article.callSign : article.title + if (first.match(new RegExp(search, 'i'))) return true + + return false + }) + + var secondFiltered = this.state.currentPlanet.Articles.filter(function (article) { + var second = article.type === 'snippet' ? article.description : article.content + if (second.match(new RegExp(search, 'i'))) return true + + return false + }) + + var thirdFiltered = this.state.currentPlanet.Articles.filter(function (article) { + if (article.type === 'snippet') { + if (article.content.match(new RegExp(search, 'i'))) return true + } + return false + }) + + var filteredArticles = firstFiltered.concat(secondFiltered, thirdFiltered).filter(function (value, index, self) { + return self.indexOf(value) === index + }) + this.setState({filteredArticles: filteredArticles}, function () { + this.selectArticleByIndex(0) + }) + }, render: function () { var user = AuthStore.getUser() if (user == null) return (
) @@ -177,9 +209,9 @@ module.exports = React.createClass({ return (
- + - + {content}
)