/* thanks to Simon Willison for his addLoadEvent function 
which allows us to execute multiple functions once the page has loaded
http://simonwillison.net/2004/May/26/addLoadEvent/ */

function addLoadEvent(func) {
     var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            if (oldonload) {
                oldonload();
            }
            func();
        }
    }
} 
	 
addLoadEvent(tidyCaptionedImages); 

function tidyCaptionedImages() {
    setImageWrapperWidth("captioned-picture"); 
   
}

/*
	Developed by Robert Nyman, http://www.robertnyman.com
	Code/licensing: http://code.google.com/p/getelementsbyclassname/
*/	
var getElementsByClassName = function (className, tag, elm){
	if (document.getElementsByClassName) {
		getElementsByClassName = function (className, tag, elm) {
			elm = elm || document;
			var elements = elm.getElementsByClassName(className),
				nodeName = (tag)? new RegExp("\\b" + tag + "\\b", "i") : null,
				returnElements = [],
				current;
			for(var i=0, il=elements.length; i<il; i+=1){
				current = elements[i];
				if(!nodeName || nodeName.test(current.nodeName)) {
					returnElements.push(current);
				}
			}
			return returnElements;
		};
	}
	else if (document.evaluate) {
		getElementsByClassName = function (className, tag, elm) {
			tag = tag || "*";
			elm = elm || document;
			var classes = className.split(" "),
				classesToCheck = "",
				xhtmlNamespace = "http://www.w3.org/1999/xhtml",
				namespaceResolver = (document.documentElement.namespaceURI === xhtmlNamespace)? xhtmlNamespace : null,
				returnElements = [],
				elements,
				node;
			for(var j=0, jl=classes.length; j<jl; j+=1){
				classesToCheck += "[contains(concat(' ', @class, ' '), ' " + classes[j] + " ')]";
			}
			try	{
				elements = document.evaluate(".//" + tag + classesToCheck, elm, namespaceResolver, 0, null);
			}
			catch (e) {
				elements = document.evaluate(".//" + tag + classesToCheck, elm, null, 0, null);
			}
			while ((node = elements.iterateNext())) {
				returnElements.push(node);
			}
			return returnElements;
		};
	}
	else {
		getElementsByClassName = function (className, tag, elm) {
			tag = tag || "*";
			elm = elm || document;
			var classes = className.split(" "),
				classesToCheck = [],
				elements = (tag === "*" && elm.all)? elm.all : elm.getElementsByTagName(tag),
				current,
				returnElements = [],
				match;
			for(var k=0, kl=classes.length; k<kl; k+=1){
				classesToCheck.push(new RegExp("(^|\\s)" + classes[k] + "(\\s|$)"));
			}
			for(var l=0, ll=elements.length; l<ll; l+=1){
				current = elements[l];
				match = false;
				for(var m=0, ml=classesToCheck.length; m<ml; m+=1){
					match = classesToCheck[m].test(current.className);
					if (!match) {
						break;
					}
				}
				if (match) {
					returnElements.push(current);
				}
			}
			return returnElements;
		};
	}
	return getElementsByClassName(className, tag, elm);
};

/*
	getStyle() developed by John Resig, http://jspro.org/toc/
	from chapter 9 of his book Pro JavaScript Techniques
*/	

// Get a style property (name) of a specific element (elem)
function getStyle( elem, name ) {
    // If the property exists in style[], then it’s been set recently (and is current)
    if (elem.style[name])
        return elem.style[name];

    // Otherwise, try to use IE’s method
    else if (elem.currentStyle)
        return elem.currentStyle[name];

    // Or the W3C’s method, if it exists
    else if (document.defaultView && document.defaultView.getComputedStyle) {
        // It uses the traditional ‘text-align’ style of rule writing, instead of textAlign
        name = name.replace(/([A-Z])/g,"-$1");
        name = name.toLowerCase();

        // Get the style object and get the value of the property (if it exists)
        var s = document.defaultView.getComputedStyle(elem,"");
        return s && s.getPropertyValue(name);

    // Otherwise, we’re using some other browser
    } else
        return null;
}

/* author: bdev 16Mar09
	thanks to John Resig for his getStyle() function and Robert Nyman for his getElementsByClassName() function
	parameters: classname - the class applied to the wrapper div containing the image, usually "captioned-picture"
*/
function setImageWrapperWidth( classname ) {

	var elems = getElementsByClassName(classname);
  	
	for (e = 0; e < elems.length; e++) {  	
		var e_images = elems[e].getElementsByTagName("img");
		for (i = 0; i < e_images.length; i++) {
			var iw = e_images[i].width
		    //alert('wrapper ' + e + ' image width is: ' + iw);
		    
		    // if image has border, need to include the left and right border widths
		   	//alert('borders are: right - ' + getStyle(e_images[i], 'borderRightWidth') + ', left - ' + getStyle(e_images[i], 'borderLeftWidth'));
		   	var br =  parseFloat(getStyle(e_images[i], 'borderRightWidth').replace('px',''));
		   	var bl =  parseFloat(getStyle(e_images[i], 'borderLeftWidth').replace('px',''));;
		   	
		   	// include any left or right padding as well
		   	var pr =  parseFloat(getStyle(e_images[i], 'paddingRight').replace('px',''));
		   	var pl =  parseFloat(getStyle(e_images[i], 'paddingLeft').replace('px',''));
		   	
		  	elems[e].style.width =  iw + pr + br + pl + bl + 'px';
		}
	}
}