function checkLocation(newLocation, historyData)
{
	wizard.parseAnchor(newLocation);
}

var theMachineUrl = appBaseUrl;

function Wizard(){	
}

var TYPE_PICKER = 0;
var TYPE_SLIDER = 1;
var TYPE_HIDDEN = 2;

var MAX_STRIPE_COLORS = 5;

var wizard = 
{
	lastLocationHash: null,
	currentBackId: 'bgtype_0',
	currentDirectionId: 'orientation_0',
	lastImageUrl: null,
	lastParamString: null,
	repeatStyle: 'repeat',
	tiledPreview: true,
	stripeColorsNum: 1,
	
	selectBackType: function(v)
	{
		if(1 || $('bgtype').value != v)
		{
			var backId = 'bgtype_' + v;
			$(this.currentBackId).className = "";
			$(this.currentBackId = backId).className = "icon_selected";
			$('bgtype').value = v;
			$S('shadow_container').display = v != 3 ? '' : 'none';
			$S('gradient_container').display = v == 3 ? '' : 'none';
			$S('background_color2_widget').display = v > 0 ? '' : 'none';
//			RGBupdate('background_color2', $('stripe_color_input').value);
			this.notifySizeChanged();
		}
	},
	
	selectStripeDirection: function(v)
	{
		if(1 || $('orientation').value != v)
		{
			var dirId = 'orientation_' + v;
			$(this.currentDirectionId).className = "";
			$(this.currentDirectionId = dirId).className = "icon_selected";
			$('orientation').value = v;
			this.notifyChanged();
		}
	},
	
	setColor: function(pickerId, color)
	{
		$S(pickerId).background = '#' + color;
		$(pickerId + '_input').value = color;
		this.notifyChanged();
	},
	
	fields:
	{
		fore:
		{
			type:2,
			ajax_param: 'fore',
			defaultValue: 'ff0000'
		},
		gradient_height_input:
		{
			validate: function(v){return v > 0 && v <= 200},
			err_msg: "Gradient height must be between 1 and 100",
			type: 1,
			ajax_param: 'h',
			defaultValue: 30
		},
		stripe_size_input:
		{
			validate: function(v){return v > 0 && v <= 50},
			err_msg: "Stripe size must be between 1 and 50",
			type: 1,
			ajax_param: 'w',
			defaultValue: 20
		},
		spacing_input:
		{
			validate: function(v){return v >= 0 && v <= 50},
			err_msg: "Spacing must be between 0 and 50",
			type: 1,
			ajax_param: 'p',
			defaultValue: 20
		},
		background_color1_input:
		{
			type: 0,
			ajax_param: 'back1',
			defaultValue: 'ffffff'
		},
		background_color2_input:
		{
			type: 0,
			ajax_param: 'back2',
			defaultValue: 'ff0000'
		},
		bgtype:
		{
			type: 2,
			ajax_param: 'gt',
			defaultValue: 0
		},
		orientation:
		{
			type: 2,
			ajax_param: 'd',
			defaultValue: 0
		},
		shadow_size_input:
		{
			type: 1,
			ajax_param: 'shadow',
			defaultValue: 0
		}
		
		
	},
	
	validate: function()
	{
		this.updateStripeColorsField();
		
		var errors = "";
		
		for(field in this.fields)
		{
			if(this.fields[field].validate && !this.fields[field].validate($(field).value))
			{
				errors += this.fields[field].err_msg + "<br/>";
			}
		}
		if(errors == "")
		{
			this.updateAnchor();
			
			this.submit();
		}
	},
	
	updateTileSize: function()
	{
		var tileWidth = (parseInt($('stripe_size_input').value) + parseInt($('spacing_input').value)) * this.stripeColorsNum;
		
		var tileHeight = $('bgtype').value == 3 ? parseInt($('gradient_height_input').value) : tileWidth;
		
		$('tile_size').innerHTML = "Tile size: " + tileWidth + "px * " + tileHeight + "px";
	},
	
	submit: function()
	{
		this.lastParamString = "";
		
		var isDefaultImage = true;
		
		for(field in this.fields)
		{
			isDefaultImage = isDefaultImage && ($(field).value == this.fields[field].defaultValue);
			this.lastParamString += this.fields[field].ajax_param + "=" + $(field).value + "&";
		}
		
		$S('preview_refresher').visibility = 'hidden';
		
		this.repeatStyle = this.currentBackId == 'bgtype_3' ? 'repeat-x' : 'repeat';
		
		$S('tile_preview').backgroundRepeat = this.tiledPreview ? this.repeatStyle : 'no-repeat';
		
		this.setDraggerConstraints();

		this.lastImageUrl = appBaseUrl + "generators/generate_stripes.php?" + this.lastParamString;
		
		if(1)
		{
//			$S('tile_preview').backgroundColor = '#ffffff';
			$S('tile_preview').backgroundImage = "url('" + this.lastImageUrl + "')";
		}
		else
		{
			$S('tile_preview').backgroundImage = "url('images/defaultstripe.png')";
		}
	},
	
	updateAnchor: function()
	{
		var anchorString = "";
		
		for(field in this.fields)
		{
			anchorString += this.fields[field].ajax_param + "=" + $(field).value + ";";
		}
		
		dhtmlHistory.add(encode64(anchorString), "");
	},
	
	parseAnchor: function()
	{
		var anchorString = location.hash.substring(1);
		
		this.lastLocationHash = anchorString;
		
		if(anchorString != '')
		{
			anchorString = decode64(anchorString);
			
			var anchorParams = anchorString.split(';');
			var paramsHash = new Array();
			
			for(var i=0; i<anchorParams.length; i++)
			{
				var keyValueArray = anchorParams[i].split('=');
				paramsHash[keyValueArray[0]] = keyValueArray[1];
			}
			
			for(field in this.fields)
			{
				this.parseField(field, paramsHash[this.fields[field].ajax_param]);
			}
		}
		else
		{
			for(field in this.fields)
			{
				this.parseField(field, this.fields[field].defaultValue);
			}
		}
		this.submit();
	},
	
	parseField: function(fieldId, fieldValue)
	{
		if(fieldId != '')
		{

			$(fieldId).value = fieldValue;
			switch(this.fields[fieldId].type)
			{
				case TYPE_PICKER:
					parseColorFromInput(fieldId.substring(0, fieldId.length - 6));
					break;
				case TYPE_SLIDER:
					Slider.updateFromInput(fieldId.substring(0, fieldId.length - 6));
					break;
				case TYPE_HIDDEN:
					if(fieldId == 'orientation')
					{
						this.selectStripeDirection(fieldValue);
					}
					else if(fieldId == 'bgtype')
					{
						this.selectBackType(fieldValue);
					}
					else if(fieldId == 'fore')
					{
						this.parseStripeColors(fieldValue);
					}
					break;
			}
		}
	},
	
	notifySizeChanged: function(sliderId)
	{
		wizard.updateTileSize();
		
		wizard.notifyChanged();
		
		if(sliderId == 'spacing')
			wizard.checkShadowSize();
	},
	
	checkShadowSize: function()
	{
		var maxShadowSize = parseInt($('spacing_input').value);
		
		Slider.sliders['shadow_size'].maxValue = maxShadowSize;
		
		Slider.updateFromInput('shadow_size');
	},
	
	checkSpacing: function()
	{
		var minSpacing = this.stripeColorsNum == 1 ? 1: 0;
		
		Slider.sliders['spacing'].minValue = minSpacing;
		
		Slider.updateFromInput('spacing');
	},
	
	notifyChanged: function()
	{
		$S('preview_refresher').visibility = 'visible';
	},
	
	download: function()
	{
		$('download_link').href = this.lastImageUrl + "&download=1";
		
		return true;
	},
	
	afterDownload: function()
	{
		$('download_link').href = '#';
	},
	
	switchTileStyle: function()
	{
		var imgSrc;
		if(this.tiledPreview)
		{
			$S('tile_preview').top = ($('tile_preview_container').offsetHeight - $('tile_preview').offsetHeight) / 2 + "px";
			$S('tile_preview').left = ($('tile_preview_container').offsetWidth - $('tile_preview').offsetWidth) / 2 + "px";
			
			$S('tile_preview').backgroundRepeat = "no-repeat";
			imgSrc = 'unchecked';
		}
		else
		{
			$S('tile_preview').backgroundRepeat = this.repeatStyle;
			imgSrc = 'checked';
		}
		
		document.images['tile_show_style'].src = 'images/' + imgSrc + '.gif';
		this.tiledPreview = !this.tiledPreview;
		
		this.setDraggerConstraints();
	},
	
	setDraggerConstraints: function()
	{
		if(!this.tiledPreview)
		{
			previewDragger.dragConstraints = DRAG_NONE;
		}
		else
		{
			if(this.repeatStyle == 'repeat')
			{
				previewDragger.dragConstraints = DRAG_BOTH;
			}
			else
			{
				previewDragger.dragConstraints = DRAG_HORIZONTAL;
			}
		}
	},
	
	updateStripeColorsField: function()
	{
		var stripeColorsArray = new Array(this.stripeColorsNum);

		for(i = 0; i < this.stripeColorsNum; i++)
		{
			stripeColorsArray[i] = $('stripe_color' + i + '_input').value;
		}
		$('fore').value = stripeColorsArray.join(',');
	},
	
	parseStripeColors: function(fieldValue)
	{
		$('fore').value = fieldValue;

		var colors = fieldValue.split(',');
		
		$('stripe_color0_input').value = colors[0];

		for(i = this.stripeColorsNum; i > 0; i--)
		{
			this.removeStripeColor(i);
		}
		for(i = 1; i < colors.length; i++)
		{
			this.addStripeColor(colors[i]);
		}
		for(i = 0; i < colors.length; i++)
		{
			parseColorFromInput('stripe_color' + i);
		}
	},
	
	addStripeColor: function(defaultColor)
	{
		if(this.stripeColorsNum < MAX_STRIPE_COLORS)
		{
			var pickerDOM = $C(getPickerWidget('stripe_color' + this.stripeColorsNum, defaultColor));

			var pickerContainer = C("div","style","clear:both");
			pickerContainer.appendChild(pickerDOM);

			$('stripe_color0_widget').appendChild(pickerContainer);
			
			pickerDOM.appendChild(
				C("a","id","stripe_color" + this.stripeColorsNum + "_remove",
					"class","color_picker_link",
					"href","javascript:wizard.removeStripeColor(" + this.stripeColorsNum + ")",
					"innerHTML","[remove]")
			);
			
			attachPickerEvents('stripe_color' + this.stripeColorsNum);
			
			this.stripeColorsNum++;
			
			this.notifySizeChanged();
			
			this.checkSpacing();
		}
	},
	
	removeStripeColor: function(colorId)
	{
		if(colorId > 0 && colorId < this.stripeColorsNum && $('stripe_color' + colorId + '_widget'))
		{
			var pickerElement = $('stripe_color' + colorId + '_widget');
			
			pickerElement.parentNode.removeChild(pickerElement);
			
			for(i = colorId + 1; i < this.stripeColorsNum; i++)
			{
				$('stripe_color' + i + '_widget').id = 'stripe_color' + (i - 1) + '_widget';
				$('stripe_color' + i).id = 'stripe_color' + (i - 1);
				$('stripe_color' + i + '_input').id = 'stripe_color' + (i - 1) + '_input';
				$('stripe_color' + i + '_remove').href = "javascript:wizard.removeStripeColor(" + (i - 1) + ")";
				$('stripe_color' + i + '_remove').id = 'stripe_color' + (i - 1) + '_remove';
			}
			
			this.stripeColorsNum--;
			
			this.notifySizeChanged();
			
			this.checkSpacing();
		}
	},
	
	share: function()
	{
		popup(500, 'sharestripe', wizard.showSharedStripe);
	},
	
	showSharedStripe: function()
	{
		if($('shared_stripe'))
		{
			$('shared_stripe').style.backgroundImage = "url('" + wizard.lastImageUrl + "')";
		}
	},
	
	tartanLink: function()
	{
		var bands = [];
		
		for(var i = 0; i < this.stripeColorsNum; i++)
		{
			bands.push($('stripe_color' + i + '_input').value);
			
			bands.push(5);
		}
		bands.push($('background_color1_input').value);
		
		bands.push(5);
		
		if(this.currentBackId != 'bgtype_0')
		{
			bands.push($('background_color2_input').value);
			
			bands.push(5);
		}
		
		var params = 'fore=' + bands.join(',') + ';t=1;l=1';
		
		$('tartanLink').href = "http://www.tartanmaker.com/#" + encode64(params);
		
		return true;
	}
}