// (c) 2006 Nimbler, http://www.nimbler.ru/

initAnimation();

addEvent(window, 'load', initAnimation);
addEvent(window, 'load', initScalableLayout);
addEvent(window, 'load', initStartpageBricks);
addEvent(window, 'load', initSlideshow);
addEvent(window, 'load', initProductBricks);

function initProductBricks() {
	productBricks.init();
}


productBricks = {
	'init' : function() {
		if (document.getElementById && document.getElementById('productBricks')) {
			BRICK_WIDTH = 231;
			BRICK_HEIGHT = 231;
			DEFAULT_BRICK_WIDTH = 115;
			DEFAULT_BRICK_HEIGHT = 115;
			document.getElementById('productBricks').zoomBricksOut = function () {
				var bricks = document.getElementById('productBricks').getElementsByTagName('li');
				for (i=0; i<bricks.length; i++) {
					bricks[i].zoomOut();
				}
			}
			var bricks = document.getElementById('productBricks').getElementsByTagName('li');
			for (i=0; i<bricks.length; i++) {
				bricks[i].image = bricks[i].getElementsByTagName('img')[0];
				bricks[i].switchZoom = function() {
					if (this.zoomedIn) {
						this.zoomOut();
					} else {
						this.zoomIn();
					}
				}
				bricks[i].zoomIn = function() {
					this.parentNode.zoomBricksOut();
					this.zoomedIn = true;
					addAnimation(this.image,'width',{
						"styleField" : "width",
						"valueFrom" : DEFAULT_BRICK_WIDTH,
						"valueTo" : BRICK_WIDTH,
						"dimention" : "px",
						"frames" : 6,
						"skip" : 1
					});
					addAnimation(this.image,'height',{
						"styleField" : "height",
						"valueFrom" : DEFAULT_BRICK_HEIGHT,
						"valueTo" : BRICK_HEIGHT,
						"dimention" : "px",
						"frames" : 6
					});
					if (coordsRight(this) + dimX(this) >= coordsRight(this.parentNode)) {
						addAnimation(this.image,'marginLeft',{
							"styleField" : "marginLeft",
							"valueTo" : "-"+(DEFAULT_BRICK_WIDTH+1),
							"dimention" : "px",
							"frames" : 6
						});
					}
					if (coordsBottom(this) + dimY(this) >= coordsBottom(this.parentNode)) {
						addAnimation(this.image,'marginTop',{
							"styleField" : "marginTop",
							"valueTo" : "-"+(DEFAULT_BRICK_HEIGHT+1),
							"dimention" : "px",
							"frames" : 6
						});
					}
					this.image.style.zIndex = 100;
				};
				bricks[i].zoomOut = function() {
					this.zoomedIn = false;
					this.image.style.width = DEFAULT_BRICK_WIDTH + "px";
					this.image.style.height = DEFAULT_BRICK_HEIGHT + "px";
					this.image.style.zIndex = 0;
					this.image.style.marginLeft = 0;
					this.image.style.marginTop = 0;
				};
				addEvent(bricks[i], 'click', function(){this.switchZoom();});
			}
		}
	}
}



function initSlideshow() {
	slideshow.init();
}

slideshow = {
	'init' : function() {
		if (document.getElementById && document.getElementById('slideshowImageTop') && document.getElementById('slideshowFiles')) {
			this.slideshowFiles = document.getElementById('slideshowFiles');
			this.imageTop = document.getElementById('slideshowImageTop');
			this.imageBottom = document.getElementById('slideshowImageBottom');
			this.files = [];
			var slideshowFilesList = this.slideshowFiles.getElementsByTagName('img');
			for (i=0; i<slideshowFilesList.length; i++) {
				this.files.push(slideshowFilesList[i].src);
				preload(slideshowFilesList[i].parentNode.href);
				addEvent(slideshowFilesList[i], 'click', function(e) {slideshow.selectSlide(e);});
				slideshowFilesList[i].slideshowKey = this.files.length-1;
			}
			this.currentSlide = 0;
			this.switchFrameTo(0);
			this.doSlideshow = true;
			setTimeout(function(){slideshow.setTimeout();}, 2000);
		}
	},
	'selectSlide' : function(e) {
		this.switchFrameTo(getTarget(e).slideshowKey);
		this.doSlideshow = false;
		stopEvent(e);
	},
	'nextSlide' : function() {
		this.switchFrameTo(this.getNextSlideId());
	},
	'switchFrameTo' : function(nextFrameId) {
		setOpacity(this.imageTop, 0);
		this.imageBottom.src = this.getLargeImage(this.imageTop.src);
		this.imageTop.switchToSrc = this.getLargeImage(this.files[nextFrameId]);
		setOpacity(this.slideshowFiles.getElementsByTagName('li')[this.currentSlide], 1);
		setOpacity(this.slideshowFiles.getElementsByTagName('li')[nextFrameId], 0.5);
		this.currentSlide = nextFrameId;
		setTimeout(function(){slideshow.switchTopSrc();}, 100);
		setTimeout(function(){slideshow.fadeOut();}, 100);
	},
	'getLargeImage' : function(str) {
		return str.replace(/\/s\//, '/');
	},
	'switchTopSrc' : function() {
		this.imageTop.src = this.imageTop.switchToSrc;
	},
	'fadeOut' : function() {
		addAnimation(this.imageTop,'opacity',{
			"styleField" : "opacity",
			"valueFrom" : 0,
			"valueTo" : 1,
			"frames" : 30
		});
	},
	'getNextSlideId' : function() {
		return (this.currentSlide + 1) % this.files.length;
	},
	'setTimeout' : function() {
		if (this.doSlideshow) {
			this.nextSlide();
			setTimeout(function(){slideshow.setTimeout();}, 3000)
		}
	}
}


function initScalableLayout() {
	scalableLayout.addMilestone('231', 'tinyScreen');
	scalableLayout.addMilestone('462', 'verySmallScreen');
	scalableLayout.addMilestone('695', 'bricksToBottom');
	scalableLayout.addMilestone('695', 'illustrationToBottom');
	scalableLayout.addMilestone('930', 'maxBricksWidthOff');
	scalableLayout.addMilestone('922', 'centerIllustration');
	scalableLayout.start();
}

scalableLayout = {
	'milestones' : [],

	'start' : function(){
		addEvent(window, 'resize', function(){scalableLayout.resize();})
		this.body = document.getElementsByTagName('body')[0];
		this.resize();
	},
	'addMilestone' : function(width, klass) {
		this.milestones[width] = klass;
	},
	'resize' : function() {
		var windowWidth = getWindowWidth();
		for (i in this.milestones) {
			if (windowWidth <= i) {
				addClass(this.body, this.milestones[i]);
			}
			else
				removeClass(this.body, this.milestones[i]);
		}
	}
}

function bricksContainerObjChangeSize() {
	bricksContainerObj.changeSize();
}

function initStartpageBricks() {
	initStartpage();
}

initStartpage = function() {
	BRICK_WIDTH = 231;
	BRICK_HEIGHT = 231;
	if (document.getElementById && document.getElementById('bricksContainer')) {
		bricksContainerObj = document.getElementById('bricksContainer');

		addClass(bricksContainerObj, 'fadeOn');
		bricksContainerObj.changeSize = function() {
			bricksContainerObj.style.width = closeDown(getWindowWidth(), BRICK_WIDTH) + 'px';
			bricksContainerObj.style.height = closeDown(getWindowHeight(), BRICK_HEIGHT) + 'px';
		};
		bricksContainerObj.countBricks = function() {
			return parseInt(bricksContainerObj.style.width) / BRICK_WIDTH * parseInt(bricksContainerObj.style.height) / BRICK_HEIGHT;
		};

		bricksContainerObj.removeFakeChild = function() {
			var bricks = getElementsByClass(this, 'bricks');
			if (bricks[1])
				this.removeChild(bricks[1]);
		};

		bricksContainerObj.addChangeSizeEvent = function() {
			addEvent(window, 'resize', bricksContainerObjChangeSize);
			bricksContainerObj.changeSize();
		};
		bricksContainerObj.removeChangeSizeEvent = function() {
			removeEvent(window, 'resize', bricksContainerObjChangeSize);
		};

		bricksContainerObj.addChangeSizeEvent();

		var bricksObj = getElementsByClass(bricksContainerObj, 'bricks')[0];

		var bricks = bricksContainerObj.getElementsByTagName('img');
		for (var i=0; i<bricks.length; i++)
			bricksObj.appendChild(getBlankBrick());

		shuffleChildren(bricksObj);
//		setTimeout(shuffleBricks, 5000);

 		bricksContainerObj.style.display = 'block';

	}
}

function shuffleBricks() {
	bricksContainerObj.removeChangeSizeEvent();
	var bricksTop = getElementsByClass(bricksContainerObj, 'bricks')[0];
	var bricksBottom = bricksTop.cloneNode(true);
	bricksContainerObj.insertBefore(bricksBottom,bricksTop);
	shuffleChildren(bricksBottom);


	for (var i=0; i<bricksContainerObj.countBricks(); i++) {
		if (bricksTop.childNodes[i]) {
			addAnimation(bricksTop.childNodes[i],'opacity',{
				"styleField" : "opacity",
				"valueFrom" : 1,
				"valueTo" : 0,
				"frames" : 3,
				"skip" : i*3,
				"onEnd" : ((i==bricksContainerObj.countBricks()-1) ?
					function(){
						bricksContainerObj.removeFakeChild();
						bricksContainerObj.addChangeSizeEvent();
						setTimeout(function(){shuffleBricks();}, 3000);
					} : function (){})
			});
		}
	}
}

function shuffleChildren(obj) {
	var children = [];
 	while(obj.childNodes.length) {
		children.push(obj.firstChild);
		obj.removeChild(obj.firstChild);
	}
	children = children.sort(function(a,b){return random(2)-1;});
	for (var i=0; i<children.length; i++) {
		obj.appendChild(children[i]);
	}
}

function getBlankBrick() {
	var brick = document.createElement('div');
	addClass(brick, 'blankBrick');
	addClass(brick, 'brickColor' + (random(3)+1));
	return brick;
}