BabylonJS / Editor

Community managed visual editor for Babylon.js
http://editor.babylonjs.com/
813 stars 232 forks source link

Import mesh utility method #361

Closed JuliaABurch closed 2 years ago

JuliaABurch commented 2 years ago

I'm working on a plugin that was started before the release of 4.1.0 and tries to add .gltf assets with customized behavior to the current scene open in the editor.

It would be nice to have access to the functionality defined in the MeshHandler's OnDropInPreview method, so that the editor loads the .gltf (with all of the appropriate metadata defined and properties set, etc) as if the user had dragged it from the asset browser.

julien-moreau commented 2 years ago

Hi @JuliaABurch !

Nice catch! I'm opening the API so you'll have access to that helper methods :)

julien-moreau commented 2 years ago

Hi @JuliaABurch ! Editor v4.1.1 has been deployed and plugins can now use that version.

You can now import SceneImporterTools from babylonjs-editor and call SceneImporterTools.Configure giving the required parameters. I'll then take benefits of the functions that where able only

Thanks for that feedback !

Implementation example:

/**
 * Called on the 
 * @param ev defines the reference to the event object.
 * @param pick defines the picking info generated while dropping in the preview.
 */
public async onDropInPreview(_: React.DragEvent<HTMLDivElement>, pick: PickingInfo): Promise<void> {
    const scene = this.props.editor.scene!;

    const extension = extname(this.props.absolutePath).toLowerCase();
    const isGltf = extension === ".glb" || extension === ".gltf";

    const result = await SceneLoader.ImportMeshAsync("", join(dirname(this.props.absolutePath), "/"), basename(this.props.absolutePath), scene);
    scene.stopAllAnimations();

    SceneImporterTools.Configure(this.props.editor.scene!, {
        isGltf,
        result,
        editor: this.props.editor,
        relativePath: this.props.relativePath,
        absolutePath: this.props.absolutePath,
    }).then((n) => {
        if (n instanceof TransformNode) {
            n.position?.copyFrom(pick.pickedPoint!);
        }

        this.props.editor.assets.refresh();
        this.props.editor.assetsBrowser.refresh();
    });

    this.props.editor.graph.refresh();
}