if (jQuery) { // start: if jQuery exists

/**
 * adds png overlays to an image
 * example usage: $("#photos img").addOverlay("pngFile.png");
 * note: png is ideally the same dimensions as the image
 * it is overlayed on.
 * @param string overlay - name of the png file
 **/
jQuery.fn.addOverlay = function(overlay) {
        return this.each(function() {
            this.style.background = "url(" + this.src + ")";
            if (!jQuery.browser.msie || (jQuery.browser.msie && parseInt(jQuery.browser.version) >= 7)) {
                this.src = overlay;
            } else {
                this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true', src='" + overlay + "')";
            }
        });
    };


/**
 * allows you to use css to position a variable sized png
 * image over an existing image.  this involves rewriting
 * some html.
 * example usage: $(".overlay-banner").useOverlayCSS("viewgallery-banner");
 * @param string cssClass - the class name to be used for the overlay div
 **/
jQuery.fn.useOverlayCSS = function(cssClass) {
        return this.each(function() {
            var a = jQuery(this).children("a:first"); // returns a jquery obj
            var img = a.children("img:first"); // returns a jquery obj
            var html = '<div align="center"><div align="center" style="width: ' + img.width() + 'px; height: ' + img.height() + 'px; text-align: center; position: relative;">';
            html += '<a href="' + a.attr("href") + '" title="' + img.attr("alt") + '">';
            html += '<img src="' + img.attr("src") + '" width="' + img.width() + '" height="' + img.height() + '" class="' + img.attr("class") + '" />';
            html += '<div align="left" class="' + cssClass + '"></div></a></div></div>';
            this.innerHTML = html;
        });
    };


/**
 * adds text div to an image, as a photo credit
 * example usage: $(".credit").addPhotoCredit();
 **/
jQuery.fn.addPhotoCredit = function() {
		// get all image elements with class "credit"
		return this.each(function() {
	
			// make sure they have caption text set
			if( jQuery(this).attr("title") != '') {
				// save some stuff for later use
				var oParent = this.parentNode;
				var oSubParent = this;
				// if the parent is a link, IE doesn't get it, so we have to keep the a tag with the img
				if( oParent.tagName == "A" ) {
					oSubParent = oParent;
					oParent = oParent.parentNode;
				}
				var sTitle = this.title;
				var sClassname = this.className;
				
				// clear title and className properties
				this.title = '';
				this.className = '';
				
				// create new parent container for image
				var oContainer = document.createElement('div');
				
				// assign classes from img tag
				oContainer.className = sClassname;
				
				// constrain the width and height of DIV to image dimensions
				oContainer.style.width = this.width + 'px';
				oContainer.style.height = this.height + 'px';
				
				// swap existing image
				oParent.replaceChild(oContainer, oSubParent);
				oContainer.appendChild(oSubParent);
				
				// create credit
				var oCaptionContainer = document.createElement('div');
				var oCaption = document.createElement('p');
				oCaption.appendChild(document.createTextNode(sTitle));
				oCaptionContainer.appendChild(oCaption);
				
				// append strapline to parent container
				oContainer.appendChild(oCaptionContainer);
				
				oCaptionContainer.style.width = this.width + 'px';
				
				var iImageWidth = this.width;
				oCaptionContainer.style.width = iImageWidth + 'px';
				if (oCaptionContainer.offsetWidth > iImageWidth) {
					oCaptionContainer.style.width = iImageWidth - (oCaptionContainer.offsetWidth - iImageWidth) + 'px';
				} 
			}
		});
	};


} // end: if jQuery exists