var imageZoom = new Class({
	initialize: function(container,source){
		this.source    = source;
		this.container = $(container);
		this.cCords    = this.container.getCoordinates();
		window.addEvent('domready',this.loadImage.bind(this));
	},
	loadImage: function(){
		var sty = {'float':'none','display':'block','position':'relative'};
		this.container.setStyles({'overflow':'hidden','position':'relative','cursor':'move'});
		this.image = new Asset.image(this.source, {id: 'iZoom', onload: this.initImage.bind(this)});
	},
	initImage: function(){
		this.image.injectInside(this.container);
		this.imageSize = this.image.getCoordinates();
		console.debug(this.imageSize);
		console.debug(this.cCords);
		if(this.imageSize.height > this.cCords.height || this.imageSize.width > this.cCords.width) {
			//this.controlls();
			var s = {};
			if(this.imageSize.width > this.imageSize.height) {
				s.height = this.cCords.height;
				s.width  = this.imageSize.width / (this.imageSize.height / s.height);
			} else {
				s.width  = this.cCords.width;
				s.height = this.imageSize.height / (this.imageSize.width / s.width);
			}
			s.cursor = 'move';
			s.left   = '0px';
			this.image.setStyles(s);
		} else {
			var cen  = {};
			cen.top  = (this.cCords.height /2) - (this.imageSize.height/2);
			cen.left = (this.cCords.width /2)  - (this.imageSize.width/2);
			this.image.setStyles(cen);
		}
		var p = this.image.getParent().getCoordinates();
		var i = this.image.getCoordinates();
		var l = {y:[-(i.height - p.height),0],x:[-(i.width - p.width),0]};
		this.dragger = this.image.makeDraggable({limit:l});
    this.image.addEvent('mouseover',this.scaleStop.bind(this));
	},
	controlls: function(){
		this.controller = new Element('div',{'id':'controller'}).setStyles('position:absolute;top:0px;right:0px;background:#fff;width:30px;cursor:pointer;').injectInside(this.container);
		var zi = new Element('div',{'id':'zoomIn'}).set('html','<img src="/images/zoom-in.png">').injectInside(this.controller);
		zi.addEvent('mousedown',this.scaleStart.bind(this,'in'));
		zi.addEvent('mouseup',this.scaleStop.bind(this));
		var zo = new Element('div',{'id':'zoomOut'}).set('html','<img src="/images/zoom-out.png">').setStyles('height:30px;font-weight:bold;').injectInside(this.controller);
		zo.addEvent('mousedown',this.scaleStart.bind(this,'out'));
		zo.addEvent('mouseup',this.scaleStop.bind(this));
	},
	scaleStart: function(dir){
		$clear(this.timer);
		this.timer = this.scale.periodical(50,this,dir);
	},
	scaleStop: function(){
		$clear(this.timer);
	},
	upLimit: function(){
		var i = this.image.getCoordinates();
		var p = this.image.getParent().getCoordinates();
		this.dragger.options.limit = {y:[-(i.height - p.height),0],x:[-(i.width - p.width),0]};
	},
	scale: function(dir){
		var s = this.image.getSize();
		var i = this.image.getCoordinates();
		var p = this.image.getParent().getCoordinates();
		if(dir=='in'){
			var n = {};
			n.width   = i.width + 10;
			n.height  = i.height + 10;
			n.top     = (i.top - p.top) - 4;
			n.left    = (i.left - p.left) - 4;
			this.image.setStyles(n);
			this.upLimit();
		}
		if(dir=='out'){
			var n = {};
			n.width   = i.width - 10;
			n.height  = i.height - 10;
			n.top     = (i.top - p.top) + 4;
			n.left    = (i.left - p.left) + 4;
			if(n.width > p.width && n.height > p.height) {
				this.image.setStyles(n);
			}
			this.upLimit();
		}
	}
});