# TS-Games

Custom framework/build system for simple single-file TypeScript games.

## Installing dependencies

- Install bun (https://bun.sh/)

```bash
bun install
```

## Make a game

- Create your game folder in `src/games`
- Create `src/games/<yourgame>/index.ts` with default exported function.

## Running:

```bash
bun start
```
Navigate to `http://localhost:3000` to see the list of your games.
Game rebuilds on each reload.

## Building

```bash
bun run build <project>
```
Will create `<project>.html` in `dist` folder.

Or to select project from list:

```bash
bun run build
```

## Features

- Bun ♥
- TypeScript
- Building into single `.html` file without any dependencies, all assets are inlined as data-urls.
    - `src/games/<yourgame>/assets/favicon.ico` is used as page icon if present.

- TSX supported with [Preact](https://preactjs.com/), because it's lightweight.

- Import images as `HTMLImageElement`
    - PNG & JPG
        ```typescript
        import spritesheet from './assets/spritesheet.png';
        console.log(spritesheet); // <img src="data:..." />
        ```

- Import audio as `HTMLAudioElement`
    - WAV, MP3 & OGG
        ```typescript
        import heal from './assets/heal.ogg';
        console.log(heal); // <audio src="data:..." />
        heal.play()
        ```

- Import CSS
    - Regular CSS
        ```ts
        import "./assets/styles.css";
        ```

    - CSS modules is supported
        ```tsx
        import styles from './assets/styles.module.css';
        console.log(styles.awoo); // G7sddg_awoo

        export default <div className={styles.root}></div>;
        ```

    - Modern CSS features are transpiled
        - Nested CSS
            ```css
            .root {
                display: flex;
                .row {
                    display: flex;
                    flex-direction: row;
                }
            }
            ```
        - Vendor prefixed if needed

    - Import fonts (see example in `src/common/assets/vga.font.css`)
        ```ts
        import "./assets/lcd.font.css";
        ```

- [AssemblyScript](https://www.assemblyscript.org/) support (TypeScript-like language compiled into WebAssembly)
    - Example: `src/games/playground/awoo.wasm.ts`
    - Triggered by file name `*.wasm.ts`

- Import `*.c`/`*.cpp` files (compile to wasm on the fly)
    - Example: `src/games/life/life.c`
    - To use, `clang` and wasm toochain should be present in the system
        ```bash
        sudo apt install clang lld wabt
        ```
    - Supports only function exports & `memory`
        - `EXPORT(jsName) void c_function();`
    - No stdlib


## Publishing

- Make sure you have `scp` installed (it most certainly is)
- Make `.env` file
    ```bash
    PUBLISH_LOCATION=ssh.example.com:/var/www/games/
    PUBLISH_URL=https://example.com/
    ```

- Run build & publish
    ```bash
    bun run build <project>
    ```

    Or to select project from list:
    ```bash
    bun run build
    ```