Use DropDownButton for checkables
parent
1e9bea827f
commit
81af806dfd
20
mail.js
20
mail.js
|
@ -169,12 +169,12 @@ var DropDownButton = React.createClass({
|
||||||
render: function()
|
render: function()
|
||||||
{
|
{
|
||||||
return <a ref="btn" title={(this.state.checked ? this.props.checkedTitle : null) || this.props.title} onClick={this.onClickButton}
|
return <a ref="btn" title={(this.state.checked ? this.props.checkedTitle : null) || this.props.title} onClick={this.onClickButton}
|
||||||
className={'button show-dropdown '+(this.state.checked ? 'checked ' : '')+
|
className={'button '+(this.props.dropdownId ? 'show-dropdown ' : '')+(this.state.checked ? 'checked ' : '')+
|
||||||
(this.state.pressed ? 'pressed ' : '')+(this.props.className || '')}>
|
(this.state.pressed ? 'pressed ' : '')+(this.props.className || '')}>
|
||||||
{this.props.icon ? <img src={'icons/'+this.props.icon+'.png'} /> : null}
|
{this.props.icon ? <img src={'icons/'+this.props.icon+'.png'} /> : null}
|
||||||
{this.props.cssIcon ? <span className="img"></span> : null}
|
{this.props.cssIcon ? <span className="img"></span> : null}
|
||||||
{this.props.text || null}
|
{((this.state.checked ? this.props.checkedText : null) || this.props.text) || null}
|
||||||
<span className="down" onClick={this.onClickDown}></span>
|
{this.props.dropdownId ? <span className="down" onClick={this.onClickDown}></span> : null}
|
||||||
</a>
|
</a>
|
||||||
},
|
},
|
||||||
getInitialState: function()
|
getInitialState: function()
|
||||||
|
@ -183,16 +183,20 @@ var DropDownButton = React.createClass({
|
||||||
},
|
},
|
||||||
toggle: function()
|
toggle: function()
|
||||||
{
|
{
|
||||||
DropDownBase.hideAll();
|
|
||||||
if (!this.state.pressed)
|
if (!this.state.pressed)
|
||||||
|
{
|
||||||
|
DropDownBase.hideAll();
|
||||||
DropDownBase.instances[this.props.dropdownId].showAt(this.refs.btn);
|
DropDownBase.instances[this.props.dropdownId].showAt(this.refs.btn);
|
||||||
|
}
|
||||||
|
else
|
||||||
|
DropDownBase.instances[this.props.dropdownId].hide();
|
||||||
this.setState({ pressed: !this.state.pressed });
|
this.setState({ pressed: !this.state.pressed });
|
||||||
},
|
},
|
||||||
onClickButton: function(ev)
|
onClickButton: function(ev)
|
||||||
{
|
{
|
||||||
if (this.props.whole)
|
if (this.props.whole || this.props.checkable && this.state.pressed)
|
||||||
this.toggle();
|
this.toggle();
|
||||||
else if (this.props.checkable)
|
if (this.props.checkable)
|
||||||
this.setState({ checked: !this.state.checked });
|
this.setState({ checked: !this.state.checked });
|
||||||
ev.stopPropagation();
|
ev.stopPropagation();
|
||||||
},
|
},
|
||||||
|
@ -794,8 +798,8 @@ var MessageView = React.createClass({
|
||||||
<DropDownButton dropdownId="reply" icon="mail_reply" text="Reply" />
|
<DropDownButton dropdownId="reply" icon="mail_reply" text="Reply" />
|
||||||
<a className="button"><img src="icons/mail_reply_all.png" />Reply All</a>
|
<a className="button"><img src="icons/mail_reply_all.png" />Reply All</a>
|
||||||
<DropDownButton dropdownId="forward" icon="mail_forward" text="Forward" />
|
<DropDownButton dropdownId="forward" icon="mail_forward" text="Forward" />
|
||||||
<a className="button checkable action-read"><span className="img"></span><span className="txt"></span></a>
|
<DropDownButton className="action-read" cssIcon="1" checkable="1" text="Read" checkedText="Unread" />
|
||||||
<a className="button checkable action-spam"><span className="img"></span><span className="txt"></span></a>
|
<DropDownButton className="action-spam" cssIcon="1" checkable="1" text="Spam" checkedText="Not Spam" />
|
||||||
<DropDownButton dropdownId="delete" className="action-delete" cssIcon="1" checkable="1" text="Delete" checkedText="Undelete" />
|
<DropDownButton dropdownId="delete" className="action-delete" cssIcon="1" checkable="1" text="Delete" checkedText="Undelete" />
|
||||||
<a className="button show-dropdown"><img src="icons/label.png" />Label <span className="down"></span></a>
|
<a className="button show-dropdown"><img src="icons/label.png" />Label <span className="down"></span></a>
|
||||||
<DropDownButton dropdownId="settings" whole="1" icon="config" text="Settings" />
|
<DropDownButton dropdownId="settings" whole="1" icon="config" text="Settings" />
|
||||||
|
|
Loading…
Reference in New Issue