// JavaScript Document

/*****************/
/* PREREQUISITES */
/*****************/
Number.implement({

  inRange: function(min, max){
		if (min <= this && this <= max) return true
	}

});


var DoubleSlider = new Class({

  Implements: [Options, Events],
	
	options: {
		knob: {
			min: '.knob-min',
			max: '.knob-max'
		},
		limit: {
			min: '.input-min',
			max: '.input-max'
		},
		output: {
			min: '.output-min',
			max: '.output-max'
		},
		range: '.range',
		loadedClass: 'loaded',
		diff: 100
	},
	
	initialize: function(container, options){
		
		this.loaded = false;

    this.setOptions(options);
		this.container = document.id(container);
		this.range = this.container.getElement(this.options.range);
		
		this.knob = this.toElements(this.options.knob);
		this.knob.minText = this.knob.min.getElement('span');
		this.knob.maxText = this.knob.max.getElement('span');
		
		this.limit = this.toElements(this.options.limit);
		this.limit.minValue = this.limit.min.get('value').toInt();
		this.limit.maxValue = this.limit.max.get('value').toInt();
		
		this.output = this.toElements(this.options.output);
		
		this.start = {
			min: (this.output.min.value ? this.output.min.value.toInt() : this.limit.minValue),
			max: (this.output.max.value ? this.output.max.value.toInt() : this.limit.maxValue)
		};
		
		this.slider = {
			min: new Slider(this.range, this.knob.min, {
				range: [this.limit.minValue, this.limit.maxValue],
				offset: -5,
			  onChange: function(step){
					var limitValue = this.getKnobValue('max')-this.options.diff;
					if (step > limitValue){
						this.slider.min.set(limitValue);
						step = limitValue;
					}
					this.setKnobValue('min', step);
					this.output.min.value = step;
				}.bind(this),
				onComplete: function(){
		      if (this.loaded) this.fireEvent('change', [this.getKnobValue('min'), this.getKnobValue('max')]);
				}.bind(this)
			}),
			max: new Slider(this.range, this.knob.max, {
				range: [this.limit.minValue, this.limit.maxValue],
				offset: -5,
			  onChange: function(step){
					var limitValue = this.getKnobValue('min')+this.options.diff;
					if (step < limitValue){
						this.slider.max.set(limitValue);
						step = limitValue;
					}
					this.setKnobValue('max', step);
					this.output.max.value = step;
				}.bind(this),
				onComplete: function(){
		      if (this.loaded) this.fireEvent('change', [this.getKnobValue('min'), this.getKnobValue('max')]);
				}.bind(this)
			})
		}

    // default knob values
		this.setKnobValue('min', this.start.min);
		this.setKnobValue('max', this.start.max);
		this.slider.min.set(this.start.min);
		this.slider.max.set(this.start.max);
		
		this.loaded = true;
		
	},
	
	toElements: function(hash){
		var hash = new Hash(hash);
		hash.each(function(item, key){
		  hash.set(key, this.container.getElement(item));
		}, this);
		return hash;
	},
	
	setKnobValue: function(knobType, value){
		switch (knobType){
			case 'min':
			  this.knob.minText.set('text', value);
			break;
			case 'max':
			  this.knob.maxText.set('text', value);
			break;
		}
	},
	
	getKnobValue: function(knobType){
		switch (knobType){
			case 'min': 
			  return this.knob.minText.get('text').toInt();
			break;
			case 'max':
			  return this.knob.maxText.get('text').toInt();
			break;
		}
	}
	

});

var Bubble = new Class({

 Implements: Options,
 
 options: {
	 element: 'div.bubble',
	 start: {		 
	 },
	 end: {
	 },
	 fx: {
		 duration: 150,
		 link: 'cancel',
		 transition: Fx.Transitions.Quad.easeOut
	 }
 },
 
 initialize: function(container, options){
	 
	 this.container = document.id(container);
	 
	 this.setOptions(options);
	 
	 this.element = this.container.getElement(this.options.element);
	 this.element.setStyle('visibility', 'visible');
	 
	 this.fx = new Fx.Morph(this.element, this.options.fx);
	 this.fx.set(this.options.start);
	 
	 this.container.addEvents({
		  'mouseenter': this.fx.start.bind(this.fx, this.options.end),
			'mouseleave': this.fx.start.bind(this.fx, this.options.start)
	 });
	 
 }

});

var Countdown = new Class({

  Implements: Options,
	
	options: {
		to: '2009-12-24 18:00:00'
	},
	
	initialize: function(container, options){
		this.container = document.id(container);
		
		this.setOptions(options);
		
		this.time = {
			current: new Date(),
			to: new Date.parse(this.options.to).getTime()
		}
		
		this.repeater = this.count.periodical(42, this);

	},
	
	count: function(){
		var diff = this.time.to - new Date().getTime();
		this.container.set('text', this.format(diff));
	},
	
	format: function(int){
		var formated = new Array();
		while (int > 0){
			var num = (int%1000).toString();
			int = (int/1000).toInt();
      if (int > 0) num = num.pad(3, '0', 'left');
		  formated.push(num);
    }
		return formated.reverse().join(' ');
	}

});

/***************/
/* MAIN SCRIPT */
/***************/

// Global object
var Zazitky = {};

// Main object
Zazitky.Darky = {
	
	init: function(){
		
		this.container = document.id('content');
		
		if (document.id('categories')) Zazitky.Darky.Categories.init();
		if (document.id('f-countdown')) new Countdown(document.id('f-countdown').getElement('span.microseconds'));
		
		this.categorySelect = document.id('gift_type');
		if (this.categorySelect){
			this.categorySelect.addEvent('change', function(){
			  if (this.value) window.location = this.value; 
			});
		}
		
		this.emptyPage = document.id('empty-page');
		if (this.emptyPage) this.emptyPage.hide();
		
		
		this.prices = new Array();
		this.items = new Array();
		
		$$('#item .item').each(function(item, index){
			this.items[index] = new Zazitky.Darky.Item(item);
			this.prices.push(this.items[index].getPrice());
		}, this);
		
		if (document.id('price-range')){
			
			if (this.items.length > 1){
				this.input = {
					min: this.container.getElement('input.input-min'),
					max: this.container.getElement('input.input-max')
				}
				
				this.output = {
					min: this.container.getElement('input.output-min'),
					max: this.container.getElement('input.output-max')
				}
				
				this.input.min.value = this.output.min.value = (this.prices.min()/100).toInt()*100;
				this.input.max.value = this.output.max.value = Math.ceil(this.prices.max()/100).toInt()*100;
				
				new DoubleSlider('price-range',{
					diff: 500,
					onChange: function(min, max){
						this.filterItems(min, max);
					}.bind(this)
				});
			} else {
				document.id('price-range').hide();
			}
		}

		// Footer
		this.giant = document.id('giant');
		if (this.giant){
			this.giant.getElement('img').set({
			  'styles': {
					'cursor': 'pointer'
				},
				'events': {
					'click': function(){
						window.open(this.getPrevious('a').get('href'));
					}
				}
			});
			this.giant.getElement('a').setStyle('cursor', 'default');
		}
		

	},
	
	filterItems: function(min, max){
		var visibleItems = 0;
		this.items.each(function(item){
			if (item.price.inRange(min, max)){
				visibleItems++;
				item.show();
			} else {
				item.hide();
			}
		});
		visibleItems == 0 ? this.emptyPage.show() : this.emptyPage.hide();
	}


};

Zazitky.Darky.Item = new Class({
															 
	Implements: Options,
	
	options: {
		bubble: {
			element: '.more',
			start: {
        'bottom': -15,
				'opacity': 0
			},
			end: {
				'bottom': -25,
				'opacity': 1
			},
			fx: {
				duration: 150,
				link: 'cancel',
				transition: Fx.Transitions.Quad.easeOut
			}
		}
	},

  initialize: function(container){
		
		this.container = document.id(container);
	
		this.link = this.container.getElement('a').get('href');
				
		this.container.setStyle('cursor', 'pointer');
		
		this.price = this.container.getElement('p.price strong').get('text').replace('Kc','').replace(' ','').toInt();

    // item events
		this.container.addEvent('click', function(event){ 
			if (event.target.get('tag') != 'a') window.location = this.link;
		}.bind(this));
		
		// bubble
		new Bubble(this.container, this.options.bubble);
		
		this.fx = new Fx.Tween(this.container, { property: 'opacity', duration: 200, link: 'cancel' });
		this.fx.set(1);
		
	},
	
	getPrice: function(){
		return this.price;
	},
	
	show: function(){
		this.container.show();
		this.fx.start(1);
	},
	
	hide: function(){
		this.fx.start(0).chain(function(){ this.container.hide() }.bind(this));
	}

});

Zazitky.Darky.Categories = {
	
	init: function(){
		this.container = document.id('categories');
		
		this.items = this.container.getElements('li');
		
		this.items.each(function(item){
		  var bubble = item.getElement('div.bubble');
			if (bubble){
				var top = bubble.getStyle('top').toInt();
				
				new Bubble(item, {
					element: 'div.bubble',
					start: {
						top: top-10,
						opacity: 0
					},
					end: {
						top: top,
						opacity: 1
					}
				});
			}
		});
	}
 };



window.addEvent('domready', function(){

  Zazitky.Darky.init();

});