
function hslider2(){	
	
	var twidget = new Widget({
		style: 'margin: 4px; float: left; width: 80px; height: 80px; position: relative;\
			display: block; z-index: 1000000;', 
		className: 'draggable cloneable noselect',
		set: 'hslider2',
		id: 'Default-Widget-3',
		init: function(){
			
			var self = this; this.value = 50;
			
			if (activepanel){
				$(this.element).css({'pointer-events': 'none'});
				$(this.parts[0].element).css({'pointer-events': 'auto'});
				$(this.parts[3].element).css({'pointer-events': 'auto'});
				this.doubleclick = noop;
				this.click = noop;
				this.clickup = noop;
				this.set = function(nval){
					self.parts[0].set(nval);
				}
				this.get = function(){
					return self.parts[0].get();
				}
				this.offset = function(inc){
					self.parts[0].set(self.parts[0].get() + inc);
				}
				this.ontopanel();
				$(this.parts[0].element).click();
			}
			this.attachLineoutVolume = function(ip, port, type){
				if (typeof ip === 'object'){
					var port = ip.port;
					var ip = ip._ip;
				}
				this.attachType = 'lineout';
				if (undef(port)) var port = 50001;
				this.unit_ip = ip;
				this.unit_port = port;
				if (undef(type)){
					this.click = function(self){
						if (!activepanel) return; self.myTCP = tcpopen(self.unit_ip, self.unit_port);
					}
					this.sliding = function(self){
						if (!activepanel) return; self.myTCP.send('lovol:'+self.value+'\r');
					}
					this.clickup = function(self){
						if (!activepanel) return; self.myTCP.destroy();
					}
				}
			}
			this.attachHeadphoneVolume = function(ip, port, type){
				if (typeof ip === 'object'){
					var port = ip.port;
					var ip = ip._ip;
				}
				this.attachType = 'headphones';
				if (undef(port)) var port = 50001;
				this.unit_ip = ip;
				this.unit_port = port;
				if (undef(type)){
					this.click = function(self){
						if (!activepanel) return; self.myTCP = tcpopen(self.unit_ip, self.unit_port);
					}
					this.sliding = function(self){
						if (!activepanel) return; self.myTCP.send('hpvol:'+self.value+'\r');
					}
					this.clickup = function(self){
						if (!activepanel) return; self.myTCP.destroy();
					}
				}
			}
			this.attachGeneric = function(ip, port, command){
				if (typeof ip === 'object'){
					var port = ip.port;
					var ip = ip._ip;
				}
				this.attachType = 'generic';
				if (undef(port)) var port = 50001;
				this.unit_ip = ip;
				this.unit_port = port;
				this.unit_command = command;
				this.click = function(self){
					if (!activepanel) return;
					self.myTCP = tcpopen(self.unit_ip, self.unit_port);
				}
				this.sliding = function(self){
					if (!activepanel || !self.myTCP) return;
					if (self.replaceType == 'ascii') var ncommand = self.unit_command.replaceAll('<replace>', self.value);
					else var ncommand = self.unit_command.replaceAll('<replace>', self.hexvalue);
					if (millitime() % self.core.send_frequency == 0) self.myTCP.send(asciiToHex(ncommand), function(data){console.log(data)});
				}
				this.clickup = function(self){
					if (!activepanel || !self.myTCP) return;
					if (self.replaceType == 'ascii') var ncommand = self.unit_command.replaceAll('<replace>', self.value);
					else var ncommand = self.unit_command.replaceAll('<replace>', self.hexvalue);
					self.myTCP.send(asciiToHex(ncommand), function(data){console.log(data)});
					self.myTCP.destroy();
					self.myTCP = false;
				}
			}
			
		},
		ontopanel: function(){
			this.value = this.core.minval + ((this.core.maxval - this.core.minval)/2);
			if (activepanel){
				
				this.doubleclick = noop;
				
				if (this.core.module && this.core.modulefunction && this.core.moduletype){
					
					this.sliding = function(self, override){
						if (!override) if (millitime() % self.core.send_frequency !== 0) return;
						if (this.core.moduletype == 'module'){
							if (self.replaceType == 'ascii') Sandbox.globalvars[this.core.module][this.core.modulefunction](this.value);
							else Sandbox.globalvars[this.core.module][this.core.modulefunction](this.hexvalue);
						}
						if (this.core.moduletype == 'serial'){
							if (self.replaceType == 'ascii') Sandbox.globalvars[this.core.module].serial_interface[this.core.modulefunction](this.value);
							else Sandbox.globalvars[this.core.module].serial_interface[this.core.modulefunction](this.hexvalue);
						}
						if (this.core.moduletype == 'ir'){
							if (self.replaceType == 'ascii') Sandbox.globalvars[this.core.module].ir_interface[this.core.modulefunction](this.value);
							else Sandbox.globalvars[this.core.module].ir_interface[this.core.modulefunction](this.hexvalue);
						}
					}
					
				}
				
			}
			else {
				
				if (!this.dropped){
					this.element.style.height = '20px';
					this.parts[0].element.style.width = '20%';
					this.parts[0].element.style.height = '90%';
					this.parts[0].element.style.top = '5%';
					this.parts[0].element.style.left = '40%';
					this.parts[1].element.style.height = '100%';
					this.parts[1].element.style.top = '0%';
					this.parts[2].element.style.height = '100%';
					this.parts[2].element.style.top = '0%';
					this.element.style.top = (parseFloat(this.element.style.top)+30) + 'px';
					for (var k=0;k<this.parts.length;k++){
						
						if (this.parts[k].resize) this.parts[k].resize();
					}
					this.dropped = true;
				}
				
				this.doubleclick = function(){
					pb.openDialog({
						title: '<span style="font-size: 21px;">Widget Properties:</span>',
						content: '\
							<fieldset style="margin-left: 15px; margin-right: 15px;">\
								<legend>Styling</legend>\
								Slider Handle image: <input id="widget_vslider_handle"\
									style="width: 84px;" type="file" /><br><br>\
								Slider Slide image: <input id="widget_vslider_slide"\
									style="width: 84px;" type="file" /><br><br>\
								Slider Background image: <input id="widget_vslider_bg"\
									style="width: 84px;" type="file" /><br><br>\
								Slider Min-Max values: <input id="widget_vslider_minval" size="6" type="text"/>\
									<input id="widget_vslider_maxval" size="6" type="text"/>\
							</fieldset><br>\
							<fieldset style="margin-left: 15px; margin-right: 15px;">\
								<legend>Assign to Module</legend>\
								<br>Module Variable: <input id="textbox_module" type="textbox" style=""></input> <span style="cursor: pointer;" title="This is the name of the module variable you declared in your setup script.">(help?)</span><br><br>\
								Function Name: <input id="textbox_module_function" type="textbox" style="" value=""></input> <span style="cursor: pointer;" title="This is the name of the function in the module you want to use on this slider.">(help?)</span><br><br>\
								<form id="widget_moduletype_form" style="display: inline; text-align: center;">\
									Function Type:<br><input id="radio_module" type="radio" name="moduletype" value="module" style="" checked="checked">\
									</input> Module <input id="radio_serial" type="radio" name="moduletype" value="serial" style="">\
									</input> Serial Interface <input id="radio_ir" type="radio" name="moduletype" value="ir" style="">\
									</input> IR Interface\
								</form>\
								<!--<legend>Assign to Unit</legend>\
								IP address: <input id="textbox_ip" type="textbox" style=""></input><br><br>\
								Port: <input id="textbox_port" type="textbox" style="" value="50001"></input><br><br>\
								<form id="widget_type_form" style="display: inline;">\
									Type: <input id="radio_lineout" type="radio" name="type" value="lineout" style="" checked="checked">\
									</input> Lineout <input id="radio_headphones" type="radio" name="type" value="headphones" style="">\
									</input> Headphones <input id="radio_generic" type="radio" name="type" value="generic" style="">\
									</input> Generic\
								</form>\
								<div id="generic_command" style="display: none;"><br><br>\
									Generic Command: <input id="generic_command_input" type="textbox" style="" value="lovol:VALUE_REPLACE "></input>\
									<br><br>--><!--<form id="widget_replace_type_form" style="display: inline;">\
										Replacement Type: <input id="radio_ascii" type="radio" name="type" value="ascii" style="" checked="checked">\
										</input> ASCII <input id="radio_hex" type="radio" name="type" value="headphones" style="">\
										</input> Hex\
									</form><br><br>--><!--\
								</div>-->\
							</fieldset>',
						style: {
							width: '500px', 
							height: '460px', 
							background: 'black',
							color: 'rgb(238, 238, 238)',
							margin: '15px',
							padding: '15px',
							'border-radius': '15px'
						},
						init: function(){
							var fileInput = document.getElementById('widget_vslider_bg');
							fileInput.addEventListener('change', function(e){
								var file = fileInput.files[0];
								if (pb.project && pb.project.core && pb.project.core.puid) var puid = pb.project.core.puid; else var puid = false; 
								sendFile(file, {command: 'image', puid: puid}, function(opts){
									pb.tempvar1 = opts.filename;
								});
							});
							var fileInput2 = document.getElementById('widget_vslider_handle');
							fileInput2.addEventListener('change', function(e){
								var file = fileInput2.files[0];
								if (pb.project && pb.project.core && pb.project.core.puid) var puid = pb.project.core.puid; else var puid = false; 
								sendFile(file, {command: 'image', puid: puid}, function(opts){
									pb.tempvar2 = opts.filename;
								});
							});
							var fileInput3 = document.getElementById('widget_vslider_slide');
							fileInput3.addEventListener('change', function(e){
								var file = fileInput3.files[0];
								if (pb.project && pb.project.core && pb.project.core.puid) var puid = pb.project.core.puid; else var puid = false; 
								sendFile(file, {command: 'image', puid: puid}, function(opts){
									pb.tempvar3 = opts.filename;
								});
							});
							$('#widget_vslider_minval').val(this.core.minval);
							$('#widget_vslider_maxval').val(this.core.maxval);
							
							if (this.core.moduletype){
								switch (this.core.moduletype){
									case 'module':
										$('#radio_module').prop('checked', true);
										$('#radio_module')[0].onchange();
										break;
									case 'serial':
										$('#radio_serial').prop('checked', true);
										$('#radio_serial')[0].onchange();
										break;
									case 'ir':
										$('#radio_ir').prop('checked', true);
										$('#radio_ir')[0].onchange();
										break;
								}
							}
							
							if (this.replaceType){
								switch (this.replaceType){
									case 'ascii':
										$('#radio_ascii').prop('checked', true);
										$('#radio_ascii')[0].onchange();
										break;
									case 'hex':
										$('#radio_hex').prop('checked', true);
										$('#radio_hex')[0].onchange();
										break;
								}
							}
							
							if (this.core.module) $('#textbox_module').val(this.core.module);
							if (this.core.modulefunction) $('#textbox_module_function').val(this.core.modulefunction);
							
						}.bind(this),
						onConfirm: function(){
							
							if (Number($('#widget_vslider_maxval').val()) < Number($('#widget_vslider_minval').val())){
								alert('Minimum must be less than maximum');
								return;
							}
							this.core.minval = Number($('#widget_vslider_minval').val());
							this.core.maxval = Number($('#widget_vslider_maxval').val());
							
							this.value = this.core.minval + ((this.core.maxval - this.core.minval)/2);
							
							if (pb.tempvar1) pb.getItemById($('.outlined')[0].id).parts[1].element.lastChild.setAttribute('src', pb.tempvar1);
							if (pb.tempvar2) pb.getItemById($('.outlined')[0].id).parts[0].element.lastChild.setAttribute('src', pb.tempvar2);
							if (pb.tempvar3) pb.getItemById($('.outlined')[0].id).parts[2].element.lastChild.setAttribute('src', pb.tempvar3);
							
							pb.tempvar1 = false; pb.tempvar2 = false; pb.tempvar3 = false;
							
							this.core.module = $('#textbox_module').val();
							this.core.modulefunction = $('#textbox_module_function').val();
							this.core.moduletype = $('#widget_moduletype_form input[name="moduletype"]:checked').val();
							
							pb.closeDialog();
							
						}.bind(this),
						onCancel: function(){
							pb.tempvar1 = false; pb.tempvar2 = false;
							pb.closeDialog();
						}
					});
				}
			}
		}
	});

	twidget.core.minval = 0;
	twidget.core.maxval = 100;
	
	twidget.core.send_frequency = 5;
	twidget.core.module = false;
	twidget.core.modulefunction = false;
	
	twidget.funclist = ['click', 'sliding', 'clickup'];
	
	var tpart = new WidgetPart({
		widget: twidget,
		style: 'position: absolute; z-index: 1000001; left: 41%; top: 41%; height: 18%; width: 18%; cursor: pointer;',
		className: 'movable item_child',
		elementHTML: '<img class="item_child" src="images/widgets/slidercirc3.png"\
			style="width: 100%; height: 100%;" />',
		click: function(){
			this.widget.click(this.widget);
		},
		clickup: function(){
			this.widget.clickup(this.widget);
		},
		moving: function(event){

			event.preventDefault();
			
			if (undef(this.core.downoffset)) this.core.downoffset = 0;
			var newpos = (pb.mouse.vectortodown.x) + this.core.downoffset;
			var distance = ($(this.widget.element).outerWidth()*0.77)/2;
			if (newpos < -distance) newpos = -distance;
			if (newpos > distance) newpos = distance;
			$(this.element).css({'margin-left': newpos + 'px'});
			
			var tw = parseFloat(this.widget.element.style.width);
			tw = (tw*0.77); 
			
			var tval = parseFloat(this.element.style.marginLeft);
			var fval = ((tval + (tw/2))/tw);
			
			var scaleval = this.widget.core.maxval - this.widget.core.minval;
			var scaledval = fval * scaleval;
			scaledval += this.widget.core.minval;
			scaledval = parseFloat(Math.round(scaledval));
			
			this.widget.value = scaledval;
			this.widget.hexvalue = this.widget.value.toString(16);
			
			if (this.widget.realtime){
				evalJavascript(this.widget.core.scripts[0], this.widget);
			}
			
			if (this.widget.sliding) this.widget.sliding(this.widget);
			
			var nscaleval = 100;
			var nscaledval = fval * nscaleval;
			nscaledval = parseFloat(Math.round(nscaledval));
			this.widget.parts[2].element.style.width = (((nscaledval) * 0.77) + 11.5) + '%';
			
		},
		drop: function(){

			var tw = parseFloat(this.widget.element.style.width);
			tw = (tw * 0.77); 
			
			var tval = parseFloat(this.element.style.marginLeft);
			var fval = ((tval + (tw/2))/tw);
			
			var scaleval = this.widget.core.maxval - this.widget.core.minval;
			var scaledval = fval * scaleval;
			scaledval += this.widget.core.minval;
			scaledval = Math.round(scaledval);
			
			this.widget.value = scaledval;
			this.widget.hexvalue = this.widget.value.toString(16);
			
			if (this.widget.core.scripts[0] !== '')
				evalJavascript(this.widget.core.scripts[0], this.widget);
				
			this.core.downoffset = parseFloat($(this.element).css('margin-left'));
			
			if (this.widget.sliding) this.widget.sliding(this.widget, true);
			if (this.widget.clickup) this.widget.clickup(this.widget);
		
		}
	});
	tpart.set = function(nval){
	
		var scale = this.widget.core.maxval - this.widget.core.minval;
		nval /= scale;
		
		//nval = 1.0 - nval;
		if (undef(this.core.downoffset)) this.core.downoffset = 0;
		var newpos = (nval-0.5)*$(this.widget.element).outerWidth()*0.77;
		var distance = ($(this.widget.element).outerWidth()*0.77)/2;
		if (newpos < -distance) newpos = -distance;
		if (newpos > distance) newpos = distance;
		$(this.element).css({'margin-left': newpos + 'px'});
		
		var tw = parseFloat(this.widget.element.style.width);
		tw = (tw*0.77); 
		
		var tval = parseFloat(this.element.style.marginLeft);
		var fval = ((tval + (tw/2))/tw);
		
		var scaleval = this.widget.core.maxval - this.widget.core.minval;
		var scaledval = fval * scaleval;
		scaledval += this.widget.core.minval;
		scaledval = parseFloat(Math.round(scaledval));
		
		this.widget.value = this.widget.core.maxval - (scaledval - this.widget.core.minval);
		this.widget.hexvalue = this.widget.value.toString(16);
		
		if (this.widget.realtime){
			evalJavascript(this.widget.core.scripts[0], this.widget);
		}
		
		this.core.downoffset = parseFloat($(this.element).css('margin-left'));
		
		if (this.widget.click) this.widget.click(this.widget);
		if (this.widget.sliding) this.widget.sliding(this.widget);
		if (this.widget.clickup) this.widget.clickup(this.widget);
		
		var nscaleval = 100;
		var nscaledval = fval * nscaleval;
		nscaledval = parseFloat(Math.round(nscaledval));
		this.widget.parts[2].element.style.width = (((nscaledval) * 0.77) + 11.5) + '%';
		
	}
	tpart.get = function(){
		if (!this.element.style.marginLeft) this.element.style.marginLeft = '0px';
		var result = 0.5 + parseFloat(this.element.style.marginLeft)/($(this.widget.element).outerWidth()*0.77);
		var scaleval = this.widget.core.maxval - this.widget.core.minval;
		result = result * scaleval;
		return result;
	}
	tpart.core.downoffset = 0;
	twidget.addPart(tpart);
	
	var tpart = new WidgetPart({
		widget: twidget, 
		style: 'position: absolute; z-index: 999999; left: 0; top: 39%; height: 22%; width: 100%;', 
		className: 'item_child',
		elementHTML: '<img class="item_child" src="images/widgets/hsliderback2.png"\
			style="width: 100%; height: 100%;" />',
	});
	twidget.addPart(tpart);
	
	var tpart = new WidgetPart({
		widget: twidget, 
		style: 'position: absolute; z-index: 1000000; left: 0; top: 39%; height: 22%; width: 50%; overflow: hidden;', 
		className: 'item_child',
		elementHTML: '<img class="item_child" src="images/widgets/hsliderglow.png"\
			style="position: absolute; left: 0; bottom: 0; height: 100%; width: 100%;" />'
	});
	tpart.resize = function(){
		this.element.children[0].style.width = $(this.widget.element).width() + 'px';
	}
	twidget.addPart(tpart);
	
	var tpart = new WidgetPart({
		widget: twidget, 
		style: 'position: absolute; z-index: 999998; left: 4%; top: 43%; height: 14%; width: 91%;', 
		className: 'item_child',
		elementHTML: '',
	});
	twidget.addPart(tpart);
	
	return twidget;
	
}