just lots and lots of high quality photos of beautiful motorcycles. bikeexif.com.

Awesome page illustrating some of the different methods of projecting a 3D sphere onto a 2D surface. Check out the youTube clip at the end. http://www.crowded.fr/2009/04/20/la-projection-myriahedrale/

Zebra stripes without stripe classes. Eventually, we'll actually be able to use this stuff......

table {border-top:0px solid;border-bottom:0px;}
td {padding:15px 10px; margin:10px 0px;  border-bottom:3px solid #CC2D82; }
th {border-bottom:3px solid black;padding:20px 10px 0px 10px;text-align:left;}

th:nth-child(2n) {background:#5DB2FC}
th:nth-child(2n+1) {background:#75D1FF}

td:first-child {border-left:3px solid #CC2D82;}
td:last-child {border-right:3px solid #CC2D82;}
tr:nth-child(2n+1) td:nth-child(2n) {background:#FC5DB2}
tr:nth-child(2n+1) td:nth-child(2n+1) {background:#FF75D1}
tr:nth-child(2n) td:nth-child(2n) {background:#E8E8E8}
tr:nth-child(2n) td:nth-child(2n+1) {background:#FFFFFF}
tr:nth-child(2n) td:first-child {border-left:1px solid white;}
tr:nth-child(2n) td:last-child {border-right:1px solid white;}

[update: just realized that this is only working on ff3 on osx so the code is useless to 98% of all people, but I'm leaving it since its still fun. Ive replaced the example with an image so the rest of you can see what you're missing out on]

If you aren't doing anything tonight, you should watch Free Radio. Vh1 @ 11pm, 10pm CT

did a few drawings on postit notes with a 005 felt tip. full size versions here and here.

Finally made the switch to Rendur 2.2
The syntax highlighting is still not as fast and as solid as I like, but its still very usable. Also, rendur 2.1 was broken in FF3 so upgrading was a pressing matter. As always, please provide any feed back or ideas.

Whats new in 2.2

• javascript sandbox


• syntax highlighting for html and css. This is turned off by default (firefox only)


• ability to turn realtime editing and syntax highlighting off.
  (select "Rendur 2.2" tab. When realtime editing is turned off, click the appropriate tab a second time to render your changes)
  


• targeted editing. (firefox only) Click the target (?) to select an element and edit it's content while leaving
  the rest of the documnet untouched. Click any item in the targeted element's ancestry to
  edit that element.
  


• minor layout/interface adjustments

This is Euchambersia, a therapsid [mammal-like reptile] from the late permian. It displays an "absence of postcanine teeth in association with a maxillary pit and grooved caniniform teeth" meaning it likely employed venom to dispatch it's prey. Neat huh! Also, check out the sharovipteryx, a gliding reptile with the flight membrane spread between its BACK legs. madness.

Ive been toying with the idea for a long time - adding syntax highlighting to rendur that is. There were a couple technical challenges standing in the way, but I feel that I've mostly circumvented them. I haven't officially moved rendur to the new version yet - since it still needs more testing, but you can get a feel for it here: rendur with syntax highlighting. Hit me up with feedback. Please. ( I hope it goes without saying that this will not be enabled for IE. Screw IE. Might support safari if i get around to it. )

example of CSS highlighting

I have also added the ability to turn off real time editing as this can be rather processor intensive if you're working on a large page, or with embedded objects. Ive also added the ability to turn off syntax highlighting since slightly older systems can choke on all the cycles it eats. Remember, this is javascript, not native desktop code :)

Keep reading for a technical detail of some of the challenges I had to work around:
First and foremost is adding color to a text area. This is no minor task since emulating a textarea with a div was far more work than I wanted to do, and textareas do not support coloring portions of their contents. I solved this by setting the background to transparent and placing a div behind it with it's innerHTML linkedd to value of the textarea.

Coloring the text, rather than highlighting would have been ideal. I actually toyed with that possibility by means of setting the transparency of the textarea to 50% so the colors of the div below would show through. This had the unfortunate side effect of also making the scroll bars, text selections of text insertion caret semi transparent. I think when rgba() is more widely available, this will be possible.

The other complete pain was keeping the scroll offset of the div linked with that of the textarea. Sounds like it would be easy right? Turns out firefox refuses to fire the onscroll() event. Wtf firefox. (the bug associated with this is marked fixed, but as far as firefox 2 is concerned, it most certainly is not.) This stings me more because I am not used to you letting me down :( The workaround wasn't pretty but it worked. It involved tracking the mouse down/move/up events on the textarea and syncing during each event. This is one of the biggest processor hogs. I will likely rewrite it to delay the sync function call a few milliseconds and cancel any sync calls which are older than the most recent sync call. I then had to trap the mouse wheel scroll but that was surprisingly simple

Just mucking around with javascript, having fun. Javascript fun. Utterly useless - doesn't do a damn thing but entertain for 10-15 seconds.

PS - don't expect it to work in IE. It was fun to write, but not that fun.

In 1971 a small advertisement appeared in the back pages of Scientific American. It read, simply:

Never Be Alone Again.

It has been estimated that some thirty-five people responded to the ad, and another seventeen the following year. However, it cannot be ascertained at this point whether these fifty-two participants comprised the entirety of mail-in replies or merely selected out of a larger pool. In either case, each of the fifty-two respondents received a package approximately six weeks after enclosing twelve dollars in an envelope and sending it to a P.O Box in St. Paul Minnesota. The package contained a simple lightboard, various cables, a 103A modem, and a black button that depressed with a satisfying click. Those given to perusing the advertisements of Scientific American had little trouble connecting the pieces. The lightboard sparkled with an array of small LEDs, in seemingly random formations — the button alone did not seem to have purpose or effect, lying dormant beside the cables. In fifty-two living rooms, puzzled men and women stared at the board, trying to understand the patterns of light. And patterns there were: around 5:00pm, a great number of lights flashed on, so too around 9:00 am. During business hours there was mostly blackness on the board. Late in the night, clusters shone, and in the pre-dawn hours, there were always one or two. Slowly fifty-two souls began to realize that the tiny lights must ignite when other users turned their systems on, that each LED was another person who had seen the St. Paul ad, so was staring intently at the board, who was alone, who was like them. The button presented a mystery — though each one of them experimented with it innumerable times, the lights did not seem to be affected. Through the winter, fifty-two boards glittered in the dark, and fifty-two people watched the other lights, steady, unblinking, silent and anonymous, but somehow comforting.

In St. Paul, Minnesota, Milo Barnes sat at the switchboard of an AT&T public branch exchange. He worked the night shift, connecting jack to jack, watching the lamps light as calls connected, the drone of human conversation in his ears. He was a quiet man, taciturn towards his fellow operators, isolated in his threadbare chair. One of the only black families in his rural hometown, he had never had many friends. His parents had been farmers: onions, greens, root vegetables. Milo had gone to the city after a brief try at college, and found himself enveloped by the warm arms of Ma Bell. He remained introverted and painfully shy, despite being surrounded by a cloud of lively talk every night. In the eighteen months that the 103A modems were active, he never mentioned his thoughts to anyone, was never caught taking them from branch offices, moved through the PBX like a ghost.

In March 1972, the lightboards began to blink. It was not a very great logical jump for Barnes’ enthusiasts to recognize Morse code, and it was, after all, a short and simple message, repeated endlessly.

All’s well that ends well yet

Rose-Marie Gascoigne of New Orleans was the first to answer. She had sat with her lightboard for hours each evening, accompanied by two disinterested tabbies. She said later that her heart had “just plain stopped” when the lights began to flicker on and off. “The whole world just held its breath. I could hear the blood rushing in my head. I knew what to do–what the hell else was that damn button for? It just took me a couple of days to work myself up to it. It was like sending a message to God.”

She reached out to the all but forgotten black button, and tried to remember what she knew of Morse.

She was not the last. Danny McKitterick sent his message from Portland just minutes after Rose-Marie, by all accounts, and in the very small hours of a Minnesota dawn, Milo Barnes sat breathless among his jacks and his lamps as one by one they flashed on and off, a slow and tremulous human server in the days before the whole of the world was networked thus, finishing his line, answering his brief, quiet message, lights in the dark:

Though time seem so adverse and means unfit though time seem so adverse and means unfit though time seem so adverse and means unfit

Over and over, again and again. Milo must have smiled–it is a comfort to think of him smiling. While the other operators worked around him, oblivious, he sent out a new message to each machine that had supplied the coded response he sought, and this one was simpler than the others, more direct, and more frightening.

Pick up the phone at midnight.

As the moon came up in St. Paul, Milo Barnes closed his eyes and slotted a silver jack into place. And another, and another. San Francisco to Cheyenne. Phoenix to Charlotte. Seattle to Sacramento.

New Orleans to Portland.

Milo sat among his lamps and wires, his hands taut, and held his breath.

In Louisiana, Rose-Marie Gascoigne held hers, and put her ear to her receiver.

“Hello?”

The Loneliness Engine | Invisible Games

The super alpha build of the next version of firefox [code name:minefield] is pretty DAMN fast. download minefield.

Have you ever wanted to sort an array in a non-standard way? Have you ever wanted to sort an array of objects by one of the properties common between the objects in the array? Continue reading!

I will move through this topic as if you have no idea how awesome Array.sort() is. If you know some already, you may want to skip a bit.

Say we have an array that looks like this:
["A","a","C","c","B","b"]

When we sort it, we would expect: AaBbCc right? Well, I would anyway. Turns out we get ABCabc. Pretend you REALLY want AaBcCc, or some other non-standard sorting result. You can still use Array.sort()! It turns out that Array.sort() accepts a single argument. The expected argument is a function which will itself accept two arguments. The function should compare the two and then pass back -1, 0, or 1 depending on what you'd like to do. Return a value of 1 or greater if the first value should be first, a value of -1 or less if the second value should be first, or 0 if they are equal. This is allows us to sort an array of numbers (since by default, the sort function will sort numbers alphabetically - meaning 1,2,26,33,4,5,6 etc).

a quick and dirty mock up might look like this:
sortedArray = myArray.sort(function(a,b){return a-b});

awesome! Now we can sort by all manner of arbitrary and senseless rubrics. We could sort an array of strings but their length rather than alphabetically like so:
myArray.sort(function(a,b){return a.length-b.length});

Now, lets say that instead of an array of strings or numbers, we have an array of objects. [{object},{object},{object}] I don't know what would happen if you tried to sort them, but I would have to imagine nothing useful coming out the other end. In order to sort the objects, we need a rubric or a rule. If all the objects share a member value or property, we can use that and write a function like this:

myArray.sort(function(a,b){
     valueA = a.price;
     valueB = b.price;
     if(valueA < valueB){return -1}
     if(valueA > valueB){return 1}
     return 0;
});

Omg this is getting exciting! Can you feel it? All of a sudden, huge arrays of complex objects can be thrown to the native javascript methods rather than writting your own cumbersome sorting functions. The problem I ran into is that if you want to sort your array by multiple dimensions, the sorting methods replicate like leporidae and before long, you've got pages of them (cause you'll need two for each dimension. One to sort ascending, and one to sort descending). Its too bad that Array.sort() wont pass two additional arguments to the sorting function - one for the member property and one for the direction.....

And then there comes a point in every boys life where he finally finds a reason to write a function which returns a function as the output.

i now present - getDynamicSortMethod()

function getDynamicSortMethod(sortProperty, direction){
	var thisMethod = function(a,b){
		var valueA = a[sortProperty];
		var valueB = b[sortProperty];
		if(typeof valueA != "number" && typeof valueA != "object"){
			var valueA = a[sortProperty].toLowerCase();
			var valueB = b[sortProperty].toLowerCase();
		}
		if(direction.toLowerCase() == "up"){
			if (valueA < valueB) {return -1}
			if (valueA > valueB) {return 1}
		}else{
			if (valueA > valueB) {return -1}
			if (valueA < valueB) {return 1}
		}
		return 0;
	}
	return thisMethod;
}

we can then use this function to do all manner of crazy sorting! Assuming we had an array of objects like:

{
	name: "A car",
	price: 40000,
	year: 2008,
	maker: "Tesla",
	otherData: "as needed"
}

We can perform the following sorting operations:
sortedArray = myCarInventory.sort(getDynamicSortMethod("maker","up"));
sortedArray = myCarInventory.sort(getDynamicSortMethod("price","down"));
sortedArray = myCarInventory.sort(getDynamicSortMethod("year","up"));

One morning, one morning, one morning in May,
I spied a young couple, just making their way.
Now, one was a soldier, and a brave one was he,
And the other was a lady, and a fine one was she.

And it’s “Where are you going?” said the soldier, so free.
“I’m going to yon river; it’s flowing for me.
Going down to yon river, and sit by that spring,
And watch the water gliding, hear the nightingale sing.”

And, “May I go with you as you journey along?
If I’m to go with you, I’ll sing you a song.
I’ll sing the old Concordance, and I’ll make my fiddle ring.
Then we’ll watch the water glide and hear the nightingale sing.”

Said the lady to the soldier, “I’m lonesome and blue,
And I think from your actions that you’re lonesome, too.
We’ll just walk together, then we’ll sit by that spring,
And we’ll watch the water glide and hear the nightingale sing.”

Now after they’d been there for an hour or two,
Out from his satchel a violin he drew.
He played the old Concordance; oh, he made that fiddle ring,
Then he'd watch the water glide and hear the nightingale sing.

Said the soldier to the lady, “It’s time I should go.”
“Oh, no,” cried the lady, “Play me just one tune more,
For I had rather hear your fiddle, or just tap a string,
Than to watch the water gliding and hear the nightingale sing.”

So he tuned his old fiddle to a much higher key.
He played the Shamrock of Erin--oh, he played it so free.
He played the Shamrock of Erin, and he made his fiddle ring.
Then they watched the water gliding, hear the nightingale sing.

Said the lady to the soldier, “Will you marry me?”
“Oh, no, my fair lady, this never could be.
I have a wife in Scotland with children twice three,
And that, with the army, is plenty for me.”

“Goodbye,” said the soldier, with a parting caress.
“Tomorrow I must be at the throne of Queen Bess,
But when I come back, it will be to this spring,
Then we’ll watch the water glide and hear the nightingale sing.”

“Goodbye,” said the lady, and she gave him her hand.
“I’ll think of you often in Ireland’s fair land,
For I had rather hear your fiddle, or just tap a string,
Than to watch the water glide and hear the nightingale sing.”
mp3

Ive been toying with the idea of redesigning the portfolio, just because I don't get to play with very much fun javascript anymore. Here is a *rough* prototype. Don't click if you're using IE - I haven't bothered to test it there and Im sure it will throw errors at you. Click the large or small boxes to bring them into focus.

On the floating, shapeless oceans
I did all my best to smile
til your singing eyes and fingers
drew me loving into your eyes.

And you sang "Sail to me, sail to me;
Let me enfold you."

Here I am, here I am waiting to hold you.
Did I dream you dreamed about me?
Were you here when I was full sail?

Now my foolish boat is leaning, broken love lost on your rocks.
For you sang, "Touch me not, touch me not, come back tomorrow."
Oh my heart, oh my heart shies from the sorrow.
I'm as puzzled as a newborn child.
I'm as riddled as the tide.
Should I stand amid the breakers?
Or shall I lie with death my bride?

Hear me sing: "Swim to me, swim to me, let me enfold you."
"Here I am. Here I am, waiting to hold you."

-Tim Buckley

I love this picture for the bag carried by the man... as if on the way home from the grocery store, he decided to inspire the whole world as a casual after thought to a day spent getting ready to prepare dinner.

I have come to believe that the whole world is an enigma, a harmless enigma that is made terrible by our own mad attempt to interpret it as though it had an underlying truth. - Umberto Eco

Just about worthless but you might get a kick out of it. I whipped up a list select widget which allows you to make a list (ul) selectable (click within the list drag up or down to select items). Unusable in its current form (code isn't pretty) but could be groomed into something nice.

ok, haven't gotten around to pairing down that javascript mentioned below into the relevant parts. I may or may not at some point. However, while waiting for a project to build (arduous task indeed) I wrote a bit of javascript that takes a node and a function as parameters and recurses through its children, passing each node to the parameter function. I trust you can see the use in that :) heck, maybe you cant. In any case, I made something pretty with it. enjoy. applyToChildren function below:

function applyToChildren(myNode, fn){
	fn(myNode);
	if(!!myNode.childNodes.length){
		for(var i=0;i<myNode.childNodes.length;i++){
			applyToChildren(myNode.childNodes[i],fn);
		}
	}
}

After struggling to develop a standards compliant, unobtrusive, browser agnostic means of filtering input keystrokes, I have finally devised a simple and elegant solution. Hell yeah. go me.

What is worth taking with you:

Each browser handles events differently. The trick was learning how to stop the event in some cases and how to allow the event to proceed in others. Sounds like cake, but when you assume that you don't have complete control over the particular event (element.onkeydown = myFunction(){} vs element.addEventListener()) and then account for the differences between IE and FF, things get sticky. Ill post the relevant pieces of the code later.

Harvard has put together a video library of short films which illustrate various scientific concepts. If you haven't already seen the inner life of the cell do so now. There is a great piece of it which depicts a kinesin molecule dragging its cargo along a microtubule.

I just watched the video which explains the chemical motor that creates most of our cellular energy (ATB). The video and motor are called "F₁ - F₀ ATPase".

link

This clever fellow devised a function which will take markup described using JSON and then create the described nodes for you, saving you the time of writing out all that DOM code or falling back on innerHTML. see: createElements();

UPDATE: Ive added the javascript sand box for IE users - just because it was easy and I suppose there is no good reason not to.

With the firefox 3 beta available, i decided to see how my different sites would render and behave. turns out - rendur.com now breaks, but the same way that safari breaks. sucked because it meant that Id have to fix it, but good because it meant that I could possibly get it working for safari too. After a surprisingly small amount of work, rendur is now functioning in safari and FF3. (The difficulties appear to be with how each browser deals with '!important' declarations.) Like IE, safari doesn't reinterpret style sheets on the fly, so only the markup and javascript tab are enabled. Better than nothing I suppose. rendur.

I have moved from lowly contractor to official employee. oh ye sweet sweet health care. No longer shall I pay out of pocket for x-rays!

ultra mobile chop sticks - FINALLY. ok seriously though: want.

if you know the width of two columns, but not their heights, you can still give them a divider that will always extend to the bottom of both. example.



whats going on - it turns out that its the margin that causes an element to wrap to the next line, not its physical dimensions. the column divider is actually the right border of the parent element. The second column has a negative right margin equal to its width plus its margins. fun huh?

if you know the combined width of two elements, and the height of one of them, you can still align their bottom edges. example. may require some tweaking for your specific scenario



whats going on - the first child div is floated left and the second floated right. With me? The parent element is just small enough that it forces the second element to the second line, but then we put a negative margin top margin on the second element bringing it up a single line.

hope for the future

My hands down favorite game of all time is now available on xbox live arcade. buy it. buy it right now. the PC version is free.
View some game play shots of the xbox live arcade version.

about N - this game isn't pretty. its all about bucking this trend of making prettier and prettier games that are less and less fun. enemies are geometric shapes and the one goal is get gather gold and escape. you can't fire or attack - in fact, there are only three buttons necessary [left, right, jump]. the ragdoll bloody deaths scenes are also rather nice.

I couldn't help playing with scribbler far too long. its a fun little app. you create a line drawing then click "done" and it will start connecting semi transparent lines between your lines, eventually describing the shape of your drawing.