~emersion/gamja

6c40561f61c05a825f2f12ee222bcd39c092137d — Simon Ser a month ago b0a3cd2
Move join button to buffer header
3 files changed, 10 insertions(+), 17 deletions(-)

M components/app.js
M components/buffer-header.js
M style.css
M components/app.js => components/app.js +2 -9
@@ 168,7 168,6 @@ export default class App extends Component {
		this.handleBufferListClick = this.handleBufferListClick.bind(this);
		this.handleComposerSubmit = this.handleComposerSubmit.bind(this);
		this.handleNickClick = this.handleNickClick.bind(this);
		this.handleJoinClick = this.handleJoinClick.bind(this);
		this.autocomplete = this.autocomplete.bind(this);
		this.handleBufferScrollTop = this.handleBufferScrollTop.bind(this);
		this.dismissError = this.dismissError.bind(this);


@@ 824,15 823,12 @@ export default class App extends Component {
		this.switchBuffer(id);
	}

	handleJoinClick(event) {
		event.preventDefault();

	handleJoinClick(netID) {
		var channel = prompt("Join channel:");
		if (!channel) {
			return;
		}

		var netID = getActiveNetworkID(this.state);
		var client = this.clients.get(netID);

		client.send({ command: "JOIN", params: [channel] });


@@ 925,7 921,7 @@ export default class App extends Component {
		if (activeBuffer) {
			bufferHeader = html`
				<section id="buffer-header">
					<${BufferHeader} buffer=${activeBuffer} network=${activeNetwork} onClose=${() => this.close(activeBuffer)}/>
					<${BufferHeader} buffer=${activeBuffer} network=${activeNetwork} onClose=${() => this.close(activeBuffer)} onJoin=${() => this.handleJoinClick(activeBuffer.network)}/>
				</section>
			`;
		}


@@ 945,9 941,6 @@ export default class App extends Component {
		return html`
			<section id="buffer-list">
				<${BufferList} buffers=${this.state.buffers} networks=${this.state.networks} activeBuffer=${this.state.activeBuffer} onBufferClick=${this.handleBufferListClick}/>
				<div class="actions">
					<a href="#" onClick=${this.handleJoinClick}>Join channel</a>
				</div>
			</section>
			${bufferHeader}
			<${ScrollManager} target=${this.buffer} scrollKey=${this.state.activeBuffer} onScrollTop=${this.handleBufferScrollTop}>

M components/buffer-header.js => components/buffer-header.js +8 -0
@@ 24,6 24,10 @@ export default function BufferHeader(props) {
		event.preventDefault();
		props.onClose();
	}
	function handleJoinClick(event) {
		event.preventDefault();
		props.onJoin();
	}

	var description = null;
	if (props.buffer.serverInfo) {


@@ 63,9 67,11 @@ export default function BufferHeader(props) {
		description = html`<${NickStatus} status=${UserStatus.OFFLINE}/> ${props.buffer.name}`;
	}

	var actions = null;
	var closeText = "Close";
	switch (props.buffer.type) {
	case BufferType.SERVER:
		actions = html`<a href="#" onClick=${handleJoinClick}>Join</a>`;
		closeText = "Disconnect";
		break;
	case BufferType.CHANNEL:


@@ 76,6 82,8 @@ export default function BufferHeader(props) {
	return html`
		<span class="description">${description}</span>
		<span class="actions">
			${actions}
			${" "}
			<a href="#" onClick=${handlePartClick}>${closeText}</a>
		</span>
	`;

M style.css => style.css +0 -8
@@ 50,14 50,6 @@ body {
#buffer-list li.unread-highlight a {
	color: #22009b;
}
#buffer-list .actions {
	flex-shrink: 0;
	text-align: center;
}
#buffer-list .actions a {
	display: block;
	padding: 10px;
}

#buffer-header, #member-list-header {
	box-sizing: border-box;