js-dos 0.80.25

package/src/ui.tsx

@@ -0,0 +1,103 @@
+import { useEffect, useRef } from "preact/hooks";
+import { useDispatch, useSelector } from "react-redux";
+import { Login } from "./login/login";
+import { Frame } from "./frame/frame";
+import { SideBar } from "./sidebar/sidebar";
+import { State } from "./store";
+import { dispatchLoginAction, uiSlice } from "./store/ui";
+import { Window } from "./window/window";
+import { useT } from "./i18n";
+
+let currentWideScreen = uiSlice.getInitialState().wideScreen;
+export function Ui() {
+    const rootRef = useRef<HTMLDivElement>(null);
+    const theme = useSelector((state: State) => state.ui.theme);
+    const dispatch = useDispatch();
+
+    useEffect(() => {
+        if (rootRef === null || rootRef.current === null) {
+            return;
+        }
+
+        const root = rootRef.current;
+        function onResize() {
+            const size = root.getBoundingClientRect().width;
+            const wide = size > 640;
+            if (wide !== currentWideScreen) {
+                currentWideScreen = wide;
+                dispatch(uiSlice.actions.setWideScreen(currentWideScreen));
+            }
+        }
+
+        const resizeObserver = new ResizeObserver(onResize);
+        resizeObserver.observe(root);
+        window.addEventListener("resize", onResize);
+
+        return () => {
+            resizeObserver.disconnect();
+            window.removeEventListener("resize", onResize);
+        };
+    }, [rootRef, dispatch]);
+
+    return <div
+        ref={rootRef}
+        class="w-full h-full relative"
+        data-theme={theme}>
+        <Window />
+        <Frame />
+        <SideBar />
+        <Login />
+        <Toast />
+        <ReadOnlyWarning />
+    </div>;
+};
+
+function Toast() {
+    const toast = useSelector((state: State) => state.ui.toast);
+    const intent = useSelector((state: State) => state.ui.toastIntent);
+
+    if (toast === null) {
+        return null;
+    }
+
+    return <div class="absolute right-10 bottom-10">
+        <div class={"alert alert-" + (intent === "panic" ? "error" : intent)} >
+            {toast}
+        </div>
+    </div>;
+}
+
+function ReadOnlyWarning() {
+    const readOnlyWarning = useSelector((state: State) => state.ui.readOnlyWarning);
+    const account = useSelector((state: State) => state.auth.account);
+    const t = useT();
+    const dispatch = useDispatch();
+
+    if (!readOnlyWarning) {
+        return null;
+    }
+
+    function fix() {
+        dispatch(uiSlice.actions.readOnlyWarning(false));
+        dispatchLoginAction(account, dispatch);
+    }
+
+    function close() {
+        dispatch(uiSlice.actions.readOnlyWarning(false));
+    }
+
+    return <div class="absolute right-10 bottom-10">
+        <div class="alert">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+                class="stroke-info shrink-0 w-6 h-6">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                    d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+            </svg>
+            <span>{t("read_only_access")}</span>
+            <div>
+                <button class="btn btn-sm btn-primary mr-2" onClick={fix}>{t("fix")}</button>
+                <button class="btn btn-sm" onClick={close}>{t("close")}</button>
+            </div>
+        </div>
+    </div>;
+}

package/src/v8/changes.ts

@@ -0,0 +1,56 @@
+import { uploadsS3Url, uploadsS3Bucket, uploadNamspace, presignPut } from "./config";
+
+function getPersonalBundleKey(id: string,
+                              bundleUrl: string): string {
+    const index = bundleUrl.lastIndexOf("/");
+    const basename = bundleUrl.substring(index + 1);
+    return "personal-v2/" + uploadNamspace + "/" + id + "/" + basename;
+}
+
+export function getChangesUrlPrefix(id: string): string {
+    return uploadsS3Url + "/" + uploadsS3Bucket + "/" + "personal-v2" + "/" + uploadNamspace + "/" + id + "/";
+}
+
+export function getChangesUrl(id: string, bundleUrl: string): string {
+    const personalBundleKey = getPersonalBundleKey(id, bundleUrl);
+    return uploadsS3Url + "/" + uploadsS3Bucket + "/" + personalBundleKey;
+}
+
+export async function putChanges(bundleUrl: string,
+                                 data: Uint8Array): Promise<void> {
+    let response = await fetch(presignPut + "?bundleUrl=" + encodeURIComponent(bundleUrl));
+    const result = await response.json();
+
+    if (!result.success) {
+        throw new Error("Unable to put personal bundle");
+    }
+
+    const post = result.post as {
+        url: string,
+        fields: {
+            Policy: string,
+            "X-Amz-Algorithm": string,
+            "X-Amz-Credential": string,
+            "X-Amz-Date": string,
+            "X-Amz-Signature": string,
+            bucket: string,
+            key: string,
+        },
+    };
+
+    const formData = new FormData();
+    Object.entries(post.fields).forEach(([k, v]) => {
+        formData.append(k, v);
+    });
+    formData.append("acl", "public-read");
+    formData.append("file", new Blob([data]));
+
+    response = await fetch(post.url, {
+        method: "post",
+        body: formData,
+    });
+
+    if (response.status !== 200 && response.status !== 204) {
+        throw new Error("Unable to put changes: " + response.statusText);
+    }
+}

package/src/v8/config.ts

@@ -0,0 +1,18 @@
+export const endpoint = "https://v8.js-dos.com";
+export const authentificator = endpoint + "/auth/";
+export const uploadsS3Bucket = "doszone-uploads";
+export const uploadsS3Url = "https://storage.yandexcloud.net";
+export const uploadNamspace = "dzapi";
+
+export const apiEndpoint = "https://d5dn8hh4ivlobv6682ep.apigw.yandexcloud.net";
+export const presignPut = apiEndpoint + "/presign-put";
+
+export const xsollaSubscriptons = "https://subscriptions.xsolla.com​/api/user/v1/projects/184012/subscriptions";
+export const xsollaPremiumId = "sumOxNVr";
+
+export const brCdn = "https://br.cdn.dos.zone";
+
+export const cancelSubscriptionPage = {
+    en: "https://v8.js-dos.com/cancel-your-subscription/",
+    ru: "https://v8.js-dos.com/ru/cancel-your-subscription/",
+};

package/src/v8/subscriptions.ts

@@ -0,0 +1,62 @@
+import { xsollaPremiumId, xsollaSubscriptons } from "../v8/config";
+
+export async function linkToBuy(token: string): Promise<string | null> {
+    const response = await fetch(xsollaSubscriptons + "/buy", {
+        method: "POST",
+        cache: "no-cache",
+        headers: {
+            "Authorization": "Bearer " + token,
+            "Content-Type": "application/json",
+        },
+        body: JSON.stringify({
+            plan_external_id: xsollaPremiumId,
+        }),
+    });
+
+    const json = await response.json();
+
+    if (json.link_to_ps === undefined) {
+        console.error("Unexpected subscriptions response:", json);
+        return null;
+    }
+
+    return json.link_to_ps;
+}
+
+export async function havePremium(token: string): Promise<boolean> {
+    const response = await fetch(xsollaSubscriptons, {
+        method: "GET",
+        cache: "no-cache",
+        headers: {
+            "Authorization": "Bearer " + token,
+        },
+    });
+
+    const json = await response.json();
+    if (json.items === undefined) {
+        console.error("Unexpected subscriptions response:", json);
+        return false;
+    }
+
+    return json.items.length > 0 && json.items[0].plan_external_id === xsollaPremiumId;
+}
+
+export async function cancle(token: string): Promise<boolean> {
+    // eslint-disable-next-line
+    // https://subscriptions.xsolla.com/api/doc/user#/Subscriptions/put_xsolla_subscription_apiuser_cancelusersubscription
+    const response = await fetch(xsollaSubscriptons + "/" + xsollaPremiumId + "/cancel", {
+        method: "PUT",
+        cache: "no-cache",
+        headers: {
+            "Authorization": "Bearer " + token,
+        },
+    });
+
+    const json = await response.json();
+    if (json.error) {
+        console.error("Unexpected subscriptions response:", json);
+        return false;
+    }
+
+    return true;
+}

package/src/vite-env.d.ts

@@ -0,0 +1,2 @@
+// eslint-disable-next-line
+/// <reference types="vite/client" />

package/src/window/dos/controls/keyboard.ts

@@ -0,0 +1,32 @@
+import { CommandInterface } from "emulators";
+import { domToKeyCode } from "./keys";
+
+export function keyboard(el: HTMLElement, ci: CommandInterface) {
+    function onKeyDown(e: KeyboardEvent) {
+        if ((e.target as any).type === "text") {
+            return;
+        }
+        const keyCode = domToKeyCode(e.keyCode);
+        ci.sendKeyEvent(keyCode, true);
+        e.stopPropagation();
+        e.preventDefault();
+    };
+
+    function onKeyUp(e: KeyboardEvent) {
+        if ((e.target as any).type === "text") {
+            return;
+        }
+        const keyCode = domToKeyCode(e.keyCode);
+        ci.sendKeyEvent(keyCode, false);
+        e.stopPropagation();
+        e.preventDefault();
+    };
+
+    el.addEventListener("keydown", onKeyDown);
+    el.addEventListener("keyup", onKeyUp);
+
+    return () => {
+        el.removeEventListener("keydown", onKeyDown);
+        el.removeEventListener("keyup", onKeyUp);
+    };
+}

package/src/window/dos/controls/keys.ts

@@ -0,0 +1,331 @@
+/* eslint-disable camelcase */
+
+export const KBD_NONE = 0;
+export const KBD_0 = 48;
+export const KBD_1 = 49;
+export const KBD_2 = 50;
+export const KBD_3 = 51;
+export const KBD_4 = 52;
+export const KBD_5 = 53;
+export const KBD_6 = 54;
+export const KBD_7 = 55;
+export const KBD_8 = 56;
+export const KBD_9 = 57;
+export const KBD_a = 65;
+export const KBD_b = 66;
+export const KBD_c = 67;
+export const KBD_d = 68;
+export const KBD_e = 69;
+export const KBD_f = 70;
+export const KBD_g = 71;
+export const KBD_h = 72;
+export const KBD_i = 73;
+export const KBD_j = 74;
+export const KBD_k = 75;
+export const KBD_l = 76;
+export const KBD_m = 77;
+export const KBD_n = 78;
+export const KBD_o = 79;
+export const KBD_p = 80;
+export const KBD_q = 81;
+export const KBD_r = 82;
+export const KBD_s = 83;
+export const KBD_t = 84;
+export const KBD_u = 85;
+export const KBD_v = 86;
+export const KBD_w = 87;
+export const KBD_x = 88;
+export const KBD_y = 89;
+export const KBD_z = 90;
+export const KBD_f1 = 290;
+export const KBD_f2 = 291;
+export const KBD_f3 = 292;
+export const KBD_f4 = 293;
+export const KBD_f5 = 294;
+export const KBD_f6 = 295;
+export const KBD_f7 = 296;
+export const KBD_f8 = 297;
+export const KBD_f9 = 298;
+export const KBD_f10 = 299;
+export const KBD_f11 = 300;
+export const KBD_f12 = 301;
+
+export const KBD_kp0 = 320;
+export const KBD_kp1 = 321;
+export const KBD_kp2 = 322;
+export const KBD_kp3 = 323;
+export const KBD_kp4 = 324;
+export const KBD_kp5 = 325;
+export const KBD_kp6 = 326;
+export const KBD_kp7 = 327;
+export const KBD_kp8 = 328;
+export const KBD_kp9 = 329;
+
+export const KBD_kpperiod = 330;
+export const KBD_kpdivide = 331;
+export const KBD_kpmultiply = 332;
+export const KBD_kpminus = 333;
+export const KBD_kpplus = 334;
+export const KBD_kpenter = 335;
+
+export const KBD_esc = 256;
+export const KBD_tab = 258;
+export const KBD_backspace = 259;
+export const KBD_enter = 257;
+export const KBD_space = 32;
+export const KBD_leftalt = 342;
+export const KBD_rightalt = 346;
+export const KBD_leftctrl = 341;
+export const KBD_rightctrl = 345;
+export const KBD_leftshift = 340;
+export const KBD_rightshift = 344;
+export const KBD_capslock = 280;
+export const KBD_scrolllock = 281;
+export const KBD_numlock = 282;
+export const KBD_grave = 96;
+export const KBD_minus = 45;
+export const KBD_equals = 61;
+export const KBD_backslash = 92;
+export const KBD_leftbracket = 91;
+export const KBD_rightbracket = 93;
+export const KBD_semicolon = 59;
+export const KBD_quote = 39;
+export const KBD_period = 46;
+export const KBD_comma = 44;
+export const KBD_slash = 47;
+export const KBD_printscreen = 283;
+export const KBD_pause = 284;
+export const KBD_insert = 260;
+export const KBD_home = 268;
+export const KBD_pageup = 266;
+export const KBD_delete = 261;
+export const KBD_end = 269;
+export const KBD_pagedown = 267;
+export const KBD_left = 263;
+export const KBD_up = 265;
+export const KBD_down = 264;
+export const KBD_right = 262;
+export const KBD_extra_lt_gt = 348; // ???
+
+export const domToKeyCodes: {[index: number]: number} = {
+    8: KBD_backspace,
+    9: KBD_tab,
+    13: KBD_enter,
+    16: KBD_leftshift,
+    17: KBD_leftctrl,
+    18: KBD_leftalt,
+    19: KBD_pause,
+    27: KBD_esc,
+    32: KBD_space,
+    33: KBD_pageup,
+    34: KBD_pagedown,
+    35: KBD_end,
+    36: KBD_home,
+    37: KBD_left,
+    38: KBD_up,
+    39: KBD_right,
+    40: KBD_down,
+    45: KBD_insert,
+    46: KBD_delete,
+    48: KBD_0,
+    49: KBD_1,
+    50: KBD_2,
+    51: KBD_3,
+    52: KBD_4,
+    53: KBD_5,
+    54: KBD_6,
+    55: KBD_7,
+    56: KBD_8,
+    57: KBD_9,
+    59: KBD_semicolon,
+    64: KBD_equals,
+    65: KBD_a,
+    66: KBD_b,
+    67: KBD_c,
+    68: KBD_d,
+    69: KBD_e,
+    70: KBD_f,
+    71: KBD_g,
+    72: KBD_h,
+    73: KBD_i,
+    74: KBD_j,
+    75: KBD_k,
+    76: KBD_l,
+    77: KBD_m,
+    78: KBD_n,
+    79: KBD_o,
+    80: KBD_p,
+    81: KBD_q,
+    82: KBD_r,
+    83: KBD_s,
+    84: KBD_t,
+    85: KBD_u,
+    86: KBD_v,
+    87: KBD_w,
+    88: KBD_x,
+    89: KBD_y,
+    90: KBD_z,
+    91: KBD_leftbracket,
+    93: KBD_rightbracket,
+    96: KBD_kp0,
+    97: KBD_kp1,
+    98: KBD_kp2,
+    99: KBD_kp3,
+    100: KBD_kp4,
+    101: KBD_kp5,
+    102: KBD_kp6,
+    103: KBD_kp7,
+    104: KBD_kp8,
+    105: KBD_kp9,
+    // 106: KBD_kpmultiply,
+    // 107: KBD_kpadd,
+    // 109: KBD_kpsubtract,
+    // 110: KBD_kpdecimal,
+    111: KBD_kpdivide,
+    112: KBD_f1,
+    113: KBD_f2,
+    114: KBD_f3,
+    115: KBD_f4,
+    116: KBD_f5,
+    117: KBD_f6,
+    118: KBD_f7,
+    119: KBD_f8,
+    120: KBD_f9,
+    121: KBD_f10,
+    122: KBD_f11,
+    123: KBD_f12,
+    144: KBD_numlock,
+    145: KBD_scrolllock,
+    173: KBD_minus,
+    186: KBD_semicolon,
+    187: KBD_equals,
+    188: KBD_comma,
+    189: KBD_minus,
+    190: KBD_period,
+    191: KBD_slash,
+    // 192: KBD_graveaccent,
+    219: KBD_leftbracket,
+    220: KBD_backslash,
+    221: KBD_rightbracket,
+    // 222: KBD_apostrophe,
+    // 224: KBD_left_super,
+};
+
+export const namedKeyCodes: {[name: string]: number} = {
+    "KBD_NONE": KBD_NONE,
+    "KBD_0": KBD_0,
+    "KBD_1": KBD_1,
+    "KBD_2": KBD_2,
+    "KBD_3": KBD_3,
+    "KBD_4": KBD_4,
+    "KBD_5": KBD_5,
+    "KBD_6": KBD_6,
+    "KBD_7": KBD_7,
+    "KBD_8": KBD_8,
+    "KBD_9": KBD_9,
+    "KBD_a": KBD_a,
+    "KBD_b": KBD_b,
+    "KBD_c": KBD_c,
+    "KBD_d": KBD_d,
+    "KBD_e": KBD_e,
+    "KBD_f": KBD_f,
+    "KBD_g": KBD_g,
+    "KBD_h": KBD_h,
+    "KBD_i": KBD_i,
+    "KBD_j": KBD_j,
+    "KBD_k": KBD_k,
+    "KBD_l": KBD_l,
+    "KBD_m": KBD_m,
+    "KBD_n": KBD_n,
+    "KBD_o": KBD_o,
+    "KBD_p": KBD_p,
+    "KBD_q": KBD_q,
+    "KBD_r": KBD_r,
+    "KBD_s": KBD_s,
+    "KBD_t": KBD_t,
+    "KBD_u": KBD_u,
+    "KBD_v": KBD_v,
+    "KBD_w": KBD_w,
+    "KBD_x": KBD_x,
+    "KBD_y": KBD_y,
+    "KBD_z": KBD_z,
+    "KBD_f1": KBD_f1,
+    "KBD_f2": KBD_f2,
+    "KBD_f3": KBD_f3,
+    "KBD_f4": KBD_f4,
+    "KBD_f5": KBD_f5,
+    "KBD_f6": KBD_f6,
+    "KBD_f7": KBD_f7,
+    "KBD_f8": KBD_f8,
+    "KBD_f9": KBD_f9,
+    "KBD_f10": KBD_f10,
+    "KBD_f11": KBD_f11,
+    "KBD_f12": KBD_f12,
+
+    "KBD_kp0": KBD_kp0,
+    "KBD_kp1": KBD_kp1,
+    "KBD_kp2": KBD_kp2,
+    "KBD_kp3": KBD_kp3,
+    "KBD_kp4": KBD_kp4,
+    "KBD_kp5": KBD_kp5,
+    "KBD_kp6": KBD_kp6,
+    "KBD_kp7": KBD_kp7,
+    "KBD_kp8": KBD_kp8,
+    "KBD_kp9": KBD_kp9,
+
+    "KBD_kpperiod": KBD_kpperiod,
+    "KBD_kpdivide": KBD_kpdivide,
+    "KBD_kpmultiply": KBD_kpmultiply,
+    "KBD_kpminus": KBD_kpminus,
+    "KBD_kpplus": KBD_kpplus,
+    "KBD_kpenter": KBD_kpenter,
+
+    "KBD_esc": KBD_esc,
+    "KBD_tab": KBD_tab,
+    "KBD_backspace": KBD_backspace,
+    "KBD_enter": KBD_enter,
+    "KBD_space": KBD_space,
+    "KBD_leftalt": KBD_leftalt,
+    "KBD_rightalt": KBD_rightalt,
+    "KBD_leftctrl": KBD_leftctrl,
+    "KBD_rightctrl": KBD_rightctrl,
+    "KBD_leftshift": KBD_leftshift,
+    "KBD_rightshift": KBD_rightshift,
+    "KBD_capslock": KBD_capslock,
+    "KBD_scrolllock": KBD_scrolllock,
+    "KBD_numlock": KBD_numlock,
+    "KBD_grave": KBD_grave,
+    "KBD_minus": KBD_minus,
+    "KBD_equals": KBD_equals,
+    "KBD_backslash": KBD_backslash,
+    "KBD_leftbracket": KBD_leftbracket,
+    "KBD_rightbracket": KBD_rightbracket,
+    "KBD_semicolon": KBD_semicolon,
+    "KBD_quote": KBD_quote,
+    "KBD_period": KBD_period,
+    "KBD_comma": KBD_comma,
+    "KBD_slash": KBD_slash,
+    "KBD_printscreen": KBD_printscreen,
+    "KBD_pause": KBD_pause,
+    "KBD_insert": KBD_insert,
+    "KBD_home": KBD_home,
+    "KBD_pageup": KBD_pageup,
+    "KBD_delete": KBD_delete,
+    "KBD_end": KBD_end,
+    "KBD_pagedown": KBD_pagedown,
+    "KBD_left": KBD_left,
+    "KBD_up": KBD_up,
+    "KBD_down": KBD_down,
+    "KBD_right": KBD_right,
+    "KBD_extra_lt_gt": KBD_extra_lt_gt,
+};
+
+export const keyCodesToDom: {[index: number]: number} = {};
+for (const next of Object.keys(domToKeyCodes)) {
+    const key = Number.parseInt(next, 10);
+    keyCodesToDom[domToKeyCodes[key]] = key;
+}
+
+export function domToKeyCode(domCode: number) {
+    return domToKeyCodes[domCode] || 0;
+}

package/src/window/dos/controls/mouse/mount.ts

@@ -0,0 +1,99 @@
+import { pointer, getPointerState } from "./pointer";
+
+export function mount(el: HTMLElement,
+                      pointerButton: number,
+                      onMouseDown: (x: number, y: number, button: number) => void,
+                      onMouseMove: (x: number, y: number, mX: number, mY: number) => void,
+                      onMouseUp: (x: number, y: number, button: number) => void,
+                      onMouseLeave: (x: number, y: number) => void) {
+    // eslint-disable-next-line
+    function preventDefaultIfNeeded(e: Event) {
+        // not needed yet
+    }
+
+    let pressedButton = 0;
+    const onStart = (e: Event) => {
+        if (e.target !== el) {
+            return;
+        }
+
+        const state = getPointerState(e, el);
+        pressedButton = state.button === undefined ? pointerButton : state.button;
+        onMouseDown(state.x, state.y, pressedButton);
+
+        e.stopPropagation();
+        preventDefaultIfNeeded(e);
+    };
+
+    const onChange = (e: Event) => {
+        if (e.target !== el) {
+            return;
+        }
+
+        const state = getPointerState(e, el);
+        onMouseMove(state.x, state.y, state.mX, state.mY);
+        e.stopPropagation();
+        preventDefaultIfNeeded(e);
+    };
+
+    const onEnd = (e: Event) => {
+        const state = getPointerState(e, el);
+        onMouseUp(state.x, state.y, pressedButton);
+        e.stopPropagation();
+        preventDefaultIfNeeded(e);
+    };
+
+    const onLeave = (e: Event) => {
+        if (e.target !== el) {
+            return;
+        }
+
+        const state = getPointerState(e, el);
+        onMouseLeave(state.x, state.y);
+        e.stopPropagation();
+        preventDefaultIfNeeded(e);
+    };
+
+    const onPrevent = (e: Event) => {
+        e.stopPropagation();
+        preventDefaultIfNeeded(e);
+    };
+
+    const options = {
+        capture: false,
+    };
+
+    for (const next of pointer.starters) {
+        el.addEventListener(next, onStart, options);
+    }
+    for (const next of pointer.changers) {
+        el.addEventListener(next, onChange, options);
+    }
+    for (const next of pointer.enders) {
+        el.addEventListener(next, onEnd, options);
+    }
+    for (const next of pointer.prevents) {
+        el.addEventListener(next, onPrevent, options);
+    }
+    for (const next of pointer.leavers) {
+        el.addEventListener(next, onLeave, options);
+    }
+
+    return () => {
+        for (const next of pointer.starters) {
+            el.removeEventListener(next, onStart, options);
+        }
+        for (const next of pointer.changers) {
+            el.removeEventListener(next, onChange, options);
+        }
+        for (const next of pointer.enders) {
+            el.removeEventListener(next, onEnd, options);
+        }
+        for (const next of pointer.prevents) {
+            el.removeEventListener(next, onPrevent, options);
+        }
+        for (const next of pointer.leavers) {
+            el.removeEventListener(next, onLeave, options);
+        }
+    };
+}