glenux-contrib/metamaps--metamaps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

metacode selection tweaks

Browse source
This commit is contained in:
Devin Howard 2017-02-25 14:35:31 -08:00
parent 835961ce90
commit 479757d671
1 changed files with 17 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
frontend/src/components/TopicCard/Links.js
View file

@ -23,6 +23,7 @@ class Links extends Component {
} }
handleMetacodeSelect = metacodeId => { handleMetacodeSelect = metacodeId => {
this.setState({ showMetacodeSelect: false })
this.props.updateTopic({ this.props.updateTopic({
metacode_id: metacodeId metacode_id: metacodeId
}) })
@ -81,26 +82,25 @@ class Links extends Component {
<div className="linkItem icon metacodeItem" <div className="linkItem icon metacodeItem"
style={{ zIndex: this.state.showMetacodeTitle ? 4 : 1 }} style={{ zIndex: this.state.showMetacodeTitle ? 4 : 1 }}
onMouseLeave={() => this.setState({ showMetacodeTitle: false, showMetacodeSelect: false })} onMouseLeave={() => this.setState({ showMetacodeTitle: false, showMetacodeSelect: false })}
onClick={() => this.setState({ showMetacodeSelect: !this.state.showMetacodeSelect })}
> >
<div className={`metacodeTitle mbg${metacode.get('id')}`} <div className={`metacodeTitle mbg${metacode.get('id')}`}
style={{ display: this.state.showMetacodeTitle ? 'block' : 'none' }} style={{ display: this.state.showMetacodeTitle ? 'block' : 'none' }}
> >
{metacode.get('name')} {metacode.get('name')}
<div className="expandMetacodeSelect" <div className="expandMetacodeSelect"/>
onClick={() => this.setState({ showMetacodeSelect: !this.state.showMetacodeSelect })} </div>
/> <div className="metacodeImage"
</div> style={{backgroundImage: `url(${metacode.get('icon')})`}}
<div className="metacodeImage" title="click and drag to move card"
style={{backgroundImage: `url(${metacode.get('icon')})`}} onMouseEnter={() => this.setState({ showMetacodeTitle: true })}
title="click and drag to move card" />
onMouseEnter={() => this.setState({ showMetacodeTitle: true })} <div className="metacodeSelect"
/> style={{ display: this.state.showMetacodeSelect ? 'block' : 'none' }}
<div className="metacodeSelect" >
style={{ display: this.state.showMetacodeSelect ? 'block' : 'none' }}
>
<MetacodeSelect onMetacodeSelect={this.handleMetacodeSelect} metacodeSets={this.props.metacodeSets} /> <MetacodeSelect onMetacodeSelect={this.handleMetacodeSelect} metacodeSets={this.props.metacodeSets} />
</div> </div>
</div> </div>
<div className="linkItem contributor"> <div className="linkItem contributor">
<a href={`/explore/mapper/${topic.get('user_id')}`} target="_blank"><img src={topic.get('user_image')} className="contributorIcon" width="32" height="32" /></a> <a href={`/explore/mapper/${topic.get('user_id')}`} target="_blank"><img src={topic.get('user_image')} className="contributorIcon" width="32" height="32" /></a>
<div className="contributorName">{topic.get('user_name')}</div> <div className="contributorName">{topic.get('user_name')}</div>