Caching loaded images in AS3

Link to example project
Link to stack overflow

So, I read this question on StackOverflow about a guy who wanted to load images several times but didn't want to have them placed inside a swf-file or a swc-file (or rather wanted to have the swc created at runtime).

Storing images inside a cache in that way isn't super easy so I thought I would give it a try and see how a solution to that would work. I started out with a simple Static ImageManager but shortly found that it wasn't nearly as easy as I first thought it would be due to race conditions and as3 being rather limited to how you can work with loaded content, queuing loads etc.

I ended up creating two classes and an extra Main-class to provide as an example:

ImageManager (static class, keeps url as id for the image sand stores loaded images bitmapdata)
FileLoader (dynamic instances, does the actual load of objects and then notifies when it is done)

Since there is no easy way of storing files on this blog, I had to create some online storage service [chose Skybox today].

Anyways, here is the link to my example project, source code is "pasted" below for "completeness" if you just wanna see the files and don't wanna download the entire project.

Main.as - link to pastie
ImageManager.as - link to pastie
FileLoader.as - link to pastie

Online code editor

So, today I was trying to figure out what type of resolutions that were used on android devices. And I ran into the following list:

1   2560*1600
2   1366*768
3   1280*800
4   1280*768
5   1024*768
6   1024*600
7   960*640
8   960*540
9   854*480
10  800*600
11  800*480
12  800*400
13  640*360
14  640*240
15  480*320
16  400*240
17  320*240

And as usual I needed to do something with this list, such as counting out the aspect ratio for those resolutions into something similar to 4:3 or 16:9 or whatever the end result would be. For a long time I've been looking into some quick way to do this without having to create a project, creating files, building html web page with included JS etc. And today I found it by googling for "online code browser" and spending time in actually evaluating the results.

The end result was a webpage called JSBin, where it is possible to just mash down some js-script and then run it automatically.

No code hinting (unfortunately) but it gets the job down and, the end result was this super nice and clean code:

var input = ["1   2560*1600","2   1366*768","3   1280*800","4   1280*768","5   1024*768",

"6  1024*600","7   960*640","8   960*540","9   854*480","10  800*600","11  800*480",

"12  800*400","13  640*360","14  640*240","15  480*320","16  400*240","17  320*240"]

 for(var i=0; i < input.length; ++i) {

      var s = input[i].split(" ");

      for(var j=0; j < s.length; ++j) {

        if(j > 0 && s[j]) {

          console.log("resolution=" + s[j] + " - Ratio: " + s[j].split("*")[0] / s[j].split("*")[1]);

        }

      }      

    }

You can find the editor on jsbin.com and my super nice code should be available at http://jsbin.com/omiyik/22/edit. Now, assuming no one breaks it it should give you this output:

• "resolution=2560*1600 - Ratio: 1.6"
• "resolution=1366*768 - Ratio: 1.7786458333333333"
• "resolution=1280*800 - Ratio: 1.6"
• "resolution=1280*768 - Ratio: 1.6666666666666667"
• "resolution=1024*768 - Ratio: 1.3333333333333333"
• "resolution=1024*600 - Ratio: 1.7066666666666668"
• "resolution=960*640 - Ratio: 1.5"
• "resolution=960*540 - Ratio: 1.7777777777777777"
• "resolution=854*480 - Ratio: 1.7791666666666666"
• "resolution=800*600 - Ratio: 1.3333333333333333"
• "resolution=800*480 - Ratio: 1.6666666666666667"
• "resolution=800*400 - Ratio: 2"
• "resolution=640*360 - Ratio: 1.7777777777777777"
• "resolution=640*240 - Ratio: 2.6666666666666665"
• "resolution=480*320 - Ratio: 1.5"
• "resolution=400*240 - Ratio: 1.6666666666666667"
• "resolution=320*240 - Ratio: 1.3333333333333333"