FP10 AS3 TextLayout TTF transcoding

27 05 2009

 Further to my last post about intl text, I have solved some of the issues and found resources for Arabic as well as Hindi. I thought I’d list the error that Flex SDK 4.0.0.7052 chucks when I try to transcode certain TTF files:

[code lang="actionscript"]

Error: unable to build font 'B Nasim'

[Embed(source='/../fonts/arabic/BNasimBd.ttf',
^

Error: Unable to transcode /../fonts/arabic/BNasimBd.ttf.

^

[/code]

I've also noticed that I only experience these transcoding issues that I mention on fonts where the font name contains a space, this could perhaps be a coincidence but it's coming up a little too frequently for it to be chance. If you have a font that you are forced to use; I would consider editing it in FontLab or similar and modifying the font name metadata.



Flash Player 10 AS3 Text Layout Engine Dynamic Selectable Embedded TTF’s

26 05 2009

I’ve been building internationalised Flash content for years now and it’s always been flawed when it comes to languages like Arabic so the most exciting thing about FP10 to me was the Text Layout engine. I’ve spent the last few days playing round with the Flash Player 10 AS3 Flex 4 Text Layout Engine (formerly Vellum) and trying to get  embedding fonts to work. It’s been a bit frustrating as there are few examples online and I haven’t yet been able to get embedding fonts to work without using Flex Builder (was attempting to use FDT and pure actionscript but no dice yet @ May 22 ’09)

[code lang="actionscript"]

UPDATE: Got this working with no MXML in FDT compiling against Flex SDK 4.0.0.7052. FDT Project src below:

[/code]

@UPDATE May 26t 09h: FDT no MXML version : app here – FDT Project src here

—————————————————————————————————————————

#OLD Anyway here’s what you’re after, an example (some hindi poetry) and some gloriously open source (get the source from the Flex Builder srcview tree):

Flash Player 10 text engine vellum example

Examples with embedded fonts using the new Text Engine are thin on the ground, partly due to proprietary font files. I’ve picked JanaHindi as it’s open source and freely downloadable from here courtesy of our friends the Indian Government. Namaskar :)

If you want to compile this you’ll need the FP10 debuggers, Flex Builder (I have standalone 3.0214193) compiling against the latest Adobe (not open source) SDK from http://opensource.adobe.com/wiki/display/flexsdk/Download+Flex+4 I  had luck with  4.0.0.705. For the Text Engine Layout components, the package flash.text.engine and flashx.textLayout come bundled with recent builds of the Gumbo SDK. If you want just the textLayout package, use a nightly build from http://labs.adobe.com/downloads/textlayout.html

API changes like the renaming of hostParagraphFormat and DisplayObjectContainerController ( now hostFormat & ContainerController respectively) and function names like flowComposer.updateAllContainers  which is now flowComposer.updateAllControllers make things a bit tricky as they change on a per nightly build basis but I found that using the ASDoc from specific builds and some common sense you can get around most of these. Running other examples I kept getting the error :

[code lang="actionscript"]
ArgumentError: Error #1063: Argument count mismatch on flashx.textLayout.property::NumberProperty(). Expected 6, got 5 [/code]

…whenever I instantiated a ParagraphFormat. I am just putting all the issues I came across here as googling them should then show up this post and help people out.

I think the key thing is to remember to add CFF (Compact Font Format) as an embed arg and understand the differences between DefineFont3 and DefineFont4 http://opensource.adobe.com/wiki/display/flexsdk/Gumbo+Font+Embedding

As mentioned I am currently unable to get embedded fonts to transcode and embed correctly using FDT despite compiling against the same SDK. I prefer FDT to Flex Builder and in my opinion Flex has some serious drawbacks, principally in the way it bloats everything with hundreds of kilobytes of framework code that I have no intention of using, though lets not get into the Flex bashing, it’s a post for another day! I have just collected a few things that people may find useful…

Transcoding – I experienced numerous errors with seemingly identical files. OpenType and Truetype information may or may not be present in font files which are identical as far as WinXP is concerned. As I’m not hardcore into typography I don’t have FontLab or any such goodies so I can only conjecture that there must be some sort of metadata required but I know not what. Digging around online a lot of people were able to solve this by using these compiler mods. I was not:

  • -managers=flash.fonts.AFEFontManager
  • -managers=flash.fonts.JREFontManager
  • -managers=flash.fonts.BatikFontManager

Flex 4 Gumbo SDK issues:

  • I kept getting errors related to the Gumbo namespacing e.g: “Could not resolve <Application> to a component implementation.” my solution is in the posted source code.
  • Design view doesn’t work with the Text Layout Components (not bothered and doesn’t affect the finished SWF)
  • Remember to edit project preferences to target FP10 (I just publish the SWF direct & skip FB’s HTML integration)

There are a few nice articles I recommend checking out too:

That last one explains why Text Engine text is not compatible with flash.text.TextField text and why you’ll have to embed the same font in a project twice at present if you wish to mix and match the methodologies. It also mentions performance issues with Vellum but I can’t verify these yet.

Adobe make great software & it’s only pragmatic that they nail down the API in one branch before they spread it out across their toolsets but why is it the Flex branch rather than the pure Actionscript one where the focus is? I would suspect this is a tactical business decision to flog Flex Builder. In my opinion anything that is possible in Flex should also be possible in Flash/Pure Actionscript and vice versa; they are 2 sides of the same coin – I’ve no vested interest in either I just want tools that make complex jobs simpler. The most annoying aspect of “Flex Creep” is things like the Embed tags creating Classes that extend items within the Flex specific MX package. Here’s an example – this Embed code:

[code lang="actionscript"]
[Embed(source='/../fonts/RKJanaHindi.TTF',
fontName = "JanaHindi",
mimeType = "application/x-font",
cff='true')]
public static var JanaHindiClass : Class;

[/code]

Creates a Class that extends  mx.core.FontAsset - forcing you to include the otherwise unnecessay Flex MX framework :(

Anyone from Adobe listening – Please don’t do this! And also Text Layout Engine is such a mouthful, can we go back to Vellum? Is this a copyright issue?

Anyway, I hope that was useful – thanks to anyone who made it all the way through! Cheerio



Multiple Face detection in AS3 using OpenCV demo

30 04 2009

fdt_as3_me_and_jens.jpg I got a mutiple face detection in Flash application running smoothly which is rather nice :) Thanks a million to Squidder and to the original author of the OpenCV file @ Intel, Rainer Lienhart. The deploy has  a zipped up XML document with Haar Classifier pattern recognition…

The AS3 unzips this data, grabs the blob/face detection data, polls frames from the camera and scans them for faces. When it finds them it will draw a rectangle around the detected faces and render them back on top of the video feed.

Check it out at http://bit.ly/HYkJF

A quick nose at the OpenCV Wikipedia stub will show you just how interesting this technology is as it’s used for:

FDT made knocking this together and sharing it on SVN in house at Glue a breeze. Hopefully I’ll knock something up with this and share some source other than what Squidder has already kindly posted.

Cheerio



Recent work & Cross Domain discoveries

7 04 2009

The Sun workThere have been no posts from me for a while as I’ve been building the AS3 carousel section (eBay items) and a series of DoubleClick Ads utilising Twitter feeds in banners and Ebay listings in banners too.  The ads are in AS2 as the DoubleCick TABS system can’t yet take AS3 FYI (coming soon, Cheers Haden for the inside info!). This is all for The Sun Help for Heroes campaign where Ebayers can apply to become sellers and then donate their profits of the items they sell directly to the campaign. We’ve got loads of Celebrities to donate items too and there is a branded hub site pulling all this activity together live within eBay at:

In my rummagings on Cross Domain I discovered this good hack for accessing the pixels from Video on distributed CDN’s:

More posts soon hopefully although my day to day link posting is all being done via Twitter these days so follow along if you’re interested in these things. I am endeavouring to keep my microblogging professional rather than letting you know I am ‘on the bus’/'popped to the shop’ etc so Flash goodies are promised  ;)



AS3 Efficiency & Optimisation tricks

20 03 2009

Found some truly excellent resources on this (Thanks to Gibo & Mike for the links):

I’ve been trying to save some of these little loops e.g. [code lang="actionscript"] list[length] = item; [/code]which for a simple Array push for example is 3x faster than:[code lang="actionscript"] list.push(item); [/code]out as FDT  snippets called arrPush for example so that I don’t even have to remember to use them and the benefits will appear throughout production rather than post optimization whcih can be a pain. In other news, I’ve been spending a lot of time getting used to Fabrication this week and it really is incredibly good. I’ll post something about it in the next fortnight. Happy Friday all :)



Grabbing assets out of AIR apps

12 03 2009

I’ve done some work in the past with the Konfabulator (Now Yahoo! Widgets) widget patform and the workflow (no IDE) was that you used to rename the .widge files to .zip and decompress in order to view the JS and XML source. I was nosing at a few AIR apps today (Frienddeck and a Merapi AS3 to Java bridge application – in order to grab Skype metadata) and thought I’d give this method a test and yes you can kind of do the same with AIR! 

 Rename the .air to .zip and decompress (I use Winzip) – it throws an error but you get some source including a .swf which you can then run through a decompiler (I use Sothink) and you get the symbols (PNG’s, Movieclips etc…). This could be useful under certain circumstances so I thought I’d share. Cheerio :)



PureMVC Forum is ultra useful & friendly

18 02 2009

Pure MVCAbsolutely brilliant forum over at PureMVC. I had some heavy questions today and Cliff & Jason helped me an awful lot with some wide ranging and tricky concepts.  Thanks for the assistance guys :)



Err, just what exactly is PixelBender?

13 02 2009

 Pixel BenderBeen trying to work this out and it seems it’s basically a way of delegating computationally expensive tasks to a hybrid of GPU & CPU so you can take advantage of the local machines hardware better to extend how hardcore you can make client side computations in Flash Player/AIR runtime.

These slides did a better job of explaining than most: http://llvm.org/devmtg/2008-08/Rose_AdobePixelBender.pdf

Main things I’ve discovered:

- What isn’t apparent from the name is that is not restricted to graphics/video processing – you can do any Maths process with this for example manipulating audio live in real time in ways you can’t currently do e.g. proper DSP operations with float4 low level datatypes

- Creating a new PixelBenderJob via AS3 actually creates a new processor thread (confirmed to me at Flash On The Beach by Lee Brimelow) so effectively FP10 is capable of multithreaded applications in the same way Java is, it’s just that noone has got it working yet as far as I know…

I wonder how long it takes the ridiculously clever folks over at Hobnox, Alternativa, Papervision, Flint, Away3D etc to grab this or whether some other PJB wizard will create some next gen tools in this that may supercede their work in the 3D/Particle and audio DSP spaces where GPU’s are at their most useful?

I haven’t got any spare time as I’ve too many research projects on at the mo already (good times) but hopefully will get a chance to nose further at this soon…

Good links in the meantime:

Good weekend all

[code lang="actionscript"]EDIT[/code]

Just spotted this from the guys at BigSpaceship http://labs.bigspaceship.com/2009/02/12/3s-vs-3d/ top stats and a very interesting comment from UnitZeroOne regarding the future of Papervision :)



FDT/Eclipse Setup & Flash Dev spring cleaning brings Happiness & new tools

6 02 2009

FDTAfter having a fresh evaluation of all my workflows, tools and processes recently and after quite a bit of time analysing Flex Builder 3 and Flash Develop; I’ve finally settled happily on FDT3 in Eclipse and the Flash IDE as my compiler (Including the AIR & AS_CORE goodies you get for free in Flex & all my favourite 3rd party AS3 Libraries via Eclipse shared Libs). During the experience I discovered loads of useful bits and thought I’d catalogue and share:

FDT can be set up to work with the Flash IDE (no slow workflow of editing SWC’s externally like with Flex) so I can live edit on stage assets as well as code as all mongrel dev/designers like me like to do. It’s also easy to set up Ctrl+Enter straight from the Eclipse IDE (Thanks to Wezside for the handy tip) like I used to with Se|Py. If you’re going to go and install this you might find this useful when you’re locating your ASO & S.O folders & various installation folders you need.

There’s only one annoying thAnnoying CS3 Flash Path paneing in that I have to add the classpaths for my external Libs to the FLA document as well as in the FDT Project (see pic) although I think this issue may be fixed or at least easier to fix with Flash CS4 (which I’ve started using on other machines and is awesome) as the settings are XML based in that rather than locked in the binary FLA.

Minor bug bear though, everything else about it I’m really pleased with. Onward to more details of cool features; for example FDT ‘Templating’. As a quick example of when to use this; I like trace – she’s done me proud over the years but I wanted to set up an FDT Template to use trace as as a keyword to enter the following line of code instead to work with ThunderBolt Logger:

[code lang="actionscript"]Logger.info("Flash is calling: A simple string", myString);[/code]

Usually you want to trace the value of a variable that is right in front of you so rather than typing it you can highlight that word in Eclipse & the FDT template will populate it’s generated code snippet with the highlighted value and plonk it straight into your code.  E.G to trace out facade in the code below:

FDT sample

Highlight the word facade and press CTRL+SPACE then when you start typing the first few letters of the Template Command Name ‘tra…’ the list of suggestions populates including your custom Template:

FDT sample

You just click that and it inserts your snippet with it’s dynamic contents like so, et voila!

FDT sample

You create these rules via Eclipse -> Window -> Preferences -> FDT -> Editor -> Templates. Pic below shows syntax:

FDT sample

So thats cool. I also mentioned our linked Library set that Rob and I are working with, there’s loads of amazing Libraries out at the moment, here’s our list (still more to go e.g PaperVision and Flint but this is a good set of great libraries)…

FDT Linked Libraries

As ever a big thanks to the creators of all of them. Tip of the hat to you all Sir’s :)

Eclipse is comfortable and solid and gives you access to an existing plug in network which I’ve already found really useful. LogWatcher http://graysky.sourceforge.net/ is a tool that lets you watch any text file on your system. I just pointed mine at the FlashLog.txt created by the FP10 debugplayer and it works just like FlashTracer for Firefox but within Eclipse. I love the ability to check projects directly out of SVN ino FDT via Subclipse and the fact that it’s so easy to work between Mac & PC platforms as Java is platform independent and I guess it’s also cool being familiar with a Java dev environment in case you want to port any existing cool stuff like Saqoosha did with FLARToolkit and some of the stuff Mario Klingemann’s BitMap manipulation stuff he mentioned porting in his lecture at FOTB08.

Flash Develop is wicked and I love to support Open Source but it hasn’t got close to the features FDT can (SWC Browsing, Refactoring, Eclipse base benefits & general subjective tool use pleasure) and V3Beta9 wouldnt save my settings properly :(

Flex for me is nasty as the split between design and dev is skewed away from the fine traditions of Flash. CSS? No thanks. I won’t miss the bloat and the framework (MXML, yuck) but the thing that I will really miss is the incredible Flex Builder 3 View Source creation wizard which I love. http://livedocs.adobe.com/flex/3/html/help.html?content=build_7.html

I first spotted this on one of Tink’s tutorials and he’s done some cool patches for it too but if anybody knows a way of getting the com.adobe.viewsource.ViewSource classes and zip/framework building scripts working with FDT (On either Windows or Mac), please leave a comment! Hope that was useful to somebody. Cheers



PureMVC & Flash Develop basic Kuler API Demo & Source

7 01 2009

I was looking for some basic working examples of PureMVC framework based apps to get my head round the Mediator Interface stuff and found a lovely demo over on Josh Weatherspoon’s blog. I’m not trying to claim I wrote this, just rejigged it so you can use Flash Develop & the Flash IDE not Flex (Hooray!) and if you do too you’ll find this a heck of a lot easier to understand as it’ll compile straight away.  I also updated it for the latest Kuler API (colour swatch generator)

Pure MVC Example

Click the above for a demo & grab the source inc FlashDevelop 3 Project File & bundled non SWC PureMVC libs here.

Cheers Josh, nice one