CringeStudios/IRC_Client
5
0
Fork 0
forked from CringeStudios/gamja
Code Pull Requests Activity

Add button to join new channel

Browse Source
This commit is contained in:
Simon Ser 2020-06-29 10:12:46 +02:00
parent 28e96e0ad5
commit b74fb90d47
No known key found for this signature in database
GPG Key ID: 0FDE7BE0E88F5E48
2 changed files with 28 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
components/app.js
View File

@ -54,6 +54,7 @@ export default class App extends Component {
this.handleBufferListClick = this.handleBufferListClick.bind(this); this.handleBufferListClick = this.handleBufferListClick.bind(this);
this.handleComposerSubmit = this.handleComposerSubmit.bind(this); this.handleComposerSubmit = this.handleComposerSubmit.bind(this);
this.handleNickClick = this.handleNickClick.bind(this); this.handleNickClick = this.handleNickClick.bind(this);
this.handleJoinClick = this.handleJoinClick.bind(this);
if (window.localStorage && localStorage.getItem("autoconnect")) { if (window.localStorage && localStorage.getItem("autoconnect")) {
var connectParams = JSON.parse(localStorage.getItem("autoconnect")); var connectParams = JSON.parse(localStorage.getItem("autoconnect"));
@ -516,6 +517,16 @@ export default class App extends Component {
this.switchBuffer(name); this.switchBuffer(name);
} }
handleJoinClick(event) {
event.preventDefault();
var channel = prompt("Join channel:");
if (!channel) {
return;
}
this.client.send({ command: "JOIN", params: [channel] });
}
componentDidMount() { componentDidMount() {
if (this.state.connectParams.autoconnect) { if (this.state.connectParams.autoconnect) {
this.connect(this.state.connectParams); this.connect(this.state.connectParams);
@ -560,6 +571,9 @@ export default class App extends Component {
return html` return html`
<section id="buffer-list"> <section id="buffer-list">
<${BufferList} buffers=${this.state.buffers} activeBuffer=${this.state.activeBuffer} onBufferClick=${this.handleBufferListClick}/> <${BufferList} buffers=${this.state.buffers} activeBuffer=${this.state.activeBuffer} onBufferClick=${this.handleBufferListClick}/>
<div class="actions">
<a href="#" onClick=${this.handleJoinClick}>Join channel</a>
</div>
</section> </section>
${bufferHeader} ${bufferHeader}
<${ScrollManager} target=${this.buffer} scrollKey=${this.state.activeBuffer}> <${ScrollManager} target=${this.buffer} scrollKey=${this.state.activeBuffer}>

16
style.css
View File

@ -22,12 +22,16 @@ body {
background-color: #e3e3e3; background-color: #e3e3e3;
grid-column: 1; grid-column: 1;
grid-row: 1 / 4; grid-row: 1 / 4;
display: flex;
flex-direction: column;
} }
#buffer-list ul { #buffer-list ul {
list-style-type: none; list-style-type: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
flex: 1 0 auto;
} }
#buffer-list li a { #buffer-list li a {
display: inline-block; display: inline-block;
@ -42,6 +46,14 @@ body {
#buffer-list li.unread-message a { #buffer-list li.unread-message a {
color: #b37400; color: #b37400;
} }
#buffer-list .actions {
flex-shrink: 0;
text-align: center;
}
#buffer-list .actions a {
display: block;
padding: 10px;
}
#buffer-header, #member-list-header { #buffer-header, #member-list-header {
box-sizing: border-box; box-sizing: border-box;
@ -133,11 +145,11 @@ body {
a { a {
color: green; color: green;
} }
#buffer-list a, a.timestamp, a.nick { #buffer-list li a, a.timestamp, a.nick {
color: #4a4a4a; color: #4a4a4a;
text-decoration: none; text-decoration: none;
} }
#buffer-list a:hover, #buffer-list a:active, #buffer-list li a:hover, #buffer-list li a:active,
a.timestamp:hover, a.timestamp:active, a.timestamp:hover, a.timestamp:active,
a.nick:hover, a.nick:active { a.nick:hover, a.nick:active {
text-decoration: underline; text-decoration: underline;