(function() {

	SL.ui.Rating = Class.create(SL.Component, {

		init : function() {
			this.formElement = $(this.config.get('element_id'));

			new SL.effects.Preloader(this.e, this._init.bind(this)).run();

			this.steps = this.e.childElements().length - 1;
		},

		_init : function() {
			this.active = parseInt(this.formElement.getValue());

			for ( var i = 0; i < this.e.childElements().length; i++) {
				var e = this.e.childElements()[i];
				if (i != this.active) {
					e.hide();
				}
			}

			this.e.show();

			this.e.observe('mousemove', this.onMouseMove.bind(this));
			this.e.observe('mouseenter', this.onMouseMove.bind(this));
			this.e.observe('mouseleave', this.onMouseLeave.bind(this));
			this.e.observe('click', this.onClick.bind(this));

			this.formElement.hide();
		},

		onMouseMove : function(e) {
			var w = e.pageX - this.e.cumulativeOffset().left;

			var active = (w / (this.e.getWidth() / this.steps) + 0.5).toFixed();
			if (active > this.teps) {
				active = this.steps;
			} else if (active <= 0) {
				active = 1;
			}

			if (this.active != active) {
				this.e.childElements()[this.active].hide();
				this.e.childElements()[active].show();
				this.active = active;
			}
		},

		onMouseLeave : function(e) {
			var current = parseInt(this.formElement.getValue());
			if (this.active != current) {
				this.e.childElements()[this.active].hide();
				this.e.childElements()[current].show();
				this.active = current;
				this.formElement.setValue(current);
			}
		},

		onClick : function() {
			this.formElement.setValue(this.active);
		}

	});

	SL.ui.UrlOrFile = Class.create(SL.Component, {
		init : function() {
			this.file = $(this.id + '_f');
			this.fakefile = $(this.id + '_ff');
			this.fileButton = $(this.id + '_fb');
			this.url = $(this.id + '_u');
			this.urlButton = $(this.id + '_ub');
			this.deleteButton = $(this.id + '_d');
			this.resetButton = $(this.id + '_r');
			this.origData = $(this.id + '_orig');
			this.previewData = $(this.id + '_piid');
			this.deleteFileField = $(this.id + '_df');
			this.assetsField = $(this.id + '_ass');

			this.fallback = !SL.utils.supportsFileClick();

			if (this.fallback) {
				this.file.setStyle({
					visibility : 'visible',
					position : 'static'
				});
				this.fileButton.hide();
			}

			this.inputName = this.file.down().readAttribute('name');
			this.resetInput();

			this.fileButton.down().observe('click', this.onFileButtonClicked.bind(this));
			this.fakefile.observe('click', this.onFileButtonClicked.bind(this));
			this.urlButton.down().observe('click', this.onUrlButtonClicked.bind(this));

			if (this.deleteButton) {
				this.deleteButton.down().observe('click', this.onDeleteClicked.bind(this));
			}

			if (this.origData || this.previewData) {
				this.resetButton.down().observe('click', this.onResetClicked.bind(this));
			}
		},

		onFileChange : function() {
			this.url.hide();
			this.urlButton.removeClassName('inactive');

			if (!this.fallback) {
				var file = this.file.down().value;
				if (!file) {
					file = 'file';
				} else {
					var pos1 = file.lastIndexOf('/');
					var pos2 = file.lastIndexOf('\\');

					if (pos1 >= 0 || pos2 >= 0) {
						if (pos1 < 0) {
							file = file.substring(pos2 + 1);
						} else if (pos2 < 0) {
							file = file.substring(pos1 + 1);
						} else if (pos1 < pos2) {
							file = file.substring(pos2 + 1);
						} else {
							file = file.substring(pos1 + 1);
						}
					}
				}

				this.fakefile.show();
				this.fakefile.down('input').value = file;
			}

			if (this.deleteButton) {
				this.deleteButton.show();
			}

			this.deleteFileField.down().checked = false;
			if (this.origData) {
				this.origData.hide();
				this.resetButton.show();
			}

			if (this.previewData) {
				this.previewData.hide();
				this.resetButton.show();
			}

			if (this.assetsField) {
				this.assetsField.value = '';
			}
		},

		resetInput : function() {

			if (this.file.down()) {
				this.file.down().remove();
			}

			var input = new Element('input', {
				type : 'file',
				name : this.inputName
			});

			this.file.appendChild(input);
			this.file.down().observe('change', this.onFileChange.bind(this));
		},

		onFileButtonClicked : function(e) {
			e.stop();

			this.file.down().click();
		},

		onUrlButtonClicked : function(e) {
			e.stop();

			this.url.show();
			this.urlButton.addClassName('inactive');
			this.fakefile.hide();
			this.fakefile.down('input').value = '';
			this.resetInput();
			if (this.deleteButton) {
				this.deleteButton.hide();
			}
			this.deleteFileField.down().checked = true;
			if (this.origData) {
				this.origData.hide();
				this.resetButton.show();
			}
			if (this.previewData) {
				this.previewData.hide();
				this.previewData.show();
			}

			if (this.assetsField) {
				this.assetsField.value = '';
			}
		},

		onDeleteClicked : function(e) {
			e.stop();

			this.deleteFileField.down().checked = true;
			this.fakefile.hide();
			this.fakefile.down('input').value = '';
			this.resetInput();
			this.urlButton.removeClassName('inactive');

			if (this.deleteButton) {
				this.deleteButton.hide();
			}

			if (this.origData) {
				this.origData.hide();
				this.resetButton.show();
			}

			if (this.previewData) {
				this.previewData.hide();
				this.resetButton.show();
			}

			if (this.assetsField) {
				this.assetsField.value = '';
			}
		},

		onResetClicked : function(e) {
			e.stop();

			this.url.hide();
			this.url.down('input').value = '';
			this.deleteFileField.down().checked = false;
			this.fakefile.hide();
			this.fakefile.down('input').value = '';
			this.resetInput();
			this.urlButton.removeClassName('inactive');
			this.resetButton.hide();

			if (this.origData) {
				this.origData.show();
				if (this.origData.down('.gui_orig_file') && this.deleteButton) {
					this.deleteButton.show();
				}
			}

			if (this.previewData) {
				this.previewData.show();
				if (this.deleteButton) {
					this.deleteButton.show();
				}
			}

			if (this.assetsField) {
				this.assetsField.value = '';
			}
		},

		setAsset : function(id, label) {

			this.url.hide();
			this.url.down('input').value = '';
			this.deleteFileField.down().checked = false;
			this.resetInput();
			this.urlButton.removeClassName('inactive');
			this.resetButton.hide();

			if (this.origData) {
				this.origData.hide();
			}

			if (this.deleteButton) {
				this.deleteButton.hide();
			}
			this.assetsField.value = id;
			this.fakefile.down('input').value = label;
			this.fakefile.show();
		}

	});

	SL.ui.FileField = Class.create(SL.Component, {
		init : function() {
			this.file = $(this.id + '_f');
			this.fakefile = $(this.id + '_ff');
			this.fileButton = $(this.id + '_fb');
			this.deleteButton = $(this.id + '_d');
			this.resetButton = $(this.id + '_r');
			this.origData = $(this.id + '_orig');
			this.deleteFileField = $(this.id + '_df');
			this.assetsField = $(this.id + '_ass');

			this.fallback = !SL.utils.supportsFileClick();

			if (this.fallback) {
				this.file.setStyle({
					visibility : 'visible',
					position : 'static'
				});
				this.fileButton.hide();
			} else {
				this.fileButton.down().observe('click', this.onFileButtonClicked.bind(this));
				this.fakefile.observe('click', this.onFileButtonClicked.bind(this));
			}

			this.inputName = this.file.down().readAttribute('name');
			this.resetInput();

			if (this.deleteButton) {
				this.deleteButton.down().observe('click', this.onDeleteClicked.bind(this));
			}

			if (this.origData) {
				this.resetButton.down().observe('click', this.onResetClicked.bind(this));
			}
		},

		onFileChange : function() {

			if (!this.fallback) {
				var file = this.file.down().value;
				if (!file) {
					file = 'file';
				} else {
					var pos1 = file.lastIndexOf('/');
					var pos2 = file.lastIndexOf('\\');

					if (pos1 >= 0 || pos2 >= 0) {
						if (pos1 < 0) {
							file = file.substring(pos2 + 1);
						} else if (pos2 < 0) {
							file = file.substring(pos1 + 1);
						} else if (pos1 < pos2) {
							file = file.substring(pos2 + 1);
						} else {
							file = file.substring(pos1 + 1);
						}
					}
				}

				this.fakefile.show();
				this.fakefile.down('input').value = file;
			}

			if (this.deleteButton) {
				this.deleteButton.show();
			}

			this.deleteFileField.down().checked = false;
			if (this.origData) {
				this.origData.hide();
				this.resetButton.show();
			}
		},

		resetInput : function() {

			if (this.file.down()) {
				this.file.down().remove();
			}

			var input = new Element('input', {
				type : 'file',
				name : this.inputName
			});

			this.file.appendChild(input);
			this.file.down().observe('change', this.onFileChange.bind(this));
		},

		onFileButtonClicked : function(e) {
			e.stop();

			this.file.down().click();
		},

		onDeleteClicked : function(e) {
			e.stop();

			this.deleteFileField.down().checked = true;
			this.fakefile.hide();
			this.fakefile.down('input').value = '';
			this.resetInput();
			if (this.deleteButton) {
				this.deleteButton.hide();
			}
			if (this.origData) {
				this.origData.hide();
				this.resetButton.show();
			}

			if (this.assetsField) {
				this.assetsField.value = '';
			}
		},

		onResetClicked : function(e) {
			e.stop();

			this.deleteFileField.down().checked = false;
			this.fakefile.hide();
			this.fakefile.down('input').value = '';
			this.resetInput();
			this.resetButton.hide();
			this.origData.show();
			if (this.deleteButton) {
				this.deleteButton.show();
			}

			if (this.origData.down('.gui_orig_file') && this.deleteButton) {
				this.deleteButton.show();
			}

			if (this.assetsField) {
				this.assetsField.value = '';
			}
		},

		setAsset : function(id, label) {
			this.resetInput();
			this.assetsField.value = id;
			this.fakefile.down('input').value = label;
			this.fakefile.show();

			if (this.origData) {
				this.origData.hide();
				this.resetButton.show();
			}
		}
	});

})();

