var canvas	= {

			canvas:					null,
			canvasHelper:			null,

			width:					null,
			height:					null,
			
			middleVertical:			null,
			middleHorizontal:		null,
				
			init:					function () {

										this.canvas	= $('#canvas');
										this.canvasHelper	= document.getElementById('canvas');
					
										this.width	= this.canvas.width();
										this.height	= this.canvas.height();
					
										this.middleVertical		= Math.round( this.width / 2 );
										this.middleHorizontal	= Math.round( this.height / 2 );
					
									}

			}


		var config	= {

				// user editable 
				timeRotate:				[0.75, 0.2, 0.2], // defines time per step
				timeFocus:				[0.7],
				timeRead:				[0.8],

				coverWidth:				315,
				coverHeight:			495,
				

				// TODO VCHECK FROM HERE
				fps:					25,

				itemWidth:				315,
				itemHeight:				495,
				itemShadowHeight:		50,
				
				timeRotation:			400,
				timeRotationFadeIn:		400,
				timeRotationFadeOut:	400,
				
				

				offset:					[ 0.12 , 0.12 , 0.20 , 0.33 , 0.5 , 0.67 , 0.80 , 0.88 , 0.88 ],

				topOffset:				[210, 210, 180, 120, 0, 120, 180, 210, 210],
				topMargin:				50,
				
				scale:					[ 0.35 , 0.35 , 0.45 , 0.65 , 1.0 , 0.65 , 0.45 , 0.35 , 0.35 ],
				zIndex:					[ 100  , 200  , 300  , 400  , 500 , 400  , 300  , 200   , 100 ],

				offsetFocus:			[0.10],

				focus:					[ 0.20 , 0.35 ], // focus has to points - endpoint and meetpoint

				// not user editable


				/*
				 * set automatically
				 */
				offsetPx:				null,
				offsetFocusPx:			null,
				offsetTurnPagePx:		null,
				itemSizesPx:			null,
				offsetTurnPagePx:		null,

				
				/* TODO FROM HERE */
				itemNumber:				null,
				
				realPositionsLeft:		null,
				
				
				realPositionsFocus:		null,

				realItemSizes:			null,

								
				init:					function () {
	
											/*
											 * sets the framerate
					 						 */
											$.fx.interval = Math.round( 1000 / this.fps );
	
											 this.offsetPx			= new Array();

												this.itemSizesPx		= new Array();
												this.offsetFocusPx		= new Array();

												
												for (var i = 0, maxI = this.scale.length; i < maxI; ++i) {
																									
													this.itemSizesPx.push ( new Array( Math.round(this.itemWidth * this.scale[i]) , Math.round(this.itemHeight * this.scale[i]) ) );

												}

												for (var i = 0, maxI = this.offset.length; i < maxI; ++i) {
													
													this.offsetPx.push( Math.round (canvas.width * this.offset[i] - ( this.itemSizesPx[i][0] / 2) ) );
													
												}

												for (var i = 0, maxI = this.offsetFocus.length; i < maxI; ++i) {

													this.offsetFocusPx.push( Math.round( this.offsetFocus[i] * canvas.width - ( this.itemSizesPx[i][0] / 2) ) );
													
												}

												//this.offsetTurnPagePx	= canvas.middleVertical - (this.itemWidth - this.itemWidthPageTurn);
												this.offsetTurnPagePx	= canvas.middleVertical;
	
											}

			}