document.observe('dom:loaded', function() {
	WidgetBuilder = new(Class.create({
		initialize: function() {
			this.stylesheet = 5;
			this.transparent = $('widget_transparent').checked;
			this.results = 4;
			this.searchID = $F($('search_widget_builder')['search_id']);

			$('number_of_results').observe('change', function() {
				WidgetBuilder.updatePreview();
			});
			
			$('widget_transparent').observe('click', function() {
				WidgetBuilder.updatePreview();
			});
		
			$('custom_search_widget_colour').select('input').each(function(s) {
				s.observe('click', function(e) {
					WidgetBuilder.updatePreview();
				});
			});
			
			this.updatePreview($RF('search_widget_builder', 'widget_colour', true));
			
		},
		updateThumbnail: function() {
			if ($('widget_transparent').checked) {
				$('search_widget_preview').src = '/images/site/screenshots/widgets/transparent.gif';
				$('search_widget_preview').alt = 'Transparent search widget preview'
			} else {
				$('search_widget_preview').src = '/images/site/screenshots/widgets/' + $RF('search_widget_builder', 'widget_colour') + '.gif';
				$('search_widget_preview').alt = $RF('search_widget_builder', 'widget_colour') + ' search widget preview'
			}

		},
		updatePreview: function() {
			var change = false;
			var changeThumb = false;
			
			if (this.transparent != $('widget_transparent').checked) {
				change = true;
				this.transparent = $('widget_transparent').checked;
				changeThumb = true;
			}

			if (this.stylesheet != $RF('search_widget_builder', 'widget_colour')) {
				this.stylesheet = $RF('search_widget_builder', 'widget_colour');
				change = true;
				if (!this.stylesheet) this.stylesheet = 6; //Default to blue if something goes wrong
				this.updateThumbnail();
			}
			
			if (change || this.results != $F($('search_widget_builder')['number_of_results'])) {
				this.results = $F($('search_widget_builder')['number_of_results']);
				change = true;
			}
			
			if (changeThumb) this.updateThumbnail();
			
			if (change) {
				new Ajax.Updater('widget_snippet','/customise/generate_search_widget', {
					method: 'get',
					parameters: { number_of_results: this.results, stylesheet_id: this.stylesheet, search_id: this.searchID, transparent: this.transparent }
				});
			}
		}
	}));
});






function $RF(el, radioGroup, id) { 
		if (typeof id == "undefined") var id = false;
    if($(el).type && $(el).type.toLowerCase() == 'radio') { 
        var radioGroup = $(el).name; 
        var el = $(el).form; 
    } else if ($(el).tagName.toLowerCase() != 'form') { 
        return false; 
    } 
    var checked = $(el).getInputs('radio', radioGroup).find( 
        function(re) {return re.checked;} 
    ); 
		if (id) return checked.id;
    return (checked) ? $F(checked) : null; 
}