Tx_Mevshop_Product.Configurable.EFG20 = new Class({

	Extends: Tx_Mevshop_Product.Configurable,

	/**
	 * Baut die Konfig-Maske
	 */
	getConfigurationInterface: function() {
		if (this.configurationInterface) return this.configurationInterface;
		
		this.fetchProductData();

		this.configurationInterface = new Element('div', {'class':'configuration configuration-EFG20 configuration-tgr' + this.getTeileGruppe()});

		var cartWrap = new Element('span', {'class':'addToCartWrap'}).inject(this.configurationInterface);

		this.options.guiElements.toCart.inject(cartWrap);
		var priceDisplay = new Element('span', {'class':'priceDisplay', events:{click:this.pseudoPriceDisplayClicked.bind(this)}}).inject(this.configurationInterface);
		this.options.guiElements.amount.inject(this.configurationInterface).show().addClass('qmValidator');

		
		var headline = new Element('h6', {text: this.lang.get('yourDesiredProduct', this.options.sku)}).inject(this.configurationInterface);

		var col1 = new Element('div', {'class':'inputcol col1'}).inject(this.configurationInterface);
		var col2 = new Element('div', {'class':'inputcol col2'}).inject(this.configurationInterface);
		var col3 = new Element('div', {'class':'inputcol col3'}).inject(this.configurationInterface);

		col1
			.adopt(
				new Element('label', {'class': 'headline', text: this.lang.get('enterDesiredDimensions')}),
				[
					new Element('label', {text: this.lang.get('widthAMm')}),
					new Element('input', {type:'text', 'class':'txtBox breite breiteValidator', name:'breite', tabindex: 1}),

					new Element('label', {text: this.lang.get('lengthBMm')}),
					new Element('input', {type:'text', 'class':'txtBox laenge laengeValidator', name:'laenge', tabindex: 2})
				]
			);


		col2
			.adopt(
				new Element('label', {
					'class': 'headline tooltip',
					text: this.lang.get('precutTypeOf'),
					style: '',
					events: {
						mouseenter: function(){ Tip(this.lang.get('precutTypeOfTooltip'), WIDTH, 200);}.bind(this),
						mouseleave: function(){ UnTip(); }
					}
				}),
				new Element('select', {size:'1', name:'lochanfang'})
			);


		var draftingContainer = new Element('div', {'class':'draftingContainer'}).inject(this.configurationInterface);
		
		var samplesContainer = new Element('div', {'class':'samplesContainer'}).inject(this.configurationInterface);

			// symmetrisch geschnitten
		new Element('div', {'class':'cut cut-symmetrically cutTypeF', 'html': '<span>' + this.lang.get('symmetricallyPrecut') + '</span>'}).inject(samplesContainer);

			// beliebig geschnitten
		new Element('div', {'class':'cut cut-userdefined cutTypeD',   'html': '<span>' + this.lang.get('userdefinedPrecut') + '</span>'}).inject(samplesContainer);

			// auf Knoten geschnitten
		new Element('div', {'class':'cut cut-atnode cutTypeC',        'html': '<span>' + this.lang.get('atNodePrecut') + '</span>'}).inject(samplesContainer);



		return this.configurationInterface;
	},


	/**
	 * Fügt die geholten Artikeldaten dem Datenarray hinzu
	 * @param responseJSON
	 * @param responseText
	 */
	dispatchProductData: function(responseJSON, responseText) {
		var smlFields = responseJSON.shopdata.item.smlfields;

		if ('TD' === smlFields['@'].type) {
			var data = {
				laengeMin: smlFields.D00860['#'].toInt(),
				laengeMax: smlFields.D00862['#'].toInt(),
				breiteMin: smlFields.D00864['#'].toInt(),
				breiteMax: smlFields.D00866['#'].toInt(),
				zuschnittarten: smlFields.D00878['#'],
				qmMax:     smlFields.D00852['#'].toInt()
			};
		} else {
			var data = {
				laengeMin: smlFields.E00860['#'].toInt(),
				laengeMax: smlFields.E00862['#'].toInt(),
				breiteMin: smlFields.E00864['#'].toInt(),
				breiteMax: smlFields.E00866['#'].toInt(),
				zuschnittarten: smlFields.E00878['#'],
				qmMax:     smlFields.E00852['#'].toInt()
			};
		}

		this.data = data;


		var selectElement = this.configurationInterface.getElement('select[name="lochanfang"]');
		this.configurationInterface.getElements('.samplesContainer .cut').hide();
		this.data.zuschnittarten.split('-').each(function(item) {
			selectElement.grab(new Element('option', {
				//value: item,
				text: this.lang.get('precutType' + item)
			}));

			var sample = this.configurationInterface.getElement('.samplesContainer .cutType' + item)
			if(sample) sample.show();
		}.bind(this));

		this.initFormValidator();
	}
});