@needle-tools/engine/plugins/vite/drop.js

Needle Engine is a web-based runtime for 3D apps. It runs on your machine for development with great integrations into editors like Unity or Blender - and can be deployed onto any device! It is flexible, extensible and networking and XR are built-in.

import path from 'path';
import { loadConfig, tryLoadProjectConfig } from './config.js';
import { readFileSync } from 'fs';
import { fileURLToPath } from 'url';

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

/** experimental, allow dropping files from Unity into the running scene */
/**
 * @param {import('../types/userconfig.js').userSettings} userSettings
 */
export const needleDrop = (command, config, userSettings) => {
    if (command === "build") return;
    
    if(userSettings.useDrop !== true) return null;

    return {
        name: "needle:drop",
        config(config) {
            if(userSettings)
            if (!config.server) config.server = {};
            if (!config.server.hmr) config.server.hmr = {};
            config.server.hmr.port = 8080;
            setTimeout(() => console.log("Update HMR port to " + config.server.hmr.port));
        },
        transformIndexHtml: {
            order: 'pre',
            handler(html, _) {
                const file = path.join(__dirname, 'drop-client.js');
                return [
                    {
                        tag: 'script',
                        attrs: {
                            type: 'module',
                        },
                        children: readFileSync(file, 'utf8'),
                        injectTo: 'body',
                    },
                ];
            },
        },
        configureServer(server) {

            server.ws.on('needle:drop-file', async (data, client) => {
                server.ws.send({ type: 'needle-editor:drop-file', data: data });
            });
            // TODO: not sure how we can receive it with the normal vite server
            // server.ws.on("custom", (data, client) => {
            //     console.log(data);
            // })

            server.ws.on('connection', (socket, request) => {
                socket.on('message', async (bytes) => {
                    try {
                        const message = Buffer.from(bytes).toString();
                        if (message && message.startsWith("{")) {
                            const obj = JSON.parse(message);
                            if (obj.type === "needle-editor:exported-file") {
                                server.ws.send(obj.type, obj.data);
                            }
                        }
                    }
                    catch (e) {
                        console.error(e.message);
                    }
                });
            });


            // setTimeout(() => {
            //     // console.log(server);
            //     console.log("WAIT FOR CON");
            //     server.ws.on('connection', (socket, request) => {
            //         console.log("FOUND CONNECTION");
            //         socket.on('message', (bytes) => {
            //             // console.log("FOUND MESSAGE");
            //             const message = Buffer.from(bytes).toString();
            //             console.log(message);
            //         });
            //     });
            //     setInterval(() => {
            //          server.ws.send({ type: 'editor', data: ["test", "123"] });
            //     }, 1000)
            // }, 1000)
        }
    }
}