3d in wick?

Help
#1

ever since i made 2d physics in wick, ive wondered if it was possible to do other things with other libraries. would it be possible to use three.js in wick to make something 3d? like a 3d game? that would be really cool, and open up new possibilities for game dev.

1 Like
#2

It might be possible.
From what i remember
someone (pumpkinhead) made a 3D Engine using wick.

#3

Well, it depends on how you do it. For something simple, like doing your own projecting and showing it as PaperJS paths, it can work, but full-on ThreeJS would be very difficult.

For an example, you could do some sort of ‘3D depth’ system which allows for some sort of 3D scene to be projected into 2D paths.

class Point
{
    constructor(x = 0, y = x)
    {
        this.x = x;
        this.y = y;
    }

    add(other)
    {
        this.x += other.x;
        this.y += other.y;
    }

    get inversed()
    {
        return new Point(-this.x, -this.y);
    }

    sub(other)
    {
        this.add(other.inversed);
    }

    get array()
    {
        return [this.x, this.y]
    }
}

class Model
{
    constructor()
    {
        this.points = [];
        this.faces = [];
    }
    
    toPath(camera)
    {
        var p = new paper.CompoundPath;

        for(var face of this.faces)
        {
            var f = new Path;
            
            for(var point of face)
            {
                f.add(camera.to2D(point).array);
            }

            p.addChild(f);
        }

        return f;
    }
}

class Camera
{
    constructor()
    {
        this.pos = new Point;
        this.rotation = new Point;
    }

    to2D(point)
    {
        // TODO: Implement
        return new Point;
    }
}

class Renderer
{
    constructor(cam = new Camera, models = [], origin = new Wick.Clip)
    {
        this.models = models;
        this.camera = cam;
        this.origin = field;
        this.frame = this.origin.parentFrame || new Wick.Frame;
    }

    render()
    {
        var paths = this.models.map(m => m.toPath(this.camera));

        paths.forEach(path => {
            this.frame.addPath(
                new Wick.Path({path})
            );
        })
    }
}