Ext.ns('Ext.ux');
Ext.ux.TextResizer = Ext.extend(Ext.util.Observable, {
	increments: 3,
	startSize: 11,
	constructor: function(config) {
		config = config || {};
		Ext.apply(this, config);
		this.minus = Ext.get('minus-button');
		this.reset = Ext.get('reset-button');
		this.plus = Ext.get('plus-button');
		
		this.currentSize = 11;
		Ext.ux.TextResizer.superclass.constructor.call(this, config);
		this.minus.addClass('cursor');
		this.reset.addClass('cursor');
		this.plus.addClass('cursor');
		this.content = Ext.get('subcontent');
		if (!this.content) {
			this.content = Ext.get('index-content')
		}
		this.minus.on('click', this.smaller, this);
		this.reset.on('click', this.resetAll, this);
		this.plus.on('click', this.bigger, this);
	},
	smaller: function() {
		var size = this.currentSize - 1;
		if (this.currentSize <= 8) return;
		this.content.removeClass('text-resize-' + this.currentSize);
		this.content.addClass('text-resize-' + size);
		this.currentSize = size;
	},
	bigger: function() {
		var size = this.currentSize + 1;
		if (this.currentSize >= 18) return;
		this.content.removeClass('text-resize-' + this.currentSize);
		this.content.addClass('text-resize-' + size);
		this.currentSize = size;
	},
	resetAll: function() {
		this.content.removeClass('text-resize-' + this.currentSize);
		this.currentSize = 11;
	}
});

Ext.ux.LanguageChooser = Ext.extend(Ext.util.Observable, {
	constructor: function(config) {
		config = config || {};
		Ext.apply(this, config);
		this.container = Ext.get('language-chooser');
		this.child = Ext.get('language-chooser-content');
		
		Ext.ux.LanguageChooser.superclass.constructor.call(this, config);
		this.container.on('mouseover', this.hover, this);
		this.container.on('mouseout', this.blur, this);
		this.container.on('click', this.toggle, this);
		this.child.setWidth(this.container.getWidth());
		this.child.setX(this.container.getX() );
		this.child.setY(this.container.getY() + this.container.getHeight() - 2);
	}, 
	
	hover: function() {
		this.container.addClass('hover');
	},
	
	blur: function() {
		this.container.removeClass('hover');
	},
	
	toggle: function() {
		if (this.child.isVisible()) {
			this.child.addClass('hidden');
			this.container.removeClass('active');
		} else {
			this.child.removeClass('hidden');
			this.container.addClass('active');
		}
	}
});