function position(elem) {
	var element = elem[0];
	var p = {x: (element.offsetLeft) || 0, y:(element.offsetTop) || 0};
        /*while (element = element.offsetParent) {
            p.x += element.offsetLeft;
            p.y += element.offsetTop;
        }*/
        return p;
}


$(document).ready(function() {
	var path = window.location.pathname;
	/*if(path.indexOf("etusivu") != -1 || path.indexOf("frontpage") != -1) {
	if(path == "/test_place/fi_FI/test1/" || path == "/test_place/fi_FI/etusivu_test" || path == "/en/frontpage/en_GB/front_test") {*/
		$("img").each(function(i){
			var cl = $(this).attr('class');
			if(cl == 'iso_puff' || cl == 'iso_puff_vaalea') {
				var a = $(this).parent('a');
				var d = $('<div />');
                                $(this).before(d);
                                d.append($(this));
				var aElem = $('<div />');
				var container = $(this).parent();
				//var alt = $(this).attr('alt');
				var width = $(this).css('width');
				var w = width.split("p")[0];
				var img = $(this).clone();
				var alt = "";
				if(a.length == 1) {
					aElem = null;
					aElem = a.clone();
					aElem.empty();
					aElem.css('cursor','pointer');
					container = a.parent();
					alt = container.find('.u4-image-caption').text();
				} else {
					var caption = container.siblings('.u4-image-caption');
                                        alt = caption.text();
                                        caption.empty();
				}
				aElem.css({zIndex: '900',margin:'0',padding:'0',display:'block',position:'absolute',top:(img[0].height-60)+'px',height:'60px'});
				if(cl == 'iso_puff_vaalea') {
					aElem.append('<div class="opaq lighter" style="width:'+width+';"></div><h2 class="opaqText" style="width:'+(0.7*w)+'px;">'+alt+'</h2><div class="opaqRight" style="left:'+(0.7*w)+'px; width:'+((0.27*w)-15)+'px;"></div>');
				} else {
					aElem.append('<div class="opaq" style="width:'+width+';"></div><h2 class="opaqText" style="width:'+(0.7*w)+'px;">'+alt+'</h2><div class="opaqRight" style="left:'+(0.7*w)+'px; width:'+((0.27*w)-15)+'px;"></div>');
				}
				container.empty();
				container.append(img);
				container.prepend(aElem);
				
				img.css('display','block');
				container.css('position','relative');
				container.css('clear','both');
				if(a.length == 1) {
					container.find('.opaqRight').css('background','transparent url(/stc/img/largePuffArrow.png) no-repeat scroll right center');
				}
				var f = img.css('float');
                                if(f == 'right' || f == 'left') {
                                        img.css('margin','0 0 12px 0');
				}
				var val = position(img).x+'px';
				aElem.css({left:val,width:width});
				container.find('.opaqText').css('bottom',29-(container.find('.opaqText').height()/2)+'px');
				var f = img.css('float');
				if(f == 'left') {
					d.css('width',width);
				}
			} else if (cl == 'pieni_puff' || cl == 'pieni_puff_vaalea') {
				var a = $(this).parent('a');
				var d = $('<div />');
				$(this).before(d);
				d.append($(this));
                                var aElem = $('<div />');
                                var container = $(this).parent();
                                //var alt = $(this).attr('alt');
                                var width = $(this).css('width');
				var w = width.split("p")[0];
                                var img = $(this).clone();
				var alt = "";
                                if(a.length == 1) {
                                        a.parent().css('padding','0px');
					aElem = null;
                                        aElem = a.clone();
                                        aElem.empty();
					aElem.css('cursor','pointer');
                                        container = a.parent();
					alt = container.find('.u4-image-caption').text();
					if(cl == 'pieni_puff_vaalea') {
						aElem.append('<div class="opaq small lighter" style="width:'+width+';"></div><p class="opaqText small img" style="width:'+(w-20)+'px;">'+alt+'</p>');
					} else {
						aElem.append('<div class="opaq small" style="width:'+width+';"></div><p class="opaqText small img" style="width:'+(w-20)+'px;">'+alt+'</p>');
					}
                                } else {
					var caption = container.siblings('.u4-image-caption');
					alt = caption.text();
					caption.empty();
					if(cl == 'pieni_puff_vaalea') {		
						aElem.append('<div class="opaq small lighter" style="width:'+width+';"></div><p class="opaqText small" style="width:'+(w-5)+'px;">'+alt+'</p>');
					} else {
						aElem.append('<div class="opaq small" style="width:'+width+';"></div><p class="opaqText small" style="width:'+(w-5)+'px;">'+alt+'</p>');
					}
				}
				aElem.css({zIndex:'900',margin:'0',padding:'0',display:'block',position:'relative',top:img[0].height+'px'});
                                container.empty();
                                container.append(img);
                                container.prepend(aElem);
                                container.css('position','relative');
                                container.find('.opaqText').css('bottom',6-(container.find('.opaqText').height()/2)+'px');
				img.css('display','block');
				var val = position(img).x+'px';
                                aElem.css({left:val,width:width});
				container.css('clear','both');
			}
		});
	/*}*/
});
