fix JS font embed, comment samples 2D

.gitignore

@@ -2,4 +2,5 @@
 *.swf
 *.js
 *.js.map
-/bin
+/bin
+/samples/res/.tmp

hxd/res/Embed.hx

@@ -1,6 +1,7 @@
 package hxd.res;
 import haxe.macro.Context;
 
+#if js @:keep #end
 class Embed {
 
 	#if macro
@@ -18,6 +19,10 @@ class Embed {
 	}
 
 	public static function doEmbedFont( name : String, file : String, chars : String ) {
+
+		var m = Context.getLocalClass().get().module;
+		Context.registerModuleDependency(m, file);
+
 		if( Context.defined("flash") || Context.defined("openfl") ) {
 			if( chars == null ) // convert char list to char range
 				chars = Charset.DEFAULT_CHARS.split("-").join("\\-");
@@ -36,6 +41,7 @@ class Embed {
 				isExtern : false,
 				fields : [],
 			});
+			return macro new hxd._res.$name().fontName;
 		} else if( Context.defined("js") ) {
 			// TODO : we might want to extract the chars from the TTF font
 			var pos = Context.currentPos();
@@ -61,10 +67,11 @@ class Embed {
 					}
 				],
 			});
+
+			return { expr : EConst(CString(name)), pos : pos };
+
 		} else
 			throw "Font embedding not available for this platform";
-		var m = Context.getLocalClass().get().module;
-		Context.registerModuleDependency(m, file);
 	}
 
 	#end
@@ -92,8 +99,7 @@ class Embed {
 			return macro null;
 		}
 		var safeName = "R_"+~/[^A-Za-z0-9_]+/g.replace(file, "_");
-		doEmbedFont(safeName, path, chars);
-		return macro new hxd._res.$safeName().fontName;
+		return doEmbedFont(safeName, path, chars);
 	}
 
 	#if js

samples/2d/Main.hx

@@ -1,44 +1,82 @@
 class Main extends hxd.App {
 
 	var spr : h2d.Sprite;
+	var tf : h2d.Text;
 
 	override function init() {
-		var tile = hxd.Res.hxlogo.toTile();
+
+		// creates a new sprite and put it at the center of the sceen
 		spr = new h2d.Sprite(s2d);
-		spr.x = s2d.width >> 1;
-		spr.y = s2d.height >> 1;
+		spr.x = Std.int(s2d.width / 2);
+		spr.y = Std.int(s2d.height / 2);
+
+		// load the haxe logo png into a tile
+		var tile = hxd.Res.hxlogo.toTile();
+
+		// change its pivot so it is centered
+		tile = tile.center();
 
 		for( i in 0...15 ) {
+			// creates a bitmap into the sprite
 			var bmp = new h2d.Bitmap(tile, spr);
-			bmp.x = Math.cos(i * Math.PI / 8) * 100 - (tile.width>>1);
-			bmp.y = Math.sin(i * Math.PI / 8) * 100 - (tile.height>>1);
-			bmp.alpha = 0.5;
+
+			// move its position
+			bmp.x = Math.cos(i * Math.PI / 8) * 100;
+			bmp.y = Math.sin(i * Math.PI / 8) * 100;
+
+			// makes it transparent by 10%
+			bmp.alpha = 0.1;
+
+			// makes the colors adds to the background
+			bmp.blendMode = Add;
 		}
 
-		//var font = hxd.Res.CustomFont.build(32, { antiAliasing : true } );
-		var font = hxd.res.FontBuilder.getFont("Arial", 32);
+		// load a true type font, can be not very high quality
+		var font = hxd.Res.trueTypeFont.build(64);
 
-		var tf = new h2d.Text(font, s2d);
+		// creates a text display with the given font
+		tf = new h2d.Text(font, s2d);
+
+		// set the text color
 		tf.textColor = 0xFFFFFF;
-		tf.dropShadow = { dx : 0.5, dy : 0.5, color : 0xFF0000, alpha : 0.8 };
+
+		// adds a red shadow
+		tf.dropShadow = { dx : 3, dy : 3, color : 0xFF0000, alpha : 0.8 };
+
+		// set the text color
 		tf.text = "Héllò h2d !";
+
+		// set the text position
 		tf.x = 20;
-		tf.y = 450;
-		tf.scale(4);
+		tf.y = s2d.height - 80;
 
-		//var font = hxd.Res.Minecraftia.build(16,{ antiAliasing : false });
-		var font = hxd.res.FontBuilder.getFont("Arial", 16);
+		// load a bitmap font Resource
+		var font = hxd.Res.customFont.toFont();
 
+		// creates another text field with this font
 		var tf = new h2d.Text(font, s2d);
 		tf.textColor = 0xFFFFFF;
 		tf.dropShadow = { dx : 0.5, dy : 0.5, color : 0xFF0000, alpha : 0.8 };
 		tf.text = "Héllò h2d !";
 
+		tf.y = 20;
 		tf.x = 20;
 		tf.scale(7);
 	}
 
+	// if we the window has been resized
+	override function onResize() {
+
+		// center our sprite
+		spr.x = Std.int(s2d.width / 2);
+		spr.y = Std.int(s2d.height / 2);
+
+		// move our text up/down accordingly
+		tf.y = s2d.height - 80;
+	}
+
 	override function update(dt:Float) {
+		// rotate our sprite every frame
 		spr.rotation += 0.01 * dt;
 	}
 

samples/res/customFont.fnt

@@ -0,0 +1,181 @@
+<?xml version="1.0" encoding="utf-8"?>
+<Font size="12" family="8-bit Operator+ 8" height="14" style="Regular">
+ <Char width="4" offset="0 8" rect="1 8 0 0" code=" "/>
+ <Char width="3" offset="1 1" rect="2 1 1 7" code="!"/>
+ <Char width="7" offset="1 1" rect="4 1 5 3" code="&quot;"/>
+ <Char width="8" offset="1 2" rect="10 2 6 6" code="#"/>
+ <Char width="7" offset="1 1" rect="17 1 5 7" code="$"/>
+ <Char width="8" offset="1 2" rect="23 2 6 6" code="%"/>
+ <Char width="7" offset="1 1" rect="30 1 5 7" code="&amp;"/>
+ <Char width="4" offset="1 1" rect="36 1 2 3" code="'"/>
+ <Char width="5" offset="1 1" rect="39 1 3 7" code="("/>
+ <Char width="5" offset="1 1" rect="43 1 3 7" code=")"/>
+ <Char width="9" offset="1 2" rect="47 2 7 5" code="*"/>
+ <Char width="7" offset="1 2" rect="55 2 5 5" code="+"/>
+ <Char width="4" offset="1 6" rect="61 6 2 3" code=","/>
+ <Char width="6" offset="1 4" rect="64 4 4 1" code="-"/>
+ <Char width="3" offset="1 7" rect="69 7 1 1" code="."/>
+ <Char width="6" offset="1 1" rect="71 1 4 8" code="/"/>
+ <Char width="7" offset="1 1" rect="76 1 5 7" code="0"/>
+ <Char width="5" offset="1 1" rect="82 1 3 7" code="1"/>
+ <Char width="7" offset="1 1" rect="86 1 5 7" code="2"/>
+ <Char width="7" offset="1 1" rect="92 1 5 7" code="3"/>
+ <Char width="7" offset="1 1" rect="98 1 5 7" code="4"/>
+ <Char width="7" offset="1 1" rect="104 1 5 7" code="5"/>
+ <Char width="7" offset="1 1" rect="110 1 5 7" code="6"/>
+ <Char width="7" offset="0 1" rect="116 1 6 7" code="7"/>
+ <Char width="7" offset="1 1" rect="1 10 5 7" code="8"/>
+ <Char width="7" offset="1 1" rect="7 10 5 7" code="9"/>
+ <Char width="3" offset="1 3" rect="13 12 1 5" code=":"/>
+ <Char width="4" offset="1 3" rect="15 12 2 6" code=";"/>
+ <Char width="6" offset="1 1" rect="18 10 4 7" code="&lt;"/>
+ <Char width="7" offset="1 3" rect="23 12 5 3" code="="/>
+ <Char width="6" offset="1 1" rect="29 10 4 7" code=">"/>
+ <Char width="7" offset="1 1" rect="34 10 5 7" code="?"/>
+ <Char width="8" offset="1 1" rect="40 10 6 8" code="@"/>
+ <Char width="7" offset="1 1" rect="47 10 5 7" code="A"/>
+ <Char width="7" offset="1 1" rect="53 10 5 7" code="B"/>
+ <Char width="7" offset="1 1" rect="59 10 5 7" code="C"/>
+ <Char width="7" offset="1 1" rect="65 10 5 7" code="D"/>
+ <Char width="7" offset="1 1" rect="71 10 6 7" code="E"/>
+ <Char width="7" offset="1 1" rect="78 10 6 7" code="F"/>
+ <Char width="7" offset="1 1" rect="85 10 5 7" code="G"/>
+ <Char width="7" offset="1 1" rect="91 10 5 7" code="H"/>
+ <Char width="5" offset="1 1" rect="97 10 3 7" code="I"/>
+ <Char width="7" offset="1 1" rect="101 10 5 7" code="J"/>
+ <Char width="7" offset="1 1" rect="107 10 5 7" code="K"/>
+ <Char width="7" offset="1 1" rect="113 10 6 7" code="L"/>
+ <Char width="9" offset="1 1" rect="1 19 7 7" code="M"/>
+ <Char width="7" offset="1 1" rect="9 19 5 7" code="N"/>
+ <Char width="7" offset="1 1" rect="15 19 5 7" code="O"/>
+ <Char width="7" offset="1 1" rect="21 19 5 7" code="P"/>
+ <Char width="7" offset="1 1" rect="27 19 6 8" code="Q"/>
+ <Char width="7" offset="1 1" rect="34 19 5 7" code="R"/>
+ <Char width="7" offset="1 1" rect="40 19 5 7" code="S"/>
+ <Char width="7" offset="1 1" rect="46 19 5 7" code="T"/>
+ <Char width="7" offset="1 1" rect="52 19 5 7" code="U"/>
+ <Char width="7" offset="1 1" rect="58 19 5 7" code="V"/>
+ <Char width="9" offset="1 1" rect="64 19 7 7" code="W"/>
+ <Char width="7" offset="1 1" rect="72 19 5 7" code="X"/>
+ <Char width="7" offset="1 1" rect="78 19 5 7" code="Y"/>
+ <Char width="7" offset="1 1" rect="84 19 5 7" code="Z"/>
+ <Char width="5" offset="1 1" rect="90 19 4 7" code="["/>
+ <Char width="6" offset="1 1" rect="95 19 4 8" code="\"/>
+ <Char width="5" offset="0 1" rect="100 19 4 7" code="]"/>
+ <Char width="7" offset="1 1" rect="105 19 5 3" code="^"/>
+ <Char width="4" offset="0 8" rect="111 26 4 1" code="_"/>
+ <Char width="4" offset="1 1" rect="116 19 2 2" code="`"/>
+ <Char width="7" offset="1 3" rect="119 21 5 5" code="a"/>
+ <Char width="7" offset="1 1" rect="1 28 5 7" code="b"/>
+ <Char width="7" offset="1 3" rect="7 30 5 5" code="c"/>
+ <Char width="7" offset="1 1" rect="13 28 5 7" code="d"/>
+ <Char width="7" offset="1 3" rect="19 30 5 5" code="e"/>
+ <Char width="6" offset="1 1" rect="25 28 4 7" code="f"/>
+ <Char width="7" offset="1 3" rect="30 30 5 6" code="g"/>
+ <Char width="7" offset="1 1" rect="36 28 5 7" code="h"/>
+ <Char width="5" offset="1 1" rect="42 28 3 7" code="i"/>
+ <Char width="7" offset="1 1" rect="46 28 5 8" code="j"/>
+ <Char width="7" offset="1 1" rect="52 28 5 7" code="k"/>
+ <Char width="5" offset="1 1" rect="58 28 3 7" code="l"/>
+ <Char width="9" offset="1 3" rect="62 30 7 5" code="m"/>
+ <Char width="7" offset="1 3" rect="70 30 5 5" code="n"/>
+ <Char width="7" offset="1 3" rect="76 30 5 5" code="o"/>
+ <Char width="7" offset="1 3" rect="82 30 5 6" code="p"/>
+ <Char width="7" offset="1 3" rect="88 30 5 6" code="q"/>
+ <Char width="7" offset="1 3" rect="94 30 5 5" code="r"/>
+ <Char width="7" offset="1 3" rect="100 30 5 5" code="s"/>
+ <Char width="6" offset="1 1" rect="106 28 4 7" code="t"/>
+ <Char width="7" offset="1 3" rect="111 30 5 5" code="u"/>
+ <Char width="7" offset="1 3" rect="117 30 5 5" code="v"/>
+ <Char width="9" offset="1 3" rect="1 39 7 5" code="w"/>
+ <Char width="7" offset="1 3" rect="9 39 5 5" code="x"/>
+ <Char width="7" offset="1 3" rect="15 39 5 6" code="y"/>
+ <Char width="7" offset="1 3" rect="21 39 5 5" code="z"/>
+ <Char width="7" offset="1 1" rect="27 37 5 7" code="{"/>
+ <Char width="3" offset="1 1" rect="33 37 1 7" code="|"/>
+ <Char width="7" offset="1 1" rect="35 37 5 7" code="}"/>
+ <Char width="8" offset="1 3" rect="41 39 6 2" code="~"/>
+ <Char width="3" offset="1 2" rect="48 38 1 7" code="¡"/>
+ <Char width="7" offset="1 1" rect="50 37 5 7" code="¢"/>
+ <Char width="8" offset="1 1" rect="56 37 6 7" code="£"/>
+ <Char width="7" offset="1 1" rect="63 37 5 8" code="¥"/>
+ <Char width="3" offset="1 1" rect="69 37 1 7" code="¦"/>
+ <Char width="6" offset="1 1" rect="71 37 4 1" code="¨"/>
+ <Char width="10" offset="1 1" rect="76 37 8 8" code="©"/>
+ <Char width="8" offset="1 2" rect="85 38 6 5" code="«"/>
+ <Char width="7" offset="0 4" rect="92 40 6 3" code="¬"/>
+ <Char width="10" offset="1 1" rect="99 37 8 8" code="®"/>
+ <Char width="6" offset="1 1" rect="108 37 4 4" code="°"/>
+ <Char width="7" offset="1 1" rect="113 37 5 7" code="±"/>
+ <Char width="4" offset="1 1" rect="119 37 2 2" code="´"/>
+ <Char width="7" offset="1 3" rect="1 48 5 6" code="µ"/>
+ <Char width="8" offset="1 1" rect="7 46 6 7" code="¶"/>
+ <Char width="3" offset="1 4" rect="14 49 1 1" code="·"/>
+ <Char width="6" offset="1 6" rect="16 51 4 3" code="¸"/>
+ <Char width="8" offset="1 2" rect="21 47 6 5" code="»"/>
+ <Char width="7" offset="1 2" rect="28 47 5 7" code="¿"/>
+ <Char width="7" offset="1 1" rect="34 46 5 7" code="À"/>
+ <Char width="7" offset="1 1" rect="40 46 5 7" code="Á"/>
+ <Char width="7" offset="1 1" rect="46 46 5 7" code="Â"/>
+ <Char width="7" offset="1 1" rect="52 46 6 7" code="Ã"/>
+ <Char width="7" offset="1 1" rect="59 46 5 7" code="Ä"/>
+ <Char width="7" offset="1 1" rect="65 46 5 7" code="Å"/>
+ <Char width="9" offset="1 1" rect="71 46 7 7" code="Æ"/>
+ <Char width="7" offset="1 1" rect="79 46 5 8" code="Ç"/>
+ <Char width="7" offset="1 1" rect="85 46 6 7" code="È"/>
+ <Char width="7" offset="1 -1" rect="92 44 6 9" code="É"/>
+ <Char width="7" offset="1 1" rect="99 46 6 7" code="Ê"/>
+ <Char width="7" offset="1 1" rect="106 46 5 7" code="Ë"/>
+ <Char width="5" offset="1 1" rect="112 46 3 7" code="Ì"/>
+ <Char width="5" offset="1 1" rect="116 46 3 7" code="Í"/>
+ <Char width="5" offset="0 1" rect="120 46 5 7" code="Î"/>
+ <Char width="5" offset="0 1" rect="1 55 5 7" code="Ï"/>
+ <Char width="7" offset="0 1" rect="7 55 6 7" code="Ð"/>
+ <Char width="7" offset="1 1" rect="14 55 6 7" code="Ñ"/>
+ <Char width="7" offset="1 1" rect="21 55 5 7" code="Ò"/>
+ <Char width="7" offset="1 1" rect="27 55 5 7" code="Ó"/>
+ <Char width="7" offset="1 1" rect="33 55 5 7" code="Ô"/>
+ <Char width="7" offset="1 1" rect="39 55 6 7" code="Õ"/>
+ <Char width="7" offset="1 1" rect="46 55 5 7" code="Ö"/>
+ <Char width="7" offset="1 2" rect="52 56 5 5" code="×"/>
+ <Char width="7" offset="0 1" rect="58 55 7 7" code="Ø"/>
+ <Char width="7" offset="1 1" rect="66 55 5 7" code="Ù"/>
+ <Char width="7" offset="1 1" rect="72 55 5 7" code="Ú"/>
+ <Char width="7" offset="1 1" rect="78 55 5 7" code="Û"/>
+ <Char width="7" offset="1 1" rect="84 55 5 7" code="Ü"/>
+ <Char width="7" offset="1 1" rect="90 55 5 7" code="Ý"/>
+ <Char width="7" offset="1 1" rect="96 55 5 7" code="Þ"/>
+ <Char width="7" offset="1 1" rect="102 55 5 7" code="ß"/>
+ <Char width="7" offset="1 1" rect="108 55 5 7" code="à"/>
+ <Char width="7" offset="1 1" rect="114 55 5 7" code="á"/>
+ <Char width="7" offset="1 1" rect="120 55 5 7" code="â"/>
+ <Char width="7" offset="1 1" rect="1 63 6 7" code="ã"/>
+ <Char width="7" offset="1 1" rect="8 63 5 7" code="ä"/>
+ <Char width="7" offset="1 1" rect="14 63 5 7" code="å"/>
+ <Char width="9" offset="1 3" rect="20 65 7 5" code="æ"/>
+ <Char width="7" offset="0 3" rect="28 64 6 7" code="ç"/>
+ <Char width="7" offset="1 1" rect="35 63 5 7" code="è"/>
+ <Char width="7" offset="1 1" rect="41 63 5 7" code="é"/>
+ <Char width="7" offset="1 1" rect="47 63 5 7" code="ê"/>
+ <Char width="7" offset="1 1" rect="53 63 5 7" code="ë"/>
+ <Char width="5" offset="1 1" rect="59 63 3 7" code="ì"/>
+ <Char width="5" offset="1 1" rect="63 63 3 7" code="í"/>
+ <Char width="5" offset="0 1" rect="67 63 5 7" code="î"/>
+ <Char width="5" offset="0 1" rect="73 63 5 7" code="ï"/>
+ <Char width="7" offset="1 1" rect="79 63 6 7" code="ð"/>
+ <Char width="7" offset="1 1" rect="86 63 6 7" code="ñ"/>
+ <Char width="7" offset="1 1" rect="93 63 5 7" code="ò"/>
+ <Char width="7" offset="1 1" rect="99 63 5 7" code="ó"/>
+ <Char width="7" offset="1 1" rect="105 63 5 7" code="ô"/>
+ <Char width="7" offset="1 1" rect="111 63 6 7" code="õ"/>
+ <Char width="7" offset="1 1" rect="118 63 5 7" code="ö"/>
+ <Char width="7" offset="1 2" rect="1 73 5 5" code="÷"/>
+ <Char width="7" offset="1 2" rect="7 73 5 7" code="ø"/>
+ <Char width="7" offset="1 1" rect="13 72 5 7" code="ù"/>
+ <Char width="7" offset="1 1" rect="19 72 5 7" code="ú"/>
+ <Char width="7" offset="1 1" rect="25 72 5 7" code="û"/>
+ <Char width="7" offset="1 1" rect="31 72 5 7" code="ü"/>
+ <Char width="7" offset="1 1" rect="37 72 5 8" code="ý"/>
+ <Char width="7" offset="1 1" rect="43 72 5 8" code="þ"/>
+ <Char width="7" offset="1 1" rect="49 72 5 8" code="ÿ"/>
+</Font>