Provide keyboard shortcut to switch between servers.

app/main/index.js

@@ -224,6 +224,13 @@ app.on('ready', () => {
 		console.log(listener, ...params);
 		page.send(listener);
 	});
+
+	ipc.on('register-server-tab-shortcut', (event, index) => {
+		electronLocalshortcut.register(mainWindow, `CommandOrControl+${index}`, () => {
+			// Array index == Shown index - 1
+			page.send('switch-server-tab', index - 1);
+		});
+	});
 });
 
 app.on('will-quit', () => {

app/renderer/css/main.css

@@ -81,7 +81,7 @@ html, body {
 
 .tab {
     position: relative;
-    margin: 5px 0;
+    margin: 2px 0;
     cursor: pointer;
 }
 
@@ -168,6 +168,13 @@ html, body {
     flex-direction: column;
 }
 
+.tab .server-tab-shortcut {
+    color: #eee;
+    font-size: 12px;
+    text-align: center;
+    font-family: sans-serif;
+}
+
 /*******************
  *   Webview Area  *
  *******************/

app/renderer/js/components/server-tab.js

@@ -1,12 +1,16 @@
 'use strict';
 
 const Tab = require(__dirname + '/../components/tab.js');
+const SystemUtil = require(__dirname + '/../utils/system-util.js');
+
+const {ipcRenderer} = require('electron');
 
 class ServerTab extends Tab {
 	template() {
 		return `<div class="tab">
 					<div class="server-tab-badge"></div>
 					<div class="server-tab" style="background-image: url(${this.props.icon});"></div>
+					<div class="server-tab-shortcut">${this.generateShortcutText()}</div>
 				</div>`;
 	}
 
@@ -26,6 +30,27 @@ class ServerTab extends Tab {
 			this.$badge.classList.remove('active');
 		}
 	}
+
+	generateShortcutText() {
+		// Only provide shortcuts for server [0..10]
+		if (this.props.index >= 10) {
+			return '';
+		}
+
+		const shownIndex = this.props.index + 1;
+
+		let cmdKey = '';
+
+		if (SystemUtil.getOS() === 'Mac') {
+			cmdKey = '⌘';
+		} else {
+			cmdKey = '⌃';
+		}
+
+		ipcRenderer.send('register-server-tab-shortcut', shownIndex);
+
+		return `${cmdKey} ${shownIndex}`;
+	}
 }
 
 module.exports = ServerTab;

app/renderer/js/main.js

@@ -46,6 +46,7 @@ class ServerManagerView {
 			icon: server.icon,
 			$root: this.$tabsContainer,
 			onClick: this.activateTab.bind(this, index),
+			index,
 			webview: new WebView({
 				$root: this.$content,
 				index,
@@ -203,6 +204,9 @@ class ServerManagerView {
 			this.openSettings(settingNav);
 		});
 		ipcRenderer.on('open-about', this.openAbout.bind(this));
+		ipcRenderer.on('switch-server-tab', (event, index) => {
+			this.activateTab(index);
+		});
 	}
 }