//************************************************controls***************************************************
new function(core){
core.controls["gapjumper.com.custom:demoPlayer"] =
{
	"initializer":function($attributes)
	{
		window["gapjumper.com"].engineTxt = window["gapjumper.com"].utils.sendXHR('framework/engine.js');
		window["gapjumper.com"].componentsTxt = window["gapjumper.com"].utils.sendXHR('framework/components.js');
		window["gapjumper.com"].componentsCSSTxt = window["gapjumper.com"].utils.sendXHR('framework/components.css');
	},

	"template":
	[
		{"div":{"style":"position:relative;overflow:hidden;height:100%;width:100%"}},
		[
			{"div":{"style":"overflow:auto;position:absolute;z-index:1;white-space:normal;width:100%;height:100%;padding:10px;background-color:white;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-box-sizing:border-box;"}},
			{"iframe":{"frameborder":"0", "style":"position:absolute;z-index:0;width:100%;height:100%;background-color:white"}},
			{"textarea":{"style":"position:absolute;z-index:0;border-style:none;font-size:11px;border-width:0;padding:0px;width:100%;height:100%;resize:none;"}}
		]
	],
	
	"properties":
	{
		"width":
		{
			"set":function(value)
			{
				this.style.width = value
			}
		},
		
		"height":
		{
			"set":function(value)
			{
				this.style.height = value
			}		
		},
		
		"demos":
		{
			"default":{}
		},
		
		"current":{},
		
		"curve":
		{
			"default": core.animation.curve.linear
		},
		
		"duration":
		{
			"default": 400
		},
		
		"view":
		{
			"default":"description"
		}
	},

	"methods":
	{
		"load":function(url)
		{
			var oDemos = this.getProperty("demos");
			var oDemo = oDemos[url];
			if(!oDemo)
			{
				var sResponse = core.utils.sendXHR(url);
				oDemo = this.callMethod("parse", sResponse);
				oDemos[url] = {"name":oDemo.name, "description":oDemo.description, "code":oDemo.code, "url":url};
			}
			this.setProperty("current", url);
			this.callMethod('getViewContainer', 'description').innerHTML = oDemo.description;
			this.callMethod("reset");
			this.callMethod("render");
		},
		
		"parse":function(sXML)
		{
			var sName = sXML.match(/<title>.*<\/title>/)[0].slice(7, -8);		
			var sDescription = sXML.slice(sXML.indexOf('<blockquote>'), sXML.indexOf('</blockquote>')+13);	
			var sCode = sXML.replace(sDescription, '');
			sDescription = sDescription.slice(12,-13);
			if(sCode)
			{
				//remove blank lines from top/bottom
				sCode = sCode.replace(/^\s*\n/,"");
				sCode = sCode.replace(/\s+$/, "");
				//remove remaining blank lines
				sCode = sCode.replace(/\n\s*\n+/g,"\n");

				//determine number of leading spaces
				sIndent = sCode.match(/^\s+/);
				var nShift = sIndent?sIndent[0].length:0;
				if(nShift)
				{
					// remove spaces from first line
					sCode = sCode.replace(/^\s+/, "");
					//shift remaining lines to the left
					var oRegExp = new RegExp("\\n\\s{"+nShift+"}", "g");
					sCode = sCode.replace(oRegExp, "\n");
				}			}
			return {"name":sName, "description":sDescription, "code":sCode};
		},
		
		"reset":function()
		{
			this.callMethod("getViewContainer", "code").value = this.getProperty("demos")[this.getProperty("current")].code;
		},
		
		"setView":function(sView)
		{
			if(this.getProperty("view") != sView)
			{
				if(sView == "liveView" && (this.getProperty('view') == 'code'))
				{
					this.callMethod("render");
				}
				this.callMethod("getViewContainer", sView).style.zIndex = "1";
				this.callMethod("getViewContainer", this.getProperty("view")).style.zIndex = "0";
				this.setProperty("view", sView);
			}
		},
		
		"getViewContainer":function(sView)
		{
			switch(sView)
			{
				case "description":
					return this.firstChild;					
				case "liveView":
					return this.firstChild.nextSibling;
				case "code":
					return this.lastChild;
			}
		},
		
		"render":function()
		{
			var oFrame = this.callMethod("getViewContainer", "liveView");
			var sCode = this.callMethod("getViewContainer", "code").value;
			sCode = sCode.replace(/<script.*src=[",'].*engine.*<\/script>/, "<script>" + top['gapjumper.com'].engineTxt + "</" + "script>");
			if(sCode.match(/<script.*src=[",'].*components.*<\/script>/))
			{
				sCode = sCode.replace(/<script.*src=[",'].*components.*<\/script>/, "<script>" + top['gapjumper.com'].componentsTxt + "</" + "script>");			
			}
			if(sCode.match(/<link.*href=[",'].*components.*\/>/))
			{
				sCode = sCode.replace(/<link.*href=[",'].*components.*\/>/, "<style type='text/css'>" + top['gapjumper.com'].componentsCSSTxt + "</" + "style>");			
			}

			if(oFrame.contentWindow)
			{
				oFrame.contentWindow.document.open("text/html", "replace");
				oFrame.contentWindow.document.write(sCode);
				oFrame.contentWindow.document.close();				
			}
		}
	}
}}(window["gapjumper.com"])

