/* Requires:

		/j/lib/on-x.js
		/j/lib/utilities.js
*/

//addLoadEvent(setPhotoFade);
addLoadEvent(flickrRotate);

function setPhotoFade(){

	var l_aImg = document.getElementsByTagName('img');
	
	for(i=0; i< l_aImg.length; i++) {
		if(l_aImg[i].parentNode.parentNode.id == "flickr_badge_wrapper") {
			l_aImg[i].backgroundColor = '#9c3';
			setFade(l_aImg[i], 0.50);
		}
	}

} // setPhotoFade


// Rotate the flickr badge (which we've restricted to one photo in (m)edium size)
function flickrRotate() {
	
	var l_aImg = document.getElementsByTagName('img');
	var l_aeF = new Array(); // Flickr image elements
	
	for(var i=0; i< l_aImg.length; i++) {
		if((l_aImg[i].parentNode.parentNode.id == "flickr_badge_wrapper") &&
		   (l_aImg[i].parentNode.className != "flickr_badge_beacon")) {
			l_aImg[i].id = "image" + i;
			l_aeF.push(l_aImg[i]);
		}
	}
	
	// With the first of the images we slip in a new canvas element so we can do some majick!
	if(l_aeF.length > 0) {
		// Iterate the 'deck' of photos and place them on the canvas
		for(var i=(l_aeF.length - 1); i>=0; i--) {
			var l_eCanvas = document.createElement("canvas");
		  if(l_eCanvas.getContext) {
				var l_CContext = l_eCanvas.getContext('2d');
				var l_eBadge = document.getElementById('flickr_badge_wrapper');
				var l_iRotatedWidth = 0;
				if(typeof l_eBadge.offsetWidth != 'undefined') {l_iRotatedWidth = l_eBadge.offsetWidth;}
				
				// Append the canvas to the 1st image's <a> (so they all point to the first flickr photo)		
				l_aeF[0].parentNode.appendChild(l_eCanvas);
				if(i==0){
					l_eCanvas.setAttribute('title', 'View my Flickr photos (this links to the latest photo)');
				}
				l_aeF[i].setAttribute('position', 'absolute');
				l_aeF[i].setAttribute('visibility', 'hidden');
				
				// Allow us to manipulate the canvas' position via CSS
				l_eCanvas.setAttribute('id', 'fcanvas' + i);
				l_eCanvas.setAttribute('class', 'fcanvas');
				l_eCanvas.setAttribute('position', 'absolute');
				l_eCanvas.setAttribute('z-index', i);

				rotate(l_eCanvas, l_CContext, l_aeF[i], i, 5, l_iRotatedWidth, (i * 24));
			}
			else {
				l_eCanvas.parentNode.removeChild(l_eCanvas);
			}
		}
	}
} // l_eImageRotate


function rotate(p_eCanvas, p_CContext, p_eImage, p_iCount, p_dDeg, p_iWidth, p_iOffset) {
	
	if(p_eCanvas && p_CContext) {
	
		var l_iFrameWidth = 3;
		var l_iShadowWidth = 4;
		var l_iShadowBlur = 3;
		
		// Known to work with: Firefox 2, Safari 3, Opera 9.5+
		// Known to fail with: Opera 9.27
		var l_dRad = (p_dDeg * (p_iCount + 1)) * (Math.PI / 180);

		var heightIncrease = (l_iFrameWidth * 2) + Math.round(Math.sin(l_dRad) * p_eImage.width) + p_iOffset;
		var widthIncrease = (l_iFrameWidth * 2) + Math.round(Math.sin(l_dRad) * p_eImage.height);
		
		if(p_iWidth == 0) {
			p_eCanvas.setAttribute('width', (p_eImage.width + widthIncrease));
		}
		else {
			p_eCanvas.setAttribute('width', p_iWidth);
		}
		if(p_iCount==0) {
			p_eCanvas.setAttribute('height', (p_eImage.height + heightIncrease));
		}
		else {
			p_eCanvas.setAttribute('height', (p_eCanvas.height + p_eImage.height + heightIncrease));
		}	
		
		p_CContext.translate(widthIncrease, p_iOffset);
		p_CContext.rotate(l_dRad);
		p_CContext.shadowColor = "rgba(0,0,0,0.3)";
		p_CContext.shadowOffsetX = l_iShadowWidth;
		p_CContext.shadowOffsetY = l_iShadowWidth;
		p_CContext.shadowBlur = l_iShadowBlur;
		p_CContext.drawImage(p_eImage, 0, 0);
		
		// Draw a border
		p_CContext.shadowOffsetX = 0;
		p_CContext.shadowOffsetY = 0;
		p_CContext.strokeStyle = "#ffffff";
		p_CContext.lineWidth = 7;
		p_CContext.lineCap = "butt";
		p_CContext.lineJoin = "miter";
		p_CContext.beginPath();
		p_CContext.moveTo(l_iFrameWidth,  l_iFrameWidth);
		p_CContext.lineTo(l_iFrameWidth,  (p_eImage.height - l_iFrameWidth));
		p_CContext.lineTo(p_eImage.width - l_iFrameWidth, (p_eImage.height - l_iFrameWidth));
		p_CContext.lineTo(p_eImage.width - l_iFrameWidth, l_iFrameWidth);
		p_CContext.closePath();
		p_CContext.stroke();
	} else {
		// Known to work with: MSIE 6 and 7
		p_eImage.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(rotation=0)';		
	};
};