- this is the next major iteration of ART!

 - SVG/VML based instead of Canvas/VML
 - supports groups, dynamic transformations, dom operations with SVG/VML real elements via ART methods
 - real svg paths from any drawing application, including Illustrator, automatically converted to VML
 - and much more!

Author: kamicane

Fonts/MgOpen.Moderna.Bold.js renamed to Fonts/Moderna.Bold.js

@@ -7,73 +7,74 @@ description: Fonts for ART, implements code from [Cufón](http://cufon.shoqolate
 
 authors: [Simo Kinnunen](http://twitter.com/sorccu), ART adaptation by [Valerio Proietti](http://mad4milk.net/)
 
-provides: [ART:text, ART.Font]
+provides: ART.Font
 
-requires: [ART.Canvas, ART.VML]
+requires: ART.Shape
 
 ...
 */
 
-// stub
-
-ART.Font = function(font){
-	return font;
-};
-
 (function(){
 
 var fonts = {};
 
-ART.defineFont = function(name, font){
-	fonts[name] = new ART.Font(font);
-};
-
-ART.lookupFont = function(name){
-	return fonts[name];
-};
-
 ART.registerFont = function(font){
-	var face = font.face, name = face['font-family'].toLowerCase().split(' ');
-	if (face['font-weight'] > 400) name.push('bold');
-	if (face['font-stretch'] == 'oblique') name.push('italic');
-	ART.defineFont(name.join('-'), font);
+	var face = font.face, name = face['font-family'];
+	if (!fonts[name]) fonts[name] = {};
+	var currentFont = fonts[name];
+	var isBold = (face['font-weight'] > 400), isItalic = (face['font-stretch'] == 'oblique');
+	if (isBold && isItalic) currentFont.boldItalic = font;
+	else if (isBold) currentFont.bold = font;
+	else if (isItalic) currentFont.italic = font;
+	else currentFont.normal = font;
+	return this;
 };
 
-var path = function(path, s, self){
-	var X = 0, Y = 0;
+var VMLToSVG = function(path, s, x, y){
+	var end = '';
 	var regexp = /([mrvxe])([^a-z]*)/g, match;
 	while ((match = regexp.exec(path))){
 		var c = match[2].split(',');
 		switch (match[1]){
-			case 'v':
-				self.bezierTo({x: X + s * ~~c[0], y: Y + s * ~~c[1]}, {x: X + s * ~~c[2], y: Y + s * ~~c[3]}, {x: X += s * ~~c[4], y: Y += s * ~~c[5]});
-				break;
-			case 'r': self.lineTo({x: X += s * ~~c[0], y: Y += s * ~~c[1]}); break;
-			case 'm': self.moveTo({x: X = s * ~~c[0], y: Y = s * ~~c[1]}); break;
-			case 'x': self.join(); break;
-			case 'e': return;
+			case 'v': end += 'c ' + (s * c[0]) + ',' + (s * c[1]) + ',' + (s * c[2]) + ',' + (s * c[3]) + ',' + (s * c[4]) + ',' + (s * c[5]); break;
+			case 'r': end += 'l ' + (s * c[0]) + ',' + (s * c[1]); break;
+			case 'm': end += 'M ' + (x + (s * c[0])) + ',' + (y + (s * c[1])); break;
+			case 'x': end += 'z'; break;
 		}
 	}
+	
+	return end;
 };
 
-ART.implement({'text': function(font, size, text){
-	if (typeof font == 'string') font = fonts[font];
-	if (!font) return new Error('The specified font has not been found.');
-
-	this.save();
-	size = size / font.face['units-per-em'];
-	// Temporary "relative" fix shifting the whole layer by the pointer, since the pointer is lost with path. Should not matter since it's later restored.
-	this.shift({x: this.pointer.x, y: this.pointer.y + Math.round(size * font.face.ascent)});
-	var width = 0;
-	for (var i = 0, l = text.length; i < l; ++i){
-		var glyph = font.glyphs[text.charAt(i)] || font.glyphs[' '];
-		if (glyph.d) path('m' + glyph.d + 'x', size, this);
-		var w = size * (glyph.w || font.w);
-		this.shift({x: w, y: 0});
-		width += w;
+ART.Font = new Class({
+	
+	Extends: ART.Shape,
+	
+	initialize: function(font, variant, text, size){
+		if (typeof font == 'string') font = fonts[font][(variant || 'normal').camelCase()];
+		if (!font) throw new Error('The specified font has not been found.');
+		this.font = font;
+		
+		this.parent();
+		if (text != null && size != null) this.draw(text, size);
+	},
+	
+	draw: function(text, size){
+		var font = this.font;
+		size = size / font.face['units-per-em'];
+		
+		var width = 0, height = size * font.face.ascent, path = '';
+
+		for (var i = 0, l = text.length; i < l; ++i){
+			var glyph = font.glyphs[text.charAt(i)] || font.glyphs[' '];
+			var w = size * (glyph.w || font.w);
+			if (glyph.d) path += VMLToSVG('m' + glyph.d + 'x', size, width, height);
+			width += w;
+		}
+		
+		return this.parent(path);
 	}
-	this.restore();
-	return {x: width, y: size * (font.face.ascent - font.face.descent)};
-}});
+
+});
 
 })();

Fonts/MgOpen.Moderna.js renamed to Fonts/Moderna.js

@@ -0,0 +1,63 @@
+/*
+---
+
+name: ART.Path
+
+description: Class to generate a valid SVG path using method calls.
+
+authors: [Valerio Proietti](http://mad4milk.net)
+
+provides: ART.Path
+
+requires: ART
+
+...
+*/
+
+ART.Path = new Class({
+	
+	initialize: function(){
+		this.clear();
+	},
+	
+	clear: function(){
+		this.path = [];
+		this.x = 0;
+		this.y = 0;
+		return this;
+	},
+	
+	move: function(x, y){
+		this.path.push('m', x, y);
+		return this;
+	},
+	
+	line: function(x, y){
+		this.x = x; this.y = y;
+		this.path.push('l', x, y);
+		return this;
+	},
+	
+	close: function(){
+		this.path.push('z');
+		return this;
+	},
+	
+	bezier: function(c1x, c1y, c2x, c2y, ex, ey){
+		this.path.push('c', c1x, c1y, c2x, c2y, ex, ey);
+		return this;
+	},
+	
+	arcLeft: function(x, y){
+		return this.bezier(0, y * Math.kappa, x - (x * Math.kappa), y, x, y);
+	},
+	
+	arcRight: function(x, y){
+		return this.bezier(x * Math.kappa, 0, x, y - (y * Math.kappa), x, y);
+	}
+	
+});
+
+ART.Path.prototype.toString = function(){
+	return this.path.join(' ');
+};