var UbbEditors = Array();
var UbbCount = 0;

var UbbEditor = new Class
(
	{
		initialize: function(element)
		{
			this.element = element;
			
			this.container = new Element('div');
			this.container.addClass('ubbContainer');
			if(this.element.getProperty('disabled') == true)
			{
				this.container.addClass('disabled');
				return;
			}
			this.container.injectInside(this.element.getParent());
			this.container.adopt(this.element);	
						
			this.toolbar = new Element('div');
			this.toolbar.addClass('ubbToolbar');
			this.toolbar.injectBefore(this.container);

			this.advancedConfig = new Element('div');
			this.advancedConfig.addClass('ubbAdvancedConfig');
			this.advancedConfig.addClass('hidden');
			
			this.advancedConfig.injectBefore(this.container);	

			this.element.addListener('keyup', this.updatePosition.bind(this));
			this.element.addListener('click', this.updatePosition.bind(this));
			this.element.addListener('select', this.updatePosition.bind(this));

			this.addButton('&nbsp;', 'header', true, null);
			this.addButton('&nbsp;', 'b', true, null);
			this.addButton('&nbsp;', 'i', true, null);
			this.addButton('&nbsp;', 'u', true, null);
			this.addButton('&nbsp;', 's', true, null);
			this.addButton('&nbsp;', 'sub', true, null);
			this.addButton('&nbsp;', 'sup', true, null);
			this.addButton('Lijst', 'list', true, [{name: '&bull;. Standaard', argument: '', between: '\n* item\n'}, {name: '1. Nummers', argument: 'nummer', between: '\n* item\n'}]);
			
			//this.addButton('Code', 'code', true, [{name: 'C++', argument: 'cpp'},{name: 'C#', argument: 'csharp'},{name: 'CSS', argument: 'css'},{name: 'Java', argument: 'java'},{name: 'LaTeX', argument: 'latex'},{name: 'Python', argument: 'python'},{name: 'PHP', argument: 'php'},{name: 'SQL', argument: 'sql'}]);
			
			
			this.updatePosition();	
		},
		
		addButton: function(caption, tag, style, arguments)
		{
			buttonObj = new Element('div');
			buttonObj.setHTML(caption);
			buttonObj.addClass("ubbButton");
			buttonObj.addClass("ubbButton-" + tag);

			if(arguments != null)
			{
				buttonArguments = new Element('div');
				buttonArguments.addClass('ubbArgumentsList');
				buttonArguments.addClass('ubbArgumentsList-' + tag);
				buttonArguments.addClass('hidden');

				arguments.each(function(argument, key) {
					if(argument != null && argument.name != null)
					{
						buttonArgument = new Element('a');
						buttonArgument.href = "#";
						buttonArgument.setHTML(argument.name);
						buttonArgument.addClass('ubbArgument');
						if(argument.input != null)
						{
							if(argument.inputArgs == null)
								inputArgs = "";
							buttonArgument.addListener('click', this.insertTagPlugin.bindWithEvent(this, [tag, style, argument.argument, argument.input, argument.inputArgs]));
						}
						else
						{
							between = '';
							if($defined(argument.between))
								between = argument.between;

							if($defined(argument.nospace) && argument.nospace == 'true')
								buttonArgument.addListener('click', this.insertTagEvent.bindWithEvent(this, [tag + argument.argument, style, '', between]));
							else
								buttonArgument.addListener('click', this.insertTagEvent.bindWithEvent(this, [tag, style, argument.argument, between]));
						}
						buttonArgument.injectInside(buttonArguments);
					}				
				}, this);
				
				buttonArguments.injectInside(buttonObj);				

				buttonObj.addListener('mouseover', this.showArguments.bindWithEvent(this, [buttonArguments]));
				buttonObj.addListener('mouseout', this.hideArguments.bindWithEvent(this, [buttonArguments]).bind(this));
			}
			else
			{
				buttonObj.addListener('click', this.insertTag.bindWithEvent(this, [tag, style, '', '']));
			}			
			buttonObj.addListener('mouseover', this.buttonHover.bindWithEvent(this, [buttonObj]));
			buttonObj.addListener('mouseout', this.buttonUnHover.bindWithEvent(this, [buttonObj]));
			buttonObj.injectInside(this.toolbar);
		},
		
		buttonHover: function(e, button)
		{
			button.doHide = false;
			button.addClass('ubbButtonHover');
		},
		
		buttonUnHover: function(e, button)
		{
			button.doHide = true;
			(function(){this.buttonUnHoverDelayed(button)}).delay(50, this);
		},		
		
		buttonUnHoverDelayed: function(button)
		{
			if(button.doHide == true)
			{
				button.removeClass('ubbButtonHover');
			}
		},		
		
		showArguments: function(e, buttonArguments)
		{
			buttonArguments.doHide = false;
			buttonArguments.removeClass('hidden');
		},		
		
		hideArgumentsDelayed: function(buttonArguments)
		{
			if(buttonArguments.doHide == true)
			{
				buttonArguments.addClass('hidden');
			}
		},

		hideArguments: function(e, buttonArguments)
		{
			buttonArguments.doHide = true;
			(function(){this.hideArgumentsDelayed(buttonArguments)}).delay(50, this);
		},

		buildCancelButton: function(plugin)
		{
			var advancedConfigCancel = new Element('input');
			advancedConfigCancel.type = 'submit';
			advancedConfigCancel.addClass('border');			
			advancedConfigCancel.addClass('button');
			advancedConfigCancel.addClass('wis');
			advancedConfigCancel.value = 'Sluiten';
			advancedConfigCancel.addListener('click', this.cancelPlugin.bindWithEvent(this, [plugin]));
			this.advancedConfig.adopt(advancedConfigCancel);
		},

		buildSubmitButton: function(plugin)
		{
			var advancedConfigSubmit = new Element('input');
			advancedConfigSubmit.type = 'submit';
			advancedConfigSubmit.addClass('border');			
			advancedConfigSubmit.addClass('button');
			advancedConfigSubmit.addClass('ok');
			advancedConfigSubmit.addClass('advancedConfigSubmit');
			advancedConfigSubmit.value = 'Invoegen';
			advancedConfigSubmit.addListener('click', this.finishPlugin.bindWithEvent(this, [plugin]));
			
			
			
			this.advancedConfig.adopt(advancedConfigSubmit);
			this.buildCancelButton(plugin);
		},

		insertTagPlugin: function(e, tag, block, argument, plugin, pluginArgs)
		{
			this.advancedConfig.removeClass('hidden');
			var plugin = new window[plugin + 'Plugin'](this);
			this.advancedConfig.innerHTML = plugin.view(argument) + "<br />";
			
			e.stop();
			return false;
		},
		
		cancelPlugin: function(e, plugin)
		{
			this._cancelPlugin();
			e.stop();
			return false;
		},
		
		_cancelPlugin: function()
		{
			this.advancedConfig.addClass('hidden');
		},		
		
		finishPlugin: function(e, plugin)
		{
			this.advancedConfig.addClass('hidden');
			plugin.complete();
			e.stop();
			return false;
		},

		insertTagEvent: function(e, tag, block, argument, between)
		{
			e = new Event(e);
			this.insertTag(e, tag, block, argument, between);
			e.stop();
			return false;
		},

		insertText: function(text)
		{
			if(this.position)
			{
				value = this.element.getValue();
				start = this.position.selectionStart;
				
				newValue = value.substr(0,start) + text + value.substr(start);

				this.element.value = newValue;
				this.element.focus();

				this.element.setCaretPosition(start + text.length);
			}
		},
		
		getSelectedText: function()
		{
			if(this.position)
			{
				value = this.element.getValue();
				start = this.position.selectionStart;
				end = this.position.selectionEnd;
		
				return value.substr(start, end - start);

			}
			return '';
		},

		insertTag: function(e, tag, block, argument, between)
		{
			if(this.position)
			{
				value = this.element.getValue();
				start = this.position.selectionStart;
				end = this.position.selectionEnd;
				
				if(argument != null && argument != "")
					tag += " " + argument;				

				if(block == true)
				{
					var betweenTags = '';
					if(between != '')
					{
						betweenTags = between;
					}
					else
						betweenTags = value.substr(start, end-start);
						
					newValue = value.substr(0, start) + "[" + tag + "]" + betweenTags + "[/]" + value.substr(end);
				}				
				else
					newValue = value.substr(0,end) + "["+tag+"]" + value.substr(end);

				this.element.value = newValue;
				this.element.focus();

				this.element.setCaretPosition(end + newValue.length - value.length);
			}
		},

		updatePosition: function()
		{
			var userSelection = new UbbPosition();
			userSelection.selectionStart = this.element.getSelectionStart();
			userSelection.selectionEnd = this.element.getSelectionEnd();	
			this.position = userSelection;
		}
	}
);

var UbbPosition = new Class
(
	{
		initialize: function(element)
		{
			this.selectionStart = 0;
			this.selectionEnd = 0;
			this.selectionLength = 0;
		}
	}
);

