diff options
| author | adamhrv <adam@ahprojects.com> | 2018-12-17 01:39:39 +0100 |
|---|---|---|
| committer | adamhrv <adam@ahprojects.com> | 2018-12-17 01:39:39 +0100 |
| commit | c7e73f613fc5189c0adeda9fd693cb6aca3d4247 (patch) | |
| tree | f4ee5eb0fd84d84780b2d31d48c5ab666ab63236 /client/faceSearch/faceSearch.result.js | |
| parent | 88ec48e1c4d93ba9cd3aa186c068ef2aa4c27c56 (diff) | |
| parent | 6a6af799c528e7d2c865db75757e90cd921f85ae (diff) | |
Merge branch 'master' of github.com:adamhrv/megapixels_dev
Diffstat (limited to 'client/faceSearch/faceSearch.result.js')
| -rw-r--r-- | client/faceSearch/faceSearch.result.js | 69 |
1 files changed, 69 insertions, 0 deletions
diff --git a/client/faceSearch/faceSearch.result.js b/client/faceSearch/faceSearch.result.js new file mode 100644 index 00000000..1882def0 --- /dev/null +++ b/client/faceSearch/faceSearch.result.js @@ -0,0 +1,69 @@ +import React, { Component } from 'react' +import { bindActionCreators } from 'redux' +import { connect } from 'react-redux' +import { courtesyS } from '../util' + +import * as actions from './faceSearch.actions' + +const errors = { + 'bbox': "Sorry, we couldn't find a face in that image. Please choose an image where the face is large and clear.", + 'nomatch': "We didn't find a match.", + 'default': "There was an error!", +} + +class FaceSearchResult extends Component { + render() { + const { dataset } = this.props.payload + const { distances, results, error } = this.props.result + if (error) { + let errorMessage = errors[error.message] || errors.default + return ( + <div className='result'>{errorMessage}</div> + ) + } + if (!results) { + return ( + <div className='result'></div> + ) + } + if (!this.props.result.results.length) { + return ( + <div className='result'>No results</div> + ) + } + const els = results.map((result, i) => { + const distance = distances[i] + const { uuid } = result.uuid + const { fullname, gender, description, images } = result.identity + return ( + <div> + <img src={'https://megapixels.nyc3.digitaloceanspaces.com/v1/media/' + dataset + '/' + uuid + '.jpg'} /> + {fullname} {'('}{gender}{')'}<br/> + {description}<br/> + {courtesyS(images, 'image')}<br /> + {distance} + </div> + ) + }) + + return ( + <div className='result'> + <div class='results'> + {els} + </div> + </div> + ) + } +} + +const mapStateToProps = state => ({ + query: state.faceSearch.query, + result: state.faceSearch.result, + options: state.faceSearch.options, +}) + +const mapDispatchToProps = dispatch => ({ + actions: bindActionCreators({ ...actions }, dispatch), +}) + +export default connect(mapStateToProps, mapDispatchToProps)(FaceSearchResult) |
