// for zIndexing reasons
var v = 0;

function aalbum(width, height, url) {
	// create the div
	var aalbum = document.createElement('div');
	
	// position
	aalbum.style.position = 'absolute';
	aalbum.style.top = '30px';
	aalbum.style.left = '180px';
	
	// background
	aalbum.style.background = '#000000';
	
	// overflow
	aalbum.style.overflow = 'hidden';
	
	// padding
	// aalbum.style.padding = '10px';
	
	// zIndex
	aalbum.style.zIndex = 1000+v;
	v = v+1;
	
	// and and ID to save me from being so confused
	aalbum.id = 'aalbum';
	aalbum.innerHTML = '<div style="padding:10px">Loading</div>';
	
	// now append it.
	document.body.appendChild(aalbum);
	
	document.getElementById('aalbum').startw = width;
	document.getElementById('aalbum').starth = height;
	
	// the grow.element
	///scale('aalbum', 10, 900, 'width', 25, 0, 'expand');
	//////// change
	scale( 'aalbum', document.getElementById('aalbum').starth, 900, document.getElementById('aalbum').startw, 500, 'width', 25, 0, 'expand' );
	
	Element.setOpacity( 'fade', '0' );
	
	document.getElementById('fade').style.display = 'block';
	document.getElementById('fade').style.zIndex = 1000+v;
	v = v+1;
	
	new Effect.Opacity( 'fade', {from:0.0, to:0.6} );
	
	document.getElementById('aalbum').style.zIndex = 1000+v;
	v = v+1;
	
	// change the opacity to 0.8
	new Effect.Opacity( 'aalbum', {duration:0.5, from:1.0, to:0.8, delay:1, afterFinish: function() {
		document.getElementById('aalbum').style.overflow = 'auto';
		
		// insert the ajax loading stuff
		new Ajax.Updater('aalbum', 'index.php?'+url, {
			onComplete:function() {
				// this thing at the bottom that contains the content of some random stuff.
			document.getElementById('aalbum').innerHTML = document.getElementById('aalbum').innerHTML + '<div style="text-align:center;padding:10px;"><a href="javascript:removeElement(\'aalbum\');">Close</a>';
			}
		 });

	// afterfinish close, and effect.opacity close
	}
	 });
}

// remove the element, take the opacity, from what it is, to 0.0, which is nothing =D
function removeElement( element ) {
	document.getElementById(element).innerHTML = '<div style="text-align:center">Closing</div>';
	scale( 'aalbum', 500, document.getElementById('aalbum').startw, 900, document.getElementById('aalbum').starth, 'height', 25, 0, 'shrink' );
	
	if( document.moveafter == 'true' ) {
		new Effect.Opacity( document.storeid, {duration:0.5, from:0.0, to:1.0, delay:1.5, afterFinish: function() {
			new Effect.Move( document.storeid, {mode:'absolute',x:document.storeleft,y:document.storetop} );
		} });
		
		document.moveafter = 'false';
	}
	
	new Effect.Opacity( 'fade', {from:0.6, to:0, afterFinish:function() {
		document.getElementById('fade').style.display = 'none';
	} });
}

function scale( id, froma, toa, fromb, tob, mode, interval, speed, mode2 ) {
	if( mode == 'width' && mode2 == 'expand' ) {
		document.getElementById(id).style.width = froma + 'px';
		document.getElementById(id).style.height = fromb + 'px';
	}
	
	resize( id, froma, toa, fromb, tob, mode, interval, speed, mode2 );
}

function resize( id, froma, toa, fromb, tob, mode, interval, speed, mode2 ) {
	if( mode == 'width' && mode2 == 'expand' ) {
		document.getElementById(id).style.width = ( Number(document.getElementById(id).style.width.replace("px", "")) + interval ) + 'px';
		if( Number(document.getElementById(id).style.width.replace("px", "")) < toa ) {
			setTimeout("resize( '"+id+"', "+froma+", "+toa+", "+fromb+", "+tob+", '"+mode+"', "+interval+", "+speed+", '"+mode2+"' )", speed);
		} else {
			///scale('aalbum', 1, 500, 'height', 25, 0, 'expand');
			/////// change
			scale( 'aalbum', froma, toa, fromb, tob, 'height', interval, speed, 'expand' );
		}
	}
	
	if( mode == 'height' && mode2 == 'expand' ) {
		document.getElementById(id).style.height = ( Number(document.getElementById(id).style.height.replace("px", "")) + interval ) + 'px';
		if( Number(document.getElementById(id).style.height.replace("px", "")) < tob ) {
			setTimeout("resize( '"+id+"', "+froma+", "+toa+", "+fromb+", "+tob+", '"+mode+"', "+interval+", "+speed+", '"+mode2+"' )", speed);
		}
	}

	if( mode == 'width' && mode2 == 'shrink' ) {
		document.getElementById(id).style.width = ( Number(document.getElementById(id).style.width.replace("px", "")) - interval ) + 'px';
		if( Number(document.getElementById(id).style.width.replace("px", "")) > tob ) {
			setTimeout("resize( '"+id+"', "+froma+", "+toa+", "+fromb+", "+tob+", '"+mode+"', "+interval+", "+speed+", '"+mode2+"' )", speed);
		} else {
			new Effect.Opacity( id, {duration:0.5, from:Element.getOpacity(id), to:0.0, afterFinish: function() {
				javascript:document.body.removeChild( document.getElementById(id) );
			} });
		}
	}
	
	if( mode == 'height' && mode2 == 'shrink' ) {
		document.getElementById(id).style.height = ( Number(document.getElementById(id).style.height.replace("px", "")) - interval ) + 'px';
		if( Number(document.getElementById(id).style.height.replace("px", "")) > toa ) {
			setTimeout("resize( '"+id+"', "+froma+", "+toa+", "+fromb+", "+tob+", '"+mode+"', "+interval+", "+speed+", '"+mode2+"' )", speed);
		} else {
			///scale('aalbum', 900, 10, 'width', 25, 0, 'shrink');
			/////// change
			scale( 'aalbum', froma, toa, fromb, tob, 'width', interval, speed, 'shrink' );
		}
	}
}
	
/*
function scale( id, from, to, mode, interval, speed, mode2 ) {
	if( mode == 'width' ) {
		document.getElementById(id).style.width = from + 'px';
	}
	
	if( mode == 'width' && mode2 == 'shrink' ) {
		document.getElementById(id).style.height = '10px';
	}
	
	if( mode == 'height' ) {
		document.getElementById(id).style.height = from + 'px';
	}
	
	if( mode2 == 'shrink' ) {
		document.getElementById(id).innerHTML = '';
	}
	
	document.getElementById(id).style.overflow = 'hidden';
	resize( id, to, mode, interval, speed, mode2 );
}

function resize( id, to, mode, interval, speed, mode2 ) {
	if( mode == 'width' && mode2 == 'expand' ) {
		document.getElementById(id).style.width = ( Number(document.getElementById(id).style.width.replace("px", "")) + interval ) + 'px';
		if( Number(document.getElementById(id).style.width.replace("px", "")) < to ) {
			setTimeout("resize('"+id+"', "+to+", '"+mode+"', "+interval+", "+speed+", '"+mode2+"')", speed);
		} else {
			scale('aalbum', 1, 500, 'height', 25, 0, 'expand');
		}
	}
	
	if( mode == 'height' && mode2 == 'expand' ) {
		document.getElementById(id).style.height = ( Number(document.getElementById(id).style.height.replace("px", "")) + interval ) + 'px';
		if( Number(document.getElementById(id).style.height.replace("px", "")) < to ) {
			setTimeout("resize('"+id+"', "+to+", '"+mode+"', "+interval+", "+speed+", '"+mode2+"')", speed);
		}
	}
	
	if( mode == 'width' && mode2 == 'shrink' ) {
		document.getElementById(id).style.width = ( Number(document.getElementById(id).style.width.replace("px", "")) - interval ) + 'px';
		if( Number(document.getElementById(id).style.width.replace("px", "")) > to ) {
			setTimeout("resize('"+id+"', "+to+", '"+mode+"', "+interval+", "+speed+", '"+mode2+"')", speed);
		} else {
			new Effect.Opacity( id, {duration:0.5, from:Element.getOpacity(id), to:0.0, afterFinish: function() {
				javascript:document.body.removeChild( document.getElementById(id) );
			} });
		}
	}
	
	if( mode == 'height' && mode2 == 'shrink' ) {
		document.getElementById(id).style.height = ( Number(document.getElementById(id).style.height.replace("px", "")) - interval ) + 'px';
		if( Number(document.getElementById(id).style.height.replace("px", "")) > to ) {
			setTimeout("resize('"+id+"', "+to+", '"+mode+"', "+interval+", "+speed+", '"+mode2+"')", speed);
		} else {
			scale('aalbum', 900, 10, 'width', 25, 0, 'shrink');
		}
	}
}*/

function infoO( element ) {
	// zIndex
	document.getElementById(element).style.zIndex = 1000+v;
	v = v+1;
	
	img = element.replace("jbox", "jboxi");
	num = element.replace("jbox", "");
	document.storetop = Number(document.getElementById(element).style.top.replace("px", ""));
	document.storeleft = Number(document.getElementById(element).style.left.replace("px", ""));
	document.storeid = element;
	document.moveafter = 'true';
	
	new Effect.Move( element , {mode:'absolute',x:180,y:30,afterFinish: function() {
		new Effect.Opacity( element, {duration:0.5, from:1.0, to:0.0, afterFinish: function() {
			aalbum(document.getElementById(img).height , document.getElementById(img).width, 'action=ainfo&id='+num);
		},duration:0.5 });
	},
	duration:0.5
	});
}

function spit(action, id) {
	var d = document.getElementsByClassName('album' + id);
	
	var id2 = id/2+'';
	var id3 = id2.split('.');
	if( id2 == id3[0] ) {
		var y = 150;
		var x = 100;
	} else {
		var y = 150;
		var x = 500;
	}
	
	if( action == 1 ) {
		for( var n = 0; n<d.length; n++ ) {
			//var x = x + (Math.random()*20);
			//var y = y + (Math.random()*20);
			var x = x + 10;
			var y = y + 10;
			new Effect.Move(d[n].id, {mode:'absolute',x:x,y:y});
			document.getElementById(d[n].id).style.zIndex = 500+v;
			v = v+1;
		}
	}
	if( action == 2 ) {
		for( var n = 0; n<d.length; n++ ) {
			var a = x + (Math.random()*100);
			var b = y + (Math.random()*100);
			new Effect.Move(d[n].id, {mode:'absolute',x:a,y:b});
		}
	}

	if( action == 3 ) {
		var a = x;
		var b = y;
		for( var n = 0; n<d.length; n++ ) {
			
			if( id2 == id3[0] ) {
				var a = a + (Math.random()*100);
				var b = b + (Math.random()*10);
			} else {
				var a = a - (Math.random()*100);
				var b = b - (Math.random()*10);
			}
			
			d[n].style.zIndex = 1000+v;
			v = v+1;
			document.getElementById('aalbum').style.zIndex = 1000+v;
			v = v+1;
			new Effect.Move(d[n].id, {mode:'relative',x:a,y:b});
		}
	}
	
	if( action == 4 ) {

		var y = 120;
		for( var n = 0; n<d.length; n++ ) {
			if( y >= 450 ) {
				var x = x + 120;
				var y = 120;
			}
			
			new Effect.Move( d[n].id , {mode:'absolute',x:x,y:y} );

			var y = y + 90;
		}
	}
	
	if( action == 5 ) {
		var amt = d.length;

		if( id2 == id3[0] ) {
			var y = 100;
		} else {
			var y = 500;
		}
		
		var interval = 50;
		
		var x = round(interval*(amt/4))+100;
	
		var a = round(amt/4);
		var b = round((amt/4)*2);
		var c = round((amt/4)*3);
		var e = amt;
		
		for( var n = 0; n <= a; n++ ) {
			var x = x + interval;
			var y = y + interval;
	//		document.getElementById(v[n].id).style.top = x + 'px';
	//		document.getElementById(v[n].id).style.left = y + 'px';
			new Effect.Move(d[n].id, {mode:'absolute',x:y,y:x});
		}
	
		for( var n = (a+1); n <= b; n++ ) {
			var x = x - interval;
			var y = y + interval;
	//		document.getElementById(v[n].id).style.top = x + 'px';
	//		document.getElementById(v[n].id).style.left = y + 'px';
			new Effect.Move(d[n].id, {mode:'absolute',x:y,y:x});
		}
		
		for( var n = (b+1); n <= c; n++ ) {
			var x = x - interval;
			var y = y - interval;
	//		document.getElementById(v[n].id).style.top = x + 'px';
	//		document.getElementById(v[n].id).style.left = y + 'px';
			new Effect.Move(d[n].id, {mode:'absolute',x:y,y:x});
		}
		
		for( var n = (c+1); n < e; n++ ) {
			var x = x + interval;
			var y = y - interval;
	//		document.getElementById(v[n].id).style.top = x + 'px';
	//		document.getElementById(v[n].id).style.left = y + 'px';
			new Effect.Move(d[n].id, {mode:'absolute',x:y,y:x});
		}
	}
	
	if( action == 6 ) {
	
	var id = id + 1;
	
	var a = 75;
	var b = 125*id;
	
		for( var n = 0; n<d.length; n++ ) {
			var height = document.getElementById(d[n].id.replace("jbox", "jboxi")).height;
			var height = (100*id) - height;
			new Effect.Move(d[n].id, {mode:'absolute',x:a,y:height});
			a = a + 100;
		}
	}
}

function round( int ) {
	int = int + '';
	return parseFloat(int.split('.'));
}

var Reflector = {
  reflect: function(element) {
    element = $(element);
    options = $H({
      amount: 1/3,
      opacity: 1/3
    }).merge(arguments[1] || {});
    
    var p = element.parentNode, n = element.nextSibling;
    var d = 1.0/(element.height*options.amount);
      
    (element.height*options.amount).times( function(line) {
      var h = Builder.node('div',{style:'height:1px;overflow:hidden'},
        [Builder.node('img',{src:element.src,id:'reflect',
          style:'margin-top:-'+(element.height-line-1)+'px'
        })]);
      p.insertBefore(h,n);
      $(h).setOpacity((1-d*line)*options.opacity);
    });
  }
}

function reflect() {
	var v = document.getElementsByClassName('jboxi');
	
	for( var n = 0; n<v.length; n++ ) {
		Reflector.reflect(v[n].id,{ amount:0.2, opacity:3/4 });
	}
}

function cperma( id ) {
	var cur = location.href;
	cur = cur.split('?');
	var url = cur[0] + '?id=' + id;
	document.getElementById('perma').innerHTML = '<input style="border:none;" onclick="this.focus();this.select();" size="'+(url.length+5)+'" value="'+url+'" type="text">';
}