Ext.namespace('Gallery.frontend');

/**
 * @class
 * @param {Element|String} buyPrice
 * @param {Element|String} rentPrice
 */
Gallery.frontend.SynchronizedPricePair = function (buyPrice, rentPrice)	{
	
	/**
	 * @type Element
	 * @protected
	 */
	this.buyPriceEl = Ext.get(buyPrice);
	
	/**
	 * @type Element
	 * @protected
	 */
	this.rentPriceEl = Ext.get(rentPrice);
	

	this.buyPriceEl.on('change', this.updateRentPriceEl, this);
	//this.rentPriceEl.on('change', this.updateBuyPriceEl, this);

	this.buyPriceEl.on('focus', function (){this.rentPriceEl.dom.disabled = true}, this);
	this.buyPriceEl.on('blur', function () {this.rentPriceEl.dom.disabled = false}, this);
	//this.rentPriceEl.on('focus', function () {this.buyPriceEl.dom.disabled = true}, this);
	//this.rentPriceEl.on('blur', function () {this.buyPriceEl.dom.disabled = false}, this);
}

Gallery.frontend.SynchronizedPricePair.prototype =	{
	updateRentPriceEl:  function()	{
		var val = parseInt(this.buyPriceEl.dom.value);
				
		
		if (isNaN(val))	{
			this.buyPriceEl.dom.value = null;
			this.rentPriceEl.dom.value = null;
			return;
		} else	{
			this.buyPriceEl.dom.value = val;
			this.rentPriceEl.dom.value = null;
		}
		
		val = Math.round(6 * (val * .015 + 10));
		this.rentPriceEl.dom.value = val;
	},
	
	updateBuyPriceEl:  function ()	{
		var val = parseInt(this.rentPriceEl.dom.value);
		
		
		if (isNaN(val))	{
			this.buyPriceEl.dom.value = null
			return;
		} else	{
			this.rentPriceEl.dom.value = val;
		}
		
		val = Math.round((val / 6 - 10)/ .015);
		this.buyPriceEl.dom.value = val;
	}
};

Gallery.frontend.registerToggleLogin = function() {
	
	var toggler = Ext.get('loginRegisterToggler');
	if (null != toggler) {
		toggler.on('click', function() {
			Ext.fly('loginRegisterForms').toggleClass('hide');
		});
	}
};

// Gallery.frontend.renderArtFlits = function() {
	// var artFlits = Ext.get('artFlits');
	// var artFlitsDom = artFlits.dom; 

	// if (artFlitsDom.textContent.trim() == '') {
		// return;
	// }
	
	// var artFlitsHtml = artFlitsDom.innerHTML;
	
	// artFlitsDom.innerHTML = '';
	
	// var marquee = new Ext.ux.Marquee({
		// step: 4,
		// interval: 30,
		// renderTo: 'artFlits',
		// containerCls: 'marquee-container',
		// textCls: 'marquee-text',
		// text: [artFlitsHtml
			// ]
	// });
	// marquee.init();
// }

Gallery.frontend.main	= function()	{
	
	var front = Gallery.frontend;
	new front.SynchronizedPricePair('minPrice', 'minPriceRent');
	new front.SynchronizedPricePair('maxPrice', 'maxPriceRent');

	if (document.getElementsByTagName('html')[0].clientHeight < 628
	&& !(Ext.isIE7 || Ext.isIE6))	{
		var bigFormCssClass = 'contextOutOfViewport';
		
		Ext.get('siteWrapper').addClass(bigFormCssClass);
	}
	
	if (Ext.isIE6)	{
		Ext.MessageBox.alert("U heeft een moderne browser nodig om deze website te bekijken!");
	}
	
	front.registerToggleLogin();
	// front.renderArtFlits();
	
	
}
/**
 * @type Gallery.frontend.SynchronizePricePair
 */
Ext.onReady(Gallery.frontend.main);