/******************************************************************************
@owner: SVSi
@author: Arthur Johnson
@functions: Window Panes are like MS Windows' windows
@WindowPane
*******************************************************************************/

//*************  WINDOWPANE CLASS  ***************//
	function WindowPane(opts) {
	
		if(undef(opts)) opts = {};
	
		this.id = 'WindowPane-'+pb.windowpaneindex;
		pb.windowpaneindex++;
	
		this.name = opts.hasOwnProperty('name') ? opts.name : '';
		this.title = opts.hasOwnProperty('title') ? opts.title : 'New Window';
		this.scale = opts.hasOwnProperty('scale') ? opts.scale : 1;

		this.element = opts.hasOwnProperty('element') ? opts.element : document.createElement("div");
		if (opts.hasOwnProperty('style')) this.element.style.cssText += opts.style;		
		if (opts.hasOwnProperty('className')) this.element.className += ' '+opts.className;	
		this.element.id = this.id;
		
		this.updating = opts.hasOwnProperty('updating') ? opts.updating : false;
		this.update = opts.hasOwnProperty('update') ? opts.update : noop;
		this.onLoad = opts.hasOwnProperty('onLoad') ? opts.onLoad : noop;
		this.init = opts.hasOwnProperty('init') ? opts.init : noop;
		this.loaded = false;
		
		this.controls = false;
		this.controlstype = false;
		this.controlsresponsive = false;
		this.click = opts.hasOwnProperty('click') ? opts.click : noop;
		this.clickup = opts.hasOwnProperty('clickup') ? opts.clickup : noop;
		this.hoverin = opts.hasOwnProperty('hoverin') ? opts.hoverin : noop;
		this.hoverout = opts.hasOwnProperty('hoverout') ? opts.hoverout : noop;
		
		this.resizable = opts.hasOwnProperty('resizable') ? opts.resizable : true;
		
		this.draggable = opts.hasOwnProperty('draggable') ? opts.draggable : true;
		this.dragging = opts.hasOwnProperty('dragging') ? opts.dragging : function (mousex, mousey){
			//no operations
		};
		
		this.children = opts.hasOwnProperty('children') ? opts.children : [];
		this._init();
		
	}
	WindowPane.prototype = {
		_init: function(opts){
			
			$('#thebody').append(this.element);
			
			for (var i=0; i<this.children.length; i++){
				this.element.appendChild(this.children[i]);
				if (this.children[i].init) this.children[i].init();
			}
			
			if (this.draggable) $('#'+this.id).draggable({handle: ".title_bar"});
			
			if (this.resizable){
				$('#'+this.id).resizable();
				$('#'+this.id).css({
					"width": "370px",
					"height": "460px"
				}).trigger('resize');
			}
			
			pb.windowpanes.push(this);
			
			this.init();
			
		},
		remove: function(opts){
		
			if ($.contains( document.body, this.element )) document.body.removeChild(this.element);
			
		},
		getChild: function(name){
			for (var i = 0; i < this.children.length; i++){
				if (this.children[i].name === name) return this.children[i];
			}
			return null;
		},
		getChildById: function(id){
			for (var i = 0; i < this.children.length; i++){
				if (this.children[i].id === id) return this.children[i];
			}
			return null;
		},
		getChildrenByClass: function(classname){
			var children = [];
			
			for (var i = 0; i < this.children.length; i++){
				var classlist = this.children[i].className.split(' ');
				if (arrayContains(classlist, classname)) children.push(this.children[i]);
			}
			if (children.length > 0) return children;
			else return null;
		},
		transition: function(opts){
			//TweenMax.to(this.element, opts.time, opts.to);
			
			var props = opts.props;
			
			if (opts.hasOwnProperty('transformperspective')){
				$(this.element).css('-webkit-perspective', opts.transformperspective+'px');
				$(this.element).css('-moz-perspective', opts.transformperspective+'px');
				$(this.element).css('-o-perspective', opts.transformperspective+'px');
				$(this.element).css('-ms-perspective', opts.transformperspective+'px');
				$(this.element).css('perspective', opts.transformperspective+'px');
			}
			if (opts.hasOwnProperty('perspectiveorigin')){
				$(this.element).css('-webkit-perspective-origin', opts.perspectiveorigin);
				$(this.element).css('-moz-perspective-origin', opts.perspectiveorigin);
				$(this.element).css('-o-perspective-origin', opts.perspectiveorigin);
				$(this.element).css('-ms-perspective-origin', opts.perspectiveorigin);
				$(this.element).css('perspective-origin', opts.perspectiveorigin);
				
				$(this.element).css('-webkit-transform-origin', opts.perspectiveorigin);
				$(this.element).css('-moz-transform-origin', opts.perspectiveorigin);
				$(this.element).css('-o-transform-origin', opts.perspectiveorigin);
				$(this.element).css('-ms-transform-origin', opts.perspectiveorigin);
				$(this.element).css('transform-origin', opts.perspectiveorigin);
			}
			if (opts.hasOwnProperty('transformorigin')){
				$(this.element).css('-webkit-transform-origin', opts.transformorigin);
				$(this.element).css('-moz-transform-origin', opts.transformorigin);
				$(this.element).css('-o-transform-origin', opts.transformorigin);
				$(this.element).css('-ms-transform-origin', opts.transformorigin);
				$(this.element).css('transform-origin', opts.transformorigin);
				
				$(this.element).css('-webkit-perspective-origin', opts.transformorigin);
				$(this.element).css('-moz-perspective-origin', opts.transformorigin);
				$(this.element).css('-o-perspective-origin', opts.transformorigin);
				$(this.element).css('-ms-perspective-origin', opts.transformorigin);
				$(this.element).css('perspective-origin', opts.transformorigin);
			}
			if (opts.hasOwnProperty('transformstyle')){
				$(this.element).css('-webkit-transform-style', opts.transformstyle);
				$(this.element).css('-moz-transform-style', opts.transformstyle);
				$(this.element).css('-o-transform-style', opts.transformstyle);
				$(this.element).css('-ms-transform-style', opts.transformstyle);
				$(this.element).css('transform-style', opts.transformstyle);
			}
			if (opts.hasOwnProperty('backfacevisibility')){
				$(this.element).css('-webkit-backface-visibility', opts.backfacevisibility);
				$(this.element).css('-moz-backface-visibility', opts.backfacevisibility);
				$(this.element).css('-o-backface-visibility', opts.backfacevisibility);
				$(this.element).css('-ms-backface-visibility', opts.backfacevisibility);
				$(this.element).css('backface-visibility', opts.backfacevisibility);
			}
			
			if (opts.hasOwnProperty('onComplete')){
				var onend = opts.onComplete;
			}
			else {
				var onend = noop;
			}
			
			//console.log('twn', props, opts.delay, opts.time, opts.to);
			
			var trans = tween({object: props, delay: (!undef(opts.delay)?opts.delay:0), time: opts.time, to: opts.to, begin: true,
				onStart: function(){},//console.log('okstart');}, 
				onUpdate: function(){
				
					//console.log(props);
				
					if (props.hasOwnProperty('opacity')){
						$(this.element).css('opacity', props.opacity);
					}
					if (props.hasOwnProperty('top')){
						$(this.element).css('top', props.top+'px');
					}
					if (props.hasOwnProperty('left')){
						$(this.element).css('left', props.left+'px');
					}
					if (props.hasOwnProperty('width')){
						$(this.element).css('width', props.width+'px');
					}
					if (props.hasOwnProperty('height')){
						$(this.element).css('height', props.height+'px');
					}
					if (props.hasOwnProperty('scale')){
						$(this.element).css('-webkit-transform', 'scale3d('+props.scale+','+props.scale+','+props.scale+')');
						$(this.element).css('-moz-transform', 'scale3d('+props.scale+','+props.scale+','+props.scale+')');
						$(this.element).css('-o-transform', 'scale3d('+props.scale+','+props.scale+','+props.scale+')');
						$(this.element).css('-ms-transform', 'scale3d('+props.scale+','+props.scale+','+props.scale+')');
						$(this.element).css('transform', 'scale3d('+props.scale+','+props.scale+','+props.scale+')');
					}
					if (props.hasOwnProperty('scaleX')){
						$(this.element).css('-webkit-transform', 'scaleX('+props.scaleX+')');
						$(this.element).css('-moz-transform', 'scaleX('+props.scaleX+')');
						$(this.element).css('-o-transform', 'scaleX('+props.scaleX+')');
						$(this.element).css('-ms-transform', 'scaleX('+props.scaleX+')');
						$(this.element).css('transform', 'scaleX('+props.scaleX+')');
					}
					if (props.hasOwnProperty('scaleY')){
						$(this.element).css('-webkit-transform', 'scaleY('+props.scaleY+')');
						$(this.element).css('-moz-transform', 'scaleY('+props.scaleY+')');
						$(this.element).css('-o-transform', 'scaleY('+props.scaleY+')');
						$(this.element).css('-ms-transform', 'scaleY('+props.scaleY+')');
						$(this.element).css('transform', 'scaleY('+props.scaleY+')');
					}
					if (props.hasOwnProperty('scaleZ')){
						$(this.element).css('-webkit-transform', 'scaleZ('+props.scaleZ+')');
						$(this.element).css('-moz-transform', 'scaleZ('+props.scaleZ+')');
						$(this.element).css('-o-transform', 'scaleZ('+props.scaleZ+')');
						$(this.element).css('-ms-transform', 'scaleZ('+props.scaleZ+')');
						$(this.element).css('transform', 'scaleZ('+props.scaleZ+')');
					}
					if (props.hasOwnProperty('rotation') && props.hasOwnProperty('angleX')
						&& props.hasOwnProperty('angleY') && props.hasOwnProperty('angleZ')){
						$(this.element).css('-webkit-transform', 'rotate3d('+props.angleX+','+props.angleY+','+props.angleZ+','+props.rotation+'rad)');
						$(this.element).css('-moz-transform', 'rotate3d('+props.angleX+','+props.angleY+','+props.angleZ+','+props.rotation+'rad)');
						$(this.element).css('-o-transform', 'rotate3d('+props.angleX+','+props.angleY+','+props.angleZ+','+props.rotation+'rad)');
						$(this.element).css('-ms-transform', 'rotate3d('+props.angleX+','+props.angleY+','+props.angleZ+','+props.rotation+'rad)');
						$(this.element).css('transform', 'rotate3d('+props.angleX+','+props.angleY+','+props.angleZ+','+props.rotation+'rad)');
					}
					if (props.hasOwnProperty('translateX') || props.hasOwnProperty('translateY')
						|| props.hasOwnProperty('translateZ')){
						$(this.element).css('-webkit-transform', 'translate3d('+(!undef(opts.translateX)?props.translateX:0)+
											','+(!undef(opts.translateY)?props.translateY:0)+','+(!undef(opts.translateZ)?props.translateZ:0)+')');
						$(this.element).css('-moz-transform', 'translate3d('+(!undef(opts.translateX)?props.translateX:0)+
											','+(!undef(opts.translateY)?props.translateY:0)+','+(!undef(opts.translateZ)?props.translateZ:0)+')');
						$(this.element).css('-o-transform', 'translate3d('+(!undef(opts.translateX)?props.translateX:0)+
											','+(!undef(opts.translateY)?props.translateY:0)+','+(!undef(opts.translateZ)?props.translateZ:0)+')');
						$(this.element).css('-ms-transform', 'translate3d('+(!undef(opts.translateX)?props.translateX:0)+
											','+(!undef(opts.translateY)?props.translateY:0)+','+(!undef(opts.translateZ)?props.translateZ:0)+')');
						$(this.element).css('transform', 'translate3d('+(!undef(opts.translateX)?props.translateX:0)+
											','+(!undef(opts.translateY)?props.translateY:0)+','+(!undef(opts.translateZ)?props.translateZ:0)+')');
					}
					
					//$(this.element).css('-webkit-transform', 'rotate3d(0,1,1,'+props.x/100+'rad)');
					
				}.bind(this),
				extraOnComplete: function(){onend();}//console.log('okend');}
			});
		}
	}
//**************  END WINDOWPANE  ****************//