network: add support for SOCKS (closes #1375)

client/components/NetworkForm.vue

@@ -98,6 +98,78 @@
 						</label>
 					</div>
 				</div>
+
+				<h2>Proxy Settings</h2>
+				<div class="connect-row">
+					<label for="connect:proxyHost">SOCKS Address</label>
+					<div class="input-wrap">
+						<input
+							id="connect:proxyHost"
+							v-model="defaults.proxyHost"
+							class="input"
+							name="proxyHost"
+							aria-label="Proxy host"
+							maxlength="255"
+						/>
+						<span id="connect:proxyPortSeparator">:</span>
+						<input
+							id="connect:proxyPort"
+							v-model="defaults.proxyPort"
+							class="input"
+							type="number"
+							min="1"
+							max="65535"
+							name="proxyPort"
+							aria-label="SOCKS port"
+						/>
+					</div>
+				</div>
+
+				<div class="connect-row">
+					<label for="connect:proxyUsername">Proxy username</label>
+					<input
+						id="connect:proxyUsername"
+						ref="proxyUsernameInput"
+						v-model="defaults.proxyUsername"
+						class="input username"
+						name="proxyUsername"
+						maxlength="100"
+						placeholder="Proxy username"
+					/>
+				</div>
+
+				<div class="connect-row">
+					<label for="connect:proxyPassword">Proxy password</label>
+					<RevealPassword
+						v-slot:default="slotProps"
+						class="input-wrap password-container"
+					>
+						<input
+							id="connect:proxyPassword"
+							ref="proxyPassword"
+							v-model="defaults.proxyPassword"
+							class="input"
+							:type="slotProps.isVisible ? 'text' : 'password'"
+							placeholder="Proxy password"
+							name="password"
+							maxlength="300"
+						/>
+					</RevealPassword>
+				</div>
+
+				<div class="connect-row">
+					<label></label>
+					<div class="input-wrap">
+						<label for="connect:proxyEnabled">
+							<input
+								v-model="defaults.proxyEnabled"
+								type="checkbox"
+								name="proxyEnabled"
+							/>
+							Enable Proxy
+						</label>
+					</div>
+				</div>
 			</template>
 			<template v-else-if="config.lockNetwork && !$store.state.serverConfiguration.public">
 				<h2>Network settings</h2>

client/css/style.css

@@ -1840,19 +1840,23 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
 	margin-top: 6px;
 }
 
-#connect .tls input {
+#connect .tls input,
+#connect input[name="proxyEnabled"] {
 	margin: 3px 10px 0 0;
 }
 
-#connect\:host {
+#connect\:host,
+#connect\:proxyHost {
 	width: 70%;
 }
 
-#connect\:port {
+#connect\:port,
+#connect\:proxyPort {
 	width: 25%;
 }
 
-#connect\:portseparator {
+#connect\:portseparator,
+#connect\:proxyPortSeparator {
 	width: 5%;
 	text-align: center;
 	display: inline-block;

package.json

@@ -50,7 +50,7 @@
     "file-type": "16.2.0",
     "filenamify": "4.2.0",
     "got": "11.8.1",
-    "irc-framework": "4.9.0",
+    "irc-framework": "github:mstrodl/irc-framework#feature/fix-socks",
     "is-utf8": "0.2.1",
     "ldapjs": "2.2.3",
     "linkify-it": "3.0.2",

src/client.js

@@ -257,6 +257,12 @@ Client.prototype.connect = function (args, isStartup = false) {
 		commands: args.commands || [],
 		channels: channels,
 		ignoreList: args.ignoreList ? args.ignoreList : [],
+
+		proxyEnabled: !!args.proxyEnabled,
+		proxyHost: String(args.proxyHost || ""),
+		proxyPort: parseInt(args.proxyPort, 10),
+		proxyUsername: String(args.proxyUsername || ""),
+		proxyPassword: String(args.proxyPassword || ""),
 	});
 
 	// Set network lobby channel id

src/models/network.js

@@ -46,6 +46,13 @@ function Network(attr) {
 			PREFIX: ["!", "@", "%", "+"],
 			NETWORK: "",
 		},
+
+		proxyHost: "",
+		proxyPort: 1080,
+		proxyUsername: "",
+		proxyPassword: "",
+		proxyEnabled: false,
+
 		chanCache: [],
 		ignoreList: [],
 		keepNick: null,
@@ -90,6 +97,12 @@ Network.prototype.validate = function (client) {
 	this.saslAccount = cleanString(this.saslAccount);
 	this.saslPassword = cleanString(this.saslPassword);
 
+	this.proxyHost = cleanString(this.proxyHost);
+	this.proxyPort = this.proxyPort || 1080;
+	this.proxyUsername = cleanString(this.proxyUsername);
+	this.proxyPassword = cleanString(this.proxyPassword);
+	this.proxyEnabled = !!this.proxyEnabled;
+
 	if (!this.port) {
 		this.port = this.tls ? 6697 : 6667;
 	}
@@ -208,6 +221,17 @@ Network.prototype.setIrcFrameworkOptions = function (client) {
 	this.irc.options.webirc = this.createWebIrc(client);
 	this.irc.options.client_certificate = null;
 
+	if (this.proxyEnabled) {
+		this.irc.options.socks = {
+			host: this.proxyHost,
+			port: this.proxyPort,
+			user: this.proxyUsername,
+			pass: this.proxyPassword,
+		};
+	} else {
+		delete this.irc.options.socks;
+	}
+
 	if (!this.sasl) {
 		delete this.irc.options.sasl_mechanism;
 		delete this.irc.options.account;
@@ -274,6 +298,12 @@ Network.prototype.edit = function (client, args) {
 	this.saslAccount = String(args.saslAccount || "");
 	this.saslPassword = String(args.saslPassword || "");
 
+	this.proxyHost = String(args.proxyHost || "");
+	this.proxyPort = parseInt(args.proxyPort, 10);
+	this.proxyUsername = String(args.proxyUsername || "");
+	this.proxyPassword = String(args.proxyPassword || "");
+	this.proxyEnabled = !!args.proxyEnabled;
+
 	// Split commands into an array
 	this.commands = String(args.commands || "")
 		.replace(/\r\n|\r|\n/g, "\n")
@@ -455,6 +485,12 @@ Network.prototype.exportForEdit = function () {
 		"saslAccount",
 		"saslPassword",
 		"commands",
+
+		"proxyEnabled",
+		"proxyHost",
+		"proxyPort",
+		"proxyUsername",
+		"proxyPassword",
 	];
 
 	if (!Helper.config.lockNetwork) {
@@ -491,6 +527,11 @@ Network.prototype.export = function () {
 		"saslPassword",
 		"commands",
 		"ignoreList",
+
+		"proxyHost",
+		"proxyPort",
+		"proxyUsername",
+		"proxyEnabled",
 	]);
 
 	network.channels = this.channels