Element.extend({

		CheckOptions: function(options) {
			if (!options.duration) {
				options.duration = 500;
			}
			if (!options.transition) {
				options.transition = Fx.Transitions.linear;
			}
			if (!options.event) {
				options.event = 'click';
			}
			if (!options.fps) {
				options.fps = 40;
			}
			if (!options.delay) {
				options.delay = 200;
			}
			return this;
		},

		/** Style manipulation */
    ColorizeText: function(color) {
        this.setStyle('color', color);
    },

    ColorizeBg: function(color) {
        this.setStyle('background-color', color);
    },

		Toggle: function() {
			if (this.style.display == 'block' || this.style.display == '') {
				this.style.display = 'none';
			}else{
				this.style.display = 'block';
   		}
		},

		/** The Effect Section */
		Effect: function(property, options){
			return new Fx.Style(this, property, options);
		},

		ToggleSlide: function(options) {
			this.CheckOptions(options);
			var Eff = this.addEvent(options.event,
															function() {
																var h = this.getStyle('height').toInt();
																if ( h == options.to) {
																	options.to   = options.from;
																	options.from = h;
																}
																this.Effect('height', {duration: options.duration, fps: options.fps, transition: options.transition}).start(options.from, options.to);
															}
														 );
		},

		FadeAndRemove: function(options) {
			this.CheckOptions(options);
			var el	= this;
			var Eff = this.addEvent(options.event,
															function() {
																this.Effect('opacity', {duration: options.duration, fps: options.fps, onComplete: function(){$(el).remove();}, transition: options.transition}).start(1,0);
															}
														 );
		},

		FadeIn: function(options) {
			// Will fade in after delay - is chainable, ie: $('element').fadeIn(500).fadeOut(1000);
			this.CheckOptions(options);
			this.Effect('opacity', {duration:options.duration, fps:options.fps}).start(0,1);
		},

		FadeOut: function(options) {
			// Will fade out after delay - is chainable, ie: $('element').fadeOut(500).fadeIn(1000);
			this.CheckOptions(options);
			this.Effect('opacity', {duration:options.duration, fps:options.fps}).start(1,0);
		},


		Resize: function(options) {
			this.CheckOptions(options);
			var Eff = this.addEvent(options.event,
															function() {
															var h = this.getStyle('height').toInt();
															if ( h == options.toH) {
																options.toH   = options.fromH;
																options.fromH = h;
															}
															var w = this.getStyle('width').toInt();
															if ( w == options.toW) {
																options.toW   = options.fromW;
																options.fromW = w;
															}
															var Eff = new Fx.Styles(this, {duration: options.duration, wait: true, fps: options.fps, transition: options.transition});
																	Eff.stop();
																	Eff.start({'height': [options.fromH, options.toH], 'width': [options.fromW, options.toW]});
															}
														 );
		},


		/** Section for value checking */
		isValidUrl: function() {
			var r = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/
			return r.test(this.value);
		},

		isValidEMail: function() {
			var r = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/
			return r.test(this.value);
		},

		isInt: function() {
			return !isNan(this);
		}
});


var InPlaceEditor = new Class({
	initialize: function(el, container, newElement, elementValues, URLtoCall, args, clickItem, item, adTypeId) {

		var ajaxStatus = '';
		$(clickItem).addEvent('click', function() {
			if (ajaxStatus != '') {
				return false;
			}
			var content = $(el).innerHTML;
			$(el).setStyle('display', 'none');
			$(clickItem).setStyle('display', 'none');


			//textarea
			if (newElement == 'textarea') {
				var NewTextarea = new Element('textarea');
				NewTextarea.setStyle('opacity', '0');
				NewTextarea.injectInside(container)
				NewTextarea.value = content;

				var valSet = {};
				for (var val in elementValues) {
					valSet[val] = elementValues[val];
				}
				NewTextarea.setProperties( valSet );
			}

			//text input field
			if (newElement == 'input') {
				var NewTextarea = new Element('input');
				NewTextarea.setStyle('opacity', '0');
				NewTextarea.setStyle('float', 'left');
				NewTextarea.injectInside(container)
				NewTextarea.value = content;

				var valSet = {};
				for (var val in elementValues) {
					valSet[val] = elementValues[val];
				}
				NewTextarea.setProperties( valSet );
			}

			//options box
			if (newElement == 'select') {
				var NewTextarea = new Element('select');
				NewTextarea.setStyle('opacity', '0');
				NewTextarea.injectInside(container)
				NewTextarea.value = content;

				var parentVals  = {};
				var selectedVal = '';

				for (var val in elementValues) {
					switch(val)
					{
						case '_selected':
							parentVals[val.substr(1,9)] = elementValues[val];
							selectedVal = elementValues[val];
						break;
						case '_name':
							parentVals[val.substr(1,5)] = elementValues[val];
						break;
						case '_class':
							parentVals[val.substr(1,6)] = elementValues[val];
						break;
						case '_id':
							parentVals[val.substr(1,3)] = elementValues[val];
						break;
						case '_size':
							parentVals[val.substr(1,5)] = elementValues[val];
						break;
						case '_multiple':
							parentVals[val.substr(1,9)] = elementValues[val];
						break;
						default:
							var optionVal = new Element('option').injectInside(NewTextarea);
								 optionVal.text = val;
								 optionVal.setProperties({ value: elementValues[val] });
						break;
					}
				}
				NewTextarea.setProperties( parentVals );

				// if a pre selected index is given, set it
				if(selectedVal != '')
					NewTextarea.selectedIndex = selectedVal;
			}

			//seperator
			var span = new Element('span').injectAfter(NewTextarea);

			id = $(clickItem).id
			id = id.replace(/icon_/, '');

			if ($('details_'+id))
				$('details_'+id).setStyle('display', 'none');

			var cancel = new Element('img');
					cancel.setStyle('opacity', '0');
					cancel.setStyle('cursor', 'pointer');
					cancel.injectAfter(span);
				  	cancel.setProperties({'class': 'inPlaceEditIcons', alt: 'abbrechen', title: 'abbrechen', style: 'cursor:pointer;vertical-align:top;padding-left:10px;', src: '/img/icons/delete.png'});

			var save = new Element('img');
					save.setStyle('opacity', '0');
					save.setStyle('cursor', 'pointer');
					save.injectAfter(cancel);
				  	save.setProperties({'class': 'inPlaceEditIcons', alt: 'speichern', title: 'speichern', style: 'cursor:pointer;vertical-align:top;padding-left:5px;', src: '/img/icons/accept.png'});

			//new line
			//var p = new Element('p').injectAfter(NewTextarea);

			//cancel
			//var cancel = new Element('a');
			//cancel.setStyle('opacity', '0');
			//cancel.injectInside(p);
			//cancel.setProperty('href', 'javascript:;');
			//cancel.innerHTML = 'abbrechen';

			//seperator
			//var span = new Element('span').injectAfter(cancel);
			//span.innerHTML = ' - ';

			//save
			//var save = new Element('a');
			//save.setStyle('opacity', '0');
			//save.injectInside(p);
			//save.setProperty('href', 'javascript:;');
			//save.innerHTML = 'speichern';

			//NewTextarea.setStyle('opacity', '1');
			//save.setStyle('opacity', '1');
			//cancel.setStyle('opacity', '1');

			//var myChain = new Chain();
			//	myChain.chain( function(){ NewTextarea.FadeIn({duration: 200}); });
			//	myChain.chain( function(){ NewTextarea.focus(); });
			//	myChain.callChain();
			//	myChain.callChain();

			NewTextarea.setStyle('display', 'block');
			NewTextarea.setStyle('opacity', '1');
			NewTextarea.focus();

			save.FadeIn({duration: 400});
			cancel.FadeIn({duration: 400});

			var newText = '';

			//set action handler for save and cancel
			save.addEvent('click', function()
			{
				// There is one exception, if we have a multiple select box,
				// we have to take some informations
				if (newElement == 'select') {
					for (var i=0;i<NewTextarea.options.length;i++) {
      				if(NewTextarea.options[i].selected==true) {
      					newText += NewTextarea.options[i].value+" ";
      				}
      			}
      		}else{
					newText = NewTextarea.value;
				}

				// Send the changed data via a Ajax Call
				// At this state we dont care, if the call was succesfully
				if (URLtoCall != '')
				{
					// to avoid a click while we are updating the data via async call, set this state info
					ajaxStatus = 'calling';

					// This is what we send to the php script
					var query = args+'&data='+encodeURIComponent(newText);

					// The answer off this call will updated into the element
    				new Ajax( URLtoCall,{postBody: query, method: 'post', onFailure: function(){ajaxStatus='';$(el).value=content}, onComplete: function(){ajaxStatus=''; if ($('surrounder')) { injectPreview(item, ''+adTypeId+'') }; }, update: $(el) }).request();

					// remove the old text and display the original element
					$(el).innerHTML = '';

    				// Put some informations in the box, while we are waiting
    				var WaitingPic   = new Element('img').injectInside($(el));
  						WaitingPic.setProperties({alt: 'waiting...', style: 'vertical-align: middle', src: '/img/throbber.gif'});

    				$(el).innerHTML += " &nbsp;speichere Daten";
    			}
    			else
    			{
	    			// Restore the old element and put the new Text in it
    				//$(el).style.display = 'block';
    				$(el).innerHTML = newText;
    			}

				// Remove the generated form element and the save and cancel button
				$(el).setStyle('display', 'block');
				$(el).FadeIn({duration: 400});
				//$(el).setStyle('opacity', '1');
				$(clickItem).setStyle('display', 'inline');

				id = $(clickItem).id
				id = id.replace(/icon_/, '');

				if ($('details_'+id))
					$('details_'+id).setStyle('display', 'inline');

				NewTextarea.replaceWith($(el));
				this.remove();
				cancel.remove();
				//p.remove();
				span.remove();
			});

			cancel.addEvent('click', function() {
				$(el).setStyle('display', 'block');
				$(el).FadeIn({duration: 400});
				//$(el).setStyle('opacity', '1');
				$(clickItem).setStyle('display', 'inline');

				id = $(clickItem).id
				id = id.replace(/icon_/, '');

				if ($('details_'+id))
					$('details_'+id).setStyle('display', 'inline');

				NewTextarea.replaceWith($(el));
				this.remove();
				save.remove();
				//p.remove();
				span.remove();
			});


		//end of initialize
		});
	},

	//a highlight effect to show on mouseover(change background-color)
	hover: function(container, el, hilite, original)
	{
		var hilighter = new Fx.Style(el, 'background-color', {wait: false});
		$(container).addEvent('mouseover', function() {
			$(el).setStyle('background-color', hilite);
		});
		$(container).addEvent('mouseout', function() {
			$(el).setStyle('background-color',original);
		});
	}

//end of class
});


var Scroller = new Class({
	initialize: function(container, down, up, event) {
		c = $(container);
		e = event;
		scrollExample = null;
		switch(event) {
			case 'click':
				$(down).addEvent('click', function(){
																		position = $(container).scrollTop;
																		scrollExample = new Fx.Scroll($(container));
																		scrollExample.scrollTo(position, (position+40));
																	}
												);
				$(up).addEvent('click', function() {
																	position = $(container).scrollTop;
																	scrollExample = new Fx.Scroll($(container));
																	scrollExample.scrollTo(position, (position-40));
																}
											);
			break;

			case 'mouseover':
				$(down).addEvent('mouseover', this.MoveDown.bindAsEventListener(this));
				$(down).addEvent('mouseout', this.clearEff.bindAsEventListener(this));
				$(up).addEvent('mouseover', this.MoveUp.bindAsEventListener(this));
				$(up).addEvent('mouseout', this.clearEff.bindAsEventListener(this));
			break;
		}
		return this;
	},

	clearEff: function()
	{
		scrollExample.stop();
	},

	MoveDown: function()
	{
		duration = c.scrollHeight * 10;
		scrollExample = new Fx.Scroll(c, {duration: duration, wait:true, fps:40});
		scrollExample.toBottom();
	},


	MoveUp: function()
	{
		duration = c.scrollHeight * 10;
		scrollExample = new Fx.Scroll(c, {duration: duration, wait:true, fps:40});
		scrollExample.toTop();
	}

//this.timer = $clear(this.timer);
//	initMoveDown: function()
//	{
//		this.timer = $clear(this.timer);
//		this.timer = this.MoveDownTimer.periodical(600, this);
//	},
//	initMoveUp: function()
//	{
//		this.timer = $clear(this.timer);
//		this.timer = this.MoveUpTimer.periodical(600, this);
//	},
//	MoveUpTimer: function()
//	{
//		position = c.scrollTop;
//		scrollExample = new Fx.Scroll(c, {duration: 400, wait:true, fps:40});
//		scrollExample.scrollTo(position, (position-40));
//	},
//
//	MoveDownTimer: function()
//	{
//		position = c.scrollTop;
//		scrollExample = new Fx.Scroll(c, {duration: 400, wait:true, fps:40});
//		scrollExample.scrollTo(position, (position+40));
//	}
});

