How do i scale down a video source?

[MileanCo]

I have some video files that have quite large resolution (from iphone). How do I scale this down? If I scale down the canvas, the video is still the same large size and I can only see a corner of it.

The height and sourceHeight video params only deal with cropping, so that doesnt work.

If I use a transformation like this

        let transformEffect = new etro.effect.Transform({
            matrix: new etro.effect.Transform.Matrix()
                .scale(.5, .5),
        });
        movie.effects.push(transformEffect);

it scales down the whole canvas and my original height is not respected anymore (still same problem).

How do I scale down the source videos so they fit in the canvas? This seems like such a basic task, surprised I dont see any examples about this or maybe im doing something wrong.

[MileanCo]

Okay I think I figured it out using destWidth and destHeight, but man that was painful!

 async add_video(url: string, startTime: number, duration: number) {
        const dimensions = await this.getVideoDimensions(url);
        let scaleRatio = this.canvas.height / dimensions.height ;
        let destWidth = dimensions.width * scaleRatio;
        let destHeight = dimensions.height * scaleRatio;

        const layer1 = new etro.layer.Video({
            startTime: startTime,
            duration: duration,
            source: url,
            destWidth:destWidth,
            destHeight:destHeight,
        });
        this.movie.layers.push(layer1);
    }

[mattstrick]

@MileanCo I was having the same issue, but did not see destWidth and destHeight in the documentation. Your solution was a godsend. Thanks!

[clabe45]

Hey glad it's working now. I didn't document these options because I'm thinking of removing them (#288), but they should be documented regardless (#289)