$(document).ready(function() {	

				var i;

				var sID;
				var DraggingSide;
				var aFromObjectRangeString = [];
				var aFromObjectRangeValue = [];
				var aToObjectRangeString = [];
				var aToObjectRangeValue = [];
				
				var CurrentValuesFrom = [];
				var CurrentValuesTo = [];
				
				var AantPercent;
				var CurrentPercent;
				var PlusPercent;
				
				// Alle standaard select form velden uitzetten indien hiervoor de speciale DualSelectBar in de plaats staat.
				$('.NoDualSelectBar').hide();
				$('.OnDualSelectBar').show();
				
				$('.DualSelectBar').each(function() { 
				
					sID =  $(this).attr('id');
					CurrentValuesFrom[sID] = $('select#'+sID+'.From').val();
					CurrentValuesTo[sID] = $('select#'+sID+'.To').val();
					
					// Alle values uit het gewone form veld halen en overhevelen in een array
					aFromObjectRangeValue = [];
					aToObjectRangeValue = [];

					$('select#'+sID+'.From > option').each(function() { aFromObjectRangeValue.push( $(this).html() ); });
					
					$('select#'+sID+'.To > option').each(function() { aToObjectRangeValue.push( $(this).html() ); });

					var AantPixel =  ( parseFloat( $(this).css('width') ) - 28 ) / (aFromObjectRangeValue.length - 1) ;
 
					for(i=0; i < (aFromObjectRangeValue.length - 1) ; i++) {
						if(Math.floor(272 / 30) < (aFromObjectRangeValue.length - 1)) {
							
							if(Boolean (i % 2)) {
								$(this).append('<div class="Range" style="margin: 0 0 0 '+ (AantPixel * i) +'px"><div id="Stripe"> <span> '+ aFromObjectRangeValue[i] +' </span></div></div>');
							}						
						}
					}
				
				});
				
	
				$('.Bullet').mousedown(function(e) {
	
					DraggingSide =  $(this).attr('id');
					sID =  $(this).parent('.DualSelectBar').attr('id');
					
					// Nice visual touch
					$('div#'+sID+' > div#'+DraggingSide).css( { backgroundPosition: "0 -14px" } );
					
					// Alle values uit het gewone form veld halen en overhevelen in een array
					aFromObjectRangeString = [];
					aFromObjectRangeValue = [];
					aToObjectRangeString = [];
					aToObjectRangeValue = [];

					$('select#'+sID+'.From > option').each(function() {

							aFromObjectRangeString.push( $(this).html() );
							aFromObjectRangeValue.push( $(this).attr('value') );
					});
					
					$('select#'+sID+'.To > option').each(function() {
						
							aToObjectRangeString.push( $(this).html() );
							aToObjectRangeValue.push( $(this).attr('value') );
					});
	
					$('select#'+sID).hide();
	
					$('html').bind('mousemove', DualSelectBarDrag);
								
					return false;
				});		
				$('html').mouseup(function(e) {
					
					$('select#'+sID+'.From').val(CurrentValuesFrom[sID]);
					$('select#'+sID+'.To').val(CurrentValuesTo[sID]);					
					
					$('html').unbind('mousemove', DualSelectBarDrag);						   
				});
				
				function DualSelectBarDrag(e) {
					
					
					$('div#'+sID+' > div#'+DraggingSide).css( { 'marginLeft' :  e.pageX - $('div#'+sID).offset().left - 7 } );	
											
					if( $('#'+sID+' > #From').offset().left < $('div#'+sID).offset().left ) {
						
						$('#'+sID+' > #'+DraggingSide).css( { 'marginLeft' :  0 } );
					}
					
					if( $('#'+sID+' > #To').offset().left > $('div#'+sID).offset().left + parseFloat( $('div#'+sID).css('width') ) - 14 ) {
						
						$('#'+sID+' > #To').css( { 'marginLeft' : parseFloat( $('div#'+sID).css('width') ) - 14 } );
					}
											
					if( $('#'+sID+' > #To').offset().left - 14 < $('#'+sID+' > #From').offset().left) {
						
						if(DraggingSide == 'From') {
							$('div#'+sID+' > div#From').css( { 'marginLeft' :  e.pageX - $('div#'+sID).offset().left - 7 } );	
							$('div#'+sID+' > div#To').css( { 'marginLeft' :  e.pageX - $('div#'+sID).offset().left + 7 } );
							
							if( $('#'+sID+' > div#To').offset().left > $('div#'+sID).offset().left + parseFloat( $('div#'+sID).css('width') ) - 14 ) {
								
								$('div#'+sID+' > div#From').css( { 'marginLeft' :  parseFloat( $('div#'+sID).css('width') ) - 28 } );
								$('div#'+sID+' > div#To').css( { 'marginLeft' :   parseFloat( $('div#'+sID).css('width') ) - 14 } );
							}
							
						} else if(DraggingSide == 'To') {
							$('div#'+sID+' > div#To').css( { 'marginLeft' :  e.pageX - $('div#'+sID).offset().left - 7 } );	
							$('div#'+sID+' > div#From').css( { 'marginLeft' :  e.pageX - $('div#'+sID).offset().left - 21 } );
							
							if( $('div#'+sID+' > div#From').offset().left < $('div#'+sID).offset().left ) {
								
								$('div#'+sID+' > div#From').css( { 'marginLeft' : 0 } );
								$('div#'+sID+' > div#To').css( { 'marginLeft' :  14 } );
							}
						}
						
					}
			
					$('div#'+sID+' > .Line').css({ 
											  	'marginLeft' :  2, 
												'marginLeft' : $('#'+sID+' > div#From').offset().left - $('div#'+sID).offset().left ,
												'width' : $('#'+sID+' > div#To').offset().left - $('div#'+sID+' > div#From').offset().left
														
											
					});
					
					PlusPercent = 0;

					AantPercent = 100 / ( aFromObjectRangeValue.length - 1);
					CurrentPercent = 100 / (parseFloat( $('div#'+sID).css('width')) - 14) * ( $('div#'+sID+' > div#From').offset().left - $('div#'+sID).offset().left );
					
					for (i=0;i<=aFromObjectRangeValue.length - 1;i++) {
						if(	CurrentPercent <= PlusPercent ) {
							$('div#'+sID+' > .Bullet > span.From').html(aFromObjectRangeString[i]);
							
							CurrentValuesFrom[sID] = aFromObjectRangeValue[i];
										
							break;
						} else {
							PlusPercent = PlusPercent + AantPercent;
						}
					}
					
					PlusPercent = 0;

					AantPercent = 100 / ( aToObjectRangeValue.length - 1);
					CurrentPercent = 100 / ( parseFloat( $('div#'+sID).css('width')) - 14) * ( $('div#'+sID+' > div#To').offset().left - $('div#'+sID).offset().left - 14 );

					for (i=0;i<=aToObjectRangeValue.length - 1;i++) {
						if(	CurrentPercent <= Math.floor(PlusPercent)) {
							$('div#'+sID+' > .Bullet > span.To').html(aToObjectRangeString[i]);
							
							CurrentValuesTo[sID] = aToObjectRangeValue[i];
							break;
						} else {
							PlusPercent = PlusPercent + AantPercent;
						}
					}
			
					
					return false;
					
				}
			});