Skip to content
This repository was archived by the owner on Dec 18, 2018. It is now read-only.
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
180 changes: 180 additions & 0 deletions geometry-1/DOMMatrix-003.htm
Original file line number Diff line number Diff line change
@@ -0,0 +1,180 @@
<!DOCTYPE html>
<html>
<head>
<title>Geometry Interfaces: Test DOMMatrix non-mutating methods</title>
<link href="mailto:peter.hall@algomi.com" rel="author" title="Peter Hall">
<link rel="help" href="https://drafts.fxtf.org/geometry-1/#dom-dommatrixreadonly">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
</head>
<body>
<p>Test DOMMatrix non-mutating methods</p>
<div id="log"></div>
<script>
var epsilon = 0.0000000005;

function initialMatrix(){
return {
m11:1, m12:-0.5, m13: 0.5, m14:0,
m21:0.5, m22:2, m23: -0.5, m24:0,
m31:0, m32:0, m33: 1, m34:0,
m41:10, m42:20, m43: 10, m44:1,
is2D: false
};
}

function initialDOMMatrix() {
return DOMMatrixReadOnly.fromMatrix(initialMatrix())
}

function identity() {
return new DOMMatrix(
[1, 0, 0, 0,
0, 1, 0 ,0,
0, 0, 1, 0,
0, 0, 0, 1]);
}

function update(matrix, f) {
f(matrix);
return matrix;
}

test(function() {
var result = initialDOMMatrix().translate(1, 5, 3);
var expected = update(initialMatrix(), function(m) {
m.m41 += 1;
m.m42 += 5;
m.m43 += 3;
});
checkDOMMatrix(result, expected);
},"test translate()");

test(function() {
var result = initialDOMMatrix().scale(2, 5, 3);
var expected = new DOMMatrix(
[2.0, -2.5, 1.5, 0.0,
1.0, 10.0, -1.5, 0.0,
0.0, 0.0, 3.0, 0.0,
20.0, 100.0, 30.0, 1.0 ]);
checkDOMMatrix(result, expected);
},"test scale() without offsets");

test(function() {
var result = initialDOMMatrix().scale(2, 5, 3, 11, 7, 13);
var expected = initialDOMMatrix()
.translate(11, 7, 13)
.scale(2, 5, 3)
.translate(-11, -7, -13);
checkDOMMatrix(result, expected);
},"test scale() with offsets");

test(function() {
var result = initialDOMMatrix().scale3d(7, 5, 2, 3);
var expected = initialDOMMatrix()
.translate(5, 2, 3)
.scale(7, 7, 7)
.translate(-5, -2, -3);
checkDOMMatrix(result, expected);
},"test scale3d()");

test(function() {
var result = initialDOMMatrix().rotate(-90);
var expected = new DOMMatrix(
[ 0.5, 1.0, 0.5, 0.0,
-2.0, 0.5, -0.5, 0.0,
0.0, 0.0, 1.0, 0.0,
-20.0, 10, 10.0, 1.0 ]);
checkDOMMatrix(result, expected);
},"test rotate() 2d");

test(function() {
var result = initialDOMMatrix().rotate(180, 180, 90);
var expected = initialDOMMatrix().rotate(0,0,-90);
checkDOMMatrix(result, expected);
},"test rotate()");

test(function() {
var result = initialDOMMatrix().rotateFromVector(1, 1);
var expected = initialDOMMatrix().rotate(45);
checkDOMMatrix(result, expected);
},"test rotateFromVector()");

test(function() {
var swap = new DOMMatrix([
0,1,0,0,
0,0,1,0,
1,0,0,0,
0,0,0,1]);
var result = swap.multiply(
initialDOMMatrix().rotateAxisAngle(3, 3, 3, 120));
checkDOMMatrix(result, initialMatrix());
},"test rotateAxisAngle() ");

test(function() {
var angleDeg = 75;
var result = initialDOMMatrix().skewX(angleDeg);
var tangent = Math.tan(angleDeg * Math.PI/180);
var skew = new DOMMatrix([
1, 0, 0, 0,
tangent, 1, 0, 0,
0, 0, 1, 0,
0, 0, 0, 1])
var expected = skew.multiply(initialDOMMatrix());
checkDOMMatrix(result, expected);
},"test skewX()");

test(function() {
var angleDeg = 18;
var result = initialDOMMatrix().skewY(angleDeg);
var tangent = Math.tan(angleDeg * Math.PI/180);
var skew = new DOMMatrix([
1, tangent, 0, 0,
0, 1, 0, 0,
0, 0, 1, 0,
0, 0, 0, 1])
var expected = skew.multiply(initialDOMMatrix());
checkDOMMatrix(result, expected);
},"test skewY()");

test(function() {
var result = initialDOMMatrix().multiply(initialDOMMatrix().inverse());
checkDOMMatrix(result, identity());
},"test multiply with inverse is identity");

test(function() {
var result = initialDOMMatrix().flipX();
var expected = initialDOMMatrix().multiply(new DOMMatrix([-1, 0, 0, 1, 0, 0]));
checkDOMMatrix(result, expected);
},"test flipX()");

test(function() {
var result = initialDOMMatrix().flipY();
var expected = initialDOMMatrix().multiply(new DOMMatrix([1, 0, 0, -1, 0, 0]));
checkDOMMatrix(result, expected);
},"test flipY()");


function checkDOMMatrix(m, exp) {
assert_approx_equals(m.m11, exp.m11, epsilon, "Expected value for m11 is " + exp.m11);
assert_approx_equals(m.m12, exp.m12, epsilon, "Expected value for m12 is " + exp.m12);
assert_approx_equals(m.m13, exp.m13, epsilon, "Expected value for m13 is " + exp.m13);
assert_approx_equals(m.m14, exp.m14, epsilon, "Expected value for m14 is " + exp.m14);
assert_approx_equals(m.m21, exp.m21, epsilon, "Expected value for m21 is " + exp.m21);
assert_approx_equals(m.m22, exp.m22, epsilon, "Expected value for m22 is " + exp.m22);
assert_approx_equals(m.m23, exp.m23, epsilon, "Expected value for m23 is " + exp.m23);
assert_approx_equals(m.m24, exp.m24, epsilon, "Expected value for m24 is " + exp.m24);
assert_approx_equals(m.m31, exp.m31, epsilon, "Expected value for m31 is " + exp.m31);
assert_approx_equals(m.m32, exp.m32, epsilon, "Expected value for m32 is " + exp.m32);
assert_approx_equals(m.m33, exp.m33, epsilon, "Expected value for m33 is " + exp.m33);
assert_approx_equals(m.m34, exp.m34, epsilon, "Expected value for m34 is " + exp.m34);
assert_approx_equals(m.m41, exp.m41, epsilon, "Expected value for m41 is " + exp.m41);
assert_approx_equals(m.m42, exp.m42, epsilon, "Expected value for m42 is " + exp.m42);
assert_approx_equals(m.m43, exp.m43, epsilon, "Expected value for m43 is " + exp.m43);
assert_approx_equals(m.m44, exp.m44, epsilon, "Expected value for m44 is " + exp.m44);
assert_equals(m.is2D, exp.is2D, "Expected value for is2D is " + exp.is2D);
}

</script>
</body>
</html>