70 lines
2.9 KiB
JavaScript
70 lines
2.9 KiB
JavaScript
import React from 'react';
|
|
import DropDownBase from './DropDownBase.js';
|
|
import ListSortSettings from './ListSortSettings.js';
|
|
import Store from './Store.js';
|
|
import StoreListener from './StoreListener.js';
|
|
|
|
class MailSettingsWindow extends DropDownBase
|
|
{
|
|
render()
|
|
{
|
|
return <div ref="dd" onClick={this.onClick} className={'dropdown window'+(this.state.visible ? ' visible' : '')}
|
|
id={'dropdown-'+this.props.id} tabIndex="1" style={{ top: this.state.top, left: this.state.left }}>
|
|
<div ref="callout" className="callout-top" style={{ left: this.state.calloutLeft }}></div>
|
|
<div className="text">Mail Layout</div>
|
|
<div className="layouts">
|
|
<a onClick={this.switchLayout} className={'button mail-message-on-right'+(this.props.layout == 'message-on-right' ? ' selected' : '')} title="List and Message on Right"><span></span></a>
|
|
<a onClick={this.switchLayout} className={'button mail-message-on-bottom'+(this.props.layout == 'message-on-bottom' ? ' selected' : '')} title="List and Message Below"><span></span></a>
|
|
<a onClick={this.switchLayout} className={'button mail-message-invisible'+(this.props.layout == 'message-invisible' ? ' selected' : '')} title="List Only"><span></span></a>
|
|
</div>
|
|
<div className="split"><i></i></div>
|
|
<div className="text">Default List Sorting</div>
|
|
<ListSortSettings className="fields" sort={this.props.defaultSorting} />
|
|
<div className="fields">
|
|
<label><input type="checkbox" checked={this.props.quickReply} onClick={this.showQuickReply} /> Show Quick Reply</label>
|
|
</div>
|
|
<div className="split"><i></i></div>
|
|
<div className="text">Mark as Read</div>
|
|
<div className="fields">
|
|
<select className="sortby" defaultValue={this.props.markDelay}>
|
|
<option value="-1">Manually</option>
|
|
<option value="0">On Select</option>
|
|
<option value="1">After 1 second</option>
|
|
<option value="3">After 3 seconds</option>
|
|
<option value="5">After 5 seconds</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
switchLayout = (ev) =>
|
|
{
|
|
var t = ev.target.nodeName == 'A' ? ev.target : ev.target.parentNode;
|
|
var l = / mail-(\S+)/.exec(t.className)[1];
|
|
Store.set('layout', l);
|
|
}
|
|
|
|
showQuickReply = () =>
|
|
{
|
|
Store.set('quickReply', !this.props.quickReply);
|
|
}
|
|
}
|
|
|
|
export default StoreListener(
|
|
MailSettingsWindow,
|
|
(data) => { return { layout: data.layout, quickReply: data.quickReply }; },
|
|
{
|
|
id: 'settings',
|
|
window: true,
|
|
markDelay: -1,
|
|
defaultSorting: {
|
|
sort: {
|
|
sortby: 'sent date',
|
|
group: 'date',
|
|
ascending: false,
|
|
threaded: false
|
|
}
|
|
}
|
|
}
|
|
);
|