

function dial2(){	
	
	var twidget = new Widget({
		style: 'margin: 4px; float: left; width: 100px; height: 100px; position: relative; z-index: 1000000;', 
		className: 'draggable cloneable', 
		aspectratio: true, 
		set: 'dial2',
		id: 'Default-Widget-7'
	});
	twidget.draggable = true;
	twidget.value = 0;
	
	var tpart = new WidgetPart({
		widget: twidget, 
		style: 'position: absolute; z-index: 100000; width: 100%; height: 100%;', 
		className: 'item_child movable'
	});
	tpart.element.innerHTML = '<div style="width: 100%; height: 100%; opacity: 1.0;\
		background: url(images/widgets/knob-bg2.png) 0 0; z-index: 10;\
		background-size: 100% 100%; position: absolute; left: 0px; top: 0px;" class="item_child"></div>\
		';
	tpart.responsive = true;
	tpart.element.style.cssText += 'position: absolute; left: 0%; top: 0%;';
	tpart.moving = noop; tpart.drop = noop;
	tpart.click = function(){
		this.down = true;
	}
	tpart.clickup = function(){
		//TweenMax.to($( this.element ), 0.5, {css: {rotation: 0}});
		this.down = false;
	};
	tpart.drop = function(){
		//TweenMax.to($( this.element ), 0.5, {css: {rotation: 0}});
		this.down = false;
	};
	tpart.update = function(){
		if (this.down) {
			var elebox = this.element.getBoundingClientRect();
			var vtocenter = {x: pb.mouse.x - elebox.left - (elebox.right - elebox.left)/2, y: pb.mouse.y - elebox.top - (elebox.bottom - elebox.top)/2};
			var tangle = calcAngle(0, 0, vtocenter.x, vtocenter.y);
			
			if (undef(this.angle)) this.angle = 0;
			
			if (!((this.angle < 0 && tangle > 0 && -this.angle < 135 && tangle < 135) ||
				(this.angle > 0 && tangle < 0 && this.angle < 135 && -tangle < 135))){
				this.angle = tangle;
				TweenMax.to($( this.element ), 0, {css: {rotation: tangle}});
				
				if (tangle<0) tangle = (180 - -tangle) + 180; 
				this.widget.value = (tangle / 360) * 100;
				//console.log(this.widget.value);
			}
		}
	};
	tpart.ontopanel = function(){
		//$( this.widget.element ).resizable( "option", "aspectRatio", true );
	}
	twidget.addPart(tpart);
	
	var tpart = new WidgetPart({
		widget: twidget, 
		style: 'position: absolute; z-index: 99999; width: 100%; height: 100%;', 
		className: 'item-child movable'
	});
	tpart.element.innerHTML = '\
		<div style="width: 100%; height: 100%; opacity: 1.0;\
		background: url(images/widgets/knob-bg-shadow.png) 0 0; z-index: 9;\
		background-size: 100% 100%; position: absolute; left: 0px; top: 0px;" class="item_child"></div>';
	tpart.responsive = true;
	tpart.element.style.cssText += 'position: absolute; left: 0%; top: 0%;';
	tpart.moving = noop; tpart.drop = noop;	
	twidget.addPart(tpart);
	
	return twidget;
}