/**
 * @author de
 */ 

// Rechenaufgaben
var T001 = new Class({
	options: {
	},

	initialize: function(options){
		this.setOptions(options);
		selfObj = this;
		
		var elements = $$('.t001');
		
		var box = new Element('div', {
			'class' : 't001box'
		});
		
		box.inject(elements[0],'before');
		box.adopt(elements);		
		
		this.selects = $$('.t001box select');
		
		this.selects.each(function(select,index){
			selfObj.makeSelect(select);
		});
		
		
	},
	
	makeSelect: function(element,index){
		selfObj = this;
		
		var options = element.getElements('option');
		
		element.setStyle('display','none');
		
		var optboxwrap = new Element('div',{
			'class':'optboxwrap',
			'events' : {
				'mouseleave' : function(){
					
					 optbox.setStyle('display','none');
				}
				
			}
			
		});

		var optbox = new Element('div',{
			'class':'optbox',
			'styles': {
				'display' : 'none'
			}

		});
		var optcurvalue = new Element('div',{
			'class':'optcurvalue',
			'events' : {
				'click' : function(){
					 optbox.setStyle('display','block');
				}
			}
			

		});
		
		options.each(function(option){
			var dhtmlopt = new Element('div',{
				'class' : 'option',
				'text' : option.get('text'),
				'events' : {
					'click' : function(){
						optbox.setStyle('display','none');
						element.value = option.value;
						optcurvalue.set('text',option.get('text'));
					},
					'mouseenter' : function(){
						this.addClass('option_over');
					},
					'mouseleave' : function(){
						this.removeClass('option_over');
					}					
				}
				
					
			});
			
			optbox.adopt(dhtmlopt);
		});
		
		optboxwrap.adopt(optcurvalue);		
		optboxwrap.adopt(optbox);
		optboxwrap.inject(element,'after');
				
	}
	
	
});	
T001.implement(new Events);
T001.implement(new Options);
T001.implement(new Chain);

// Konzentrationstest
var T004 = new Class({
	options: {
	},

	initialize: function(options){
		this.setOptions(options);
		
		selfObj = this;

		this.answerBlock = $$('.t004 .questionSubtext')[0];
		if($type($$('.t004 .matrix')[0]) == 'element'){
			$$('.t004 .matrix')[0].setStyle('display','none');
		}
		
		var replaceObject = {
			paba : '<span class="akey">paba</span>',
			dada : '<span class="akey">dada</span>',
			bada : '<span class="akey">bada</span>',
			dapa : '<span class="akey">dapa</span>',
			baba : '<span class="akey">baba</span>',
			papa : '<span class="akey">papa</span>',
			bapa : '<span class="akey">bapa</span>',
			pada : '<span class="akey">pada</span>',
			daba : '<span class="akey">daba</span>'
		}
		
		this.answerBlock.set('html',this.answerBlock.get('html').substitute(replaceObject));
		
		this.answerKeys = $$('.akey');
		this.keyCheckBoxes = $$('input[type=checkbox]');
		
		
		// fieldsets
		this.answerKeys.each(function(keybutton,index){
				keybutton.addEvents({
					'click':
					function(e){
						if(keybutton.hasClass('checked')){
							selfObj.keyCheckBoxes[index].removeProperty('checked','checked');						
							keybutton.removeClass('checked');
						} else {
							selfObj.keyCheckBoxes[index].setProperty('checked');													
							keybutton.addClass('checked');							
						}
						
					},
					'mouseenter':
					function(e){
						keybutton.addClass('over');					
					},
					'mouseleave':
					function(e){		
						keybutton.removeClass('over');
					}					
				});
								

		});
		
		
		$$('.t004 .questionSubtext').each(function(questionSubtext){
			questionSubtext.setStyle('visibility','visible');
		});

		
	}
});	
T004.implement(new Events);
T004.implement(new Options);
T004.implement(new Chain);


// Arbeitssituationen
var T008 = new Class({
	options: {
	},

	initialize: function(options){
		this.setOptions(options);
		selfObj = this;		
		this.answerBlock = $$('.t008')[0];		
		
		this.textanswers = this.answerBlock.getElements('.opt');
		
		this.answers = this.answerBlock.getElements('input');
		this.controlblocks = this.answerBlock.getElements('.controls');
		
		var i=0;
		this.answers.each(function(answer){
			answer.value = ++i;
			answer.setStyle('display','none');
		});
		
		this.controlblocks.each(function(element,index){
			
			var num = index+1;
			
			var upb = new Element('div', {
				'class':'cltr-upb',
				'text':'',
				'events' : {
					'click': function(){
						selfObj.moveUp(num);
					}
				}
			});
			
			var downb = new Element('div', {
				'class':'cltr-downb',
				'text':'',
				'events' : {
					'click': function(){
						selfObj.moveDown(num);
					}
				}
			});
			
			
			
			if(num == 1){
				element.adopt(downb);
			} else if(num==selfObj.controlblocks.length) {
				element.adopt(upb);
			} else {
				element.adopt(upb,downb);
			}
			
			
		});
		
		
	},
	
	moveUp: function(num){
		var index = num-1;

		var tempopt = this.textanswers[index].get('text');
		this.textanswers[index].set('text',this.textanswers[index-1].get('text'));
		this.textanswers[index-1].set('text',tempopt);

		var tempvalue = this.answers[index].value;
		this.answers[index].value = this.answers[index-1].value;
		this.answers[index-1].value = tempvalue;
		
	},
	
	moveDown: function(num){
		var index = num-1;

		var tempopt = this.textanswers[index].get('text');
		this.textanswers[index].set('text',this.textanswers[index+1].get('text'));
		this.textanswers[index+1].set('text',tempopt);

		var tempvalue = this.answers[index].value;
		this.answers[index].value = this.answers[index+1].value;
		this.answers[index+1].value = tempvalue;
		
	}
	
	
});	
T008.implement(new Events);
T008.implement(new Options);
T008.implement(new Chain);


// Wortschatztest
var T009 = new Class({
	options: {
	},

	initialize: function(options){
		this.setOptions(options);
		selfObj = this;

		this.answerBlock = $$('.t009')[0];
		
		var replaceObject = {
			answer1 : '<span class="answerword">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>',
			answer2 : '<span class="answerword">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>'
		}
		this.answerBlock.set('html',this.answerBlock.get('text').substitute(replaceObject));
		
		this.answerWords = $$('.answerword');
		this.selects = $$('.t009select');
				
		// fieldsets
		this.selects.each(function(radiobox,index){
			var radios = radiobox.getElements('input');
			radios.each(function(radio){
				radio.addEvent(
					'click',
					function(e){
						var selectedword = $(radio.id + 'label').get('text');
						selfObj.answerWords[index].set('text',selectedword);
					}
				);
			});
			
		});

		
		
	}
});	
T009.implement(new Events);
T009.implement(new Options);
T009.implement(new Chain); 
 

var SurveyTimer = new Class({
	
		options: {
		},

		initialize: function(options){
			this.setOptions(options);
			var timers = $$('.timer');
			var selfObj = this;
		// 	 timer = $$('.timer')[0];
			timers.each(function(timer){
				// Rechentest und Worschatztest Sonderregelung
				if($$('.t001').length || $$('.t009').length){
					timer.setStyle('visibility','hidden');
				} else {
					timer.setStyle('visibility','visible');					
				}
				
				
				var elconf = timer.getElement('.conf')
				var conf =  JSON.decode(elconf.get('text'));
				elconf.setStyle('display','none');
				// console.debug(conf);
				
				var elmessage = timer.getElement('.message');
				
				
				var mySliderCounter = { counter: conf.start };
				var mySlider = new Slider(timer.getElement('.rule'), timer.getElement('.pos'), {
				    range: [0, conf.stop],
				    wheel: false,
				    snap: true,
				    onStart: function(){
				    	
				    },
				    onTick: function(pos){
				    	this.knob.setStyle('width', pos+8);
				    	
				    	var resttime = conf.stop-mySliderCounter.counter
				    	if(resttime < 0){
				    		
				    		// form submit
				    		resttime = 0;
				    		$('timeoutfield').value = 1;
				    		$clear(selfObj.periodicaladdCount);
				    		$('frmPbSurvey').submit();
				    		
				    	}
				    	
				    	// console.debug('resttime:'+resttime);

				    	var min = (resttime/60-0.5).round();
				    	var sek = (resttime)%60;
				    	var message='';
				    	if(min){
				    		// if(sek) min = min+1;
				    		message = conf.message_min.substitute({time:min});
				    	} else {
				    		message = conf.message_sek.substitute({time:sek});
				    	}
				    	
						elmessage.set('text',message);

				    },
				    onComplete: function(){
						// console.debug('complete');
				    },
				    onChange: function(){
				    	this.knob.setStyle('left', 0);				    	
				    }
				});
				mySlider.set(conf.start);
				// make it non dragable
				mySlider.element.removeEvents('mousedown');
				mySlider.drag.handles.removeEvent('mousedown');
				
				var addCount = function(){
					this.counter++;
					// console.debug(this.counter) 
					mySlider.set(this.counter);
				};
				selfObj.periodicaladdCount = addCount.periodical(1000, mySliderCounter);

				
				

		/*		
				.message
				.rule
				.pos
				.conf
			*/	
				
			 });
		}
});
SurveyTimer.implement(new Events);
SurveyTimer.implement(new Options);
SurveyTimer.implement(new Chain);

 
 

var TrainigsParcours = new Class({
	
		options: {
		},

		initialize: function(options){
			this.setOptions(options);

			// Rechenaugaben
			if($$('.t001').length){
				this.theT001 = new T001();
			}

			// Konzentrationstest
			if($$('.t004').length){
				this.theT004 = new T004();
			}

			// Arbeitssituationen
			if($$('.t008').length){
				this.theT008 = new T008();
			}
			
			// Wortschatztest
			if($$('.t009').length){
				this.theT009 = new T009();
			}
			
			// 
			
			var popups = $$('.popuplink a');
			popups.each(function(element){
				
				element.addEvent('click',function(e){
					e = new Event(e);
					e.stop();
					var url = element.get('href');
					var fenster = window.open(url, 'popup_window', "width=710,height=520,status=no,scrollbars=no,resizable=no");

					if(fenster){
						fenster.focus();
					}				
				});		
				
			});


		}
});
TrainigsParcours.implement(new Events);
TrainigsParcours.implement(new Options);
TrainigsParcours.implement(new Chain);


	
window.addEvent('domready', function() {
	TrainigsParcours = new TrainigsParcours();
	new SurveyTimer();
});