dispatch/client/src/js/components/TabList.jsx

77 lines
2.0 KiB
React
Raw Normal View History

2015-01-17 01:37:21 +00:00
var React = require('react');
var Reflux = require('reflux');
var _ = require('lodash');
var channelStore = require('../stores/channel');
2015-01-30 01:34:28 +00:00
var privateChatStore = require('../stores/privateChat');
var selectedTabStore = require('../stores/selectedTab');
var tabActions = require('../actions/tab');
2015-01-17 01:37:21 +00:00
var TabList = React.createClass({
mixins: [
Reflux.connect(channelStore, 'channels'),
2015-01-30 01:34:28 +00:00
Reflux.connect(privateChatStore, 'privateChats'),
2015-01-17 01:37:21 +00:00
Reflux.connect(selectedTabStore, 'selectedTab')
],
getInitialState: function() {
return {
channels: channelStore.getState(),
2015-01-30 01:34:28 +00:00
privateChats: privateChatStore.getState(),
2015-01-17 01:37:21 +00:00
selectedTab: selectedTabStore.getState()
};
},
render: function() {
var self = this;
var tabClass;
var selected = this.state.selectedTab;
2015-01-17 01:37:21 +00:00
var tabs = _.map(this.state.channels, function(server, address) {
var channels = _.map(server, function(channel, name) {
if (address === selected.server &&
name === selected.channel) {
tabClass = 'selected';
} else {
tabClass = '';
}
return <p className={tabClass} onClick={tabActions.select.bind(null, address, name)}>{name}</p>;
2015-01-17 01:37:21 +00:00
});
2015-01-30 01:34:28 +00:00
_.each(self.state.privateChats[address], function(chat, nick) {
if (address === selected.server &&
nick === selected.channel) {
tabClass = 'selected';
} else {
tabClass = '';
}
channels.push(<p className={tabClass} onClick={tabActions.select.bind(null, address, nick)}>{nick}</p>);
});
if (address === selected.server &&
selected.channel === null) {
tabClass = 'tab-server selected';
} else {
tabClass = 'tab-server';
}
channels.unshift(<p className={tabClass} onClick={tabActions.select.bind(null, address, null)}>{address}</p>);
2015-01-17 01:37:21 +00:00
return channels;
});
return (
<div className="tablist">
<button className="button-connect">Add Network</button>
{tabs}
<div className="side-buttons">
<button>Settings</button>
</div>
</div>
2015-01-17 01:37:21 +00:00
);
}
});
module.exports = TabList;