dataUpdater = new Class({
	Implements: Options,
	
	options: {
		'baseHref'   : '',
		'emptyLabel' : 'empty',
		'customManufacturerLabel' : 'custom'
	},

	initialize: function( options ) {
		this.setOptions( options );
		
		$( 'parentID' ).addEvent( 'change' , this.selectCategory.bind( this ) );
		$( 'updateCategoryButton' ).destroy();
	},
	
	/**
	 * Update manufacturers
	 */
	updateManufacturers : function( data ) {
		// update manufacturers
		var manufacturersContainer = $('manufacturer');

		manufacturersContainer.empty();
		new Element( 'option', { 'class': 'customManufacturerSelect', 'value': -1, text: this.options.customManufacturerLabel } ).inject( manufacturersContainer );

		if( data.manufacturers.length > 0 ) {
			data.manufacturers.each( function( man, idx ) {
				new Element( 'option', { 'value': man.id, text: man.title } ).inject( manufacturersContainer );
			});
		}

	},

	/**
	 * Load parameters/manufacturers of category with given ID
	 */
	selectCategory : function( ev ) {		
		// request manufacturers
		new Request.JSON( {
			url: this.options.baseHref + 'scripts/get-category-data.php',
			data: { 'category-ID': ev.target.value },
			onSuccess: this.updateManufacturers.bind( this )
		}).send();
		
		// request properties
		new Request.HTML( {
			url: this.options.baseHref + 'scripts/get-category-properties.php',
			data: { 'category-ID': ev.target.value },
			onSuccess: function( responseTree, responseElements, responseHTML, responseJavaScript ) {				
				var container = $('propertiesContainer');
				
				container.empty();
				container.set( 'html', responseHTML );
				
			}
		} ).send();
	}
});

imageBoxes = new Class({
	Implements: Options,
	
	options: {
		'injectInto' : 'titleImageBox',
		'startID'   : 0,
		'maxImageBoxes' : 5,
		
		'addImageLabel' : 'Add more',
		'imageLabel' : 'Image',
		'titleLabel' : 'Title',
		'descriptionLabel' : 'Description'
	},
	
	initialize: function( options ) {
		this.setOptions( options );
		
		if( this.options.maxImageBoxes < 1 || !$(this.options.injectInto) )
			return;
		
		this.boxesCounter = 0;
		this.boxID = this.options.startID;
		this.newImageButton = new Element( 'div' ).inject( this.options.injectInto, 'bottom' );
		
		new Element( 'hr' ).inject( this.newImageButton );
		new Element( 'a', { 'class': 'submitForm', 'text': this.options.addImageLabel, 'events' : { 'click' : this.createImageBox.bind( this ) } }).inject( this.newImageButton );
	},
	
	/**
	 * Creates box for image attachment
	 */
	createImageBox : function() {
		if( this.boxesCounter >= this.options.maxImageBoxes )
			return;

		new Element( 'div', {
			'class': 'imageBox',
			'html': '<hr />' +
					'<div class="form_row">' +
						'<label class="form_cell_1" for="file'+this.boxID+'">'+this.options.imageLabel+':</label>' +
						'<span class="form_cell_2"><input type="file" name="newFiles['+this.boxID+']" id="file'+this.boxID+'" /></span>' +
					'</div>' +

					/*
					'<div class="form_row">' +
						'<label class="form_cell_1" for="imageName'+this.boxID+'">'+this.options.titleLabel+':</label>' +
						'<span class="form_cell_2"><input type="text" name="newFileDetails['+this.boxID+'][title]" id="imageName'+this.boxID+'"/></span>' +
					'</div>' +
					*/

					'<div class="form_row">' +
						'<label class="form_cell_1" for="imageDescription'+this.boxID+'">'+this.options.descriptionLabel+':</label>' +
						'<span class="form_cell_2"><input type="text" name="newFileDetails['+this.boxID+'][description]" id="imageDescription'+this.boxID+'" size="40" /></span>' +
					'</div>'
		} ).inject( this.newImageButton, 'before' );
		
		++this.boxesCounter;
		++this.boxID;
		
		if( this.boxesCounter >= this.options.maxImageBoxes )
			this.newImageButton.destroy();
	}	
});

imageEdits = new Class({
	Implements: Options,
	
	options: {
		'editBoxClass' : 'imageData',
		'editButtonLabel' : 'edit'
	},
	
	initialize: function( options ) {
		this.setOptions( options );
		
		$$( this.options.editBoxClass ).each( function( box ) {
			
		} );
	},
	
	show: function( box ) {
		
	}
});
