Links: Mathematical themes with Actionscript

August 26th, 2007 . by polyGeek

One of my hobbies is playing around with mathematical algorithms in Actionscript. Here are a few sites I have found useful.

Code Optimization

AS3 Speed tests
This is a community maintained page of speed optimization techniques for use with ActionScript3.

AS3: Rethink your old assumptions
A bit on code optimization using constants and variables.

Fast and accurate sine/cosine approximation
More code optimization to do sine/cosine operations without using the Math class.

Bitwise gems - fast integer math
Using bitwise operations to speed up calculations.

Actionscript

Using molecular mechanics in Flash
Cool motions based on equations of attraction and repulsion.

Making Bitmap Art with Flash CS3 and WikiPedia
Art from equations.

Sites

Wolfram’s MathWorld
The web’s most extensive math resource.

Superfractals
The site resource for the book Superfractals by Professor Michael F. Barnsley

Good Math / Bad Math
Finding the fun in good math. Squashing bad math and the fools who promote it is their tagline. I just hope he never writes about me.

Articles

Iterated Function Systems and Attractors
Covers the mathematical iteration I used here.


Do yourself a favor and start blogging

August 25th, 2007 . by polyGeek

If you are a developer or designer, or both, you should have a blog. It’s too easy and cheap not to do.

Here is a short list of the benefits of having a blog:

  1. It’s the easiest way to create an online portfolio that you can update quickly. No more editing HTML and redesigning pages every time you want to update your portfolio. It’s as easy as writing an email.
  2. It’s a great way to create your own database of solutions to problems, tips, useful websites, etc. If you’re like me then you have a hard drive full of code and designs scattered all over the place.
  3. It’s a fantastic way for employees to find you.
  4. You get to interact with your community of developers or designers.
  5. It makes you money.

If you are mainly a designer then a blog really isn’t suitable for showcasing your talents. But it is a nice add on. You can still have your site - myPortfolioSite.com - as your creative front. And then you can have myPortfolioSite.com/blog/ as your blog to help draw attention to the creative stuff you have done.

What you need

You’ll need a host that runs PHP scripts. They usually run in the neighborhood of $7 a month. I use one of the hosts recommended by Wordpress.org called Lunarpages.com. I’ve helped five of my friends set up Wordpress blogs with Lunarpages.com and haven’t encountered any problems.

Download and configure Wordpress - it’s all free - and install it on your host. That’s pretty simple and here are a few links to help get you started.

You can go with free hosting from Wordpress.org but you won’t get total control over the customization options that are available if you self host. Plus your domain name would be something like: myPortfolioSite.wordpress.com. I’m sure you’d rather have your own personal domain name. Most hosts will give you a domain name for free as long as you host with them.

$dollars$

There are numerous ways to make money off your site. I use Text Link Ads here at polyGeek and pull in over a $100 a month for just a few little text links in my side bar. You can also go with Google Ads or others depending on how unobtrusive you want your ads to be.

Stats

Your host will probably have many built in applications for checking your site statistics. I look at those every now and then but my favorite is Google Analytics. You just need to sign up for an account and drop a little code snippet in the footer of your website. Then you’ll be able to see really cool graphs of the traffic coming to your site. I love looking at the Map Overlay to see people from around the world visiting my site.

Plugins

There are a vast number of plugins for Wordpress. Here are a few that I use:

  • Akismet: this comes pre installed with your Wordpress files but must be activated. You’ll absolutely want to do that so that you don’t get overwhelmed by comment spam.
  • Feedburner/Feedsmith: this is a service and plugin that help you track subscriptions to your RSS feed.
  • Google Sitemaps: automatically creates a sitemap for you that Google can use to better index your content.
  • Kimili Flash Embed: if you need to display Flash content - SWF files - you’ll need this plugin.
  • Math Comment Spam Protection: Akismet won’t get all those pesky comment bots. This will help reduce the load even more.
  • WordPress Database Backup: easy and essential and hopefully you’ll never need it.

There are many others that you’ll probably end up using but this is a good start.

One last thing: if you sign up then please post a comment below with a link to your blog. I’d love to keep track of what you publish.


right-click HERE!

August 20th, 2007 . by polyGeek

Update: Paulius Uza has run an extensive user test on the right-click code and concludes that the code is reliable 86% of the time across the major browsers.

Today will be a day long remembered. It has seen the end of the Javascript incompatibilities, it will soon see the end of the Flash context-menu.

We hope.

Paulius Uza has created a right-click testing script and he needs your help. Please visit the test page, right-click on the SWF and then vote yes or no to let him know if the code is working correctly. The script will automatically send browser type, version and OS back to Paulius for analysis.

You can visit the project home on Google Code at: http://code.google.com/p/custom-context-menu/


Another touchdown for Flash Video

August 18th, 2007 . by polyGeek

For years the NFL.com site has been using RealMedia for their video streaming. They finally updated their site and are now using Flash video. Go Team!!!

Beyond that they have greatly increased the amount of video they are delivering. Each game will have video highlights and they have lots of interviews and analysis delivered with Flash video. Their video player has maximum dimensions of 640 x 360 and has a full screen mode in IE but not Firefox.

I checked the source code of the homepage and they are also using the SWFobject to embed the HTML code dynamically to get around the Internet Explorer’s Eolas/ActiveX activation crud.

Preseason practice

On the downside I had lots of problems browsing to some of the videos and getting them to play correctly on a Win XP machine with IE7 and Firefox 2.0. Of course the commercials play just fine but the content often fails to queue up.

The video content navigation is handled in HTML so the problem is likely the Javascript communication between the HTML container page and the Actionscript. It’s amazing how often that gets messed up but as everyone knows Javascript can be more than a little finicky. Hopefully they’ll get that sussed out before the regular season is underway.

Close, but not perfect

They could have used video.Maru for their video player but it doesn’t look like they did. Oh well, I can dream. :-)

Fantastic

As a fan I couldn’t be happier. I’ll be on the NFL.com site on a daily basis during the football season. I don’t have cable TV because there isn’t much to watch besides football and the History/Discovery channel. The way things are going it won’t be much longer before I’ll be able to watch anything I want via the Internet.

Addendum: one day later

I’m working with one of the dev’s at NFL.com to help trouble-shoot the problems I mentioned above. Here on my system at home everything works flawlessly. At my friend’s house on the same setup I had all sorts of problems. Don’t you just hate it when that happens?


Google Code project for custom context-menu in Flash/Flex

August 18th, 2007 . by polyGeek

I have created a project on Google Code for the custom context-menu.

http://code.google.com/p/custom-context-menu/

I have copied all the comments from my original posting over to the issues tab, uploaded the code, made a few wiki entries and such. This is the first time I’ve ever used Google Code so please feel free to make any improvements to what I’ve started.

There isn’t much that I can do beyond this point other than to ask everyone interested to blog about this so that hopefully some Javascript experts can jump on this and get this working reliably.

I’m going to look into creating an interactive chart that we might be able to use to track testing. Hopefully I’ll be adding a custom right-click to the charting app real soon. :-)


360Flex Seattle brain dump

August 17th, 2007 . by polyGeek

As always the best part of a conference is what happens outside the sessions. Not to disparage the speakers at all. There were some great sessions, more about that later, and some good sessions. And think this might be the first conference I’ve been to where none of the sessions I attended were bad.

John Wilker and Tom Ortega did a fabulous job. I guess the best compliment I can pay them is that I plan to be going to the next 360Flex conference that’s on the West coast.

There were lots of great sessions. If I had to pick my favorite I’d go with Doug McCune’s Building Custom Components. His message was that we need to keep an eye on existing open source projects that we can use to wrap into our projects when ever possible. His tileUI is mosly open source code that he mashed together.

I thought it was brilliant that his session itself was sort of open source. He got things started and then mediated a discussion from various members of the audience. Deepa Subramaniam from Adobe, Adam Flater from effectiveUI, David Coletta from Buzzword, and a few others that I didn’t know made significant contributions to the discussion. And on many occasions Doug himself asked questions of the audience like, “this is what I do. What do you do?”

I think a lot of presenters would be afraid of letting go of control over the session but Doug handled it well. Others should consider a similar approach.

Bugs

I think Adobe should hand out buttons or something that say, “Submit a bug.” I heard that phrase countless times. So, if you find something you think is a bug in Flex then go to bugs.adobe.com/flex/ and do a search to see if anyone else has submitted a bug on what you’ve found. If they have then vote for it. The more votes a bug gets the more likely it is to get fixed. If there isn’t already a bug report then submit one.

The most common bug you’ll find are properties/methods that are private should should be public. So if you find something in the framework that you want public submit a bug. Deepa also offered that these are the easiest bugs to fix and they do have a quota. So don’t be shy.

I personally don’t know what the problem is. I just did a search and replace across all the entire flex framework on my system and make everything public. Problem solved. Okay, I’m kidding. But that would solve the problem. :-)

Tid-bits

The good news: Flex 3 will ship as open source.

The bad news: Flex 3 won’t ship until early ‘08. I think we were all hoping for a ship date around MAX07. Bummer.

AIR 1.0 will ship with Flex 3.

Flex 3 will have much better text support with kernaling, font height, etc.

Blogs to read

Here are a few blogs to read that you may not have seen before.

Alex’s Flex Closet ( http://blogs.adobe.com/aharui/ )

Flexophile: fount of Flex factoids ( http://blogs.adobe.com/gosmith/ )

Deepa said that she was going to start blogging before MAX07. If she doesn’t I’m going to file a bug. :-)

Coldfusion 8 hosting

I talked to Ted Patrick about who was offering shared hosting of a Coldfusion 8 with LiveCycle setup. He said that they were working hard to get that option out in hosting community for us. I’m sure that as soon as someone has that available then someone at Adobe will make it known to the community.

Video

The video encoder that comes with Flash is good. But if you want the best results look for On2Flix or Sorenson’s encoders. They do two pass encoding which the Adobe encoder doesn’t do.

Nity-gritty

If you use setStyle in your Flex apps do it on initialization not creationComplete. That will help speed up your apps rendering time.

Debugging

It never occurred to me that those ugly exceptions warnings that pop up in Flex apps only work in the debug version of the player that we Flex developers have. That’s a relief.

In Flex 3 you will get the option in the code editor to right-click and select watch variable/property during your debugging sessions.

You can make Eclipse preview in a browser other than your default by going to: Window -> General -> Web Browser.

Nested functions are not a member of any class. So there is really no telling what this is.

Custom Components

Metadata is for code hinting purposes. They don’t actually serve any purpose in code execution.

If you have a custom event you use clone to keep those custom properties attached as the event bubbles. Otherwise the event bubbles but loses your custom property.

Have your heard of the tag [Mixin]. You should check it out at AdamFlater’s blog.

List of speakers

This is a good page to keep handy if you want to go back and find a presenter’s website/blog someday.

http://www.360conferences.com/360flex/2007/05/speaker-to-session-list.html


Offer your suggestions for Flash player right-click project

August 16th, 2007 . by polyGeek

Update: I’ve created a project on Google Code for this in the hopes of getting some Javascript experts to make the code work reliably in all the browsers that support the Actionscript External Interface.

I’ve never started or worked on an open source project before and I’d like the communities suggestions on what you think would be the best path going forward to make the custom Flash context-menu project successful.

I think there are enough people out there who have an interest in this and the knowledge to make this work reliably on a majority of the browsers out there today.

My first guess is that Google Code would be a good base of operations. I’ll also look into OSflash.org. Please weigh in with your suggestions.

Thanks,

dan


Custom Right-click in Flash

August 16th, 2007 . by polyGeek
Update: I’ve created a project on Google Code for this in the hopes of getting some Javascript experts to make the code work reliably in all the browsers that support the Actionscript External Interface.

By using a few lines of Javascript, and the External Interface I’ve been able to replace the default context-menu in Flash with a customized one. In my examples I use a simple color wheel in Flash and the color-picker component in Flex.

You can check out the pages here: Flash version, Flex version, Download code.

Here is the testing matrix so far:

  • Internet Explorer 7, Windows XP, passed
  • FireFox 2, Windows XP, passed

If you have a configuration that is different than any shown above then please comment and let me know the results. I’ll update the list as comments come in.

If it doesn’t work on your system it would be great if you took a crack at modifying the Javascript to support your browser. I’m pretty much out of the loop from here on out because I don’t have anything left to test on.

Below is the list of browser/OSes that the Flash External Interface works on. I would like to make sure that the Javascript works on all of the browser/OSes that are supporeted by the External Interface - listed below.

External Interface browser support
Browser Operating System
Internet Explorer 5.0 and later Windows  
Netscape 8.0 and later Windows Macintosh
Mozilla 1.7.5 and later Windows Macintosh
Firefox 1.0 and later Windows Macintosh
Safari 1.3 and later   Macintosh

The gist of how this works

It’s really pretty simple. We’ve all seen sites that have Flash content that have disabled the right-click altogether. I just took that idea and modified it by capturing the onMouseDown in Javascript and if it’s a right-click then notifying Flash via the External Interface. Flash then does its work which is very basic Actionscript.

Hopefully this will work on most browser/OSes and so encourage Adobe to just give us access from within Flash to fully customize the context-menu and not have to muck about in Javascript.

Sorry about disparaging Javascript. It isn’t Javascript’s fault that Internet Explorer is such a pain in the frakking ass. It took me 15 minutes to get this all to work in FireFox. It took 4 hours to get it to work in IE. (Insert Yosemite Sam cursing tirade here.)


Random generation of the Sierpinski triangle

August 14th, 2007 . by polyGeek

On the first page of the book Superfractals is one of those cool mathematical curiosities that makes math geeks like me go all Archimedian. (No, I didn’t run naked to the bookstore counter and buy the book. But I did go home and order it at Amazon.)

Here’s the gist of the curiosity, which I created an algorithm for below:

Pick 3 points on the xy-plane and label them A, B, and C. (As a group I’ll call them ABC.)

Now pick a fourth point and label it X0. Now randomly pick a point from the ABC group. From X0 make a new point that is the mid-point between your random ABC selection and X0. Label that point X1.

Now from X1 do the same thing again. Pick randomly between ABC group and then from X1 go to the mid-point between X1 and your random selection.

Repeat that a few millions times.

You might think that eventually you’ll fill up the points in between the ABC group and have a solid triangle. But no. You’ll end up with a skewed Sierpinski triangle as you can see below.

Serendipitous errors

In my first version of the algorithm I made a mistake in the equation that calculates the mid-point. The equation should be as such:

xmid = ( x1 + x2 ) / 2

And the same for the y-coordinate.

In my haste I wrote the incorrectly and calculated a difference instead of a sum between the two values.

Now that sould produce something random because what on earth could the relationship of the difference between the first and second points divided by two have anything to do with?

But you don’t get a random dispersion. You get something that closely resembles the inverse of the Kosh snowflake. Why? Ask a mathematician because I have no idea.

Grdenizing the code

This is exactly the sort of algorithm where code optimization can make a big difference. John Grden just wrote a wonderful post on optimizing Actionscript by using bitwise operations and a few other tricks that I applied here.

In the application above you can check/uncheck the optimized code checkbox to select which version of the method gets used. Then you can see the results displayed and judge for yourself how much code optimization can benefit you in cases where you are iterating over large sets of data.

View source code here.

The obvious place to optimize is with the mid-point equation. Instead of dividing by two I’m using the equivalent bitwise operation: >> 1.

That helped but using int(num) instead of Math.floor(num) made a huge difference. I’ll never use Math.floor() again that’s for sure.


Another mission impossible

August 14th, 2007 . by polyGeek
Update: I’ve created a project on Google Code for this in the hopes of getting some Javascript experts to make the code work reliably in all the browsers that support the Actionscript External Interface.

I don’t have time to go into the details right now because I’m MISSING THE 360FLEX CONFERENCE for this. Damn!!! So I’ll have to be brief. I’ll write more about how this works later.

I was in a session yesterday by Tony Hillerson from EffectiveUI about Designing RIA with More Engaging User Experiences Using Alternative Navigation and Command Gestures. He lamented that there was no way to fully customize the right-click functionality in Flash to do something like bring up a wheel navigation on right-click. All you can do is edit the normal right-click popup and even then you can’t remove some of the items.

So this really bugs me. It’s like that crap about not being able to fade/mask device fonts. I don’t like limitations. So I figured out a way to do it. Open the page below to test it out for yourself. I’ll write more about how it works later. Right now I have to jet off to the conference.

custom rightClick

Oh, this only works in FireFox 2. I tested it in IE and it didn’t work correctly. It’s a Javascript issue. Like that’s a big surprise. :-)


« Previous Entries