Add buffer header

Only for channels for now
This commit is contained in:
Simon Ser 2020-06-25 18:28:54 +02:00
parent 2bb8f68f6f
commit 3e33999619
No known key found for this signature in database
GPG Key ID: 0FDE7BE0E88F5E48
2 changed files with 53 additions and 12 deletions

View File

@ -2,6 +2,7 @@ import * as irc from "/lib/irc.js";
import Client from "/lib/client.js";
import Buffer from "/components/buffer.js";
import BufferList from "/components/buffer-list.js";
import BufferHeader from "/components/buffer-header.js";
import Connect from "/components/connect.js";
import Composer from "/components/composer.js";
import ScrollManager from "/components/scroll-manager.js";
@ -148,7 +149,10 @@ export default class App extends Component {
msgUnread = Unread.MESSAGE;
}
this.createBuffer(bufName);
if (msg.prefix.name != this.client.nick && msg.command != "PART") {
this.createBuffer(bufName);
}
this.setBufferState(bufName, (buf, state) => {
var unread = buf.unread;
if (state.activeBuffer != buf.name) {
@ -311,6 +315,22 @@ export default class App extends Component {
return irc.STD_CHANNEL_TYPES.indexOf(name[0]) >= 0;
}
close(target) {
if (target == SERVER_BUFFER) {
this.client.close();
return;
}
if (this.isChannel(target)) {
this.client.send({ command: "PART", params: [target] });
}
this.switchBuffer(SERVER_BUFFER);
this.setState((state) => {
var buffers = new Map(state.buffers);
buffers.delete(target);
return { buffers };
});
}
executeCommand(s) {
var parts = s.split(" ");
var cmd = parts[0].toLowerCase().slice(1);
@ -328,15 +348,7 @@ export default class App extends Component {
console.error("Not in a user or channel buffer");
return;
}
if (this.isChannel(target)) {
this.client.send({ command: "PART", params: [channel] });
}
this.switchBuffer(SERVER_BUFFER);
this.setState((state) => {
var buffers = new Map(state.buffers);
buffers.delete(target);
return { buffers };
});
this.close(target);
break;
case "join":
var channel = args[0];
@ -416,10 +428,20 @@ export default class App extends Component {
activeBuffer = this.state.buffers.get(this.state.activeBuffer);
}
var topbar = null;
if (activeBuffer && this.isChannel(activeBuffer.name)) {
topbar = html`
<section id="topbar">
<${BufferHeader} buffer=${activeBuffer} onClose=${() => this.close(activeBuffer.name)}/>
</section>
`;
}
return html`
<section id="sidebar">
<${BufferList} buffers=${this.state.buffers} activeBuffer=${this.state.activeBuffer} onBufferClick=${this.handleBufferListClick}/>
</section>
${topbar}
<${ScrollManager} target=${this.buffer} scrollKey=${this.state.activeBuffer}>
<section id="buffer" ref=${this.buffer}>
<${Buffer} buffer=${activeBuffer}/>

View File

@ -7,7 +7,7 @@ html, body {
body {
display: grid;
grid-template-rows: 1fr max-content;
grid-template-rows: auto 1fr max-content;
grid-template-columns: max-content auto;
font-family: monospace;
}
@ -20,7 +20,8 @@ body {
#sidebar {
background-color: #e3e3e3;
grid-row: 1 / 3;
grid-column: 1;
grid-row: 1 / 4;
}
#sidebar ul {
@ -42,8 +43,26 @@ body {
color: #b37400;
}
#topbar {
grid-row: 1;
grid-column: 2;
box-sizing: border-box;
padding: 5px 10px;
border-bottom: 1px solid #e3e3e3;
}
#topbar .actions {
float: right;
}
#buffer {
grid-row: 2;
grid-column: 2;
}
#composer {
grid-column: 2;
grid-row: 3;
border-top: 1px solid #e3e3e3;
}
#composer input {