/**
 * From version 7.1
 */
YAHOO.si.Layouts = function()
{
	this.textblocks = [];
	/**
	 * For the layouts I have in mind, I only need a maximum of 5 element. I won't 
	 * need textboxes for headers anymore because the full Editor we use here provides
	 * a style drop-down list from Header 1 to 6. Initialise these text blocks with
	 * the editor-hidden class so that they are invisible initially.
	 */
	for(var i = 0; i < 5; i++)
	{
		this.textblocks[i] = document.createElement("div");
		this.textblocks[i].id = "textblock_" + i;
		this.textblocks[i].className = "editor-hidden";
	}
	/**
	 * The key to an object which describes key data about the relevant layout.
	 */
	this.SINGLE_BOX_LAYOUT = "singlebox";
	/**
	 * The key to an object which describes key data about the relevant layout.
	 */
	this.SIDE_BY_SIDE = "sidebyside";
	this.ONE_UP_TWO_DOWN = "oneuptwodown";
	this.TWO_OVER_ONE = "2over1";
	/**
	 * Added in version 7.1
	 */
	 this.TOP_AND_BOTTOM = "topandbottom";
	 this.ONE_TWO_ONE = "onetwoone";
	/**
	 * An object literal containing all the available layouts: Single Box, Side-by-side etc.
	 * with data for each stored in the blocks array.
	 */
	this.layouts = {
		"singlebox":{
			type:"singlebox",
			titlebar:["Single Box Layout"],
			textblocks:[
					{	x:0,	
						y:0,	
						width:950,		
						height:400,
						textblock:this.textblocks[0],
						id:this.textblocks[0].id,
						className:"single-block"
						}
				]
		},
		"sidebyside":{
			type:"sidebyside",
			titlebar:["Side-by-side Layout: Left Box", "Side-by-side Layout: Right Box"],
			textblocks:[
				{	x:0,		
					y:0,	
					width:470,		
					height:400,
					textblock:this.textblocks[0],
					id:this.textblocks[0].id,
					className:"sidebyside-left"
					},
				{	x:470,	
					y:0,	
					width:470,		
					height:400, 
					textblock:this.textblocks[1],
					id:this.textblocks[1].id,
					className:"sidebyside-right"
				}		
			]			
		},
		"2over1":{
			type:"2over1",
			titlebar:["Two-over-one layouts: Top-Left Box","Two-over-one layouts: Top-Right Box","Two-over-one layouts: Bottom Box"],
			textblocks:[
				{	x:0,		
					y:0,	
					width:470,		
					height:200,
					textblock:this.textblocks[0],
					id:this.textblocks[0].id,
					//Can't use class names that begin with a number in CSS
					className:"twooverone-topleft"
				},
				{	x:475,		
					y:0,	
					width:470,		
					height:200,
					textblock:this.textblocks[1],
					id:this.textblocks[1].id,
					className:"twooverone-topright"
				},
				{	x:0,		
					y:220,	
					width:950,		
					height:200,
					textblock:this.textblocks[2],
					id:this.textblocks[2].id,
					className:"twooverone-bottom"
				}
			]
		},	
		"onetwoone":{
			type:"onetwoone",
			titlebar:[
				"One-two-one layouts: Top  Box",
				"One-two-one layouts: Middle-Left  Box",
				"One-two-one layouts: Middle-Right Box",
				"One-two-one layouts: Bottom Box"],			
			textblocks:[
				{	x:0,		
					y:0,	
					width:950,		
					height:200,
					textblock:this.textblocks[0],
					id:this.textblocks[0].id,
					//Can't use class names that begin with a number in CSS
					className:"onetwoone-top"
				},
				{	x:0,		
					y:220,	
					width:470,		
					height:200,
					textblock:this.textblocks[1],
					id:this.textblocks[1].id,
					//Can't use class names that begin with a number in CSS
					className:"onetwoone-middleleft"
				},
				{	x:475,		
					y:220,	
					width:470,		
					height:200,
					textblock:this.textblocks[2],
					id:this.textblocks[2].id,
					className:"onetwoone-middleright"
				},
				{	x:0,		
					y:440,	
					width:950,		
					height:200,
					textblock:this.textblocks[3],
					id:this.textblocks[3].id,
					className:"onetwoone-bottom"
				}
			]
		},
		"oneuptwodown":{
			type:"oneuptwodown",
			titlebar:[
				"One-up-two-down layouts: Top  Box",
				"One-up-two-down layouts: Bottom-Left Box",
				"One-up-two-down layouts: Bottom-Right Box"],
			textblocks:[
				{	x:0,		
					y:0,	
					width:950,		
					height:200,
					textblock:this.textblocks[0],
					id:this.textblocks[0].id,
					//Can't use class names that begin with a number in CSS
					className:"oneuptwodown-top"
				},
				{	x:0,		
					y:220,	
					width:470,		
					height:200,
					textblock:this.textblocks[1],
					id:this.textblocks[1].id,
					className:"oneuptwodown-bottomleft"
				},
				{	x:475,		
					y:220,	
					width:470,		
					height:200,
					textblock:this.textblocks[2],
					id:this.textblocks[2].id,
					className:"oneuptwodown-bottomright"
				}
			]
		
		},
		"topandbottom":{
			type:"topandbottom",
			titlebar:["Top and Bottom layout: Top Box","Top and Bottom layout: Bottom Box"],
			textblocks:[
				{	x:0,		
					y:0,	
					width:950,		
					height:200,
					textblock:this.textblocks[0],
					id:this.textblocks[0].id,
					//Can't use class names that begin with a number in CSS
					className:"topandbottom-top"
				},
				{	x:0,		
					y:220,	
					width:950,		
					height:200,
					textblock:this.textblocks[1],
					id:this.textblocks[1].id,
					className:"topandbottom-bottom"
				}
			]
		}	
	};
};