With the advent of font embedding becoming more available outside of IE (been available in IE since version 6) there’s a need to encode and font-face the fonts for the various browsers to render on the client side. Flash has been embedding fonts silently for years and nothing makes your site look more professional than a good short choice of fonts to embed.

Here’s what you need to add to your htaccess file (on apache servers) to allow the client side to download the files from restricted servers (including other media types commonly referenced in HTML5):

AddType application/vnd.ms-fontobject .eot
AddType application/octet-stream .otf .ttf
AddType application/x-font-ttf .ttf
AddType application/x-woff .woff

(WOFF is the new version of EOT. Chrome and IE 9 RC support WOFF. EOT is supported by IE 6-9 Beta).
(OTF/TTF is supported by many other browsers but definitely not IE).
I’ve come across conflicting definitions for TTF — some indicate the octet-stream and other’s indicate x-font-ttf — I’d gone with the latter on my sites but the former is here in case you don’t get the right results with your system.

//For html audio types, you’ll need to add:

AddType audio/mp4 .mp4 .m4a
AddType audio/mpeg .mp3
AddType audio/ogg .ogg .oga
AddType audio/wav .wav

//For video types:

AddType video/ogg .ogm .ogv .ogg
AddType video/mp4 .mp4 .m4v .f4v
AddType video/webm .webm
AddType video/x-flv .flv

// for SWF (Flash) files
AddType application/x-shockwave-flash .swf
AddType application/pdf .pdf

// archive files
application/zip .zip .7z

Mime types are becoming much more important as the browser wars of 2010 continue into 2011/2012 based on some being more adamant that the mime be properly defined on the server.

Some browsers on micro platforms like the embedded systems may become more dependent on the mime as a way of constricting bandwidth or filtering content on low bandwidth or conservative networks.

Also, more advanced client side applications may behave incorrectly if the mime of an asset is not correctly defined (as3 applications which load .swf content into themselves may not issue the correct eventHandler if the asset is considered an image rather than an application).

Just as REST requires browsers to correctly handle server side status codes, so will mime types properly restrict and filter content based on type.

It doesn’t hurt to define the mime types correctly, but it certainly will become an issue if you don’t configure them for the content that you deliver on your sites.

Here’s a sample html page that works with tracking of Media and SiteCatalyst:

You need to provide your own s_code.js from the admin for the site. ‘s_code.js’ is preconfigured from SiteCatalyst with the parameters for your account and tracking servers and shouldn’t generally be edited manually (just an FYI, you do what you like of course).

This should get you started on setting up an HTML 5 video player and hooking it up to track usage with Omniture SiteCatalyst.

The limitations are many but this will be great for getting ad banners out there onto iPhone type devices like the iPad, iPod and iPhones.

Limitations are:
No script execution – strictly a timeline animation tool
No support of any advance api’s — like camera and custom communication protocols.
No support of filters as yet.
No subpixel rendering

But I’m very impressed in any case.

I’ve attached a .zip with two FlashDevelop projects which uses the FlexSDK to compile. You should really be using FlashDevelop if you’re on a PC — it’s bar none the best IDE for Flash out there. If you’re on a Mac, you can use FlashBuilder which does much of the same thing but is missing a few key features that I really love about FlashDevelop. It’s the only reason I still use a PC over a Mac.

Okay, here’s the run down on how I built out the pieces:

First there’s a project called ‘FontTester.as3proj’ that compiles a simple font library swf. There are two embeds in that file and in the constructor it registers those fonts for use by the static Font class. They should already be registered but what I’m doing is forcing it to redo the action in the parent swf when it loads this swf file.

Compiling this project generates the file ‘FONTLOADER.swf’ in the bin.

The second project (‘FontEmbeddingAS3′) is the shell app that will load the library swf and take all the fonts from that swf and make them available in the shell:

First thing I do is make sure everything is loaded and ready.

Then I load the library swf and wait for it to load.

Next is the great part; in the function fontsloaded I enumerate the fonts that are now registered in the system and reregister the fonts in the current application domain so that they’re available for the current domain to use.

This happens in the very terse line:

Font.registerFont(e.currentTarget.loader.content.loaderInfo.applicationDomain.getDefinition(f.fontName) as Class);

You’ll need to do this in a level that is accessible by the current application domain. If you find that the fonts are not showing up in a specific domain level you’ll need to repeat this process there.

For example, you’ve created a movieclip at some point and are attaching text fields to the movieclip. If your creation happens before your loading and attaching the fonts (always possible in an asyncronyous environment) fonts will fail to be available. Timing is everything so to ensure that the fonts are ready you really should put your font library loading as a first step before your application launches.

Here’s the source:

Find unicode ranges here. I’ve got part of the line commented out for the setting of unicode ranges for example.

For non latin fonts you’ll need to use a non latin font for embedding (arialuni.ttf for example). Luckily in Flash 10 this isn’t an issue any longer but it does come up occationally.

Here’s the FontEmbeddingAS3 source.

Here’s a few links to enjoy:

http://www.fordvehicles.com/transitconnect/ 
(Bill Shippy helped me when the going got tough. Creatively not inspirational but the architecture is good, and lightweight. I like the deferred downloading and integration of some metrics and incremental updates supported — almost the whole interface is driven by xml data).

http://www.fordvehicles.com/sync/ 
(screen savers only — Lee Felarca and Bill Shippy were the developers on the main site)

http://www.clickbooq.com/
(rewire from PHP to Ruby on Rails — the Flex CMS migration was my baby and it was intense. Originally built by three different development groups (myself included), I took all those divergent styles and coalesced them into a functional rewire and repair)

http://www.airgid.com/
(flash development work for a good friend of mine — it was also kind of intense but enjoyable — and with all the papervision sites going down these days I’m happy we curbed the itch to do it in papervision — it would get lost in the crowd of 3D spinning cubes when really it should be a fast, light sales tool only)

I’m working on some cool stuff but for the most part I’m hitting video players like they’re going out of style =).

All of a sudden video players are the new flash photo gallery (seems like all I built for 2004 was photo galleries).

Itching for some heavy application work (which is what I did for five years from 2001 to 2006) I’m aiming to open source a presentation layer app sooner or later. I used to build apps in Visual Studio with a Flash presentation layer for companies like AIAG and Chrysler through a few companies I worked with (Plexcan/Plexus and McGill) and it was really nice to switch out to web based advertising work, which is a little more diverse but also much more prosaic. Before AIR, I used to spec projects in Delphi and C# which integrated the Flash .ocx to leverage custom RAD environments to Flash’s nice integrated development environment. Folks used to ask me ‘why are you using Flash when C# and Delphi have much of the same abilities and more’ — my answer was the same as my answer to AJAX development versus Flash — it’s nice to be able to distribute the functional elements of an application to a control that is best suited to the task — AJAX is crap in general and C# and Delphi allow you to put buttons on a form, but for a presentation layer Flash kicks ass (and Silverlight is also an awesome environment, but there’s not much business call for that yet).

I think I’d spec AIR only now, and do away with C# and Delphi altogether (although, for a stand alone application Delphi still generates a completely Win32 app, which needs no installer or other such nonsense to deploy — great for Enterprise environments where you have no control over the security of the system and deployment to the environment would be a three month interaction with the IT group at the enterprise to deploy, when most users need the product for a day or two. ZINC and Screenweaver used to come in handy too, for single package delivery of a flash app to desktops, but with ZINC 3 it’s still too buggy to use (very poor effort there I have to say MDM), and Screenweaver has become the Ruby of Flash wrapper apps (command lines R US). I’m personally very tired of command line app deployment having worked in a Java environment for four years and having to debug and deploy that mess on a monthly basis.

I’ve been saying to the guys at work that next year, this time we could all be doing Silverlight instead of Flash, or AJAX if that crowd wins the war. But it’s nice to see someone pushing a technology (MS and Silverlight) that is creative with some level of interest — Flash has a bit of an ego these days sadly — great environment, but what built the Flash platform was agreements by MS and Apple to distribute the player. If MS decides one day to only deploy it’s own player (Silverlight showed up recently on my Windows updates as an optional install — Adobe should be scared) and anyone that uses the new update site (which they are currently Beta testing Silverlight enabled) must have Silverlight installed we could be doing SL in a year to two years instead of Flash. Now, also imagine that MSN has the gonads to dictate that if an ad is delivered in SL format it will have reduced deployment costs over a Flash ad, now you’re talking 1/3 of the ad buys going SL instead of Flash. And if that’s the case, I’m going to be a Visual Studio lover in no time, since I’d have an integrated environment, with an excellent coding system and very mature language (mostly based off the same type of syntax as Java / Flash). All they need there is a streamlined delivery to Enterprise where an installer is not necessary for the application to run (for the marketing crowd) and we’re off to the races.

But that’s a fantasy right now. It’s very interesting times to be in this business!

 Some initial things that I thought made my purchase enjoyable:

• Ordered from Dell on Feb 15, delivered on Feb 25 (even with all the custom stuff selected)!
• Nvidia Geforce 8600 GT card rocks!
• 200g 7200 rpm drive is fast!
• 1680×1050 resolution — so glad I got it!
• AverTV card — awesome for those areas that have HDTV signals and you’re on the road!
• Gyroscopic remote — great for those times you want to present and don’t want to sit in front of the laptop but need to use a mouse to show your presentation.
• Touch sensitive buttons for common functions.
• Zero setup time.
• Battery life (2.5 – 3 on the 6 cell).
• Vista rocks!
• Webcam is awesome — follows you around when you move and does an automatic zoom in on your face!

click here for a video sample

Some things that would have made the experience better:

• Loose bezel on top
• Loose frame at barrel hinge
• Don’t like the location of the expresscard slot
• Only three usb ports
• Getting used to Vista’s security makes me feel stupid, but I’m very happy that it’s there to protect the system from instability.
• Don’t care for the rabbit ears for the AverTV card — could have come up with something more elegant than that!

I’ll post some shots of the packaging and system at a future point — I had some projects I needed to do right away once I got the system that threw me for a loop.

Overall, system rocks.

Oh, and if you’re Canadian like me, you can enter to win one for yourself here:

 Really there’s nothing specifically wrong with how the classes work, it’s just the implementation using temporary vars that GC will clean up before the request is complete and the events will never fire.

http://exanimo.com/actionscript/never-use-tween-or-urlloader/

Neither site knew of the other’s development (I know because I wrote Kevin’s site code), but with being released within a week of each other they show that creatively there’s some semblance of a universal mind at work =). Needless to say, I enjoy both sites.

 Turns out either getting spyware or removing spyware or even removing spyware shield programs can screw up your winsock chain.

Anyway, being as I am, I fixed it by using this app (XP only, no version for Vista that I could find): Winsock XP Fix

There isn’t any official page (option explicit was the author, but his site is no longer up), but a ton of sites provide the download and you should keep this one handy on a floppy or USB key.

What does it fix? If you’ve ever gotten “cannot connect to the internet” and you know your router is working fine (especially for other systems on your network) then you’ve been ‘fixed’ by removing spyware that then will leave your system inoperable for browsing.

 There’s some other stuff I came across at the same time, where I couldn’t get my Windows Firewall to start because of a bunch of issues related to the services being modified on the system by whichever program thought it was a good idea.

 First there are three important settings for your windows services, which keep the house of cards standing:

The login, enable/disabled settings, and whether the service starts automatically, manually or is disabled.

Microsoft has a listing of the primary services which will get you back to showroom specs pretty quick if some nice piece of software decided that your services were not set up correctly.

Microsoft Default Windows settings

 I came across the most excellent site for infomation on windows services and their settings at blackviper. This is a great site.

 I was still having problems after going through all this, but finally got everything working by following these final steps.

Also, running a last:

netsh int ip reset c:\resetlog.txt

Seems to clinch the deal. Whew!

 Information on parameters used by TIDY are noted here. The default values of the cleanup never really worked with how I used the app so I’ve made modifications to the html.properties file in the Scintilla Text Editor folder.

command.name.1.$(file.patterns.xml)=Save and Indent XML
command.1.$(file.patterns.xml)=tidy -xml -indent -modify “$(FilePath)”
command.is.filter.1.$(file.patterns.xml)=1
command.save.before.1.$(file.patterns.xml)=1

 TIDY Quick Reference