Expose SvgCanvas.matrixMultiply() and add starting unit-test framework (QUnit) and first test.

git-svn-id: http://svg-edit.googlecode.com/svn/trunk@1236 eee81c28-f429-11dd-99c0-75d572ba1ddd

editor/svgcanvas.js

@@ -19,11 +19,8 @@ if(window.opera) {
 	window.console.log = function(str) {opera.postError(str);}
 }
 
-
-
 function SvgCanvas(container)
 {
-
 var isOpera = !!window.opera;
 var isWebkit = navigator.userAgent.indexOf("AppleWebKit") != -1;
 
@@ -2168,20 +2165,19 @@ function BatchCommand(text) {
 	// on the SVGMatrix interface.  See https://bugs.webkit.org/show_bug.cgi?id=16062
 	// This function tries to return a SVGMatrix that is the multiplication m1*m2.
 	// We also round to zero when it's near zero
-	var matrixMultiply = function() {
+	this.matrixMultiply = function() {
-		var NEAR_ZERO = 1e-14;
+		var NEAR_ZERO = 1e-14,
-		var multi2 = function(m1, m2) {
+			multi2 = function(m1, m2) {
-			var m = svgroot.createSVGMatrix();
+				var m = svgroot.createSVGMatrix();
-			m.a = m1.a*m2.a + m1.c*m2.b;
+				m.a = m1.a*m2.a + m1.c*m2.b;
-			m.b = m1.b*m2.a + m1.d*m2.b,
+				m.b = m1.b*m2.a + m1.d*m2.b,
-			m.c = m1.a*m2.c + m1.c*m2.d,
+				m.c = m1.a*m2.c + m1.c*m2.d,
-			m.d = m1.b*m2.c + m1.d*m2.d,
+				m.d = m1.b*m2.c + m1.d*m2.d,
-			m.e = m1.a*m2.e + m1.c*m2.f + m1.e,
+				m.e = m1.a*m2.e + m1.c*m2.f + m1.e,
-			m.f = m1.b*m2.e + m1.d*m2.f + m1.f;
+				m.f = m1.b*m2.e + m1.d*m2.f + m1.f;
-			return m;
+				return m;
-		}
+			},
-		
+			args = arguments, i = args.length, m = args[i-1];
-		var args = arguments, i = args.length, m = args[i-1];
 		
 		while(i-- > 1) {
 			var m1 = args[i-1];
@@ -2196,6 +2192,7 @@ function BatchCommand(text) {
 		
 		return m;
 	}
+	var matrixMultiply = this.matrixMultiply;
 	
 	// This returns a single matrix Transform for a given Transform List
 	// (this is the equivalent of SVGTransformList.consolidate() but unlike

test/qunit/qunit.css

@@ -0,0 +1,119 @@
+
+ol#qunit-tests {
+	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
+	margin:0;
+	padding:0;
+	list-style-position:inside;
+
+	font-size: smaller;
+}
+ol#qunit-tests li{
+	padding:0.4em 0.5em 0.4em 2.5em;
+	border-bottom:1px solid #fff;
+	font-size:small;
+	list-style-position:inside;
+}
+ol#qunit-tests li ol{
+	box-shadow: inset 0px 2px 13px #999;
+	-moz-box-shadow: inset 0px 2px 13px #999;
+	-webkit-box-shadow: inset 0px 2px 13px #999;
+	margin-top:0.5em;
+	margin-left:0;
+	padding:0.5em;
+	background-color:#fff;
+	border-radius:15px;
+	-moz-border-radius: 15px;
+	-webkit-border-radius: 15px;
+}
+ol#qunit-tests li li{
+	border-bottom:none;
+	margin:0.5em;
+	background-color:#fff;
+	list-style-position: inside;
+	padding:0.4em 0.5em 0.4em 0.5em;
+}
+
+ol#qunit-tests li li.pass{
+	border-left:26px solid #C6E746;
+	background-color:#fff;
+	color:#5E740B;
+	}
+ol#qunit-tests li li.fail{
+	border-left:26px solid #EE5757;
+	background-color:#fff;
+	color:#710909;
+}
+ol#qunit-tests li.pass{
+	background-color:#D2E0E6;
+	color:#528CE0;
+}
+ol#qunit-tests li.fail{
+	background-color:#EE5757;
+	color:#000;
+}
+ol#qunit-tests li strong {
+	cursor:pointer;
+}
+h1#qunit-header{
+	background-color:#0d3349;
+	margin:0;
+	padding:0.5em 0 0.5em 1em;
+	color:#fff;
+	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
+	border-top-right-radius:15px;
+	border-top-left-radius:15px;
+	-moz-border-radius-topright:15px;
+	-moz-border-radius-topleft:15px;
+	-webkit-border-top-right-radius:15px;
+	-webkit-border-top-left-radius:15px;
+	text-shadow: rgba(0, 0, 0, 0.5) 4px 4px 1px;
+}
+h2#qunit-banner{
+	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
+	height:5px;
+	margin:0;
+	padding:0;
+}
+h2#qunit-banner.qunit-pass{
+	background-color:#C6E746;
+}
+h2#qunit-banner.qunit-fail, #qunit-testrunner-toolbar {
+	background-color:#EE5757;
+}
+#qunit-testrunner-toolbar {
+	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
+	padding:0;
+	/*width:80%;*/
+	padding:0em 0 0.5em 2em;
+	font-size: small;
+}
+h2#qunit-userAgent {
+	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
+	background-color:#2b81af;
+	margin:0;
+	padding:0;
+	color:#fff;
+	font-size: small;
+	padding:0.5em 0 0.5em 2.5em;
+	text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
+}
+p#qunit-testresult{
+	font-family:"Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial;
+	margin:0;
+	font-size: small;
+	color:#2b81af;
+	border-bottom-right-radius:15px;
+	border-bottom-left-radius:15px;
+	-moz-border-radius-bottomright:15px;
+	-moz-border-radius-bottomleft:15px;
+	-webkit-border-bottom-right-radius:15px;
+	-webkit-border-bottom-left-radius:15px;
+	background-color:#D2E0E6;
+	padding:0.5em 0.5em 0.5em 2.5em;
+}
+strong b.fail{
+	color:#710909;
+	}
+strong b.pass{
+	color:#5E740B;
+	}

test/test1.html

@@ -0,0 +1,77 @@
+<html>  
+<head>  
+  <link rel="stylesheet" href="qunit/qunit.css" type="text/css"/>  
+  <script src="../editor/jquery.js"> </script>  
+  <script type="text/javascript" src="../editor/svgicons/jquery.svgicons.js"></script>
+  <script type="text/javascript" src="../editor/locale/locale.js"></script>
+  <script type="text/javascript" src="../editor/svgcanvas.js"></script>
+  <script type="text/javascript" src="qunit/qunit.js"></script>  
+  <script type="text/javascript">
+  $(function() {
+  	// log function
+  	QUnit.log = function(result, message) {
+		if (window.console && window.console.log) {
+			window.console.log(result +' :: '+ message);
+		}
+	};
+	
+	// helper functions
+	var isIdentity = function(m) {
+		return (m.a == 1 && m.b == 0 && m.c == 0 && m.d == 1 && m.e == 0 && m.f == 0);
+	};
+	var matrixString = function(m) {
+		return [m.a,m.b,m.c,m.d,m.e,m.f].join(',');
+	}
+
+  	var svgCanvas = new SvgCanvas(document.getElementById("svgcanvas")),
+  		svgroot = document.getElementById("svgroot"),
+  		svgdoc = svgroot.documentElement;
+
+	module("Basic Module");
+
+	test("Test existence of SvgCanvas object", function() {
+		expect(1);
+		equals(typeof {}, typeof svgCanvas);
+	});
+	
+	module("Transform Module");
+
+	test("Test matrixMultiply", function() {
+		expect(4);
+
+		// translate there and back
+		var tr_1 = svgroot.createSVGMatrix().translate(100,50),
+			tr_2 = svgroot.createSVGMatrix().translate(-90,0),
+			tr_3 = svgroot.createSVGMatrix().translate(-10,-50),
+			I = svgCanvas.matrixMultiply(tr_1,tr_2,tr_3);
+		equals(true, isIdentity(I),
+			"Expected identity matrix when translating there and back, got " + matrixString(I));
+
+		// rotate there and back
+		var rot_there = svgroot.createSVGMatrix().rotate(90),
+			rot_back = svgroot.createSVGMatrix().rotate(-90);
+		I = svgCanvas.matrixMultiply(rot_there, rot_back);
+		equals(true, isIdentity(I),
+			"Expected identity matrix when rotating there and back, got " + matrixString(I));
+
+		// test multiplication with its inverse 
+		I = svgCanvas.matrixMultiply(rot_there, rot_there.inverse());
+		equals(true, isIdentity(I),
+			"Expected identity matrix when multiplying a matrix by its inverse, got " + matrixString(I));
+		I = svgCanvas.matrixMultiply(rot_there.inverse(), rot_there);
+		equals(true, isIdentity(I),
+			"Expected identity matrix when multiplying a matrix by its inverse, got " + matrixString(I));
+	});
+	
+  }); 
+  </script>  
+</head>  
+<body>  
+  <h1 id="qunit-header">Unit Tests for SvgCanvas</h1>
+  <h2 id="qunit-banner"></h2>
+  <h2 id="qunit-userAgent"></h2>
+  <ol id="qunit-tests">
+  </ol>
+  <div id="svgcanvas" style="display:none"></div>
+</body>  
+</html>