/******************************************************************************
@owner: SVSi
@author: Arthur Johnson
@function: Button Class
@Button
*******************************************************************************/

//*************  BUTTON CLASS  ***************//

	function Button(opts){
		//if (opts && opts.core) console.log('creating button', opts.core.id, opts.core.style);
		if (undef(opts)) opts = {};
		
		if (undef(pb.buttonindex)) pb.buttonindex = 0;
		
	//**************************** CORE ******************************//
		if (opts.hasOwnProperty('core')){
		
			this.core = opts.core;
			
			if (undef(opts.copyid)) this.core.id = pb.uniqueId('Button-'+(pb.buttonindex++));
			//else this.core.id = pb.uniqueId(this.core.id);
			
			if (!undef(opts.type)) this.core.type = opts.type;
			
			if (undef(this.core.actualwidth)) this.core.actualwidth = this.core.basewidth;
			if (undef(this.core.actualheight)) this.core.actualheight = this.core.baseheight;
			if (undef(this.core.id)) this.core.id = 'Button-'+(pb.buttonindex++);	
			if (undef(this.core.type)) this.core.type = 'user';			
			if (undef(this.core.scale)) this.core.scale = 1;			
			if (undef(this.core.scripts)) this.core.scripts = ['',''];
			if (undef(this.core.conditional)) this.core.conditional = '';
			if (undef(this.core.elementHTML)) this.core.elementHTML = '';
			if (undef(this.core.className)) this.core.className = '';
			if (undef(this.core.style)) this.core.style = '';	
			if (undef(this.core.textnodeHTML)) this.core.textnodeHTML = '';
			if (undef(this.core.textstyle)) this.core.textstyle = '';	
			if (undef(this.core.texteditable)) this.core.texteditable = false;		
			if (undef(this.core.textoffsetx)) this.core.textoffsetx = 0;
			if (undef(this.core.textoffsety)) this.core.textoffsety = 0;
			if (undef(this.core.basewidth)) this.core.basewidth = 80;
			if (undef(this.core.baseheight)) this.core.baseheight = 80;
			if (undef(this.core.basetop)) this.core.basetop = 0;
			if (undef(this.core.baseleft)) this.core.baseleft = 0;			
			if (undef(this.core.draggedoffsetx)) this.core.draggedoffsetx = 0;
			if (undef(this.core.draggedoffsety)) this.core.draggedoffsety = 0;			
			if (undef(this.core.touchpanelkey)) this.core.touchpanelkey = false;
			if (undef(this.core.states)) this.core.states = [{images: []},{images: []}];
			if (undef(this.core.currentstate)) this.core.currentstate = 0;
			if (undef(this.core.updating)) this.core.updating = false;
			if (undef(this.core.update)) this.core.update = noop;
			if (undef(this.core.responsive)) this.core.responsive = false;
			if (undef(this.core.keepaspect)) this.core.keepaspect = false;
			if (undef(this.core.draggable)) this.core.draggable = false;
			if (undef(this.core.zvalue)) this.core.zvalue = 2000;
			
		}
		else {
		
			this.core = {};
			
			this.core.id = opts.hasOwnProperty('id') ? opts.id : pb.uniqueId('Button-'+(pb.buttonindex++));	
			this.core.type = opts.hasOwnProperty('type') ? opts.type : 'user';			
			this.core.scale = opts.hasOwnProperty('scale') ? opts.scale : 1;			
			this.core.scripts = opts.hasOwnProperty('scripts') ? opts.scripts : ['',''];
			this.core.conditional = opts.hasOwnProperty('conditional') ? opts.conditional : '';
			this.core.elementHTML = opts.hasOwnProperty('elementHTML') ? opts.elementHTML : '';
			this.core.className = opts.hasOwnProperty('className') ? opts.className : '';
			this.core.style = opts.hasOwnProperty('style') ? opts.style : '';	
			this.core.textnodeHTML = opts.hasOwnProperty('textnodeHTML') ? opts.textnodeHTML : 'text';
			this.core.textstyle = opts.hasOwnProperty('textstyle') ? opts.textstyle : '';	
			this.core.texteditable = opts.hasOwnProperty('texteditable') ? opts.texteditable : false;		
			this.core.textoffsetx = opts.hasOwnProperty('textoffsetx') ? opts.textoffsetx : 0;
			this.core.textoffsety = opts.hasOwnProperty('textoffsety') ? opts.textoffsety : 0;
			this.core.basewidth = opts.hasOwnProperty('basewidth') ? opts.basewidth : 80;
			this.core.baseheight = opts.hasOwnProperty('baseheight') ? opts.baseheight : 80;
			this.core.basetop = opts.hasOwnProperty('basetop') ? opts.basetop : 0;
			this.core.baseleft = opts.hasOwnProperty('baseleft') ? opts.baseleft : 0;
			this.core.actualwidth = opts.hasOwnProperty('actualwidth') ? opts.actualwidth : 80;
			this.core.actualheight = opts.hasOwnProperty('actualheight') ? opts.actualheight : 80;
			this.core.actualtop = opts.hasOwnProperty('actualtop') ? opts.actualtop : 0;
			this.core.actualleft = opts.hasOwnProperty('actualleft') ? opts.actualleft : 0;
			this.core.draggedoffsetx = opts.hasOwnProperty('draggedoffsetx') ? opts.draggedoffsetx : 0;
			this.core.draggedoffsety = opts.hasOwnProperty('draggedoffsety') ? opts.draggedoffsety : 0;			
			this.core.touchpanelkey = opts.hasOwnProperty('touchpanelkey') ? opts.touchpanelkey : false;
			this.core.states = opts.hasOwnProperty('states') ? opts.states : 
				[{name: 'state1', bgimage: blankimg, bgcolor: '', images: [], script: '', style: '', cssfilter: 'none'},
				 {name: 'state2', bgimage: blankimg, bgcolor: '', images: [], script: '', style: '', cssfilter: 'none'}];
			this.core.currentstate = opts.hasOwnProperty('currentstate') ? opts.currentstate : 0;
			this.core.updating = opts.hasOwnProperty('updating') ? opts.updating : false;
			this.core.update = opts.hasOwnProperty('update') ? opts.update : noop;
			this.core.responsive = opts.hasOwnProperty('responsive') ? opts.responsive : false;
			this.core.keepaspect = opts.hasOwnProperty('keepaspect') ? opts.keepaspect : false;
			this.core.draggable = opts.hasOwnProperty('draggable') ? opts.draggable : false;
			this.core.clonable = opts.hasOwnProperty('clonable') ? opts.clonable : false;
			this.core.resizable = opts.hasOwnProperty('resizable') ? opts.resizable : false;
			this.core.zvalue = opts.hasOwnProperty('zvalue') ? opts.zvalue : 1;
			this.core.iconimage = opts.hasOwnProperty('iconimage') ? opts.iconimage : false;
			this.core.iconstyle = opts.hasOwnProperty('iconstyle') ? opts.iconstyle : {position: 'topcenter', left: 'calc(50% - 20px)', top: '0px', width: '40px', height: '40px'};
			
		}
			
	//**************************** PANEL *****************************//
		this.panel = opts.hasOwnProperty('panel') ? opts.panel : false;
	
	//*************************** ELEMENT ****************************//
		this.element = document.createElement("div");	
		this.element.style.cssText += this.core.style;
		this.element.id = this.core.id;
		this.element.className = this.core.className;
	
	//**************************** TEXT ******************************//
		this.textnode = opts.hasOwnProperty('textnode') ? opts.textnode : document.createElement("div");
		this.element.appendChild(this.textnode);	
		$(this.textnode).css({
			width: '100%', 'min-height': '1em', position: 'relative',
			top: 'calc(50% - 0.5em)', left: 0, 'line-height': 'normal',
			'text-align': 'center', 'z-index': 89, 'word-wrap': 'break-word'
		});
		this.textnode.id = this.core.id + '_text';
		this.textnode.innerHTML = this.core.textnodeHTML;
		this.textnode.className = 'draggable_child item_child';	
		this.textnode.style.marginLeft = this.core.textoffsetx + 'px';
		this.textnode.style.marginTop = -this.core.textoffsety + 'px';
		this.textnode.style.cssText += this.core.textstyle;
		
		this.textnode.ondblclick = this.textdoubleclick.bind(this);
		
	//**************************** ICON ******************************//
		this.iconnode = opts.hasOwnProperty('iconnode') ? opts.iconnode : document.createElement("div");
		this.element.appendChild(this.iconnode);	
		$(this.iconnode).css({
			width: '40px', height: '40px', position: 'absolute', 'pointer-events': 'none',
			top: '0px', left: 'calc(50% - 20px)', 'z-index': 9
		});
		this.iconnode.id = this.core.id + '_icon';
		this.iconnode.className = 'draggable_child item_child';
		if (this.core.iconimage){
			this.iconnode.style.backgroundImage = 'url('+this.core.iconimage+')';
			this.iconnode.style.backgroundSize = '100% 100%';
		}
		if (this.core.iconstyle){
			if (this.iconnode.style.top) this.iconnode.style.top = this.core.iconstyle.top;
			if (this.iconnode.style.left) this.iconnode.style.left = this.core.iconstyle.left;
			if (this.iconnode.style.width) this.iconnode.style.width = this.core.iconstyle.width;
			if (this.iconnode.style.height) this.iconnode.style.height = this.core.iconstyle.height;
		}

	//**************************** INIT ******************************//
		if (undef(this.core.actualwidth) && undef(this.core.actualheight)){
			this.core.states[0].style = this.core.style;
			this.core.states[1].style = this.core.style;
			this.core.actualwidth = parseFloat(this.element.style.width);
			this.core.actualheight = parseFloat(this.element.style.height);
		}
	
		this.setState();
		try {
			pb[this.core.type].buttons.push(this);
		}
		catch (e){
			pb.user.buttons.push(this);
		}
		
		this.core.previouslocation = {top: this.element.style.top, left: this.element.style.left};
		
		if (!activepanel) this.element.title = this.element.id;
		else this.element.title = '';
		
		this._dragwait = true;
		this._dragfired = false;
		
		this.clickEffect = {
			down: function(self){
				tweencss({object: self.element, time: 0.001, props: {scale: 1.0}, to: {scale: 1.14}});
			},
			up: function(self){
				tweencss({object: self.element, time: 0.001, props: {scale: 1.14}, to: {scale: 1.0}});
			}
		};
		this.clickEvent = {
			down: noop, up: noop
		};
		
		for (var i=0; i<this.core.states.length; i++){
			if (!this.core.states[i].name) this.core.states[i].name = 'state'+(i+1);
		}
		
	}
	//************************** PROTOTYPE **************************//
	Button.prototype = {
		_show: function(){
			$(this.element).show(); this.core.__hidden = false;
		},
		_hide: function(){
			$(this.element).hide(); this.core.__hidden = true;
		},
		show: function(){
			$(this.element).show();
		},
		hide: function(){
			$(this.element).hide();
		},
		fadein: function(time){
			$(this.element).stop().fadeIn(time*1000);
		},
		fadeIn: function(time){
			$(this.element).stop().fadeIn(time*1000);
		},
		fadeout: function(time){
			$(this.element).stop().fadeOut();
		},
		fadeOut: function(time){
			$(this.element).stop().fadeOut(time*1000);
		},
		animate: function(opts, time, ease, onComplete){
			$(this.element).stop().animate(opts, time*1000, ease, onComplete);
		},
		animate3d: function(opts){
		
			var from = opts.from;
			var to = opts.to;
			var ease = opts.ease;
			
			if (!from || !to) return;
			
			var newopts = {};
			newopts.object = this.element;
			newopts.time = (opts.time || 1.0);
			if (ease) newopts.ease = ease;
			newopts.props = from;
			newopts.to = to;
		
			tweencss(newopts);
			
		},
		text: function(newtext){
			if (undef(newtext)) return this.textnode.innerHTML;
			this.setText(newtext);
		},
		setText: function(newtext){
			if (this.textnode.innerHTML !== newtext) this.textnode.innerHTML = newtext;
			//this.textnode.innerHTML = newtext;
		},
		getText: function(){
			return this.textnode.innerHTML;
		},
		setStyle: function(s){
			if (typeof s == 'string'){
				if (this.element) this.element.style.cssText = s;
				this.states[this.currentstate].style = s;
			}
			if (typeof s == 'object'){
				$(this.element).css(s);
			}
			window.onresize();
		},
		setTextStyle: function(s){
			if (typeof s == 'string'){
				if (this.textnode){
					this.textnode.style.cssText = s;
					var all = this.textnode.getElementsByTagName('*');
					for (var i = -1, l = all.length; ++i < l;) {
						all[i].style.cssText = s;
					}
				}
			}
			if (typeof s == 'object'){
				$(this.textnode).css(s);
				var all = this.textnode.getElementsByTagName('*');
				for (var i = -1, l = all.length; ++i < l;) {
					$(all[i]).css(s);
				}
			}
			window.onresize();
		},
		setOpacity: function(t){
			if (this.element) this.element.style.opacity = t;
		},
		setBackground: function(filepath){
			this.core.states[this.core.currentstate].bgimage = filepath;
			this.setState(this.core.currentstate+1);
		},
		setBackgroundImage: function(t){
			var puid = false;
			if (pb.project && pb.project.puid) var puid = pb.project.puid;
			if (project && project.puid) var puid = project.puid;
			if (!puid) return;
			if (this.element){
				this.element.style.backgroundImage = 'url(projects/'+puid+'/images/'+t+')';
				this.element.style.backgroundSize = '100% 100%';
			}
		},
		addState: function(opts){
			var puid = false;
			if (undef(opts.name)) return;
			if (undef(opts.images)) opts.images = [];
			if (undef(opts.bgimage)) opts.bgimage = 'data:image/gif;base64,R0lGODlhAQABAIAAAP///////yH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==';
			for (var i=0; i<this.core.states.length; i++){
				if (this.core.states[i].name == opts.name) return;
			}
			this.core.states.push({name: opts.name, bgimage: opts.bgimage, bgcolor: '', images: opts.images, script: '', style: '', cssfilter: 'none'});
		},
		getState: function(index){
			if (typeof index === 'string'){
				for (var i=0; i<this.core.states.length; i++){
					if (this.core.states[i].name == index){
						return this.core.states[i];
					}
				}
			}
			if (typeof index === 'number' && this.core.states[index-1]) return this.core.states[index-1];
			if (typeof index === 'undefined'){
				if (this.core.states[this.core.currentstate].name) return this.core.states[this.core.currentstate].name;
				else return this.core.currentstate+1;
			}
			return false;
		},
		deleteState: function(index){
			if (typeof index === 'string'){
				for (var i=0; i<this.core.states.length; i++){
					if (this.core.states[i].name == index){
						removeFromArray(this.core.states, this.core.states[i]);
						return;
					}
				}
			}
			if (typeof index === 'number' && this.core.states[index-1]) removeFromArray(this.core.states, this.core.states[index-1]);
			return;
		},
		setState: function(index){
			if (index == this.core.currentstate + 1) return;
			if (undef(index)) index = this.core.currentstate + 1;
			if (typeof index === 'string'){
				var found = false;
				for (var i=0; i<this.core.states.length; i++){
					if (this.core.states[i].name == index){
						index = i + 1;
						found = true;
					}
				}
				if (!found) index = 1;
			}
			if (typeof index !== 'number') return;
			
			if (activepanel && this.core.__hidden) this.element.style.display = 'block';
		
			index = parseInt(index) - 1;
			this.core.currentstate = index;
			if (undef(this.core.states[this.core.currentstate])){
				console.log('setstate_fail:', this.core.currentstate, this.core.states);
				return;
			}
			
			if (this.panel){
				if (this.panel.core.type !== 'templates'){
					this.element.style.width = this.core.actualwidth + 'px';
					this.element.style.height = this.core.actualheight + 'px';
				}
			}
			else {
				this.element.style.width = this.core.actualwidth + 'px';
				this.element.style.height = this.core.actualheight + 'px';
			}
		
			if (this.core.states[this.core.currentstate].bgimage) 
				var bgimage = this.core.states[this.core.currentstate].bgimage.replace('url(\'','').replace('\')','');
			else var bgimage = blankimg;
		
			$(this.element).find('img').remove();
			$(this.element).append('<img class="item_child bgimage" src="'+bgimage+'"\
					style="z-index: -1; width: 100%; height: 100%; position: absolute;\
					left: 0; top: 0; filter: '+this.core.states[this.core.currentstate].cssfilter+';\
					-webkit-filter: '+this.core.states[this.core.currentstate].cssfilter+';" \
					onerror="this.src = blankimg;" />');
			
			for (var i=0; i<this.core.states[this.core.currentstate].images.length; i++){
				$(this.element).append('<img class="item_child image'+(i+1)+'" \
					src="'+this.core.states[this.core.currentstate].images[i]+'"\
					style="z-index: '+(i+1)+'; width: 100%; height: 100%; position: absolute;\
					left: 0; top: 0;" />');
			}
			
			if (this.core.states[this.core.currentstate].bgcolor) 
				this.element.style.backgroundColor = this.core.states[this.core.currentstate].bgcolor;
			else this.element.style.backgroundColor = 'transparent';
			
			if (this.core.states[this.core.currentstate].style){
				if (this.panel) if (this.panel.core.type !== 'templates'){this.element.style.cssText += this.core.states[this.core.currentstate].style;}
				if (this.core.states[this.core.currentstate].style.indexOf('border-radius:') != -1){
					var array = this.core.states[this.core.currentstate].style.split(';');
					for (var i=0; i<array.length; i++){
						if (array[i].indexOf('border-radius:') != -1) 
							$(this.element).find('.bgimage')[0].style.cssText += array[i]+';';
					}
				}
			}
			
			if (this.core && this.core.states && this.core.states[this.core.currentstate] && this.core.states[this.core.currentstate].borders){
				if (this.core.states[this.core.currentstate].borders.tl){
					this.element.style.borderTopLeftRadius = this.core.states[this.core.currentstate].borders.tl;
					$(this.element).find('.bgimage')[0].style.borderTopLeftRadius = this.core.states[this.core.currentstate].borders.tl;
				}
				if (this.core.states[this.core.currentstate].borders.tr){
					this.element.style.borderTopRightRadius = this.core.states[this.core.currentstate].borders.tr;
					$(this.element).find('.bgimage')[0].style.borderTopRightRadius = this.core.states[this.core.currentstate].borders.tr;
				}
				if (this.core.states[this.core.currentstate].borders.bl){
					this.element.style.borderBottomLeftRadius = this.core.states[this.core.currentstate].borders.bl;
					$(this.element).find('.bgimage')[0].style.borderBottomLeftRadius = this.core.states[this.core.currentstate].borders.bl;
				}
				if (this.core.states[this.core.currentstate].borders.br){
					this.element.style.borderBottomRightRadius = this.core.states[this.core.currentstate].borders.br;
					$(this.element).find('.bgimage')[0].style.borderBottomRightRadius = this.core.states[this.core.currentstate].borders.br;
				}
			}
			
			//$(this.element).find('.bgimage').css('border-radius', $(this.element).css('border-radius'));

			if (this.core.textnodeHTML === 'undefined' || undef(this.core.textnodeHTML)){
				this.textnode.style.display = 'none';
			}
			
			if (this.core.scripts){
				if (this.core.scripts[0]){
					this.core.states[0].script = this.core.scripts[0];
					this.core.scripts[0] = false;
				}
				if (this.core.scripts[1]){
					this.core.states[1].script = this.core.scripts[1];
					this.core.scripts[1] = false;
				}
			}
			
			$(this.textnode).addClass('item_child');
			allDescendantsAddClass(this.textnode, 'item_child');
			
			if (this.core.iconimage){
				this.iconnode.style.backgroundImage = 'url('+this.core.iconimage+')';
				this.iconnode.style.backgroundSize = '100% 100%';
			}
			if (this.core.iconstyle){
				if (this.iconnode.style.top) this.iconnode.style.top = this.core.iconstyle.top;
				if (this.iconnode.style.left) this.iconnode.style.left = this.core.iconstyle.left;
				if (this.iconnode.style.width) this.iconnode.style.width = this.core.iconstyle.width;
				if (this.iconnode.style.height) this.iconnode.style.height = this.core.iconstyle.height;
			}
			
			this.iconnode.style.zIndex = 9;
			this.textnode.style.zIndex = 10;
			
			this.element.style.cssText += '; background-size: 100% 100%;';
			
			if (undef(this.core.scripts[0])) this.core.scripts[0] = '';
			if (undef(this.core.scripts[1])) this.core.scripts[1] = '';
			if (undef(this.core.conditional)) this.core.conditional = '';
			
			$(this.element).addClass('noselect');

			return this;
		},
		setBackgroundColor: function(c){
			if (this.element) this.element.style.backgroundColor = c;
		},
		setLeft: function(l){
			if (this.element) this.element.style.left = l + 'px';
			this.left = l;
		},
		setTop: function(t){
			if (this.element) this.element.style.top = t + 'px';
			this.left = t;
		},
		setPosition: function(l,t){
			if (this.element) this.element.style.left = l + 'px';
			if (this.element) this.element.style.top = t + 'px';
			this.left = l;
			this.top = t;
		},
		setZ: function(z){
			if (this.element) this.element.style.zIndex = z;
			this.core.zvalue = z;
		},
		setWidth: function(w){
			if (this.element) this.element.style.width = w + 'px';
			this.core.actualwidth = w;
		},
		setHeight: function(h){
			if (this.element) this.element.style.height = h + 'px';
			this.core.actualheight = h;
		},
		setSize: function(w, h){
			if (w !== null){
				if (this.element) this.element.style.width = w + 'px';
				this.core.actualwidth = w;
			}
			if (!undef(h) && h !== null){
				if (this.element) this.element.style.height = h + 'px';
				this.core.actualheight = h;
			}
			window.onresize();
		},
		setSizeSmart: function(w, h){
			if (w !== null){
				if (this.element){
					var oldleft = parseFloat(this.element.style.left);
					var oldw = parseFloat(this.element.style.width);
					this.element.style.width = w + 'px';
					this.element.style.left = oldleft - (w-oldw);
				}
				this.core.actualwidth = w;
			}
			if (!undef(h) && h !== null){
				if (this.element){
					var oldtop = parseFloat(this.element.style.top);
					var oldh = parseFloat(this.element.style.height);
					this.element.style.height = h + 'px';
					this.element.style.top = oldtop - (h-oldh);
				}
				this.core.actualheight = h;
			}
			var theight = ($(this.element).outerHeight()/2)
					- ($(this.textnode).outerHeight()/2);
				$(this.textnode).css('top', theight + 'px');
			window.onresize();
		},
		setPositionCenter: function(x, y){
			if (x !== null){
				if (this.element) this.element.style.left = (x - $(this.element).outerWidth()/2) + 'px';
				this.left = parseFloat(this.element.style.left);
			}
			if (!undef(y) && y !== null){
				if (this.element) this.element.style.top = (y - $(this.element).outerHeight()/2) + 'px';
				this.top = parseFloat(this.element.style.top);
			}
		},
		getPositionCenter: function(){
			var result = {};
			result.x = parseFloat(this.element.style.left) + ($(this.element).outerWidth()/2);
			result.y = parseFloat(this.element.style.top) + ($(this.element).outerHeight()/2);
			return result;
		},
		getWidthToHeight: function(){
			return this.width/this.height;
		},
		getHeightToWidth: function(){
			return this.height/this.width;
		},
		getActualWidth: function(){
			return parseFloat(this.element.style.width);
		},
		getActualHeight: function(){
			return parseFloat(this.element.style.width);
		},
		scaleTo: function(s){
			this.core.scale = s; 
			$(this.element).css({
				'transform': 'scale('+s+','+s+')',
				'-ms-transform': 'scale('+s+','+s+')',
				'-moz-transform': 'scale('+s+','+s+')',
				'-webkit-transform': 'scale('+s+','+s+')'
			});
		},
		remove: function(opts){
			this.panel.removeChild(this);
		},
		destroy: function(){
			$(this.element).remove();
			removeFromArray(pb[this.core.type].buttons, this);
			if (this.panel) removeFromArray(this.panel.buttons, this);
		},
		restore: function(){
			this.panel.addChild(this);
			pb[this.core.type].buttons.push(this);
		},
		clone: function(opts){
		
			if (undef(opts)) opts = {};
			
			var type = opts.hasOwnProperty('type') ? opts.type : this.core.type;
			var extrastyle = opts.hasOwnProperty('extrastyle') ? opts.extrastyle : '';
			
			this.core.style = this.element.style.cssText + extrastyle;
		
			var newbutton = new Button({	
				core: clone(this.core),
				panel: this.panel,
				type: type
			});
			
			newbutton.textnode.innerHTML = this.textnode.innerHTML;
			newbutton.textnode.style.cssText += this.textnode.style.cssText;
			
			newbutton.element.style.cssText += this.element.style.cssText
				+ ' ' + extrastyle + ' background-size: 100% 100%; margin: 0px;';
			
			if (!undef(opts.library)) newbutton.library = opts.library;
			
			var oldbuttonid = this.core.id;			
			var newbuttonid = newbutton.core.id;
			
			if (0&&newbutton.core.scripts){
				for (var i=0; i<newbutton.core.scripts.length; i++){
					newbutton.core.scripts[i] = 
						newbutton.core.scripts[i].replaceAll(oldbuttonid, newbuttonid);
				}
			}
			
			return newbutton;
		},
		copy: function(opts){
		
			if (undef(opts)) return;
			if (undef(opts.button)) return;
			
			var btn = opts.hasOwnProperty('button') ? opts.button : false;
			var extrastyle = opts.hasOwnProperty('extrastyle') ? opts.extrastyle : '';
			var extratextstyle = opts.hasOwnProperty('extratextstyle') ? opts.extratextstyle : '';
			var copyid = opts.hasOwnProperty('copyid') ? opts.copyid : false;
			
			this.core = clone(btn.core);
			this.element.className = btn.element.className;
			this.element.style.cssText = btn.element.style.cssText + extrastyle;
			this.textnode.innerHTML = btn.textnode.innerHTML;
			this.textnode.style.cssText = btn.textnode.style.cssText;
			
			if (copyid){
				this.element.id = btn.element.id;
				this.core.id = btn.element.id;
			}
			
			this.setState(btn.core.currentstate);
		},
		whileDown: false,
		click: function(){
			var ok = 0;
			//console.log(++ok);
			$('#tooltip2').finish().fadeOut();

			if (pb.currentpanel){
				//console.log(++ok, this.panel);
				if (this.panel){
					//console.log(++ok);
					if (pb.shiftdown){
						//console.log(++ok);
						if (this.element.className.indexOf('outlined') != -1){
							$('.outlined').removeClass('first');
							$(this.element).addClass('outlined'); $(this.element).addClass('first');
							if (this.core.states[this.core.currentstate] && this.core.states[this.core.currentstate].borders){
								if (this.core.states[this.core.currentstate].borders.tl) 
									$('#item-border-radius-tl').val(parseInt(this.core.states[this.core.currentstate].borders.tl)); else $('#item-border-radius-tl').val(0);
								if (this.core.states[this.core.currentstate].borders.tr) 
									$('#item-border-radius-tr').val(parseInt(this.core.states[this.core.currentstate].borders.tr)); else $('#item-border-radius-tr').val(0);
								if (this.core.states[this.core.currentstate].borders.bl) 
									$('#item-border-radius-bl').val(parseInt(this.core.states[this.core.currentstate].borders.bl)); else $('#item-border-radius-bl').val(0);
								if (this.core.states[this.core.currentstate].borders.br) 
									$('#item-border-radius-br').val(parseInt(this.core.states[this.core.currentstate].borders.br)); else $('#item-border-radius-br').val(0);
							}
						}
						else {
							if ($('.outlined').length == 0) $(this.element).addClass('first');
							$(this.element).addClass('outlined');
						}
						
					}
					else {
						//console.log(++ok);
						if (this.element.className.indexOf('outlined') != -1){
							$('.outlined').removeClass('first'); $(this.element).addClass('outlined'); $(this.element).addClass('first');
							if (this.core.states[this.core.currentstate] && this.core.states[this.core.currentstate].borders){
								if (this.core.states[this.core.currentstate].borders.tl) 
									$('#item-border-radius-tl').val(parseInt(this.core.states[this.core.currentstate].borders.tl)); else $('#item-border-radius-tl').val(0);
								if (this.core.states[this.core.currentstate].borders.tr) 
									$('#item-border-radius-tr').val(parseInt(this.core.states[this.core.currentstate].borders.tr)); else $('#item-border-radius-tr').val(0);
								if (this.core.states[this.core.currentstate].borders.bl) 
									$('#item-border-radius-bl').val(parseInt(this.core.states[this.core.currentstate].borders.bl)); else $('#item-border-radius-bl').val(0);
								if (this.core.states[this.core.currentstate].borders.br) 
									$('#item-border-radius-br').val(parseInt(this.core.states[this.core.currentstate].borders.br)); else $('#item-border-radius-br').val(0);
							}
						}
						else {
							$('.outlined').removeClass('outlined').removeClass('first'); $(this.element).addClass('outlined');
							$($('.outlined')[0]).addClass('first'); var item = pb.getItem($('.outlined')[0].id);
							if (this.core.states[this.core.currentstate] && this.core.states[this.core.currentstate].borders){
								if (item.core.states[item.core.currentstate].borders.tl) 
									$('#item-border-radius-tl').val(parseInt(item.core.states[item.core.currentstate].borders.tl)); else $('#item-border-radius-tl').val(0);
								if (item.core.states[item.core.currentstate].borders.tr) 
									$('#item-border-radius-tr').val(parseInt(item.core.states[item.core.currentstate].borders.tr)); else $('#item-border-radius-tr').val(0);
								if (item.core.states[item.core.currentstate].borders.bl) 
									$('#item-border-radius-bl').val(parseInt(item.core.states[item.core.currentstate].borders.bl)); else $('#item-border-radius-bl').val(0);
								if (item.core.states[item.core.currentstate].borders.br) 
									$('#item-border-radius-br').val(parseInt(item.core.states[item.core.currentstate].borders.br)); else $('#item-border-radius-br').val(0);
							}
						}
						
					}
					
					$('.outlinedjson').removeClass('outlinedjson');
					
					if ($('.outlined').exists()){
						
						var array = [];
						$('.outlined').each(function(){
							var type = false, set = false;
							var item = pb.getItem(this.id);
							if (item instanceof Button) type = 'button';
							if (item instanceof Widget){
								type = 'widget'; set = item.core.set;
							}
							array.push({id: this.id, type: type, set: set, width: item.core.actualwidth});
						});
						ng.selected = array;
						
						array = [];
						$('.outlined').each(function(){
							var item = pb.getItem(this.id);
							if (item instanceof Button) for (var i=0; i<item.core.states.length; i++){
								var found = false;
								for (var j=0; j<array.length; j++){
									if (item.core.states[i].name == array[j].name) found = true;
								}
								if (!found) array.push(item.core.states[i]);
							}
						});
						ng.buttonstates = array;
						
						if (this.core.touchpanelkey) $('#touchpanelkey-radio'+this.core.touchpanelkey).click();
						else $('#touchpanelkey-radio9').click();
						
						$('#item-width-input').val(pb.getItem($('.first')[0].id).core.actualwidth);
						$('#item-height-input').val(pb.getItem($('.first')[0].id).core.actualheight);
						
						this.core.actualtop = parseFloat(this.element.style.top);
						this.core.actualleft = parseFloat(this.element.style.left);
						
						$('#item-top-input').val(pb.getItem($('.first')[0].id).core.actualtop);
						$('#item-left-input').val(pb.getItem($('.first')[0].id).core.actualleft);
						
						$('#props-props-label').click();
						
						if ($('#props_props').css('display') == 'none'){
							$('.item-options').each(function(){
								$(this).css({display: 'none'});
							});
							setTimeout(function(){
								$('#item-basics-container').slideDown(400);
							}, 200);
						}
						
					}
					else {
						ng.selected = false, ng.buttonstates = [];
						$('.item-options').each(function(){
							if ($(this).css('display') != 'none') $(this).slideUp();
						});
					}
				
				}
				else {				
					$('.buttonlibraryselected').removeClass('buttonlibraryselected');
					$(this.element).addClass('buttonlibraryselected');
				}
			
			}
		
			if (pb.project.textEditing){
			
				if (pb.project.textEditing.core.text)
					pb.project.textEditing.core.text = 
					$(pb.project.textEditing.textnode)[0].innerHTML;
				
				for (k in CKEDITOR.instances){
					var instance = CKEDITOR.instances[k];
					instance.destroy();
				}
				
				if (pb.project.textEditing.textnode){
					$(pb.project.textEditing.textnode).attr('contenteditable', 'false');
					$(pb.project.textEditing.textnode).blur();
					$(pb.project.textEditing.textnode).addClass('item_child');
					allDescendantsAddClass(pb.project.textEditing.textnode, 'ck_edit');
					$(pb.project.textEditing.textnode).children().addClass( 'ck_edit' );
				}
				else {
					$(pb.project.textEditing.element).attr('contenteditable', 'false');
					$(pb.project.textEditing.element).blur();
					$(pb.project.textEditing.element).addClass('item_child');
					if (pb.project.textEditing.element) 
						allDescendantsAddClass(pb.project.textEditing.element, 'ck_edit');
					$(pb.project.textEditing.element).children().addClass( 'ck_edit' );
				}
				pb.project.textEditing = false;
				$(this.textnode).removeClass('selectable');
				
			}
			
		},
		doubleclick: function(){
		
			$('#tooltip2').finish().fadeOut();

			if (pb.project.textEditing){
			
				if (pb.project.textEditing.text) pb.project.textEditing.text = $(pb.project.textEditing.textnode)[0].innerHTML;
				
				for (k in CKEDITOR.instances){
					var instance = CKEDITOR.instances[k];
					instance.destroy();
				}
				
				if (pb.project.textEditing.textnode){
					$(pb.project.textEditing.textnode).attr('contenteditable', 'false');
					$(pb.project.textEditing.textnode).blur();
					$(pb.project.textEditing.textnode).addClass('item_child');
					allDescendantsAddClass(pb.project.textEditing.textnode, 'ck_edit');
					$(pb.project.textEditing.textnode).children().addClass( 'ck_edit' );
				}
				else {
					$(pb.project.textEditing.element).attr('contenteditable', 'false');
					$(pb.project.textEditing.element).blur();
					$(pb.project.textEditing.element).addClass('item_child');
					if (pb.project.textEditing.element) 
						allDescendantsAddClass(pb.project.textEditing.element, 'ck_edit');
					$(pb.project.textEditing.element).children().addClass( 'ck_edit' );
				}
				
				pb.project.textEditing = false;
				$(this.textnode).removeClass('selectable');
				
			}
			
		},
		textdoubleclick: function(){

			$('#tooltip2').finish().fadeOut();
		
			if (!this.panel) return;
			if (pb.project.textEditing == this) return;

			$(this.textnode).attr('contenteditable', 'true');
			$(this.textnode).removeClass('item_child');
			
			allDescendantsAddClass(this.textnode, 'ck_edit');

			CKEDITOR.inline( this.textnode );   
				
			$(this.textnode).focus();
			
			pb.project.textEditing = this;
			
			$(pb.project.textEditing.textnode).attr('contenteditable', 'true');
			$(pb.project.textEditing.textnode).children().addClass( 'ck_edit' );
			
			pb.unselectAll();
			
			$(this.textnode).addClass('selectable');
	
		},
		dragging: function(offx, offy){
		
			if (this._dragwait){
				if (pb.mouse.distancefromdown < 4) return;
				else {
					this._dragwait = false;
					
					if (!this._dragfired){

						this.element.style.transform =
							'scale('+pb.currentpanel.core.scale+','+
									pb.currentpanel.core.scale+')';
						$(this.element).css({ 
							'transform': 'scale('+pb.currentpanel.core.scale+','+
								pb.currentpanel.core.scale+')',
							'-webkit-transform': 'scale('+pb.currentpanel.core.scale+','+
								pb.currentpanel.core.scale+')',
							'-moz-transform': 'scale('+pb.currentpanel.core.scale+','+
								pb.currentpanel.core.scale+')',
							'-ms-transform': 'scale('+pb.currentpanel.core.scale+','+
								pb.currentpanel.core.scale+')'
						});

						document.body.appendChild(this.element);
					
					}
					
					this._dragfired = true;
				}
			}
		
			this.element.style.zIndex = 24000;
			this.element.style.position = 'absolute';

			var elebounds = this.element.getBoundingClientRect();
			var bbox = pb.currentpanel.element.getBoundingClientRect();
			var s = pb.currentpanel.core.scale;
			var doffsetx = -this.core.draggedoffsetx;
			var doffsety = -this.core.draggedoffsety;
			var oy = 0;
			var ox = 0;
			
			if (!this.panel){
				doffsetx = doffsetx*s;
				doffsety = doffsety*s;
			}
			
			this.element.style.top = oy + (doffsety + pb.mouse.y) - ($(this.element).outerHeight()*(1-s)/2) + 'px';
			this.element.style.left = ox + (doffsetx + pb.mouse.x) - ($(this.element).outerWidth()*(1-s)/2) + 'px';			

			$(this.element).css({
				'transform': 'scale('+pb.currentpanel.core.scale+','+pb.currentpanel.core.scale+')',
				'-ms-transform': 'scale('+pb.currentpanel.core.scale+','+pb.currentpanel.core.scale+')',
				'-moz-transform': 'scale('+pb.currentpanel.core.scale+','+pb.currentpanel.core.scale+')',
				'-webkit-transform': 'scale('+pb.currentpanel.core.scale+','+pb.currentpanel.core.scale+')'
			});
			
			this.core.actualtop = (doffsety + pb.mouse.y)/s - bbox.top/s + -1;
			this.core.actualleft = (doffsetx + pb.mouse.x)/s - bbox.left/s + -1;
			
			if ($('.first').exists()){
				$('#item-top-input').val(pb.getItem($('.first')[0].id).core.actualtop);
				$('#item-left-input').val(pb.getItem($('.first')[0].id).core.actualleft);
			}

		},
		drop: function(){
		
			if (undef(pb.project)) return;
			if (undef(pb.currentpanel)) return;
			if (undef(pb.currentpanel.element)) return;
			
			if (this._dragwait) return;
			
			this._dragwait = true;
			this._dragfired = false;
		
			var oy = -1; var ox = -1;
			var s = pb.currentpanel.core.scale;
			var doffsetx = -this.core.draggedoffsetx;
			var doffsety = -this.core.draggedoffsety;
			var elebox = this.element.getBoundingClientRect();
			var bbox = pb.currentpanel.element.getBoundingClientRect();
			
			//console.log('testing', pb.mouse.elementover);
			
			var els = pb.mouse.elementsOver();
			//for (var i=0; i<els.length; i++){
			//	if (/SubPanel-/.test(els[i].id)) console.log('got');
			//}
			var found = false;
			for (var i=els.length; i--;){
				if (/SubPanel-/.test(els[i].id)){
					var subpanel = get(els[i].id); if ($(subpanel.element).hasClass('first') || $(subpanel.element).hasClass('outlined')) continue;
					if (!subpanel.children) subpanel.children = [];
					if (this.subpanel){removeFromArray(get(this.subpanel).children, this.core.id);}
					if (subpanel.children.indexOf(this.core.id) === -1) subpanel.children.push(this.core.id);
					this.subpanel = subpanel.core.id;
					found = true;
					break;
				}
			}
			if (!found && this.subpanel){
				var subpanel = get(this.subpanel); var self = this;
				if (subpanel.children.indexOf(this.core.id) !== -1){
					pb.openDialog({
						title: 'Confirm',
						content: '<br><center>Remove item(s) from subpanel?</center>',
						confirm: 'ok', cancel: 'cancel',
						style: {height: '120px'},
						onConfirm: function(){
							pb.closeDialog(); removeFromArray(subpanel.children, self.core.id); self.subpanel = false;
						},
						onCancel: function(){
							pb.closeDialog(); 
						}
					});
					
				}
			}
			
			if (get(pb.mouse.elementover.id) instanceof SubPanel){
				//console.log('bom');
			}
			
			if (this.panel){
			
				if (pb.mouse.isOverElement(document.getElementById('button-library-pane'))){	
					pb.addUserButton(this);
				}
				
				$(this.element).css({
					'transform': 'scale('+1+','+1+')',
					'-webkit-transform': 'scale('+1+','+1+')',
					'-moz-transform': 'scale('+1+','+1+')',
					'-ms-transform': 'scale('+1+','+1+')'
				});
				
				$(this.element).remove();
				pb.currentpanel.element.appendChild(this.element);
				this.element.style.zIndex = this.core.zvalue;
				
				//todo: move to constrain?
				if (pb.snap_to_panel && doffsetx + pb.mouse.pagex < bbox.left) 
					this.element.style.left = 0 + 'px';
				else if (pb.snap_to_panel && doffsetx + pb.mouse.pagex > bbox.right - $(this.element).outerWidth()*s) 
					this.element.style.left = $(pb.currentpanel.element).outerWidth() 
						- $(this.element).outerWidth() - 2 + 'px';
				else this.element.style.left = (doffsetx + pb.mouse.x)/s - bbox.left/s + ox + 'px';
					
				if (pb.snap_to_panel && doffsety + pb.mouse.pagey < bbox.top)
					this.element.style.top = 0 + 'px';
				else if (pb.snap_to_panel && doffsety + pb.mouse.pagey > bbox.bottom - $(this.element).outerHeight() * s)
					this.element.style.top = $(pb.currentpanel.element).outerHeight() 
						- $(this.element).outerHeight() - 2 + 'px';
				else this.element.style.top = (doffsety + pb.mouse.y)/s - bbox.top/s + oy + 'px';
				
				this.makeResizable();
				
				if (pb.mouse.isOverElement(document.getElementById('button-library-pane'))){	
					this.element.style.top = this.core.previouslocation.top;
					this.element.style.left = this.core.previouslocation.left;
				}
				
				this.core.previouslocation = {top: this.element.style.top, left: this.element.style.left};

			}
			else {
			
				if (pb.currentpanel && !pb.mouse.isOverElement($('#tools-panel')[0]) &&
					pb.mouse.isOverElement(pb.currentpanel.element)){
					
					//this.core.type = 'user';
					
					var taction = new Action({ type: 'drop', items: [this] });
					pb.saveaction(taction);
						
					$(this.element).remove();
			
					this.element.style.zIndex = this.core.zvalue;
					this.library = 'panel';
					
					this.setPosition(
						doffsetx + pb.mouse.x/s - bbox.left/s + ox,
						doffsety + pb.mouse.y/s - bbox.top/s + oy
					);
					
					this.element.className = this.element.className.replace('cloneable','');
					this.core.texteditable = true;	
					this.element.className += ' draggable ';
					
					this.makeResizable();
					
					this.element.style.width = this.basewidth + 'px';
					this.element.style.height = this.baseheight + 'px';
					
					this.panel = pb.currentpanel;
					this.panel.addChild(this);
					
					this.constrain();
					
					this.core.responsive = true;
					this.core.left = parseFloat(this.element.style.left);
					this.core.top = parseFloat(this.element.style.top);
						
					tweencss({ object: this.element, time: 0, props: {scale: 1.0}, to: {scale: 1.0} });
					
					this.setState();
					
					this.core.previouslocation = {top: this.element.style.top, left: this.element.style.left};
					
					pb.updateTree();
					
				}
				else this.destroy();
			}
			
			this.core.actualtop = parseFloat(this.element.style.top);
			this.core.actualleft = parseFloat(this.element.style.left);
			
			if ($('.first').exists()){
				$('#item-top-input').val(pb.getItem($('.first')[0].id).core.actualtop);
				$('#item-left-input').val(pb.getItem($('.first')[0].id).core.actualleft);
			}
			
			if (this.subpanel){
				var _bbox = get(this.subpanel).element.getBoundingClientRect();
				var _cbox = this.element.getBoundingClientRect();
				var _pbox = this.panel.element.getBoundingClientRect();
				this._x = _cbox.left - _bbox.left - _pbox.left;
				this._y = _cbox.top - _bbox.top - _pbox.top;
				this.element.style.zIndex = parseInt(get(this.subpanel).element.style.zIndex) + 1;
			}
			
			//pb.updateFromMasterTemplate();
			
		},
		clickup: noop,
		hoverin: function(){
			if (activepanel) return;
			
			if (this.core.touchpanelkey && this.core.touchpanelkey > -1 && this.core.touchpanelkey < 10){
				$('#tooltip2').html('Touch Key: '+this.core.touchpanelkey);
				$('#tooltip2').css({left: (pb.mouse.x+8)+'px', top: (pb.mouse.y-16)+'px'});
				$('#tooltip2').finish().fadeIn();
			}
			else $('#tooltip2').hide();
		},
		hoverout: function(){
			if (activepanel) return;
			
			$('#tooltip2').finish().fadeOut();		
		},
		constrain: function(){
		
			var bbox = pb.currentpanel.element.getBoundingClientRect();
			var elebox = this.element.getBoundingClientRect();
			var ox = 0; var oy = 0;
		
			if (elebox.left < bbox.left) this.element.style.left = '0px';
			if (elebox.top < bbox.top) this.element.style.top = '0px';
			if (elebox.right > bbox.right) this.element.style.left =
				$(pb.currentpanel.element).outerWidth()
				- $(this.element).outerWidth() + ox + 'px';
			if (elebox.bottom > bbox.bottom) this.element.style.top =
				$(pb.currentpanel.element).outerHeight()
				- $(this.element).outerHeight() + oy + 'px';
				
		},
		resizeText: function(){
			
		},
		centerText: function(){
			var theight = ($(this.element).outerHeight()/2)
				- ($(this.textnode).outerHeight()/2);
			$(this.textnode).css('top', theight + 'px');
		},
		makeDraggable: function(opts){
		
			if (undef(opts)) opts = {};
		
			var appendTo = opts.hasOwnProperty('appendTo') ? opts.appendTo : 'body';
			var helper = opts.hasOwnProperty('helper') ? opts.helper : 'clone';
			var start = opts.hasOwnProperty('start') ? opts.start : noop;
			var drag = opts.hasOwnProperty('drag') ? opts.drag : noop;
			var stop = opts.hasOwnProperty('stop') ? opts.stop : noop;
			var grid = opts.hasOwnProperty('grid') ? opts.grid : [1, 1];
			var containment = opts.hasOwnProperty('containment') ? opts.containment : 'document';
		
			$(this.element).draggable({
				appendTo: appendTo,
				helper: helper,
				start: start,
				drag: drag,
				stop: stop,
				grid: grid,
				containment: containment
			});
			
		},
		makeResizable: function(){
			
			$(this.element).resizable({
				autoHide: true,
				containment: 'parent', 
				handles: 'n, e, s, w, se, sw, nw, ne',
				resize: function (e, ui) {	
				
					var s = pb.currentpanel.core.scale;
					var bbox = pb.currentpanel.element.getBoundingClientRect();
					var elebox = this.element.getBoundingClientRect();
					
					var changeWidth = ui.size.width - ui.originalSize.width;
					
					var newWidth = ui.originalSize.width + changeWidth/s;
				 
					var changeHeight = ui.size.height - ui.originalSize.height;
					var newHeight = ui.originalSize.height + changeHeight/s; 
					
					this.element.style.width = newWidth+'px';
					this.element.style.height = newHeight+'px';
					
					var oldtop = this.element.style.top;
	
					if (ui.handle == 'w' || ui.handle == 'nw' || ui.handle == 'sw'){
						//console.log('nw');
						this.element.style.left = ((pb.mouse.x - bbox.left)/s) + 'px';
					}
					if (ui.handle == 'n' || ui.handle == 'nw' || ui.handle == 'ne'){
						//console.log('ne');
						this.element.style.top = ((pb.mouse.y - bbox.top)/s) + 'px';
					}
					
					var elebox = this.element.getBoundingClientRect();
					if (pb.snap_to_panel && elebox.right >= bbox.right)
						this.element.style.width = newWidth - ((elebox.right - bbox.right)/s) + 'px';
					if (pb.snap_to_panel && elebox.bottom >= bbox.bottom)
						this.element.style.height = newHeight - ((elebox.bottom - bbox.bottom)/s) + 'px';
					if (pb.snap_to_panel && elebox.top <= bbox.top){
						if (this._lastsizey) this.element.style.height = this._lastsizey;
						this.element.style.top = '0px';
					}
					if (pb.snap_to_panel && elebox.left <= bbox.left){
						if (this._lastsizex) this.element.style.width = this._lastsizex;
						this.element.style.left = '0px';
					}
				
					var theight = ($(this.element).outerHeight()/2)
						- ($(this.textnode).outerHeight()/2);
					$(this.textnode).css('top', theight + 'px');
					
					this._lastsizex = this.element.style.width;
					this._lastsizey = this.element.style.height;
					this._lastleft = this.element.style.left;
					this._lasttop = this.element.style.top;
					
					this.core.actualwidth = parseInt(this.element.style.width);
					this.core.actualheight = parseInt(this.element.style.height);
					
					if ($('.first').exists()){
						$('#item-width-input').val(pb.getItem($('.first')[0].id).core.actualwidth);
						$('#item-height-input').val(pb.getItem($('.first')[0].id).core.actualheight);
					}
					
				}.bind(this),
				start: function(e, ui) {
					this.action = new Action({
						type: 'size',
						items: [this],
						oldvalues: [{width: this.element.style.width, height: this.element.style.height}]
					});
				}.bind(this),
				stop: function(e, ui) {
					this.action.newvalues = [{width: this.element.style.width, height: this.element.style.height}];
					pb.saveaction(this.action);
				}.bind(this)
			}); 
			
		}
	}
//**************  END BUTTON  ****************//