// Change Demo - MIT licence  webresizer.com

// change demo select boxes
var demo = {
	menu: "<div id='dropdowns'><div id='switch_demo'>Change Demo:&nbsp;<select name='demoType' id='demoType' onchange='changeType(this.value)'><option value='simple'>Simple</option><option value='single'>Single Image</option><option value='tool'>Tool Display</option><option value='upload'>Uploads Off</option></select></div><div id='switch_lang'>Language:&nbsp;<select name='demoLang' id='demoLang' onchange='changeLang(this.value)'><option value='en' selected='true'>English</option><option value='es'>Spanish</option><option value='ru'>Russian</option><option value='pt'>Portuguese</option><option value='pl'>Polish</option><option value='it'>Italian</option><option value='he'>Hebrew</option><option value='fr'>French</option><option value='fi'>Finnish</option><option value='nl'>Dutch</option><option value='dk'>Danish</option></select></div></div>", 
	lang: {dk:"Danish",en:"English",es:"Spanish",fi:"Finnish",fr:"French",he:"Hebrew",it:"Italian",nl:"Dutch",pl:"Polish",pt:"Portuguese",ru:"Russian"},
	type: {simple:"simple",single:"single",tool:"tool",upload:"upload"}
};

function isdef(x) {
// check x is defined and not null 
	return ((x!=null)&&(x!='undefined'))?true:false;
};

function changeLang(l) {
// change webresizer language
	var f = document.getElementById("webresizerIFrame"); // webresizer IFrame
	if (isdef(f)) {
		f.src = f.src.replace(/lang=\w*&/, "lang=" + l +"&");
		changeHeading(null,l,false); // optional - change the heading for this demo
	};
};

function changeType(t) {
// change webresizer demo type : Simple, Single Image etc

	var f = $("webresizerIFrame");
	if (isdef(f)) {
		var s = f.src, s1 = null, s2;
		if (t == demo.type.single) {
			s1 = "uploads=yes&apitools=&singleimage=yes&singleline=yes";
			s2 = "imageurl=http://webresizer.com/images/strawberry.jpg&de";
		} else if (t == demo.type.simple) {
			s1 = "uploads=yes&apitools=&singleimage=no&singleline=no";
			s2 = "imageurl=&de";
		} else if (t == demo.type.tool) {
			s1 = "uploads=yes&apitools=bq&singleimage=yes&singleline=yes";
			s2 = "imageurl=http://webresizer.com/images/coffee.jpg&de";
		} else if (t == demo.type.upload) {
			s1 = "uploads=no&apitools=bq&singleimage=yes&singleline=yes";
			s2 = "imageurl=&de";
		};
		if (isdef(s1)) {
			s = s.replace(/uploads.*$/,s1);
			s = s.replace(/imageurl=.*&de/,s2);
			f.src = s;
			changeHeading(t,null,true);
		};
	};
};

function changeHeading(t,l,newDemo) {
// change the page heading, text and sample code associated with this demo (dependencies mootools-1.2.1.js)

	var demoTitle = {simple:"Simple Demo",single:"Single Image",tool:"Tool Display",upload:"Uploads Off"};
	var demoText = {
		simple:"Embed webresizer by cutting and pasting simple HTML and javascript ...",
		single:"Customize the webresizer interface ...",	
		tool:"Turn selected tools on or off ...",
		upload:"Use webresizer as an editor only ..."
	};
	
	// get the heading for this demo type
	if (!isdef(t)) t = $("demoType").value;
	var dt = demoTitle[t];
	if (!isdef(dt)) dt = "Demo";
	
	// get the selected language
	if (!isdef(l)) l = $("demoLang").value;
	var lt = demo.lang[l];  
	lt = (isdef(lt))?" - " + lt:""; 
		
	// change the page heading
	$("demoHeading").set('html', dt + lt);
	
	// change the demo text
	var txt = demoText[t];
	if (!isdef(txt)) txt = "";
	$('demoText').set('html', txt);
		
	// change the sample code
	changeCode(t, l, newDemo);	
	
};

function changeCode(dType,dLang,newDemo) {
// change the sample code displayed for this demo (dependencies mootools-1.2.1.js)

	var newCode = {
		start:"<pre>&lt;script type=&quot;text/javascript&quot;&gt;<br/><br/>webresizer_apikey = 'your API key here';<br/>webresizer_language = '" + dLang + "';<br/>",
	    start_obj:"<pre>&lt;script type=&quot;text/javascript&quot;&gt;<br/><br/>var webresizerAPI = new Object;<br/><br/>webresizerAPI.parameters = {<br/>    apikey : 'your api key here',<br/>    language : '" + dLang + "',<br/>",
		mid:"",
		end:"<br/>&lt;/script&gt;<br/>&lt;script type=&quot;text/javascript&quot;<br/>src=&quot;http://api.webresizer.com/ext/js/webresizer_api.js&quot;&gt;<br/>&lt;/script&gt;</pre>",
		single:"webresizer_single_image = 'yes';<br/>webresizer_single_line = 'yes';<br/>webresizer_image_url = 'http://webresizer.com/images/strawberry.jpg';<br/>",
		tool:"    single_image : 'yes',<br/>    single_line : 'yes'<br/>};<br/><br/>webresizerAPI.toolDisplay = {<br/>    contrast : 'no',<br/>    exposure : 'no',<br/>    rotate : 'no',<br/>    saturation : 'no',<br/>    sharpen : 'no',<br/>    tint: 'no'<br/>};",
		upload:"    single_image : 'yes',<br/>    single_line : 'yes',<br/>    allow_uploads : 'no'<br/>};<br/><br/>webresizerAPI.toolDisplay = {<br/>    contrast : 'no',<br/>    exposure : 'no',<br/>    rotate : 'no',<br/>    saturation : 'no',<br/>    sharpen : 'no',<br/>    tint: 'no'<br/>};",
		show:function() {return this.start + this.mid + this.end;}	
	};
	
	if (dType == demo.type.single) {
		newCode.mid = newCode.single;
	} else if (dType == demo.type.tool) {
		newCode.start = newCode.start_obj;
		newCode.mid = newCode.tool;
	} else if (dType == demo.type.upload) {
		newCode.start = newCode.start_obj;
		newCode.mid = newCode.upload;
	};

	// add the new sample code
	$('demoCode').set('html', newCode.show());
	if (newDemo) {
		var s = new Fx.Slide('demoCode');
		$('showCode').set('html', "show code");
		s.slideOut();
	};
};


window.addEvent('domready', function() { // (dependencies mootools-1.2.1.js)
											
	// display the change demo select boxes
    $('demoMenus').set('html', demo.menu);
	
	// display the 'show code' link and add events (mootools slider)
	var status = {
		'true': 'hide code',
		'false': 'show code'
	};
	var d = new Fx.Slide('demoCode');
	$('showCode').addEvent('click', function(e){
		e.stop();
		d.toggle();
	});
	d.addEvent('complete', function() {
		$('showCode').set('html', status[d.open]);
	});

	// display the sample code
	changeCode('Simple','en');
	$('demoCode').style.visibility = "visible";
});