Posts Tagged ‘Flash’

Font detection with Javascript and Flash

Thursday, June 26th, 2008

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 (Though, its possible it might not work)

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

Saturday, March 29th, 2008

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 = '<html><body> \
          <form name="upload" action="http://' + bucketName + '.s3.amazonaws.com/" method="post" enctype="multipart/form-data"> \
            Key to upload: <input type="input" name="key" value="' + objectName + '" /><br /> \
            Content-Type: <input type="input" name="Content-Type" value="' + contentType + '" /><br /> \
            <input type="hidden" name="AWSAccessKeyId" value="' + accessKey + '" /> \
            <input type="hidden" name="Policy" value="' + policy + '" /> \
            <input type="hidden" name="Signature" value="' + signature + '" /> \
            File: <input type="file" name="file" /> <br /> \
            <!-- The elements after this will be ignored --> \
            <input type="submit" name="submit" value="Upload to Amazon S3" /> \
          </form></body></html>';                                                     
      }
 
    ]]>
  </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

Thursday, June 14th, 2007

"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

Thursday, April 12th, 2007

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.

1
2
3
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.