Ext.namespace('Bit');

Bit.applyClickDetail = function(){
	var items = Ext.DomQuery.select('div[id=old-prodlist]');
	if(!Ext.isEmpty(items.length)){
		Ext.each(items, function(item, index){
			var itemEl = Ext.get(item);
			var detailEl = Ext.DomHelper.insertBefore(itemEl, '<p><a href="#" class="local open">Подробнее...</a></p>', true);
			var collapseEl = Ext.DomHelper.insertBefore(itemEl, '<p><a href="#" class="local collapse">Свернуть</a></p>', true);
			Ext.get(detailEl).setVisibilityMode(Ext.Element.DISPLAY);
			Ext.get(collapseEl).setVisibilityMode(Ext.Element.DISPLAY);
			Ext.get(collapseEl).setVisible(false);
			itemEl.applyStyles({
				'margin-left': '40px'
			});
			itemEl.slideOut('t', {
				 easing: 'easeOut'
				,block: true
				,duration: .5
				,remove: false
				,useDisplay: true
			});
			detailEl.on('click', function(e){
				var targetEl = e.getTarget();
				var collapseEl = Ext.get(targetEl).parent().next();
				itemEl.slideIn('t', {
					 easing: 'easeOut'
					,duration: .5
					,callback: function(){
						Ext.get(targetEl).parent().setVisible(false);
						Ext.get(collapseEl).setVisible(true);
					}
				});
				e.stopEvent();
			}, this);
			collapseEl.on('click', function(e){
				var targetEl = e.getTarget();
				var showEl = Ext.get(targetEl).parent().prev();
				itemEl.slideOut('t', {
					 easing: 'easeOut'
					,block: true
					,duration: .5
					,remove: false
					,useDisplay: true
					,callback: function(){
						Ext.get(targetEl).parent().setVisible(false);
						Ext.get(showEl).setVisible(true);
					}
				});
				e.stopEvent();
			}, this);
			

		});
	}
}


Bit.applyEvents = function(item, index){
	
	if(Ext.isEmpty(Bit.arrow)){
		Bit.arrow = Ext.DomHelper.append(item, '<div class="arrow-active2" id="arrow-active" style="visibility: hidden;"></div>', true);//style="visibility: hidden;"
		/*
		Bit.arrowTask.delay(1000, function(){
			Bit.arrow.hide();
		}, this);
		*/
	}
	
	item = Ext.get(item);

	item.on('mouseover', function(e){
		if(!Bit.arrow.isVisible()){
			if(Ext.isIE){
				Bit.arrow.show();
			}else{
				Bit.arrow.fadeIn({
					 endOpacity: 1
					,easing: 'easeOut'
					,duration: .5
				});
			}
		}
		Bit.arrowTask.cancel();
		var xy = this.getXY();
		if(this.dom.className == 'products-text')
			Bit.arrow.moveTo(xy[0]-30, xy[1]-15, true);
		else
			Bit.arrow.moveTo(xy[0]-23, xy[1]+30, true);
	});

	item.on('mouseout', function(e){
		if(Ext.isEmpty(Bit.arrowXY)){
			var outFunc = function(){
				if(Ext.isIE){
					Bit.arrow.hide();
				}else{
					Bit.arrow.fadeOut({
						 endOpacity: 0
						,easing: 'easeOut'
						,duration: .5
						,remove: false
						,useDisplay: false
					});
				}
			}
		}else{
			var outFunc = function(){
				Bit.arrow.moveTo(Bit.arrowXY[0], Bit.arrowXY[1], true);
			}
		}
		Bit.arrowTask.cancel();
		Bit.arrowTask.delay(1000, outFunc);
	});
	
}

Ext.onReady(function(){
	Bit.arrow = Ext.get('arrow-active');
	Bit.arrowTask = new Ext.util.DelayedTask();
	if(!Ext.isEmpty(Bit.arrow)){
		Bit.arrowXY = Bit.arrow.getXY();
	}
	
	Bit.arrowTask.delay(1000, function(){
		var items = Ext.DomQuery.select('div[class*=product-ban-round]');
		if(!Ext.isEmpty(items.length))
			Ext.each(items, Bit.applyEvents);
		items = Ext.DomQuery.select('div[class*=products-text]');
		if(!Ext.isEmpty(items.length))
			Ext.each(items, Bit.applyEvents);
		
	});

	if(Ext.isEmpty(Ext.fly('old-prodlist').child('.selected')))
		Bit.applyClickDetail();
	
});