Natural Push Machine

    @casual-simulation/aux-vm-browser
    TypeScript icon, indicating that this package has built-in type declarations

    3.1.12-alpha.3578187535 • Public • Published

    AUX VM Browser

    npm (scoped)

    A set of utilities required to run an AUX in a web browser.

    Installation

    1. Install the NPM package
    npm install @casual-simulation/aux-vm-browser
    
    1. Add the WorkerEntry.js file to your Webpack config:
    entry: {
        vm: path.resolve(
            __dirname,
            'node_modules',
            '@casual-simulation',
            'aux-vm-browser',
            'html',
            'WorkerEntry.js'
        ),
    },
    
    1. Add the iframe_host.html file to your webpack config via the HtmlWebpackPlugin:
    new HtmlWebpackPlugin({
        chunks: ['vm'],
        template: path.resolve(
            __dirname,
            'node_modules',
            '@casual-simulation',
            'aux-vm-browser',
            'html',
            'iframe_host.html'
        ),
        title: 'AUX VM',
        filename: 'aux-vm-iframe.html',
    }),
    
    1. Ensure that aux-vm-iframe.html is available at the root path of the site.

    Usage

    Connect to an AUX

    import { BotManager } from '@casual-simulation/aux-vm-browser';
    import { AuxUser } from '@casual-simulation/aux-vm';
    
    start();
    
    async function start() {
        // The user that we want the program to act as.
        // In a real-world scenario we would not hardcode these values
        // and we would store the token in a secure location.
        const user: AuxUser = {
            id: 'myUserId', // The Unique ID of this user session.
            username: 'myUsername', // The unique username of the user.
            name: 'myName', // The common name of the user.
            token: 'mySecretToken', // The user password.
            isGuest: false, // Whether the user should be treated as a guest.
        };
    
        // The ID of the channel that should be loaded.
        // The ID can have the following forms:
        // - 'channelId' - This will load 'channelId' from the current host (taken from navigator).
        // - 'https://example.com/*/channelId' - This will load 'channelId' from example.com over https
        const id = 'channelId';
    
        // Create a file manager.
        // This represents an in-browser AUX simulation.
        const sim = new BotManager(user, id, {
            isBuilder: false,
            isPlayer: false,
        });
    
        // Initialize the simulation.
        // This will setup a web worker and pipe
        // events between the worker and main thread.
        await sim.init();
    
        // Listen for the sync state to change to "synced".
        // When we're synced we know we have the most up to date data
        // and we can communicate our changes to the server.
        // Note that this will not fire if we are not allowed to connect.
        // This may happen if we are not authenticated/authorized.
        sim.connection.syncStateChanged.subscribe((synced) => {
            if (synced) {
                console.log("We're synced!");
    
                // TODO: Update THE UI
            } else {
                console.log('No longer synced.');
    
                // TODO: Update the UI
            }
        });
    }

    Keywords

    Install

    npm i @casual-simulation/aux-vm-browser

    DownloadsWeekly Downloads

    194

    Version

    3.1.12-alpha.3578187535

    License

    MIT

    Unpacked Size

    328 kB

    Total Files

    87

    Last publish

    Collaborators

    • kallyngowdyyeti
    • casualsimulation