Archive for the 'General' Category

Strange Flash cache behaviour and attachMovieAnywhere solution

Monday, September 11th, 2006

Some days ago I've read about an old problem:
if I load a swf with some identifiers, I can't "attachMovie" them anywhere, but only in the loaded movie:

Actionscript:
  1. //If you do:
  2. myClip.loadMovie("libraryfile.swf");
  3. //then you can attach movie only in this scope: "myClip":
  4. myClip.attachMovie('clip1', 'foo', myClip.getNextHighestDepth());
  5.  
  6. //this doesn't works:
  7. _root.attachMovie('clip1', 'foo', _root.getNextHighestDepth());

This can be really a problem if you decide to move some assets to external files too late in the development, probably you'll have to rewrite substantial part of the application or it can be just impossible.

The simplest way to load an external resource and still be able to attach movies everywhere is to "Import for runtime sharing" it, but in this way you can't control via actionscript when to load or change what file to load (for example, to change the theme).

The solution:

Since I've noted some strange behaviour loading files in the flash ide, I've opened my trusty Ethereal sniffer and I've found something interesting:
When flash load a clip and cache it, it will not try to reload it until the page is refreshed.
What does it mean?

Actionscript:
  1. var mcLoader:MovieClipLoader = new MovieClipLoader();
  2. //This send to server: GET /libraryfile.swf HTTP/1.1
  3. mcLoader.loadClip("libraryfile.swf", target);
  4.  
  5. var mcLoader2:MovieClipLoader = new MovieClipLoader();
  6. //This don't send nothing, No bandwidth waste :)
  7. mcLoader2.loadClip("libraryfile.swf", target2);

In the above example, after the first load, every time I'll load "libraryfile.swf" in the movie, flash will take it from the memory and not from the server.
So I can load it everywhere I need it without using any bandwidth. In this way I can attach the loaded resources everywhere in the movie.
The next time the page is loaded, flash will ask the server for the file only the first time.

This can be a problem when we want to check if an swf was modified, in this case we have to put a ? in the filename to be sure the file will be reloaded:

Actionscript:
  1. //This is _always_ reloaded:
  2. clipName = "clip.swf?"+ Math.random();

AttachMovieAnywhere:

This simple function can be useful to attach a loaded movieclip anywhere:

Actionscript:
  1. MovieClip.prototype.attachMovieAnywhere = function(file:String, idName:String, newName:String, depth:Number, initObject:Object ) {
  2.         if(depth == undefined) depth = getNextHighestDepth();
  3.     var parent:MovieClip = this;
  4.     var container:MovieClip = this.createEmptyMovieClip(newName, depth);
  5.     var mcLoader:MovieClipLoader = new MovieClipLoader();
  6.     var listener:Object = new Object();
  7.     listener.onLoadInit = function (mc) {
  8.         mc.attachMovie(idName, newName, mc.getNextHighestDepth());
  9.         parent[newName] = parent[newName][newName];
  10.     }
  11.     mcLoader.addListener(listener);
  12.     mcLoader.loadClip(file, container);
  13. }

The usage is simple:

Actionscript:
  1. var container:MovieClip = this.createEmptyMovieClip("container", getNextHighestDepth());
  2. container.attachMovieAnywhere('foo.swf', 'clip', 'foo');
  3. //One frame later:
  4. container.foo._x = 100;

The main difference from attachMovie is that the attached movieclip will not be avaible until the next frame.

Conclusions:

It is a bug? I don't think, this isn't much different form how a browser works: after the first occurrence of <img src="img.jpg"/>, it will not try to reload "img.jpg" if another <img src="img.jpg"/> is found.

So why I haven't found it before? :)
Maybe because I have always thought that "loadClip" would have loaded file, maybe receiving a "HTTP1/1 304 Not Modified" reply, instead of silently take the cached one, who knows!

I'm sure there are plenty of experienced flash developers out there that already know this, but I've found many questions about this problem and I hope this can be useful to someone :)

 

To be sure that this stuff works I've made a test for it, it was useful to me to better understand how the flash cache mechanism works and to test it on many platform.
Feel free to leave a comment if something doesn't works.
(It is sufficient to view this post to participate, the results will be stored for statistic purpose only)

Some useful Javascript tools

Friday, August 25th, 2006

Because I've come back from my holidays and I have some spare time, I'm wondering if I can do some nice stuff before the next exam session (olny 2 left!).
First, I've start looking for some html/javascript tool, and I've found something interesting:


A Mouseover DOM Inspector (try it now clicking here!)
You can save it as a bookmark and start exploring every web site you visit.

There is also a similar tool packed as a Firefox extension: Aardvark, but it has less features.


Then an image crop tool in JS: 12ImageCrop. It work nice with CakePhp (copy it in the webroot/12cropimage folder and add the js where you need it). See the Demo

I've found also this one based on Scriptaculous & Prototype, it seems better but I haven't try it yet: JavaScript Image Cropper UI, see the Demo

Now something on CSS: I've found this comparison between css optimizers, and Icey’s CSS Compressor seems to have won the challenge. It can be really useful.

Must-read for AS3 developer

Tuesday, July 11th, 2006

André Michelle in his blog point to a great article about AS3 internals by Gary Grossman, the creator of Action Script.

Already on funny videos

Saturday, July 8th, 2006

Ok, this should be a dev blog about flash, javascript and some projects I'm working on, but since I'm busy studying for the last 4 exam I haven't do nothing interesting to show yet. So, just to keep you busy in the meantime, here two video worth to see:

Watch: Video 1
Watch: Video 2

Three Legged Legs™ ||| Humans

Saturday, July 8th, 2006

I had stumble upon this great CG short movie today, it could be an answer to the Stephen Hawking question:

watch the video: Three Legged Legs™ ||| Humans

DHTML Timeline

Friday, July 7th, 2006

(Found on Protozoo.com)
This is a wonderfull timeline visualization tool, it graphically show the time and date when an event occur.
From the site:

Timeline is a DHTML-based AJAXy widget for visualizing time-based events. It is like Google Maps for time-based information

The event data can be loaded from XML or JSON. Clicking on an event show a box with event's detail. It is even possible to distort the time in certain period, for example "zooming in" some days richer of events.
This an example of good javascript use, I wish we could see more of that.

Timeline in action:

Hitachi Storage Technology fun add

Wednesday, January 18th, 2006

This is the best harddisk add I ever seen!
Get Perpendicular!

First post

Wednesday, July 13th, 2005

This is my first post, hope will not the last.