• new drawing mechanisms: curve interpolation and curve transformation.
  • new clothing template: dress shirts

Dress Shirt Template

Chained transformations and dress shirt

The new dress shirt template comes with many drawing parts and parameters. Also demonstrated in the GIF is the new ability to chain transformations. Previously transformations were asynchronous processes that returned immediately, but now they return promises that can be chained together via .then(), such as shown below:

function drawAndExport() {
    da.draw(window.canvasGroup, PC, window.config).then(function (exports) {
        window.ex = exports;
    });
}

var transformation = da.createTransformation(myClothing, drawAndExport, {
    topParted: 8,
    botParted: 8
});
var breastEnlarge = da.createTransformation(PC, drawAndExport, {
    basedim: {
        breastSize: 20
    }
});
var breastShrink = da.createTransformation(PC, drawAndExport, {
    basedim: {
        breastSize: -20
    }
});

// sequential transformations
da.transformAndShow(transformation, 3000)
.then(da.transformAndShow.bind(null, breastEnlarge, 2500))
.then(da.transformAndShow.bind(null, breastShrink, 2500));

Note that transformations can apply to any object, as shown by the first transformation which is on the clothing rather than the PC.

Curve Interpolation

The new method interpolateCurve gives back a point on a curve given partial information about the point (either its x or y). The demo below shows this in action. Click and hold somewhere on the canvas below.

Curve Transformation

The new method transformCurve gives back an intermediate curve when given a starting and ending curve. Click and hold somewhere on the canvas below.