rel=me » Flash

Font detection with Javascript and Flash

admin — Thu, 26 Jun 2008 22:08:00 +0000

I was playing around with jquery and I wanted to see if it was possible to generate a cheat sheet of all the fonts on your system. Its also a good run through of how to load a SWF with a callback.

View a demo

The steps I used to generate this are:

Load SWF
Javascript calls to Actionscript fonts() method via ExternalInterface
Get the list of system fonts in Flash via Font.enumerateFonts(true)
Curse Flash for giving you a list of font names, where half of them are garbage.
For each font name, in javascript, create a test which adds a DOM element temporarily with a fallback font family set. For example, font-family: 'Apple Garamond Pro', 'Times New Roman';, where Times New Roman is your fallback.
Then check the actual width (via offsetWidth). If it does not match the offsetWidth of the fallback font, then we know it rendered ok. (The original idea is from http://www.lalit.org/lab/javascript-css-font-detect)

The only caveat is, if the actual font width and the fallback font width do match, then you would have a false negative. So its not bulletproof.

The actionscript to enumerate the fonts and call back out is pretty simple:

Expose the method in the constructor using ExternalInterface:

FontList.as

I used swfobject to load the SWF. Also be sure to enable allowScriptAccess.

The javascript to test the fonts is at: font-detect.js

You can use it by including:

In the end, I don’t think this is useful in practice, but I thought I would share anyway. Its on github too.

Updated: Now uses call straight to actionscript, doesn’t marshall JSON first so its much faster, and other refactoring.

Memory usage during file upload in AIR

admin — Sat, 29 Mar 2008 00:47:00 +0000

Uploading files in AIR is a little bit problematic these days.

Here is the code:

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" showStatusBar="false" 
  initialize="onInitialize(event)">  
 
  <mx:Script>
    [CDATA[
 
      import com.rwnage.s3.service.S3PostOptions;
      import flash.events.Event;
 
      public function onInitialize(event:Event):void {
        var accessKey:String = "0RXZ3R7Y034PA8VGNWR2";
        var bucketName:String = "rwnage_test";
        var objectName:String = "test_file";
        var contentType:String = "application/octet-stream";
        var secretAccessKey:String = "[PUT YOUR SECRET ACCESS KEY HERE]";      
 
        var postOptions:S3PostOptions = new S3PostOptions(bucketName, objectName, accessKey, 
          { contentType: contentType });
 
        var policy:String = postOptions.getPolicy();
        var signature:String = postOptions.getSignature(secretAccessKey, policy);
 
        html.htmlText = ' \
          '.s3.amazonaws.com/" method="post" enctype="multipart/form-data"> \
            Key to upload: '" />
 \
            Content-Type: contentType + '" />
 \
            '" /> \
            '" /> \
            '" /> \
            File:  
 \
             \
             \
          ';                                                     
      }
 
    ]]>
  mx:Script>
 
  <mx:HTML id="html" width="100%" height="100%" paddingLeft="20" paddingTop="20"/>
 
mx:WindowedApplication>

No I don’t normally use mx:script tags, its a test case.

Eventually it malloc fails and crashes. This issue is Mac only and also occurs during a FileReference (or File) upload.

ASProject now Sprouts

admin — Thu, 14 Jun 2007 01:12:00 +0000

"I introduced AsProject in April and have since been redesigning it under a new, much more manageable project called Sprouts."

http://www.asserttrue.com/articles/2007/06/13/announcing-sprouts-was-asproject

ASProject and Flash debugging to Firebug console

admin — Thu, 12 Apr 2007 02:47:00 +0000

Publishing, testing, and running Actionscript projects is a pain.

“AsProject automates a variety of tasks including the creation of projects, classes, test cases, test suites, and swfmill libraries. It automates the download, installation and configuration of the debug flash player and many open source tools. AsProject also includes sophisticated build tools written in rake to automate build processes.”

Video demo or Project page

gem install asproject

Also, a friend Corey pointed out that you can debug flash using Actionscript ExternalInterface to log to Firebug console.log instead of using ASUnit’s debug console. In your actionscript:

 ExternalInterface.call("console.log", "FLASH: " + s);

And make sure to allowScriptAccess.

123	var so = new SWFObject("flash/xxx.swf", "myswf", "680", "200", "8", "#FFFFFF"); so.addParam("allowScriptAccess", "always"); so.write("xxx");

And you could call any javascript from it. ExternalInterface is a replacement for fscommand. I don’t remember but I don’t think ExternalInterface works in all browsers.