Archive for the ‘javascript’ Category

The Lifespan of your Code

July 29, 2010 0 comment

I’ve been spending a likely larger-than-ought chunk of my summer sitting here coding up a storm. It’s a great project though, one I believe could reap time-saving rewards in the future. It’s nearly 100% RSS-feed based, with all the jQuery bells n whistles. And immediately, I begin to fear.

Sure Javascript/ECMASCript has been going strong for nearly 15-20 years now, and furthermore shows little sign of slowing down in it’s dominance. Yet, these past few days I’ve been dealing with what I’m calling a “2-digit year bug.” Ya see, I’m trying to support the years before AD100. And it seems that’s a little rough for Javascript to prefer. Fine, fine, I’ll just code around it. But wait, we’re in a new century. What happens in the year 2101? Will future-javascript (or a 100 year old browser) interpret year AD101 as AD2101??

This is where I decided, “But I’ll be dead by then, so do I really care?” :) I mean, I’ll start caring once: (a) someone besides me likes my open-source socially-enabled RSS reader and/or (b) when the Javascript gods start caring that they don’t support serious (>2000 year old) timelines.

JS element justification

March 4, 2008 Comments Off

So in an over-exuberant (and low-sleep) moment, I coded this one up. Say ya wanna have 5 elements on a page evenly spaced out, but you can’t depend on .. anything. Under normal circumstances a sane person would just use a table, with text-align:center & td.padding. Nope. Not me. I do things the hard way:

<script>
function justifier(par){
ulist=document.getElementById(par);
plain=0;
count=0;
/* determine widths for padding. Must set paddings to 0 for an accurate count */
for(i=0;i<ulist.childNodes.length;i++){
  if(ulist.childNodes[i].nodeType==1 && ulist.childNodes[i].nodeName=="LI"){
	pad(ulist.childNodes[i],0);
	plain+=parseInt(ulist.childNodes[i].offsetWidth);
	count++;
  }
}
wide=ulist.offsetWidth;
x=parseInt((wide-plain-count)/(count*2));	//due to FF, count !=ulist.childNodes.length
//alert("w:"+wide+" cw:"+plain+" ="+(wide-plain)+"/"+count+" pad:"+x);
/* change paddings: */
for(i=0;i<ulist.childNodes.length;i++){
  if(ulist.childNodes[i].nodeType==1 && ulist.childNodes[i].nodeName=="LI"){
	mainMenuItem=ulist.childNodes[i];
	pad(mainMenuItem,x);
  }
}

}

function pad(ele,x){
ele.style.paddingLeft=x+"px";
ele.style.paddingRight=x+"px";
}
</script>

<style>
#list{
width:40%;
border:1px red solid;
}
ul{
padding:0px;
margin:0px;
float:left;
list-style-type:none;
}
li{
padding:0px;
margin:0px;
float:left;
list-style-type:none;
}
</style>
<body onload="justifier('list')" onresize="justifier('list')">
<ul id="list">
<li>one</li>
<li>two</li>
<li>three</li>
</ul>

</body>