Been a bit quiet here for the last few months. I’ve been particularly busy at work but also I’ve been working on a few other projects on the side.

One of these is ThumbWhere. http://thumbwhere.com (try the blog for more info).

ThumbWhere allows you to post text, images, video or audio to the web and to Twitter. Support for other social media and social networking sites will be enabled in the near future.

Here is a post on my Twitter stream sent in from ThumbWhere.

If you use Twitter on your mobile phone you will find it’s very very fast. I have no ads – I just link you directly to the media if you click on a http://tny.tw shortlink using a phone.

If you just want to post something anonymously – send images, photos or video to +61-447-100-293 and it will be added to the public feed. Anyone can send via MMS and your content will be added anonymously to the public timeline. If you later on create an account, that content will be added to your account and will no longer be anonymous, so don’t post anything embarrassing if you intend to join up in the future :)

I’m keeping out the email spammers for now but I’ll be enabling submissions via email in the next few weeks – at the moment you need a phone that can MMS to the submission number, so if you have an iPhone you will need version 3.0.

The main web site is a very plain lightweight AJAX driven ‘white-site. It does not look like much, but it’s doing some wonderful magic under the hood as it’s all driven by my state machine language. The back end is running my own custom pipeline processing engine – it’s kind of a multi-dimensional-tree lazy evaluation version of map-reduce. This architecture means that it’s trivial for me to integrate job endpoints from on demand computer systems such as Azure and EC2.

I’ve set up a site to allow people to request features. First off the rank will be submission via email.

I’m also working on an iPhone app and an Azure endpoint for much of my processing and transcoding pipeline.

Its keeping me off the streets :)

Developed by some very dear friends of mine who used to work at Massive.

http://pitapata.com/

This is the same team that produced LilyPie http://lilypie.com/ which provides Tickers and Widgets for your baby or child :)

Australia is gripped in debate over it's government’s push to introduce Mandatory ISP Level Filtering. Yes and the policy is about as well thought out as it is acronymed.

Out of that debate Jon Seymour has come up with “The Conroy Rule”, named after Stephen Conroy, the senator spearheading this ‘initiative’.

Simply put, it’s related to "The Hitler Rule” and “Godwin’s Law” and is formulated thusly.

The first person to equate free speech with an unrestricted right to access child pornography, loses.

This rule has become necessary because the government seems to be using the “Are you still beating your wife?” approach to anyone who questions the policy. Essentially, if you are against the filter, you must be for child pornography – we are trying to protect children from child pornography.

The proposed “clean feed” is easily bypassed by a VPN (which comes for free with Windows and Apple computers) which not only masks someone's true IP address, it also adds an extra bonus layer of encryption.

I’d argue that its easier to catch criminals when they don’t use a VPN to mask their actual IP address and encrypt their traffic. Just seems like common sense to me.

At best its going to make the incompetent pedophiles harder to catch because they will be forced to learn how to use a VPN to get what they want.

I’d also imagine that many police leads come from the inexperienced ones who get caught, and this allows police to infiltrate their social sphere. I’d like to know if anyone has any statistics, information or evidence either way that shows that a lack of encryption by one member has ever allowed the police to break up a pedophile ring.

It’s arguable that this will force them further underground and make them harder to detect, which will in effect mean that this ‘initiative’ will make the Internet safer for incompetent pedophiles.

I’d suggest the Clean Feed should have the following tag-line. “The Clean Feed – Forcing pedophiles to use stronger encryption”. Because in the end, that’s going to be the effect. There has been no evidence presented of children “stumbling onto child porn”. I would argue that the clean feed would make this less likely as it would become much harder to find – so one part of their argument at least stacks up. Shame about all the collateral damage.

In 1999 I created a semantic markup language that could be dynamically transcoded into output targeted for the requesting device.

I’d been using XML since 1995, I just didn’t know it. I was lucky enough to be exposed to SGML and developing my own markup engines in the late 80’s for demo-scene magazines and professional in the early 90’s so I had a kind of a head start.

It was initially used for set-top box content transcoding. The language could be entirely or partially executed on the server. Partial execution involved some translation into JavaScript on some browsers or a custom microbrowser on a set-top box or device.

It was also of course applicable to mobile phone development and with WAP on the way it was very little effort to adapt it.

It could take an XML feed from a server or transcode existing HTML into XML feeds and then break the content up into chucks suitable for a mobile device. When we tried to sell this award winning software, nobody was interested as we were just in time for the collapse of the tech bubble. I’ve been told that if we had done this a year earlier it would have sold for tens of millions – but those are the breaks.

So just in time for the credit crunch I’ve recently launched my little image transcoding service. http://qr.tl and have built into it the option to resize an image to the ideal for the mobile device doing the requesting using a semantic hint. eg. wallpaper, logo, button or as a percentage of screen height or width.

Now I’m turning my eye back to serving complete applications because I have a need to have a web app running under multiple devices.

Now I’ve been keeping my eye on XHTML2 and HTML5 in the hope of adopting this as my new starting application format for mobile devices and widgets.

XHTML5 has some handy semantic tags such as section, header and footer which make it ideal and scarily close to my old semantic format.

One of the issues is the sordid history of HTML5 . The short version goes something like this. (Please correct me If I am wrong).

A group (WHATWG) , unhappy with the speed at which the W3C was progressing with the next version of HTML, started a new standard called HTML5. This was eventually adopted by the W3C by forming the W3CHWG as the starting point of the next generation of HTML now commonly refereed to as X/HTML5.

There are three different locations where you can see the progress – its rather confusing if you don’t realise that the two versions on the W3C  site are a delayed/filtered version of the same document.

Working Draft

http://www.w3.org/TR/html5/

Latest Editors draft

http://www.w3.org/html/wg/html5/

Current Draft

http://www.whatwg.org/specs/web-apps/current-work/

As it says on the WHATWG’s website.

Looking at the Browser Global Marketshare Statistics on getclicky.com, there is an obvious 7 day cycle with 5 days high, 2 days low for IE and 5 days low, 2 days high for Firefox – both in perfect sync.

My interpretation of this is that people use IE at work but on the weekend at home they use Firefox.

I’m guessing it reflects IE’s dominance in office Intranets and its integration into Microsoft’s applications (outlook webmail etc.).

On a side note – it looks like Chrome is staying steady on just over 1.5%

http://qr.tl (pronounced ‘qwertle’) is a real time image manipulation service that lets you crop, compose, scale, tint, slice, dice images and generate QR codes without having to have any software installed on your webserver or PC.

The way it works:

In your code you generate image tags in your HTML eg. <img src=”http://qr.tl?m=INSTRUCTIONS”>.

qr.tl generates images based on the instructions in the URL

eg

http://qr.tl?m=(N200x200Yellow)G10x10R1,1-8x8(Q100http://qr.tl/)O(http://img2.freeimagehosting.net/uploads/f9efc01cee.png)J

Generates

There is no website for qr.tl at the moment to describe the service or to help you generate your own sets of instructions, but the service is up and running and ready for you to play with.

For now if you want to use qr.tl you need to learn the instruction format. (read on :) )

The master plan for the website is to create a tool that will allow you to visually create instructions based on qr.tl templates.

For now this blog post will function as the official instructions and forum.

Here are some examples with detailed descriptions to give you a basic idea of what qr.tl can do.

Some Examples

Overlay Composition

http://qr.tl?m=(http://www.watchingcw.com/wp-content/uploads/2008/07/kittens.jpg)(http://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Censored_rubber_stamp.svg/550px-Censored_rubber_stamp.svg.png)O

This will overlay one image over the top of another which results in the following image.

If you look carefully at the URL will see that it consists of three distinct elements marked red, green and orange.

It is the execution of these instructions in the specified order that produces the end result. The aim is to end up with only one image on the stack. If you have more than one image, the server will generate an error message long the lines of.

  Not very informative – hopefully the next release will have something to help you debug errors in your instructions.

Now if we run through these instructions one by one.

1. (http://www.watchingcw.com/wp-content/uploads/2008/07/kittens.jpg) Push this image onto the stack – this is the top and only image on the stack.
2. (http://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Censored_rubber_stamp.svg/550px-Censored_rubber_stamp.svg.png) Push this image onto the stack. This becomes the new top of the stack. There are now two images on the stack.
3. O Executes the Overlay instruction. This will take two instructions down off the stack – overlay the image from the top of the stack and push the result back onto the stack.

There is also an underlay instruction U. In the previous example, if you reverse the order of the image push instructions and use the U instead of O as the last instruction you will end up with the same result.

http://qr.tl?m=(http://upload.wikimedia.org/wikipedia/commons/thumb/7/70/Censored_rubber_stamp.svg/550px-Censored_rubber_stamp.svg.png)(http://www.watchingcw.com/wp-content/uploads/2008/07/kittens.jpg)U

Generating Cropped Thumbnails

Here is another example – lets say that I want to display some thumbnails on a web-site, and all I have are some larger images that are the wrong aspect ratio.

So starting with this larger image

http://silkiestar-siberian-cats.co.uk/images/kitten4.jpg

Can I fit it into a smaller thumbnail?

Yes.

http://qr.tl?m=(N200x200White)CZ(http://www.watchingcw.com/wp-content/uploads/2008/07/kittens.jpg)O

In this case we have

1. (N200x200White) created a new 200x200 image with a white background and push that onto the stack
2. CZ set the Cropping type to Zoom on that image’s Cropping Type register.
3. (http://www.watchingcw.com/wp-content/uploads/2008/07/kittens.jpg) Push this image onto the stack.
4. O Executes the Overlay instruction. This will take two instructions down off the stack – overlay the image from the top of the stack and push the result back onto the stack.

In this case the cropping type instruction is the key.

You can choose CZ = Crop Zoom, CF = Crop Fit and CN = Crop None.

QR Code Generation

Here is an example of generating a QR Code.

http://qr.tl?m=(http://farm2.static.flickr.com/1336/612092698_dc7da3349b.jpg)(Qhttp://m.twitter.com/DrMiaow)J

Here I have taken an image and placed a QR code next to it.

1. (http://farm2.static.flickr.com/1336/612092698_dc7da3349b.jpg) Push this this image onto the stack. Yes that’s me.
2. (Qhttp://m.twitter.com/DrMiaow) created a QR code image that points to my twitter feed
3. J and then joined the two images together. The default join alignment is ‘to the right’

Generating Lolcats

And of course what system would be complete that could not generate lolcats?

qr.tl implements the now famous  :) LOL-STAR markup language.

http://qr.tl?m=(http://www.reallyfunnypictures.co.uk/animals/pics/25.08.07/tenniscat.jpg)[<Oh%20hai,%20can%20Has..//>WTF!!]

1. (http://www.reallyfunnypictures.co.uk/animals/pics/25.08.07/tenniscat.jpg) Push this image onto the stack
2. [<Oh%20hai,%20can%20Has..//>WTF!!] Annotate the image using this text.

Under The Hood In Detail

Essentially the qr.tl implements a simple image processing virtual machine. The VM consists of a ‘Stack’ of images. The topmost image on the stack has Registers (variables) that can be set by other instructions. Images on the stack can be manipulated by instructions.

The instructions are specified in RPN order.

A set of qr.tl instructions is valid if it leaves one image left on the stack after all possible instructions have been executed.

There are three classes of instructions

Image Push

These are always of the form ‘(‘ something ‘)’ and they push an image onto the Stack. This new image becomes the top of the stack.

(URL) Loads an image.

eg.

(http://farm2.static.flickr.com/1336/612092698_dc7da3349b.jpg)

(NWidthxHeightColor) Creates a new image of dimensions WidthxHeight (pixels) with a background color of Color . Color is optional. Default at the moment is Transparent.

eg.

(N100x100)

(N100x100Transparent)

(N100x100Blue)

(QSizeString) Creates a QR code based on the supplied String. Size is optional.

eg.

(Qhttp://m.twitter.com/DrMiaow)

(QTesting 1 2 3)

(Q400http://m.twitter.com/DrMiaow) Create QR code that is 400x400 pixels.

Image Register Assignment

Each image on the stack has a set of registers, By executing these instructions you are able to set the registers on the topmost image.

ADigit = set alignment

This will set the alignment. Digit is any value from 0 to 9 and corresponds with the keys on a mobile phone keypad.

This has an impact on

1. where an image is drawn when it is overlaid or underlain into a region where it does not take up all the available space.
2. where an image is placed for a join operation.

A1 = Top Left	A2 = Top Center	A3 = Top Right
A4 = Left	A5 = Center	A6 = Right
A7 = Bottom Left	A8 = Bottom	A9 = Bottom Right

 

CType = Set cropping type.

Sets the centering algorithm

CZ = Zoom - Image will be cropped to fit the available space.

CF = Image will be fitted resized into the available space

CN = No resize

TColor = transparency color           

This defines the color that will be treated as transparent

eg.

TRed

TTransparent

TOrange

GWidthxHeight = Project a grid over the topmost image on the stack that is used in combination with the Rectangle (R) instruction

eg.,

G10x10 projects a 10x10 virtual grid over the image.

RTop,Left-WidthxHeight = Set the drawing rectangle within the grid.

eg.,

R2,2-3x3 Sets the rectangle to start at position 2,2 and be 3x3 wide. The units for this on the image are defined by the Grid (G) instruction.

TTransparency = set image transparency.

This defines the value of the transparency

eg.

T.5 = 50% transparent.

T.75 = 75%

Instructions

O = Overlay

Takes the top of the stack and the next image after that on the stack, removes them from the stack. Overlays one on the other (overlays top of stack on top of  next on stack).

Overlay is influenced by several registers.

The grid and rectangle register pair defines where the overlay is performed.

The alignment register affects where the overlaid image is positioned within the rectangle.

The transparency register defines how the images are combined.

The transparency color register defines which color is treated as transparent.

U = Underlay

Takes the top of the stack and the next image after that on the stack, removes them from the stack. Overlays one on the other (underlays top of stack under next on stack).

Overlay obeys several registers.

The grid and rectangle register pair defines where the underlay is performed.

The alignment register affects how the underlaid image is aligned.

The transparency register defines how the images are combined.

The transparency color register defines which color is treated as transparent.

J = Join

Takes the top of the stack and the next image after that on the stack, removes them from the stack. Joins one image to another.

The alignment register affects how the underlaid image is aligned.

Some More Complicated Formatting

Now lets pull it all together with this example

http://qr.tl?m=(http://farm2.static.flickr.com/1336/612092698_dc7da3349b.jpg)[SMS%204223G33K//]A9G20x20R12,12-7x7(Qhttp://m.twitter.com/DrMiaow)OA8(http://assets1.twitter.com/images/twitter_logo_s.png)J

1. (http://farm2.static.flickr.com/1336/612092698_dc7da3349b.jpg) Push this image onto the stack. Yes it’s still me.
2. [SMS%204223G33K//] Annotate the image with the text SMS 4224G33K (I’ll leave it up to you to determine the significance of the numbers 42 and 23)
3. A9 Set alignment to 9 (bottom right hand corner) Look at your mobile phone numeric pad.
4. G20x20 Define a virtual 20x20 unit grid over the top of the image
5. R12,12-7x7 Set our drawing rectangle at position 12,12 and make it 7x7 units.
6. (Qhttp://m.twitter.com/DrMiaow)
7. O Overlay the top of the stack onto the one below it. Removes both from the stack and pushes this new image.
8. A8 Set alignment to 8 (bottom) Look at your mobile phone numeric pad.
9. (http://assets1.twitter.com/images/twitter_logo_s.png) Push this image onto the stack
10. J Join the top two images to each other., Because we are using A8 (bottom) the twitter logo (top of the stack) will be placed below the next image on the stack

Notes

Its alpha – so don’t be alarmed if it spits the dummy at you at some point or gives you a cryptic error.

The most common error you will get will be…

…  which just means that you have either left more than one image on the stack or you have executed an instruction the requires more images on the stack than you have.

At the moment the service is open for anyone to use with some restrictions on size and dimensions of the images imported and generated. If you embed any <img> tags in your HTML that link to qr.tl generation instructions – at some point in the future they will cease to work without some kind of account with qr.tl. Yes I have plans to monetise this.

Yes you can return .png or other formats, but I’m not going to say how yet.

Some browsers may require that your instructions are strictly URL encoded http://www.w3schools.com/TAGS/ref_urlencode.asp. I’ve not seen a modern browser that still has this problem – but best practice is always to ‘urlencode’ them. Url Encoding is a standard function every web development language I have seen.

I can be contacted at drmiaow@gmail.com

So if I turn on the aspect ‘loggedin’ these will show unless they are inside an aspect that is off. Aspects are hierarchical. Visibility obeys the laws of physics.

So consider this statemachine and in particular the part for managing the classical Web 2.0 Invite system.

So now we need to map between the states and the views

The State View Map

The state view map is a formalised description of mappings from a state to a view and a set of aspects of that view.

A state view map description consists of a list of states and the pages and aspects that should be visible.

A state can be mapped to a particular page – so if that state is true then it switches to that page/view.

A state can be mapped to an aspect. For this example check out the invite mappings. This is a very simple example – I only have three minutes! :)

Bringing it all together in an application. Template for the view. If you include the history iframe it will do the classic AJAX history tracking.

The function that starts it all.

Every time there is a key hit in the invite email input, we re-determine the current state.

When we re-determine the state the state machine definition knows that for the send invite button to be ready we need to return true from isInviteReady()

And that function simply returns true if there is a regex match on an the content of the invite email field.

And here is a Demo of it in action.

The End

James Mc Parlane http://blog.metawrap.com/

http://twitter.com/DrMiaow

Next Presentation At WebJam – Adding a dynamic Layout / Skinning engine to State/View engine.

Oh and BTW…

Massive Are Hiring HTML/JS/CSS Front End developers

Knowing XML/XSLT Is a bonus!

Mail work@massive.com.au

David Vandenberg (One of my co-workers at Massive) attended StartupCamp  this weekend and in 24 hours created uT.ag (here is the elevator pitch video) which allows you to create a compressed url like http://tinyurl.com/ and http://is.gd/ but goes one step further and loads the site in a <iframe> with Google ads at the top.

uTag allows you to generate these urls one at a time AND you can insert some JavaScript into your website which rewrites all the external urls to go via their <iframe> host page. The end result is that all links out from your site end up showing ads at the top, and uTag send you the money.

And yes, if you have clicked on a link in my blog by now you will see that I have added it to my site.

http://ut.ag is one of those clever, simple ideas that could just work, or it could start a war, maybe both.

I can’t see how it violates the Google Adsense TOS unless they argue that it interferes with Navigation, or they stretch the interpretation of  “No Google ad may be placed on pages published specifically for the purpose of showing ads, whether or not the page content is relevant.”

Its  going to be up to the web community to decide wether or not this form of advertising is viable.

The cure is to add a single line of framebusting JavaScript to your site.

<script type="text/javascript">
   if(top.location != location) {top.location.href = document.location.href;}
</script>

But would they counter with the anti-framebusting hack for Opera And IE? Are we at the dawn of a JavaScript driven adverting arms race? Will Google’s new partial JavaScript execution its webcrawler be used to counter this by affecting the page-rank of the source pages?

I’m also curious to know what will happen to blog trackbacks.

I can see how people running ads in their sites (like me) may feel that this dilutes their own advertising’s attention share on the target page.

I can also see how it shares some of the advertising revenue around and rewards sites that direct people toward relevant information.

Is this an acceptable way for content owners to extract revenue from traffic out of their site?

In the case of blogs, if the revenue could be split between the source and destination sites could this be a basis for some kind of treaty?

If they checked for ads on the target site and left sites with ads untreated, would that make it more acceptable?

Check out the Utag blog http://ut.ag/Blog/ and the StartupCamp live stream from uStream. At the time of writing this they had all gone to bed, but should be up again in 10 hours or so :)

Times seem to ahead by an hour. Suspect some kind of JavaScript bug.

GMail far RHS column in IE7

GMail far RHS column in Chrome.

I’ve been tracking Google Chrome’s market share. This is important because as web developers we get clients wanting to support the top ranked browsers. Normally clients want just IE, FF and Safari supported  Sometimes this includes list Opera.

At its peak Google Chrome was a fraction over 3%

In the last 12 hours its dropped down to just under 2.5%

http://getclicky.com/global-marketshare-statistics

So obviously of people who have tried GC, some have stuck with it and others have abandoned it.

I’m expecting his downward trend to cease and see some bounce as the GC as primary browser uptake slowly crawls upward.  I’m using GC as my primary browser and I know a few others who are was well. I’ve always used IE as my primary and FF as my dev browser. GC has managed to move me.

The big question that Web Developers want answered is, “Is this going to mean more effort to support the most popular web browsers?”. If after the bounce back GC was to overtake Opera, that's kind of interesting because it could mean that Opera is not the 4th browser. As GC is based on WebKit, this means our job may be a little easier as HTML/CSS for Safari should work for GC so the incremental effort required to support that 4th browser gets buffered by its similarity with Safari.

Wether or not GC ends up above or below Safari in the rankings is probably not a great technical concern, assuming that there is not a huge difference between their CSS and JavaScript behaviors. I’m very happy that even such fiendishly devious JavaScript as my JavaScript Macro Recorder works under GC – so I’m hoping the JavaScript quirks are going to be minimal.

I’ll be keeping an eye on these rankings over the next few weeks – its an interesting race.

I’m predicting that Chrome will take a large bite out of Safari after the OSX version is released, assuming that it performs faster and renders better than Safari. The FF users will much harder to move. FF users will stick to FF because of the plug-ins that they can not live without. Eg. Dev tools such as firebug and ad blockers.

Interesting times.

Update – 8 hours later...

24 Hours later..

I Like it. Its fast. The tab page is genius. Its my default browser for everything bar web development. Webkit developers console is outclassed by FireBug on FireFox.

Flash works. Flash player install required a few goes.

Java Works.. but need latest Java 6 Update 10 plugin http://java.sun.com/developer/technicalArticles/javase/java6u10/

My JavaScript library works with no modification required. So happy I could cry.

Silverlight does not work. Hope this is resolved soon.

Sadly my Blog editor does not work so this post will be short. Using LiveWriter mostly now anyway, but its not installed on this machine :)

Some interesting points from PPK http://www.quirksmode.org/blog/archives/2008/09/google_chrome.html

I’m thinking of making some updates to my Timezone Converter Utility.

I’ve had some great feedback from people using the GPS AJAX/Google Maps/Google Earth/ActiveX integration. I seem to have a lot of users in the merchant navy and people who need to know if its an appropriate time to phone someone overseas

Some new politically induced changes in timezones means I’ve now got a critical mass of adjustments to get published. I’m considering digging up my old distributed memory project to use as a dynamic timezone database in the future.

If you want to suggest a change, feature or fix, now is the time to do it.

I've not been so impressed by a search engine since Google hit the waves.

http://www.cuil.com

What is particularly impressive is the usability. And the category explorer that so far seems to be mostly spot on and very useful. I find myself going to it more than the search results, it doubles as a kind of mimetic thesaurus.

I have seen it get confused.

It does seem to be suffering from its sudden popularity.

I agree with almost all the criticism of it, especially the lack or low ranking of Wikipedia entries.

http://blogs.siliconvalley.com/gmsv/2008/07/size-may-matter-but-theres-more-than-that-to-achieving-satisfaction.html

http://www.readwriteweb.com/archives/cuil_good_but_not_good_enough.php

http://www.makeyougohmm.com/20080728/5239/

http://searchengineland.com/080728-000100.php

Despite its nice UI/UX, in the end, the true user experience depends on its usefulness. Does it function as a good search engine?.... and to that my answer is an emphatic 'almost'.

I'm not going to switch from Google but its the best usurper I've seen yet.

*Update*

Ive started using Cuil as a research tool, not for its search results, but for the "Explore By Category" box.  When its correct, its associations are educational. Almost a Wikipedia entry generator.

Mostly its correct or humorous, sometimes both. eg. Mark Pesce is listed under "Psychedelic Advocates And Proponents" and "Psychedelic Researchers" the rest are spot on.

I started witing this two years ago and never really got around to blogging about it. In a nutshell this is a module that runs within the MetaWrap JavaScript library that allows you to define a finite state machine in XML. The finite state machine can call out to JavaScript to check values and notify the application of state transitions.

This development is a follow on from my previous research into Parsing Theory and part of an ongoing interest in streamlining web development. I've recently started using the state machine for its intended purpose so after 18 months I’ve finally decided to dust it off and blog it :)

My thesis is, in a nutshell that as developers we often end up dealing with complex logical situations in a user interface that are best explained by this sketch from Monty Python's The Meaning Of Life.

MR HUMPHREY: I begin the lesson, will those of you who are playing in the match this afternoon move your clothes down onto the lower peg immediately after lunch, before you write your letter home, if you're not getting your hair cut, unless you've got a younger brother who is going out this weekend as the guest of another boy, in which case, collect his note before lunch, put it in your letter after you've had your hair cut, and make sure he moves your clothes down onto the lower peg for you. Now,--
WYMER: Sir?
MR HUMPHREY: Yes, Wymer?
WYMER: My younger brother's going out with Dibble this weekend, sir, but I'm not having my hair cut today, sir. So, do I move my clothes down, or--
MR HUMPHREY: I do wish you'd listen, Wymer. It's perfectly simple. If you're not getting your hair cut, you don't have to move your brother's clothes down to the lower peg. You simply collect his note before lunch, after you've done your scripture prep, when you've written your letter home, before rest, move your own clothes onto the lower peg, greet the visitors, and report to Mr. Viney that you've had your chit signed.

Now, like me your probably written an application with a user interface that ends up with complex logic all over the place and a single change results in unpredictably strange consequences. As you make changes to this the code complexity grows. As developers, the best we have been able to come up with is MVC, which puts all that logic is all in the controller, however this is distributed throughout the code of the controller and there is no guarantee that you won't end up dabbling in the Kafkaesque.

Ideally I want some way of

1. Describing a set of integrated rules in one location in a domain specific language.
2. Decoupling this description as much as possible from the the Views.
3. Allows those rules to be provable and enforced via contracts.
4. Allow the system to be intelligent enough that it exhibits emergent behavior via its logical roots, this emergent behavior can then be leaned upon and provide complex yet intuitive behaviors to users for free.

My aim was to break the controller up into a state machine based rules system and a layer that could mediate between the state and view.  The states could be mathematically provable with contracts ensuring that no illegal state combination could be entered.  Combining this with a direct mapping layer between states and views, could result in a lot of code being abstracted away into the state machine and result in a more compact code-base.

A state machine interrogates a model via user defined JavaScript functions.The state view map defines what views and aspects of the view should be visible and triggers their display. 

JavaScript Finite State-Machine

The state-machine is a formalised description of the possible states of a system. States are either 'active' or 'inactive'.  The state-machine is multi-dimensional (states have sub-states) and multi-state (more than one state can active). 

The state-machine description consists of an XML file that describes a list of states.

Each state has a collection of sub-states which can only be active if their parent is active.

Each state has...

A list of rules for validating states which allow for a degree of asserting contracts between states.

A state can 'exclude' another state. Which is a way of saying that if this state is active then the other state should be inactive. If not, a fault will be indicated by an exception.

A state can 'include' another state. Which is a way of saying that if this state is active then the other state should also be active. If not, a fault will be indicated by an exception.

A list of rules that describe how a state is affected by the activation of other states or the return from JavaScript calls.

A state can 'require' some conditions to be met that another state is active or that a JavaScript function returns true. Any sub-state automatically requires its parent state. If you find a state requires only one or more states to be active then it should probably be a child of one of those states.

 

The reverse of ‘require’ is ‘unrequire’ such that the state will require a state to be inactive and expect called JavaScript functions to return false.

Can anyone think of an alternative to ‘require’ and ‘unrequire’. I’m seriously considering ‘canhas’ and ‘doesnotwant’ as they make as much sense as any other alternatives so far.

A list of rules that describe how a states can control that activation of other states.

A state can 'negate' a specified state in which case when the state becomes active it will try and make the specified state inactive.

A state can 'affirm' a specified state in which case when the state becomes active it will try and make the specified state active.

A list of triggers that are fired when the pattern of active states changes. The trigger is the call to a JavaScript function.

A trigger can fire when a states 'enter' (become active).

A trigger can fire when a states 'exit' (become inactive).

A trigger can fire when two specified states transitions 'from' or 'to' active/inactive between determining states.

A state can have a lock which forces it into its current state until the state machine is reset.

The state machine has the following public accessible JavaScript functions

MetaWrap.State.testState(stateName) - Returns true if the named state is active

MetaWrap.State.negateState(stateName) - Tries to set the named state to inactive then determines the new state and fires transitions. Returns true if state is 'inactive'

MetaWrap.State.affirmState(stateName) - Tries to set the named state to active then determines the new state and fires transitions. Returns true if state is 'active'

MetaWrap.State.flipState(stateName) - Flips the named the named state from active to inactive or visa versa. Returns true if state is was flipped.

MetaWrap.State.determineState()  - Calculates the current state. Called after changes to the model are made that may require the state machine to re-evaluate.'

JavaScript State Machine Examples

1. Toaster Example

NOTE – This won’t work in Safari or Opera.. yet. Neither of these browsers support client side XSLT. I’m working on a simple solution for this.

http://test.metawrap.com/javascript/tests/state/test_10_state.html

My first serious example was to model a simple toaster in a way that used most of the functionality of the state machine.

I wanted to model two classes of behavior.

The first are based on the explicit physical properties of the toaster (power on/off, bread in/out, lever up/down). I added the typical toaster behavior that you can’t push the lever down if the toaster is not on.

The second are based on the higher level states build up on the physical states, for instance if the power is on, the bread is in and the lever down, then the toast is cooking. I have also added the state where if you put the lever down after the toast has cooked, it will burn the toast.

1. Tic Tac Toe Example

I think it was Lela who suggested that I try and model Tic Tac Toe. So I sat down and defined the finite state machine.

NOTE – This won’t work in Safari or Opera.. yet. Neither of these browsers support client side XSLT. I’m working on a simple solution for this.

http://test.metawrap.com/javascript/tests/state/test_13_state.html

One pleasant surprise is that formally describing the states as a whole makes you think about them as a….. whole :) . And the formal description can make some things obvious. For example. In the way I modeled Tic Tac Toe, it could be X’s turn or O’s turn.

And I set it up for one to deny the other (note that x_turn defaults to true, so X goes first).  This means in the JavaScript my code is nice and simple.

Once the game is over, who’s turn is it? There is a fault in my current model that became obvious after examination. I thought I was being clever by inversely relating x_turn and o_turn because it gave me a way of tracking the turn inside of the state machine which would then flip the current state.

However at the end of the game when I want to make it nobody's turn, if I negate x_turn, o_turn becomes true and then when I negate o_turn, x_turn becomes true. I solved the issue by locking the turns.

I’m probably going to modify lock so that you can specify a value to lock it on and get it to suspend all further affirmations and negations down the chain, but I need to work out what the implications for that could be.

State View Map

The state view map is a formalised description of mappings from a state to a view and a set of aspects of that view.

A state view map  description consists of a list of states and the pages and aspects that should be visible.

This will be the topic of my next post.

Most impressive and most scary technology demo I have seen this year.

Once this is as easy to use as Photoshop, our trust of media will be reduced even further.

Yes its advertising for Microsoft -but its for a good cause.

"Microsoft Australia are running an interesting campaign to demo MS Office 2007 and raise money for charity at the same time. The premise is fairly simple. Users head over to the campaign page (built with Silverlight) and watch a 30-second clip of 9-yr olds explaining MS Office 2007, and Microsoft donates one Aussie dollar to The Smith Family."

http://www.microsoft.com.au/donatenow is the link

Looks like Twitter is going into the garage tonight.

Its coughing a bit of blood at the moment so that may be a good thing for all of us twitticts.

http://www.istwitterdown.com

http://www.twitter.com

I love DigsBy but there are three annoying behaviors that could be solved with.... just a few more options :)

1) In popup mode and an IM from person I didn't have a conversation going with comes in, it pops up and takes focus and whatever I was typing starts streaming into the popped up IM window..

I've not found a way to stop it from taking focus - even when turning off "Popup"

The number of times I have almost posted code or a part of an email I am typing to Twitter is quite astounding. I'm removing the Google Talk and MSN accounts and going back to native. I'm still using Digsby to monitor Twitter, Facebook and half a dozen email accounts.  I've been using Twitter via Google Talk and its amazing how much faster the messages come through via Google Talk I'm hoping that's just down to polling speed and not Twitter API issues :)

2) The flashing of the application toolbar icon.

I want to be able to tell it to not flash on every message source. I don't want to know that I have gotten 10 messages from Twitter or ThumbWhere. I want to know if a coworker messages me.

3) I run it at home and at work - and I don't want the same behavior in both environments. These ones should be machine specific as they are specific to the hardware.

It may not work for a pot or a kettle, but thanks to some operating systems giving the topmost focused window process a higher priority, it does work for computers.

This will only really work If the process is graphically intensive and is doing an awful lot of computation eg.

It can be worthwhile just clicking on that window to make it focused and watching time pass by. Hint. Open a web page and do some practical research, just keep bringing that process window back to the top and clicking on it if it goes away because you have clicked on something in the web page.

So next time someone says "A watched kettle never boils", you have the counter argument.

Possibly the best comic form summary of the CDO MBS scandal. (Sub-prime loans crisis.)

http://www.suburbanhousehunters.com/about/mortgage-crisis/

Of note.

1. SPV's is the general term for the more specific term of SIVs (Structured Investment Vehicles).  Expect to hear more about these in the future.
2. They don't mention that some of the ratings agencies and the financial institutions had shared ownership which could be counted as a conflict of interest.  IMHO If nothing is done legislatively to regulate ratings agencies then this can always happen again. They obviously have a large duty of care.

LOL-* (Pronounced "LOL STAR")  is a simple and compact markup language for creating image macros on your mobile phone via MMS.

An implementation of this language has been included as part of the http://rss.test.thumbwhere.com MMS to RSS gateway.

When you submit an MMS message from a mobile phone you typically send one media element with a subject. A server capable of rendering LOL-* is able to extract the LOL-* markup and render one or more captions or annotations onto the encapsulated media.

Caption Your MMS Submissions

Any text you put at the start of the subject in square brackets.

[Like This]

will be turned into a caption.

The remainder of the subject will be left as is, so if you send

[Fear Me Human]Why is my kitty growling?

It will caption the image with "Fear Me Human" and the subject will be "Why is my kitty growling?"

Why is my kitty growling?

A Caption can be positioned in three rows on your photo, [Top/Middle/Bottom]. The / character is used to switch to the next row.

A more complicated example is

[I/love/these things]Tribbles taste like chicken.

which will caption the image on three lines "I" will be at the top, "Love" will be in the middle and "These Things" will be at the bottom. The Subject of the message will be "Tribbles taste like chicken!"

Tribbles taste like chicken.

You can of course leave the first two rows blank if you want your caption at the bottom as in this next example,

[//I Is Raptor U Fool!!]Why does my Kitty Have Glowing Eyes?

...which will caption the image at the bottom with "I Is Raptor You Fool!". The Subject of the message will be "Why does my Kitty Have Glowing Eyes?"

Why does my Kitty Have Glowing Eyes?

Putting a < or > in your caption will align the text to the left or the right so...

[<Oh hai, can I Ha..//>WTF!!]

...will put a caption at the top, left justified and at the bottom right justified.

All captions are automatically capitalised, they just seem to look better that way.

If characters are already capitalised, they will remain capitalised. Note the WTF!! in the previous example was not converted to Wtf!!

Here is another example.

[//O RLY?]

You don't have to end your caption instruction with a ] if you are not going put some text after it, such that ...

[nom nom nom

...will still work as a top caption even though the caption command is missing its final ]

As part of an MMS message standard you are also allowed to send one or more large blocks of text, which ThumbWhere treats as the message body.

If you send a video, the caption will be rendered over the top of the thumbnail and the video will remain unaltered.

If you run out of room in the Subject, keep the Subject blank and use the message body. If the Subject is blank, the Body will be treated as the subject and image commands such as caption and rotation will come from the body.

Image Rotation. Not all phones have sensors to detect if you are taking an image on its side, so you may need to rotate the image from your phone for it to make sense.

Luckily you can do this as part of LOL-*

Rotate Your MMS Submissions

You can add special commands to the start of the subject to rotate your photos. This is useful if your phone's camera functions don't automatically rotate an image before sending it via MMS

< Will rotate the photo left (anti-clockwise)

> Will rotate the photo right (clockwise)

So if you sent in the following subject

>I Love My Kitty!

Your picture will be rotated to the right and given the subject of "I Love My Kitty."

You can rotate your image before applying a caption such that if you sent in the following subject

>[Distinctly Told//Not To Mow During The Day]Australia - Its Hot

Your picture will be rotated to the right and given the subject of "Australia - Its Hot", a top caption of "Distinctly Told" and a bottom caption of "Not To Mow During The Day"

Australia - Its Hot

LOL-* is being constantly extended. I will post updates.

If you think these instruction can be made better - please send me an email.

"A new generic method for exploiting a common problem in software code that was previously thought to be prohibitively difficult to attack is generating a wave of concern and surprise in the security community."

http://news.bbc.co.uk/2/hi/technology/7358792.stm

This is really just another buffer overflow attack. If he is taking advantage of bugs in the VM then it's just an old fashioned exploit.

Because the 'code' you execute in a Virtual Machine or Intereter does not directly access the low level runtime libraries, we assume that the programs we develop can not cause a buffer exploit. If there is an exploit then it lies in the VM itself. Its very easy in a low level language like C or C++ to allow a buffer exploit simply due to the semantics of some of the calls. You have to actively check for these issues and have some knowledge on how these exploits arise. When developing code that is executed via a VM, the onus for this checking for and blocking of this class of exploit is shifted to the application, which in this case is the VM itself.

We trust that a VM is checked and tested thoroughly and is free of these kind of bugs so that as developers we can not worry (so much) that our code has some kind of exploit.

If anything this paper simply reminds us that these VMs are just another application and if they have holes, these can be exploited.

Finally blogging an observation I made last year.

Its very simple.

History is repeating itself.

In the US, "Freed Men" where given the soft and non explicit right to vote by the Thirteenth Amendment in 1865, although it was 100 years before laws were passed to make it illegal to prevent people from voting based on their race.

Women voted nationwide for the first time in the presidential election of 1920.

There was a battle between the Suffragettes and the "Freed Men" for the public high ground, one of the arguments being along the lines that the American public would not let both groups get the vote at the same time. One group would have to go first.

The fight was dirty and divisive.

"After the American Civil War, both Stanton and Anthony broke with their abolitionist backgrounds and lobbied strongly against ratification of the Fourteenth and Fifteenth Amendments to the US Constitution granting African American men the right to vote.^"

"Eventually, Stanton's oppositional rhetoric took on racial overtones. Arguing on behalf of female suffrage, Stanton posited that women voters of "wealth, education, and refinement" were needed to offset the effect of former slaves and immigrants whose "pauperism, ignorance, and degradation" might negatively affect the American political system. She declared it to be "a serious question whether we had better stand aside and see 'Sambo' walk into the kingdom [of civil rights] first." While her frustration was palpable and perhaps understandable after her long fight for female suffrage, some scholars have argued that Stanton's emphasis on property ownership and education, opposition to black male suffrage, and desire to holdout for universal suffrage fragmented the civil rights movement by pitting African-American men against women and, together with Stanton's emphasis on "educated suffrage," in part established a basis for the literacy requirements that followed in the wake of the passage of the fifteenth amendment.^"

What we see on our TV's every night seems to mirror this ancient epic struggle.

And if history repeats itself - it will be Obama who gets to be the Democratic Candidate.

It also pains me that I seem to know more about the US political system than that of my own country.

Its pains me more that I seem to care more about the US elections but as I said in 2000. "The US elections effect the world to such an extent, they are too important to be left up to Americans". I think history has borne that one out so far.

Yet again, we are the bridesmaid and not the bride.

And the winner in our category of Best Interactive Channel was http://www.wedigtv.com/

So its congratulations to everyone involved - its an honor just to be nominated!

Next Year Gadget! Next Year!

Coming from Perth Western Australia and remembering the Annual Birdman Rally from the 1970's, I could not miss the the RedBull Flugtag.

Arrived at 11am. According to the announcements they were expecting 20,000 people but got 50,000. The crowd was stretched all around from Mrs Macquarie's Chair to the Opera House. The Point of action being in the Harbour about half way down Mrs Macquarie's Rd.

The second half was fine, but the first half was pure hell.

Yes this is going to be a whiny post.

Managed to find a spot, then some large Cruisers moved in blocking the view.

Found a new spot.

Then the Red-Bull boat parked in front of the ramp occluding the fun for the vast majority of the people that had not camped out from 6am.

If you were between the yellow lines, the Red Bull staff boat meant that you didn't get to see a thing.

Then the crowd started to get ugly.

In the end I performed the classic outflanking maneuver.

Found a spot where through a tube of foliage you could just make out the action. But then of course as soon as the action started everyone stood up and we found ourselves behind a family who liked to brag about their level of education by calling everyone in front of them a 'pack of c*^%s' .

We ventured on, hid behind a steam powered zeppelin and ended up deep in the heart of the staging area and by pure luck managed to score a partially obscured view of a large LCD screen...

Which spent a lot of time not working...

But worked enough that we didn't miss too much.

Although it went on and off just as people were about to smack into the water so many times that Kew wanted to crawl away into a paper bag.

If its on HTDV next year, I'm staying at home or at least taking a bottle of wine with me to dull the pain.

Its the end of Daylight Saving in NSW Australia this morning.

I managed to patch my phone the day before so that changed over fine.

A number of devices in my house however failed to change over correctly. I think their operating systems systems are no longer supported or the updates failed to come through automatically.

I would appreciate some help tracking down the OS patches or configuration changes for these ones.

This device broadcasts time to my lounge-room. It clearly failed to update itself.

This device broadcasts time to my kitchen. I suspect if the problem with the lounge-room clock is resolved it may provide some insight into the solution for this clock.

This crept into my room and jumped on me one hour earlier than it should have. This one is going to be a problem to solve I suspect, simply because its going to involve updating a large number of upstream devices that are outside of my direct control. The obvious ones that come to mind are the dog next door and the large ball of nuclear plasma that rises in the sky in the morning.

If anyone knows where I can download the timezone updates for any of these, I believe a large number of people in Australia will be very grateful.

The cool thing about being able to work at Massive is that you straddle the extreme technical end of making things scale, in the web 'C10k problem' sense, combined with the demands of the general public TV audience.

It combines both of my passions for the hard core Computer Science of making machines work at optimum capacity, providing developers with a simple and sensible API while also involving my eternal pathological psychological passion for the creation of an intuitive interface that combines the essential ingredients of a compelling first impression and the fugue that comes with immersion.

At Massive we are fortunate enough to get to combine web technology with the world of mass entertainment which puts us a little bit closer to Hollywood.

Or in this case Cannes.

Yes. We have been nominated for another Emmy, which makes that two Emmy nominations in a row.

http://www.iemmys.tv/awards_nominees.aspx

Check out the V8 Supercars Showreel if you want to get an feel for what the site is all about and what it delivers to viewers.

Anyone who knows me personally knows that the V8 project has been one of my focal projects for the last 3 years. Many a person has been denied my weekend company because I have been devoted to making such an awesome system and concept work. I've blogged about algorithmic success and the trepidation of designing a new version. Sometimes its all for Science!

The BigPond V8 broadband site combines live streaming, PVR time-shifting and the synchronisation of disparate data sources to bring together a coherent behind the scenes in the car narrative to the end consumer. I have loved working on this project so very much and I'm really chuffed to get this recognition.

Of course this was a team effort, with many other people involved in the project at Massive working in Design, Flash and Project management. Without many others at Massive and some of the brilliant people at BigPond and Chief Entertainment this project would not have been possible.

Check out the Massive Showreel as well if you want to get a feel for the kind of projects we work on at Massive.

Adobe is planning to release a security update for Flash Player 9 in April 2008 to strengthen the security of Adobe Flash Player.

This security update will make the optional socket policy file changes introduced in Flash Player 9,0,115,0 mandatory.

• A socket policy file will always be required for all socket connections
• A policy file will be required to send headers across domains.
• The allowScriptAccess default will always be "sameDomain"
• javascript:" URLs will be prohibited in networking APIs, except getURL(), navigateToURL(), and HTML-enabled text fields

This is probably a good thing, but I am expecting a lot innocent flash applications to get stuck in the crossfire if their developers are not prepared  or are not aware that their application will be nobbled by this update.

If you just try and install it normally from the Microsoft Live website, the installer Bork's and tells you that its not for Server 2003.

Its just that the installer does not work under the 2003, not Messenger itself.

The solution is to.

1. Hunt down version 8.0.XXX.
2. Install it.
3. Let it upgrade itself.
4. Joy!

I installed Windows Live Messenger 8.0.0787 and it worked fine on Server 2003 R2