Skip to content

Commit aa82194

Browse files
code-asherkylecarbs
code-asher
authored and
kylecarbs
committed
Web socket + fill setup
1 parent 8b2c1ed commit aa82194

File tree

12 files changed

+64
-65
lines changed

12 files changed

+64
-65
lines changed

‎packages/disposable/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
{
22
"name": "@coder/disposable",
3-
"main": "src/disposable.ts"
3+
"main": "src/index.ts"
44
}

‎packages/events/package.json

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"name": "@coder/events",
3+
"main": "./src/index.ts"
4+
}

‎packages/events/yarn.lock

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
2+
# yarn lockfile v1
3+
4+

‎packages/ide/src/client.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ export class Client {
2929
this.tasks = [];
3030
this.finishedTaskCount = 0;
3131
this.progressElement = typeof document !== "undefined"
32-
? document.querySelector("#status > #progress > #fill") as HTMLElement
32+
? document.querySelector("#fill") as HTMLElement
3333
: undefined;
3434

3535
this.mkDirs = this.wrapTask("Creating directories", 100, async () => {

‎packages/ide/src/fill/client.ts

+3-1
Original file line numberDiff line numberDiff line change
@@ -115,7 +115,9 @@ class Connection implements ReadWriteConnection {
115115
*/
116116
private async openSocket(): Promise<WebSocket> {
117117
this.dispose();
118-
const socket = new WebSocket("websocket");
118+
const socket = new WebSocket(
119+
`${location.protocol === "https" ? "wss" : "ws"}://${location.host}/websocket`,
120+
);
119121
socket.binaryType = "arraybuffer";
120122
this.activeSocket = socket;
121123

‎packages/protocol/src/browser/modules/child_process.ts

+4-4
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@ export class CP {
88
private readonly client: Client,
99
) { }
1010

11-
public exec(
11+
public exec = (
1212
command: string,
1313
options?: { encoding?: BufferEncoding | string | "buffer" | null } & cp.ExecOptions | null | ((error: Error | null, stdout: string, stderr: string) => void) | ((error: Error | null, stdout: Buffer, stderr: Buffer) => void),
1414
callback?: ((error: Error | null, stdout: string, stderr: string) => void) | ((error: Error | null, stdout: Buffer, stderr: Buffer) => void),
15-
): cp.ChildProcess {
15+
): cp.ChildProcess => {
1616
const process = this.client.spawn(command);
1717

1818
let stdout = "";
@@ -41,11 +41,11 @@ export class CP {
4141
return process;
4242
}
4343

44-
public fork(modulePath: string): cp.ChildProcess {
44+
public fork = (modulePath: string): cp.ChildProcess => {
4545
return this.client.fork(modulePath);
4646
}
4747

48-
public spawn(command: string, args?: ReadonlyArray<string> | cp.SpawnOptions, _options?: cp.SpawnOptions): cp.ChildProcess {
48+
public spawn = (command: string, args?: ReadonlyArray<string> | cp.SpawnOptions, _options?: cp.SpawnOptions): cp.ChildProcess => {
4949
return this.client.spawn(command, args, options);
5050
}
5151

‎packages/protocol/src/browser/modules/net.ts

+4-31
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,5 @@
11
import * as net from "net";
22

3-
/**
4-
* Implementation of Socket for the browser.
5-
*/
6-
class Socket extends net.Socket {
7-
8-
public connect(): this {
9-
throw new Error("not implemented");
10-
}
11-
12-
}
13-
14-
/**
15-
* Implementation of Server for the browser.
16-
*/
17-
class Server extends net.Server {
18-
19-
public listen(
20-
_port?: number | any | net.ListenOptions, // tslint:disable-line no-any so we can match the Node API.
21-
_hostname?: string | number | Function,
22-
_backlog?: number | Function,
23-
_listeningListener?: Function,
24-
): this {
25-
throw new Error("not implemented");
26-
}
27-
28-
}
29-
303
type NodeNet = typeof net;
314

325
/**
@@ -35,11 +8,11 @@ type NodeNet = typeof net;
358
export class Net implements NodeNet {
369

3710
public get Socket(): typeof net.Socket {
38-
return Socket;
11+
throw new Error("not implemented");
3912
}
4013

4114
public get Server(): typeof net.Server {
42-
return Server;
15+
throw new Error("not implemented");
4316
}
4417

4518
public connect(): net.Socket {
@@ -65,8 +38,8 @@ export class Net implements NodeNet {
6538
public createServer(
6639
_options?: { allowHalfOpen?: boolean, pauseOnConnect?: boolean } | ((socket: net.Socket) => void),
6740
_connectionListener?: (socket: net.Socket) => void,
68-
): Server {
69-
return new Server();
41+
): net.Server {
42+
throw new Error("not implemented");
7043
}
7144

7245
}

‎packages/vscode/src/index.ts

+15-12
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import { URI } from "vs/base/common/uri";
44
import "./firefox";
55

66
const load = (): Promise<void> => {
7-
return new Promise((resolve, reject) => {
7+
return new Promise((resolve, reject): void => {
88
setUriFactory({
99
// TODO: not sure why this is an error.
1010
// tslint:disable-next-line no-any
@@ -20,19 +20,22 @@ const load = (): Promise<void> => {
2020
],
2121
});
2222

23-
resolve();
23+
client.mkDirs.then(() => {
24+
resolve();
25+
});
2426

25-
// const importTime = time(1500);
26-
// import(/* webpackPrefetch: true */ "./workbench").then((module) => {
27-
// logger.info("Loaded workbench bundle", field("duration", importTime));
28-
// const initTime = time(1500);
27+
const importTime = time(1500);
28+
import(/* webpackPrefetch: true */ "./workbench").then((module) => {
29+
logger.info("Loaded workbench bundle", field("duration", importTime));
30+
const initTime = time(1500);
2931

30-
// return module.initialize(client).then(() => {
31-
// logger.info("Initialized workbench", field("duration", initTime));
32-
//
33-
// });
34-
// }).catch((error) => {
35-
// });
32+
return module.initialize(client).then(() => {
33+
logger.info("Initialized workbench", field("duration", initTime));
34+
resolve();
35+
});
36+
}).catch((error) => {
37+
reject(error);
38+
});
3639
});
3740
};
3841

‎packages/web/src/index.scss

+16-8
Original file line numberDiff line numberDiff line change
@@ -30,18 +30,18 @@ html, body {
3030
z-index: 2;
3131
}
3232

33-
#overlay>.message {
33+
#overlay > .message {
3434
color: white;
3535
margin-top: 10px;
3636
opacity: 0.5;
3737
}
3838

39-
#overlay.error>.message {
39+
#overlay.error > .message {
4040
color: white;
4141
opacity: 0.3;
4242
}
4343

44-
#overlay>.activitybar {
44+
#overlay > .activitybar {
4545
background-color: rgb(44, 44, 44);
4646
bottom: 0;
4747
height: 100%;
@@ -51,14 +51,14 @@ html, body {
5151
width: 50px;
5252
}
5353

54-
#overlay>.activitybar svg {
54+
#overlay > .activitybar svg {
5555
fill: white;
5656
margin-left: 2px;
5757
margin-top: 2px;
5858
opacity: 0.3;
5959
}
6060

61-
#overlay.error>#status {
61+
#overlay.error > #status {
6262
opacity: 0;
6363
}
6464

@@ -76,7 +76,7 @@ html, body {
7676
transform-style: preserve-3d;
7777
}
7878

79-
#logo>svg {
79+
#logo > svg {
8080
fill: rgb(0, 122, 204);
8181
opacity: 1;
8282
width: 100px;
@@ -94,7 +94,7 @@ html, body {
9494
transition: 300ms opacity ease;
9595
}
9696

97-
#status>#progress {
97+
#progress {
9898
background: rgba(0, 0, 0, 0.2);
9999
border-bottom-left-radius: 5px;
100100
border-bottom-right-radius: 5px;
@@ -134,11 +134,19 @@ html, body {
134134
}
135135
}
136136

137-
#status>#progress>#fill {
137+
#fill {
138138
animation: statusProgress 2s ease infinite;
139139
background-size: 400% 400%;
140140
background: linear-gradient(270deg, #007acc, #0016cc);
141141
height: 100%;
142142
transition: 500ms width ease;
143143
width: 0%;
144144
}
145+
146+
.reload-button {
147+
background-color: #007acc;
148+
border-radius: 2px;
149+
cursor: pointer;
150+
margin-top: 10px;
151+
padding: 6px 10px;
152+
}

‎packages/web/src/index.ts

+9-5
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { load } from "@coder/vscode";
33
import "./index.scss";
44

55
const loadTime = time(2500);
6-
logger.info("Loading IDE...");
6+
logger.info("Loading IDE");
77

88
const overlay = document.getElementById("overlay");
99
const logo = document.getElementById("logo");
@@ -33,11 +33,15 @@ load().then(() => {
3333
overlay.classList.add("error");
3434
}
3535
if (msgElement) {
36-
msgElement.innerText = `Failed to load: ${error.message}. Retrying in 3 seconds...`;
36+
const button = document.createElement("div");
37+
button.className = "reload-button";
38+
button.innerText = "Reload";
39+
button.addEventListener("click", () => {
40+
location.reload();
41+
});
42+
msgElement.innerText = `Failed to load: ${error.message}.`;
43+
msgElement.parentElement!.appendChild(button);
3744
}
38-
setTimeout(() => {
39-
location.reload();
40-
}, 3000);
4145
}).finally(() => {
4246
logger.info("Load completed", field("duration", loadTime));
4347
});

‎tsconfig.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
],
1818
"paths": {
1919
"@coder/*": [
20-
"./packages/*/src"
20+
"./packages/*"
2121
],
2222
"vs/*": [
2323
"./lib/vscode/src/vs/*"

‎webpack.config.app.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ const vscodeFills = path.join(root, "packages", "vscode", "src", "fill");
2121

2222
module.exports = {
2323
context: root,
24-
devtool: "source-map",
24+
devtool: "eval",
2525
entry: "./packages/web/src/index.ts",
2626
mode: isCi ? "production" : "development",
2727
output: {
@@ -111,6 +111,7 @@ module.exports = {
111111
devServer: {
112112
hot: true,
113113
port: 3000,
114+
disableHostCheck: true,
114115
stats: {
115116
all: false, // Fallback for options not defined.
116117
errors: true,

0 commit comments

Comments
 (0)