var console, tim, display, truck;
var c, t_res, t_mov;
var ie = !window.getComputedStyle;
var ie6 = ie && navigator.appVersion.indexOf('MSIE 7') == -1;
var icon_values = [
{
	pc: 1, left: null
}, 
{
	pc: 23, left: null
},
{
	pc: 55, left: null
},
{
	pc: 69, left: null
},
{
	pc: 85, left: null
},
{
	pc: 100, left: null
}
];
function init_icon_values(){
	icon_values.each(function(obj){
		obj.left = (c.track_width - 30).pc(obj.pc);
	});	
}
var cur_pos = -1;
var anim_timeout;
var ANIM_WORKING = false;
window.onload = function(){
	tim = new Timer(30);
	tim.start();
	console = new Console($('console'));
	console.onprint.register('clear', function(){
		if(this.pr_count > 15){
			this.elem.removeChild(this.elem.firstChild);
		}
	});
	var c_root = $('component');
	var arr = $C_arr(['track', 'thumb'], c_root, 'DIV');
	c = new DragDropComponent(arr.shift(), arr.shift());
	display = $('display');
	c.pr_val = c.moveable.left;
	c.breakPoint = 430;
	c.onchange.register('change truck', function(percent, val){
		var res_val = (val - this.pr_val) / 2;
		if(val <= this.breakPoint && this.pr_val <= this.breakPoint){
			var mov = (val - this.pr_val) * 0.5;
			truck.label.className = "label";
		}else if(val > this.breakPoint && this.pr_val > this.breakPoint){
			var mov = val - this.pr_val;
			t_mov.saveFloatX.errVal = -t_res.resizeable.saveFloatX.errVal;
//			console.print("M: " + t_mov.saveFloatX.errVal + ", R: " + t_res.resizeable.saveFloatX.errVal);
			truck.label.className = "label l-right";
		}else if(val > this.breakPoint && this.pr_val <= this.breakPoint){
			var pr = this.breakPoint - this.pr_val;
			var nt = val - this.breakPoint;
			var mov = pr * 0.5 + nt;
			truck.label.className = "label l-right";
		}else if(val <= this.breakPoint && this.pr_val > this.breakPoint){
			var pr = this.breakPoint - this.pr_val;
			var nt = val - this.breakPoint;
			var mov = pr + nt * 0.5;
			truck.label.className = "label";
		}
//		t_mov.saveFloatX.errVal = t_res.resizeable.saveFloatX.errVal;
		t_res.resizeable.resizeBy(res_val, 0);
		t_mov.moveBy(-mov / 2, 0);
		this.pr_val = val;
		if(i_root){
			if(this.dragdrop.IS_DRAGGING){
				var icon = check_icon(this.dragdrop.moveable.left);
				if(icon){
					if(this.current_grow_icon && this.current_grow_icon == icon){
						return true;
					}
					this.current_grow_icon = icon;
					icon.grow();
				}
			}
		}
	});
	c.onchange.register('print percent', function(percent){
		var val = parseInt(percent) + 1;
		if(val > 100){
			val = 100;
		}
		clearElem(display);
		display.appendChild(document.createTextNode(0 + val));
		var span = document.createElement('SPAN');
		span.appendChild(document.createTextNode('%'));
		display.appendChild(span);
	});
	truck = $('truck');
	truck.holder = $('truck-holder');
	var t_arr = $C_arr(['w-root'], truck, 'DIV');
	truck.label = $("truck-label");
	truck.w_root = t_arr.shift();
	truck.w_root.VISIBILE = true;
	t_mov = new moveable(truck);
	c.moveable.onmove.register('clear timeout', function(){
		clearTimeout(anim_timeout);
	}, 1);
	c.moveable.onmove.register('call flash', function(){
		if(!external){
			var num = get_num(this.left);
			if(this.limits.X.TO_REACHED){
				num = 5;
				c.movement.stop();
			}
			if(cur_pos == num){
				return true;
			}	
			cur_pos = num;
			fl.hoverObject2(num);
		}
	}, -1, 0);
	t_mov.onmove.register('print', function(){
		truck.label.innerHTML = "<a href='/service/' alt='Услуги'>Поздравляем, Вы &mdash; VIP-клиент!</a>";
	}, 1);
	t_res = new Resize(truck, tim, t_mov);
	c.movement = new Movement(c.moveable, tim);
	c.movement.onstop.register('test', function(){
		clearElem(display);
		display.appendChild(document.createTextNode(0 + this.p_val));
		var span = document.createElement('SPAN');
		span.appendChild(document.createTextNode('%'));
		display.appendChild(span);
	});
	c.onstart.register('stop movement', function(){
		external = false;
		if(this.movement.IS_MOVING){
			this.movement.stopMoveTo();
		}
	});
	c.dragdrop.ondrop.register('test', function(){
		external = true;
	});
	c.movement.onmove.register('wheeles', function(){
		if(this.moveable.limits.X.REACHED){
//			fl.hoverObject2(5);
			return true;
		}
		if(truck.w_root.VISIBILE){
			truck.w_root.addClass('w-hidden');
		}else{
			truck.w_root.removeClass('w-hidden');
		}
		truck.w_root.VISIBILE = !truck.w_root.VISIBILE;
	});
//	init_icons();
//	load_flash();
	fl = getFlash('flash');
	init_icon_values();
	anim_timeout = setTimeout(function(){
		external = false;
		c.movement.p_val = icon_values.last().pc;
		c.movement.onstop.register('set external', function(){
			external = true;
		}, 1);
		ANIM_WORKING = true;
		c.movement.moveTo(c.moveable.limits.X.to + 1, 0, 10);
	}, 10000);
};
var fl;
function DragDropComponent(track, oMoveable){
	this.track = track;
	this.init(oMoveable);
	this.onchange = new DOMEvent(this);
}
DragDropComponent.prototype.init = function(oMov){
	this.detectDD(oMov);
	this.get_dims();
	this.initDD();
};
DragDropComponent.prototype.get_dims = function(){
	var dims = Style.$D(this.track);
	this.track_width = dims.width;
	this.track_height = dims.height;

	dims = Style.$D(this.dragdrop.elem);
	this.thumb_width = dims.width;
	this.thumb_height = dims.height;
};
DragDropComponent.prototype.detectDD = function(oMov){
	if(oMov instanceof DragDrop){
		this.dragdrop = oMov;
		this.moveable = oMov.moveable;
	}else{
		this.dragdrop = new DragDrop(oMov);
		this.moveable = this.dragdrop.moveable;
	}
};
DragDropComponent.prototype.initDD = function(){
	this.lim_val = this.track_width - this.thumb_width;
	this.dragdrop.moveable.setLimits("X", this.lim_val);
	this.dragdrop.moveable.setLimits("Y", 0);
	this.dragdrop.ondrag.register("test", function(){
		this.onchange.fire((this.moveable.left / this.lim_val) * 100, this.moveable.left);
	}.bind(this));	
	this.onstart = DOMEvent.cloneEvent(this.dragdrop.ondragstart, this);
};
function Console(elem){
	this.elem = elem;
	this.pr_count = 0;
	this.onprint = new DOMEvent(this);
}
Console.prototype.print = function(val){
	print(val, this.elem);
	this.pr_count++;
	this.onprint.fire(val);
};
Console.prototype.clear = function(){
	clearElem(this.elem);
};
var speed = 10;
var g_speed = 5;
var i_root;
function init_icons(){
	var root = $('icons');
	root.items = $C('item', root, 'DIV');
	root.items.each(function(item){
		item.root = root;
		item.input = $T('INPUT', item, 1);
		item._percent_val = Number(item.input.value);

		item._val = item._percent_val != 0 ? Math.round((c.lim_val / 100) * item._percent_val) : 1;

		var arr = $C_arr(['img-holder', 'img', 'hidden'], item, 'DIV');
		item.link = $T("A", item, 1);
		item.d_holder = arr.shift();
		item.d_img = arr.shift();
		item.d_hidden = arr.shift();
		item.hidden_img = $T('IMG', item.d_hidden, 1);
		item.img = $T('IMG', item.d_img, 1);
		item.from = {
			w: item.img.width, h: item.img.height, src: item.img.src
		};
		item.to = {
			w: item.hidden_img.width, h: item.hidden_img.height, src: item.hidden_img.src
		};
		item.d_img.style.left = Math.floor((item.d_holder.offsetWidth - item.img.width) / 2) + "px";
		item.d_img.style.width = item.img.width + "px";
		item.d_img.style.height = item.img.height + "px";
		item.d_img.style.top = Math.floor((item.d_holder.offsetHeight - item.img.height) / 2) + "px";
		item.mov = new moveable(item.d_img);
		item.res = new Resize(item.d_img, tim);
		Resize.setGrow(item.res, item.mov);
		item.res.resizeable.onafterresize.register('img', function(oR){
			this.img.width = oR.width;
			this.img.height = oR.height;
		}.bind(item, item.res.resizeable));
		item.link_top = 0;
		item.coeff = 0;
		item.res.onresize.register('change link position', function(oR){
			this.link_top += this.res.stepY.signOf();
			this.link.style.top = this.link_top + "px";
			print(this.link_top,console);
		}.bind(item, item.res.resizeable));
		item.res.ongrown.register('src', function(){
			if(this.GROWING){
				this.img.src = this.to.src;
			}
		}.bind(item));
		var w = item.img.width;
		var h = item.img.height;
		item.grow = function(){
			if(this.GROWING){
				return false;
			}
			this.res.growTo(this.to.w, this.to.h, g_speed);
			this.GROWING = 1;
			if(this.root.here_item){
				this.root.here_item.img.src = this.root.here_item.from.src;
				this.root.here_item.res.growTo(this.root.here_item.from.w, this.root.here_item.from.h, g_speed);
				this.root.here_item.GROWING = false;
			}
			this.root.here_item = this;		
		};
		item.img.onmouseover = item.link.onmouseover = function(){
			if(c.dragdrop.IS_DRAGGING){
				return false;
			}
			var diff = this._val - c.movement.moveable.left;
			c.movement.p_val = this._percent_val == 0 ? 1 : this._percent_val;
			c.movement.moveTo(this._val, 0, diff == 1 ? 1 : 10);
			this.grow();
		}.bind(item);
		if(ie6){
			item._src = item.img.src;
			item.img.style.width = w + 'px';
			item.img.style.height = h + 'px';
			item.img.src = item.img.src.replace(item.img.nameProp, 'blank.gif');
			item.img.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + item._src + '", sizingMethod="crop"';
		}
		var dims = Style.$D(item.d_holder);
		Style.set(item.d_img, {width: w, height: h}, null, true);
		item.img.style.left = Math.floor((dims.width - w) / 2) + "px";
	});
	i_root = root;
}

function check_icon(pos){	
	var ic = null;
	i_root.items.each(function(item){
		if(Number(item._val) <= pos){
			ic = item;
		}else{
			if(ic){
				throw $break;
			}
		}
	});
	return ic;
}
var getFlash = function ( flashId ) {
	
	if (ie) {
		return window[flashId];
	}
	else {
		return document[flashId];
	}
	
}

var external = true;
var moveThumb = function ( num ) {
	if(external || ANIM_WORKING){
		cur_pos = num;
		var left = icon_values[num].left;
		c.movement.moveTo(left < 100 ? 0 : left, 0, speed);
		c.movement.p_val = icon_values[num].pc;
		ANIM_WORKING = false;
	}
};
function get_num(left){
	var num = -1;
	icon_values.each(function(obj, ind){
		if(obj.left < left){
			num = ind;
		}else{
			if(num != -1){
				throw $break;
			}
		}
	});
	return num == -1 ? 0 : num;;
}