/**
 * Class of 360Object.
 * Presents the various events managed to display an object make make it
 * rotate.
*/
var C360Object = Class.create() ;
C360Object.prototype = {

	// ------------------------------------
	// Attributes
	
	// Name of the object, appears in the title attribute.
	name: null,

	// Image file presenting the object faces, used to preload the stuff.
	image: null,

	// Image content parameter.
	rows: 1,     // number of rows, set to 1 by default thus only a single image is present.
	cols: 1,     // number of cols, set to 1 by default thus only a single image is present.
	width: 300,  // default width of a single view.
	height: 200, // default height of a single view.

	// Initial viewport
	xPos: 1,
	yPos: 1,

	// Waiting image
	waitingImage: null,

	// Final object
	object: null,

	// Object location
	parent: null,

	// Rotating activity
	activated: false,  // rotation active or not
	rotationWay: 0,    // way of the rotation: >0=clockwise, <0=counterclockwise
	rotationCenter: 0, // The initial mouse position used as movement analysis

	// ------------------------------------
	// Methods

	// Constructor
	initialize: function (name, image, param) {
		if (!param) param = {} ;
		this.name  = name ;
		this.image = new Image () ;
		this.image.onload = this.onload ;

		this.rows = param.rows || 1 ;
		this.cols = param.cols || 1 ;

		this.width  = param.width || 300 ;
		this.height = param.height || 200 ;

		this.waitingImage = param.wait || "loading.gif" ;

		// object creation
		var theDiv = document.createElement("div") ;
		theDiv.id                    = this.name ;
		theDiv.name                  = this.name ;
		theDiv.title                 = this.name ;
		theDiv.style.width           = this.width ;
		theDiv.style.height          = this.height ;
		theDiv.style.cursor          = "move" ;
		theDiv.style.backgroundImage = "url(" + this.waitingImage + ")" ;
		theDiv.style.backgroundPosition = "center" ;
		theDiv.style.backgroundRepeat = "no-repeat" ;
		theDiv.that = this ; // Link to JS object
		theDiv.onmousemove = this.onmousemove ;
		theDiv.onmousedown = this.onmousedown ;
		theDiv.onmouseup   = this.onmouseup ;
		theDiv.onmouseout  = this.onmouseout ;
		this.object = theDiv ;
		this.image.relatedObject = this ;

		// Object location
		var parent = (param.parent) ? $(param.parent) : document.body ;
		parent.appendChild(this.object) ;

		// Start loading the object image
		this.image.src = image ;

	},

	// Image onload action
	onload: function () {
		this.relatedObject.object.style.backgroundImage = "url(" + this.src + ")" ;
		this.relatedObject.object.style.backgroundRepeat = "" ;
		this.relatedObject.object.style.backgroundPosition = this.relatedObject.width + "px " + this.relatedObject.height + "px" ;
		//alert("ronron: "+this.relatedObject.object.style.backgroundImage) ;
	},

	// Move the background to the next or previous image in the viewport
	// according to the sign provided
	rotateBy: function (sign) {
		var toTheEnd = false ;
		if (sign){
			this.xPos++ ;
			toTheEnd = (this.xPos > this.cols) ;
		}else{
			this.xPos-- ;
			toTheEnd = (this.xPos < 1) ;
		}
		if (toTheEnd){
			if (sign) {
				this.yPos++ ;
				this.xPos = 1 ;
			}else{
				this.yPos-- ;
				this.xPos = this.cols ;
			}
			if (this.yPos > this.rows) this.yPos = 1 ;
			if (this.yPos < 1) this.yPos = this.rows ;
		}
		this.object.style.backgroundPosition= (this.xPos*this.width) + "px " + (this.yPos*this.height) + "px" ;
	},
	rotateLeft: function () { this.rotateBy(true) ; },
	rotateRight: function () { this.rotateBy(false) ; },

	// Mouse action over the object
	onmousemove: function (ev) {
		if (this.that.active) {
			var eve = ev || event ;
			var dif = this.that.rotationCenter - eve.clientX ;
			var way = eve.clientX - this.that.rotationWay ;
			if ((dif%3==0)) {
				if (way<0) this.that.rotateRight() ;
				else this.that.rotateLeft() ;
			}
			this.that.rotationWay = eve.clientX ;
		}
		return false ; // to avoid drag'n'drop and other actions
	},
	onmouseup: function () {
		this.that.active = false ;
		return false ; // to avoid drag'n'drop and other actions
	},
	onmouseout: function () {
		this.that.active = false;
		return false ; // to avoid drag'n'drop and other actions
	},
	onmousedown: function (ev) {
		this.that.active = true ;
		var eve = ev || event ;
		this.that.rotationCenter = eve.clientX ;
		this.that.rotationWay = this.that.rotationCenter ;
		return false ; // to avoid drag'n'drop and other actions
	}

}