function addTriangle(x, y, z, w, h) {
this.addLine(x, y, z,
x + w/2, y, z,
x, y - h, z,
x- w/2, y, z,
x, y, z);
}
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!!
This is still a work in progress but I wanted to get it up here so that I could see what needs work.
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
So I have been watching Torchwood. The bad guys have this cool spinning triangle (very sinister).
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