So this week I have started an AS3 project (little things) but making sure that I totally understand the underlying reasons for choosing the architecture that I have gone for. So back to the online community and reading coded 101 sites but it has been really beneficial.

No time spent learning is ever wasted – no time spent making sure that you fully understand the life cycle of your development is ever wasted either.

perfection!! no matter how wide the line. Instead of drawing the triangle from 3 points (left, right, top) I am using 4 – mid to right, right to top, top to left, left to mid.

Thanks to Lori for just lying there girggling while I got this down!!

The comments below are for the proof of concept that is available here.

I have a love / hate relationship with code 360s. On the one hand they seem to appear in pretty much every site I have worked on and so effectively they pay the bills. On the other hand – same shit – different day.

So what happens if you take a 360 player and try to make it do new things?
First lets build it with JavaScript instead of Flash – that should be fun …. I did this for the fordCmax site.

Next – how to just change the tint of an object. I had a bit of a mess around and here is the result

It needs a bit of work still – there are issues with the load management – I need to write something for this but it wasn’t obvious until I put the demo online.

How is it working – the image is created as a composite of 4 layers – base, mask, reflection and shadows. The colour is changed by dynamically changing the background

I wanted to harness the power of this but in JavaScript and HTML5 as I haven’t had enough chance to play around with this.

I did my usual swift search – which of the coding giants can help – why Bit101 has been monkeying around too. I shall stand on his shoulders to create my masterpiece!

First off I needed read his tutorials. I got to day 3 before needing to just get on with stuff (I only get to build stuff during Lori’s nap times so I have an excuse for my impatience).

Next I added my new triangle primative to the wirelib.js.
function addTriangle(x, y, z, w, h) {
this.addLine(x - w/2, y, z,
x + w/2, y, z,
x, y - h, z,
x- w/2, y, z);
}
Then I create my aTriangle.js file (whilst humming James Blunt’s Triangle)


var x = 30;
var y = 40;
wirelib.strokeStyle = '#ffffff';
wirelib.lineWidth = lineW;
wirelib.addTriangle(x, y, 0, 500, 500);


Nice ! but narrow

so i add width
and that screws with it – I have still to sort this out but have a look and feel its power

or to put it in a more simplistic way – it does exactly what the client wants.

var tTF = timeToFrames();
var frDuration = thisComp.frameDuration;
var endTime = thisComp.marker.key("2").time;
var stTime = thisComp.marker.key("1").time;
var currentTime = tTF*frDuration;
var totalTime = endTime - stTime;

if (content > 0)
content
else
0
}
else
100

little note for later gotchas – can’t use the variable name ‘startTime’ as it appears to be reserved – it kept giving me the number 6 though i am not sure why

Initially I had planned to use Flash to create the video but then there were issues – I couldn’t get the video as an flv to start with – then Pete told me that the video would need to be distributed via youTube and the usual channels – so I started doubting that the creation of an swf file would be the best approach.

But I still needed to create a timer.

I blagged a bit of knowledge from Ivan Pinto Bravo who told me that I needed to use something called Expressions in AfterEffects and showed me the basics of getting time info from a movie clip.

So here it is – it probably isn’t the best bit of Java ever but to say that it does the job intended makes me happy and proud

100-(((timeToFrames()*(thisComp.frameDuration))/(thisComp.marker.key("1").time))*100)

But there’s more!

I don’t want the display to start showing negative values so I experimented with a bit of variable adding and guess what! it worked


var tTF = timeToFrames();
var frDuration = thisComp.frameDuration;
var markerTime = thisComp.marker.key("1").time;
var content = 100-(((tTF*frDuration)/markerTime)*100);

if (content > 0)
content
else
0