Getting the client to run (#12)
* Clean up workbench and integrate initialization data * Uncomment Electron fill * Run server & client together * Clean up Electron fill & patch * Bind fs methods This makes them usable with the promise form: `promisify(access)(...)`. * Add space between tag and title to browser logger * Add typescript dep to server and default __dirname for path * Serve web files from server * Adjust some dev options * Rework workbench a bit to use a class and catch unexpected errors * No mkdirs for now, fix util fill, use bash with exec * More fills, make general client abstract * More fills * Fix cp.exec * Fix require calls in fs fill being aliased * Create data and storage dir * Implement fs.watch Using exec for now. * Implement storage database fill * Fix os export and homedir * Add comment to use navigator.sendBeacon * Fix fs callbacks (some args are optional) * Make sure data directory exists when passing it back * Update patch * Target es5 * More fills * Add APIs required for bootstrap-fork to function (#15) * Add bootstrap-fork execution * Add createConnection * Bundle bootstrap-fork into cli * Remove .node directory created from spdlog * Fix npm start * Remove unnecessary comment * Add webpack-hot-middleware if CLI env is not set * Add restarting to shared process * Fix starting with yarn
This commit is contained in:
Asher
Kyle Carberry
@@ -1,11 +1,26 @@
|
||||
import { exec } from "child_process";
|
||||
import { promisify } from "util";
|
||||
import { field, logger, time, Time } from "@coder/logger";
|
||||
import { escapePath } from "@coder/protocol";
|
||||
import { retry } from "./retry";
|
||||
import { InitData } from "@coder/protocol";
|
||||
import { retry, Retry } from "./retry";
|
||||
import { client } from "./fill/client";
|
||||
import { Clipboard, clipboard } from "./fill/clipboard";
|
||||
|
||||
export interface IURI {
|
||||
|
||||
readonly path: string;
|
||||
readonly fsPath: string;
|
||||
readonly scheme: string;
|
||||
|
||||
}
|
||||
|
||||
export interface IURIFactory {
|
||||
|
||||
/**
|
||||
* Convert the object to an instance of a real URI.
|
||||
*/
|
||||
create<T extends IURI>(uri: IURI): T;
|
||||
file(path: string): IURI;
|
||||
parse(raw: string): IURI;
|
||||
|
||||
export interface IClientOptions {
|
||||
mkDirs?: string[];
|
||||
}
|
||||
|
||||
/**
|
||||
@@ -14,33 +29,81 @@ export interface IClientOptions {
|
||||
* Everything the client provides is asynchronous so you can wait on what
|
||||
* you need from it without blocking anything else.
|
||||
*
|
||||
* It also provides task management to help asynchronously load and time
|
||||
* external code.
|
||||
* It also provides task management to help asynchronously load and time code.
|
||||
*/
|
||||
export class Client {
|
||||
export abstract class Client {
|
||||
|
||||
public readonly mkDirs: Promise<void>;
|
||||
public readonly retry: Retry = retry;
|
||||
public readonly clipboard: Clipboard = clipboard;
|
||||
public readonly uriFactory: IURIFactory;
|
||||
private start: Time | undefined;
|
||||
private readonly progressElement: HTMLElement | undefined;
|
||||
private tasks: string[];
|
||||
private finishedTaskCount: number;
|
||||
private tasks: string[] = [];
|
||||
private finishedTaskCount = 0;
|
||||
private readonly loadTime: Time;
|
||||
|
||||
public constructor() {
|
||||
logger.info("Loading IDE");
|
||||
|
||||
this.loadTime = time(2500);
|
||||
|
||||
const overlay = document.getElementById("overlay");
|
||||
const logo = document.getElementById("logo");
|
||||
const msgElement = overlay
|
||||
? overlay.querySelector(".message") as HTMLElement
|
||||
: undefined;
|
||||
|
||||
if (overlay && logo) {
|
||||
overlay.addEventListener("mousemove", (event) => {
|
||||
const xPos = ((event.clientX - logo.offsetLeft) / 24).toFixed(2);
|
||||
const yPos = ((logo.offsetTop - event.clientY) / 24).toFixed(2);
|
||||
|
||||
logo.style.transform = `perspective(200px) rotateX(${yPos}deg) rotateY(${xPos}deg)`;
|
||||
});
|
||||
}
|
||||
|
||||
public constructor(options: IClientOptions) {
|
||||
this.tasks = [];
|
||||
this.finishedTaskCount = 0;
|
||||
this.progressElement = typeof document !== "undefined"
|
||||
? document.querySelector("#fill") as HTMLElement
|
||||
: undefined;
|
||||
|
||||
this.mkDirs = this.wrapTask("Creating directories", 100, async () => {
|
||||
if (options.mkDirs && options.mkDirs.length > 0) {
|
||||
await promisify(exec)(`mkdir -p ${options.mkDirs.map(escapePath).join(" ")}`);
|
||||
}
|
||||
require("path").posix = require("path");
|
||||
|
||||
window.addEventListener("contextmenu", (event) => {
|
||||
event.preventDefault();
|
||||
});
|
||||
|
||||
// Prevent Firefox from trying to reconnect when the page unloads.
|
||||
window.addEventListener("unload", () => {
|
||||
retry.block();
|
||||
this.retry.block();
|
||||
logger.info("Unloaded");
|
||||
});
|
||||
|
||||
this.uriFactory = this.createUriFactory();
|
||||
|
||||
this.initialize().then(() => {
|
||||
if (overlay) {
|
||||
overlay.style.opacity = "0";
|
||||
overlay.addEventListener("transitionend", () => {
|
||||
overlay.remove();
|
||||
});
|
||||
}
|
||||
logger.info("Load completed", field("duration", this.loadTime));
|
||||
}).catch((error) => {
|
||||
logger.error(error.message);
|
||||
if (overlay) {
|
||||
overlay.classList.add("error");
|
||||
}
|
||||
if (msgElement) {
|
||||
const button = document.createElement("div");
|
||||
button.className = "reload-button";
|
||||
button.innerText = "Reload";
|
||||
button.addEventListener("click", () => {
|
||||
location.reload();
|
||||
});
|
||||
msgElement.innerText = `Failed to load: ${error.message}.`;
|
||||
msgElement.parentElement!.appendChild(button);
|
||||
}
|
||||
logger.warn("Load completed with errors", field("duration", this.loadTime));
|
||||
});
|
||||
}
|
||||
|
||||
@@ -48,14 +111,14 @@ export class Client {
|
||||
* Wrap a task in some logging, timing, and progress updates. Can optionally
|
||||
* wait on other tasks which won't count towards this task's time.
|
||||
*/
|
||||
public async wrapTask<T>(description: string, duration: number, task: () => Promise<T>): Promise<T>;
|
||||
public async wrapTask<T, V>(description: string, duration: number, task: (v: V) => Promise<T>, t: Promise<V>): Promise<T>;
|
||||
public async wrapTask<T, V1, V2>(description: string, duration: number, task: (v1: V1, v2: V2) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>): Promise<T>;
|
||||
public async wrapTask<T, V1, V2, V3>(description: string, duration: number, task: (v1: V1, v2: V2, v3: V3) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>, t3: Promise<V3>): Promise<T>;
|
||||
public async wrapTask<T, V1, V2, V3, V4>(description: string, duration: number, task: (v1: V1, v2: V2, v3: V3, v4: V4) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>, t3: Promise<V3>, t4: Promise<V4>): Promise<T>;
|
||||
public async wrapTask<T, V1, V2, V3, V4, V5>(description: string, duration: number, task: (v1: V1, v2: V2, v3: V3, v4: V4, v5: V5) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>, t3: Promise<V3>, t4: Promise<V4>, t5: Promise<V5>): Promise<T>;
|
||||
public async wrapTask<T, V1, V2, V3, V4, V5, V6>(description: string, duration: number, task: (v1: V1, v2: V2, v3: V3, v4: V4, v5: V5, v6: V6) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>, t3: Promise<V3>, t4: Promise<V4>, t5: Promise<V5>, t6: Promise<V6>): Promise<T>;
|
||||
public async wrapTask<T>(
|
||||
public async task<T>(description: string, duration: number, task: () => Promise<T>): Promise<T>;
|
||||
public async task<T, V>(description: string, duration: number, task: (v: V) => Promise<T>, t: Promise<V>): Promise<T>;
|
||||
public async task<T, V1, V2>(description: string, duration: number, task: (v1: V1, v2: V2) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>): Promise<T>;
|
||||
public async task<T, V1, V2, V3>(description: string, duration: number, task: (v1: V1, v2: V2, v3: V3) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>, t3: Promise<V3>): Promise<T>;
|
||||
public async task<T, V1, V2, V3, V4>(description: string, duration: number, task: (v1: V1, v2: V2, v3: V3, v4: V4) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>, t3: Promise<V3>, t4: Promise<V4>): Promise<T>;
|
||||
public async task<T, V1, V2, V3, V4, V5>(description: string, duration: number, task: (v1: V1, v2: V2, v3: V3, v4: V4, v5: V5) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>, t3: Promise<V3>, t4: Promise<V4>, t5: Promise<V5>): Promise<T>;
|
||||
public async task<T, V1, V2, V3, V4, V5, V6>(description: string, duration: number, task: (v1: V1, v2: V2, v3: V3, v4: V4, v5: V5, v6: V6) => Promise<T>, t1: Promise<V1>, t2: Promise<V2>, t3: Promise<V3>, t4: Promise<V4>, t5: Promise<V5>, t6: Promise<V6>): Promise<T>;
|
||||
public async task<T>(
|
||||
description: string, duration: number = 100, task: (...args: any[]) => Promise<T>, ...after: Array<Promise<any>> // tslint:disable-line no-any
|
||||
): Promise<T> {
|
||||
this.tasks.push(description);
|
||||
@@ -97,4 +160,21 @@ export class Client {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* A promise that resolves with initialization data.
|
||||
*/
|
||||
public get initData(): Promise<InitData> {
|
||||
return client.initData;
|
||||
}
|
||||
|
||||
/**
|
||||
* Initialize the IDE.
|
||||
*/
|
||||
protected abstract initialize(): Promise<void>;
|
||||
|
||||
/**
|
||||
* Create URI factory.
|
||||
*/
|
||||
protected abstract createUriFactory(): IURIFactory;
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user