Make font style CSS on HTML5 dependent on which formats are generated

lime/tools/platforms/HTML5Platform.hx

@@ -164,10 +164,25 @@ class HTML5Platform extends PlatformTarget {
 						PathHelper.mkdir (webfontDirectory);
 						FileHelper.copyFile (asset.sourcePath, fontPath);
 						
+						var originalPath = asset.sourcePath;
 						asset.sourcePath = fontPath;
 						
 						HTML5Helper.generateWebfonts (project, asset);
 						
+						var ext = "." + Path.extension (asset.sourcePath);
+						var source = Path.withoutExtension (asset.sourcePath);
+						var extensions = [ ext, ".eot", ".woff", ".svg" ];
+						
+						for (extension in extensions) {
+							
+							if (!FileSystem.exists (source + extension)) {
+								
+								LogHelper.warn ("Could not generate *" + extension + " web font for \"" + originalPath + "\"");
+								
+							}
+							
+						}
+						
 					}
 					
 					asset.sourcePath = fontPath;
@@ -287,15 +302,54 @@ class HTML5Platform extends PlatformTarget {
 					var ext = "." + Path.extension (asset.sourcePath);
 					var source = Path.withoutExtension (asset.sourcePath);
 					
-					for (extension in [ ext, ".eot", ".woff", ".svg" ]) {
+					var hasFormat = [ false, false, false, false ];
+					var extensions = [ ext, ".eot", ".woff", ".svg" ];
+					var extension;
+					
+					for (i in 0...extensions.length) {
+						
+						extension = extensions[i];
 						
 						if (FileSystem.exists (source + extension)) {
 							
 							FileHelper.copyIfNewer (source + extension, path + extension);
+							hasFormat[i] = true;
 							
-						} else {
+						}
 						
-							LogHelper.warn ("Could not find generated font file \"" + source + extension + "\"");
+					}
+					
+					var shouldEmbedFont = false;
+					
+					for (embedded in hasFormat) {
+						if (embedded) shouldEmbedFont = true;
+					}
+					
+					var embeddedAssets:Array<Dynamic> = cast context.assets;
+					for (embeddedAsset in embeddedAssets) {
+						
+						if (embeddedAsset.type == "font" && embeddedAsset.sourcePath == asset.sourcePath) {
+							
+							if (shouldEmbedFont) {
+								
+								var urls = [];
+								if (hasFormat[1]) urls.push ("url('" + embeddedAsset.targetPath + ".eot?#iefix') format('embedded-opentype')");
+								if (hasFormat[2]) urls.push ("url('" + embeddedAsset.targetPath + ".svg#my-font-family') format('svg')");
+								if (hasFormat[3]) urls.push ("url('" + embeddedAsset.targetPath + ".woff') format('woff')");
+								urls.push ("url('" + embeddedAsset.targetPath + ext + "') format('truetype')");
+								
+								var fontFace = "\t\t@font-face {\n";
+								fontFace += "\t\t\tfont-family: '" + embeddedAsset.fontName + "';\n";
+								if (hasFormat[1]) fontFace += "\t\t\tsrc: url('" + embeddedAsset.targetPath + ".eot');\n";
+								fontFace += "\t\t\tsrc: " + urls.join (",\n\t\t\t") + ";\n";
+								fontFace += "\t\t\tfont-weight: normal;\n";
+								fontFace += "\t\t\tfont-style: normal;\n";
+								fontFace += "\t\t}\n";
+								
+								embeddedAsset.cssFontFace = fontFace;
+								
+							}
+							break;
 							
 						}
 						

templates/html5/template/index.html

@@ -27,17 +27,7 @@
 	<style>
 		html,body { margin: 0; padding: 0; height: 100%; overflow: hidden; }
 		#content { background: #000000; width: ::if (WIN_RESIZABLE)::100%::elseif (WIN_WIDTH > 0)::::WIN_WIDTH::px::else::100%::end::; height: ::if (WIN_RESIZABLE)::100%::elseif (WIN_WIDTH > 0)::::WIN_HEIGHT::px::else::100%::end::; }
-		::foreach assets::::if (type == "font")::
+::foreach assets::::if (type == "font")::::if (cssFontFace)::::cssFontFace::::end::::end::::end::
-		@font-face {
-			font-family: '::fontName::';
-			src: url('::targetPath::.eot');
-			src: url('::targetPath::.eot?#iefix') format('embedded-opentype'),
-			url('::targetPath::.svg#my-font-family') format('svg'),
-			url('::targetPath::.woff') format('woff'),
-			url('::targetPath::.ttf') format('truetype');
-			font-weight: normal;
-			font-style: normal;
-		}::end::::end::
 	</style>
 	
 </head>