<commit_before><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>Simple Hash</title>
  <link href="../opendsaAV.css" title="CSS" rel="stylesheet" type="text/css" />
  <link rel="stylesheet" href="../../JSAV/css/JSAV.css" type="text/css" />
<style>

#container {
  width: 790px;
  height: 465px;
  border: 1px solid black;
  background-color: #efe;
  padding: 10px;
  overflow: hidden;
}

#bottom {
  width: 810px;
  height: 90px;
  border: 1px solid black;
  background-color: #ddd;
  
  overflow: hidden;
}

title {
	text-align: center;
}

div h1 {
  background-color: #efe;
  margin: 5px;
}

.jsavcontainer {
  background-color: #efe;
  border: none;
}

.jsavarray {
   padding-left:0;
   text-align: center;
   position: absolute;
   left: 350px;
}

p.jsavoutput.jsavline {
  height: 30px;
  margin: 0;
}

#about {
  float: right;
}

a.jsavsettings {
  display: block;
  margin-top: 10px;
  margin-left: 10px;
}

form {
  clear: both;
}

</style>
</head>

<body>

	<!-- Main Container -->
	<div id="container">
		<p class="jsavoutput jsavscroll" readonly="readonly" style="width:225px; height:400px;  float:left"> </p>
	</div>

	<!-- Bottom Container -->
	<div id="bottom">
	
		<form id="ssperform">
			<p align="left">
			
				<!-- Function Dropdown -->
				<select id="function">
					<option selected value = 0> Choose Hashing Function </option>
					<option value = 1> Simple Mod Hash </option>
					<option value = 2> Binning Hash </option>
				</select>
			
				<!-- Array Size Dropdown -->
				<select id="arraysize">
					<option selected value = 0> Table Size </option>
					<option value = 1> 1 </option>
					<option value = 2> 2 </option>
					<option value = 3> 3 </option>
					<option value = 4> 4 </option>
					<option value = 5> 5 </option>
					<option value = 6> 6 </option>
					<option value = 7> 7 </option>
					<option value = 8> 8 </option>
					<option value = 9> 9 </option>
					<option value = 10> 10 </option>
					<option value = 11> 11 </option>
					<option value = 12> 12 </option>
					<option value = 13> 13 </option>
					<option value = 14> 14 </option>
					<option value = 15> 15 </option>
					<option value = 16> 16 </option>
				</select>
				
				<!-- Collision Resolution Dropdown -->
				<select id="collision">
					<option selected value = 0> Collision Resolution Policy </option>
					<option value = 1> Linear Probing </option>
				</select>
				
				<!-- Input Text Field -->
				<label for="input">&nbsp;Input:</label>
				<input size="10" name="input" id="input" type="text" />
				&nbsp;
				
				<!-- Buttons --> 				
				<input type="button" name="next" value="Next" />
				<input type="button" name="reset" value="Restart" />
				<input type="button" name="help" value="Help" />
			</p>
			
			<!-- Second row of controls -->
			<p align="left">
			
			<select id="keyrange">
					<option selected value = 0> Key Range </option>
					<option value = 1> 0 - 999 </option>
					<option value = 2> 1000 - 1999 </option>
				</select>
				</p>
			 
		</form>
		
	</div>


<script
   src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
</script>
<script
  src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js">
</script>
<script src="../../JSAV/lib/jquery.transform.light.js"></script>
<script src="../../JSAV/build/JSAV-min.js"></script>
<script type="text/javascript" src="Queue.js"></script>

<script>
 
/* The fun starts here  */
(function($) {

  /* Variables */
  var arraySize;					// Table size
  var theArray = [];				// Actual array
  var av;							// JSAV
  var arr;						// JSAV Array
  var fullArray= false;           // Flag that determines whether array is full or not
  var nextStep = new Queue();		/* A queue that will contain the "next step". Stores 
																	position and value of next step as an object */
  // Initialize JSAV object
  av = new JSAV("container");
  av.umsg("Please select a hashing function");
		
  // Connect action callbacks to the HTML entities
  $('input[name="about"]').click(about);
  $('input[name="next"]').click(next);
  $('input[name="reset"]').click(reset);
  		
  // Call reset - the initial state of the vizualization
  reset();
  		
  /* Settings Function */
  // create a new settings panel and specify the link to show it
  var settings = new JSAV.utils.Settings($(".jsavsettings"));
  // add the layout setting preference
  var arrayLayout = settings.add("layout", {"type": "select", "options": {"bar": "Bar", "array": "Array"}, "label":"Array layout: ", "value": "bar"});

  // Process About button: Pop up a message with an Alert
  function about() {
	var mystring = "Hashing  Visualization\nWritten by ...\nCreated as part of the OpenDSA hypertextbook project.\nFor more information, see http://algoviz.org/OpenDSA\nWritten during Spring, 2012\nLast update: January, 2012\nJSAV library version " + JSAV.version();
    alert(mystring);
  }
  
  
  /* Reset Function */
  function reset() {
	  
  	// Clear messages
    if (av) {
      av.clearumsg();
      av.umsg("Please select a hashing function");
    }
      		
    // Hide array if one exists
    if (arr) {
      arr.hide();
    }
      			
   	// Reset & disable dropdowns
    $("#function").val(0);
    $("#arraysize").val(0);
    $("#collision").val(0);
    $('#keyrange').val(0);
    $('#arraysize').attr("disabled", "disabled");
    $('#input').attr("disabled", "disabled");
    $('#collision').attr("disabled", "disabled");
    $('#keyrange').attr("disabled", "disabled");
    		
    // Disable buttons
    $('input[name="next"]').attr("disabled", "disabled");
    		
    // Enable function change dropdown
    $("#function").removeAttr("disabled");
	}
	
	/* Key Presses */
	// Enable Next as soon as the text field has been changed
	$('#input').keypress(function() {
		 $('input[name="next"]').removeAttr("disabled");
	});
	
	// Disable key range as soon as it has been set
	$('#keyrange').change(function() {
		$("#keyrange").attr("disabled", "disabled");
	});
	
	
	// Event trigger change if hashing function option is changed
	$("#function").change(function() {
	    
	  if ($(this).val() == 0) {
	    reset();
	  }
	    		
	  else {
	  
	    // Enable table size
	    $("#arraysize").removeAttr("disabled");
	    		
	    // Disable function change
	    $("#function").attr("disabled", "disabled");
	     	    
	    // Enable Appropriate Controls for each function
	    switch ($(this).val()) {
	    	    	
	    	// Binning
	    	case '2':
	    		// Enable key range
          $("#keyrange").removeAttr("disabled");
          break;
      }
	    
	    /*
	     * THIS IS DETERMINED FROM THE QUERY.
	     * EITHER QUERY SETS IT, OR IT IS FREE TO CHOOSE
	     * FOR NOW, USE LINEAR PROBING
	     */
	    // Choose linear probing resolution policy for now:
	    $("#collision").val(1);
	    
	    /*switch ($(this).val()) {
	      // Linear probing for simple mod
	      case '1':
	    		$("#collision").val(1);
	    		break;
	    }*/
	  }
	});
	
	// Event trigger change if size of hash changes
	$("#arraysize").change(function() {
	    
		// Hide previous array if it exists
	  if (arr) {
			arr.hide();
	  }
		
	  // Draw new array
	  var arraySize = $('#arraysize').val();
	  theArray.length = arraySize;
	  // Initialize JSAV
	  arr = av.ds.array(theArray, {indexed: true, layout: "vertical"});
	  
	  // Enable input field
	  $("#input").removeAttr("disabled");
	});
	
	/* Next button pushed. 
	 * If no slide show exits, make one.
	 * Else, load next slide
	 */
	function next() {
	
		// If no slide exists, create one
		if (nextStep.isEmpty()) {
		
			// Input field value
  		var inputVal = $("#input").val();
    		
  		// Check if input is a valid number
  		if (isNaN(inputVal)) {
  	  	av.umsg("Please enter a valid number");
	  	}
    		
	  	else {
    		
  	  	// Disable input field to process it safely
      	$("#input").attr("disabled", "disabled");
    			
      	// Disable array size drop down to avoid havoc
      	$("#arraysize").attr("disabled", "disabled");    			
    		
      	// Process input with selected function
      	var hashFunction = $("#function").val();
      	switch(hashFunction) {
      		// No function chosen
      		case '0':
          	reset();
          	break;
		  		case '1':
      	  	var ret = simpleMod(inputVal);
          	break;
          case '2':
          	var ret = binning(inputVal);
          	break;
		  	}
		  	
		  	// Show first slide if success
		  	if (ret === 0)
		  		loadNextSlide();
	  	}
		}
		
		// Else, load next slide
		else {
			loadNextSlide();
		}
	}
	
	function loadNextSlide() {
	
		var next = nextStep.dequeue();
		
	  // If activity is insertion
	  if (next.insert) {
	    av.umsg("Inserting " + next.value + " at position " + next.position + ".");
			arr.unhighlight(next.position);
			arr.value(next.position, next.value);
	  }
	  
	  // If activity is only highlighting
	  else {
	    av.umsg("Attempting to insert " + next.value + " at position " + next.position + ".");
			arr.unhighlight(next.position-1);
			arr.highlight(next.position);
	  }
	  
	  // Disable Next Button & re-enable input field if queue is empty
	  if (nextStep.isEmpty()) {
	  	  		  
	  	// If array is full at the end of dequeue, display message
      if (fullArray) {
	    	av.umsg("Array is full. Insertion failed.");
				// Reset flag
				fullArray = false;
	  	}
	  	
	  	$('input[name="next"]').attr("disabled", "disabled");
	  	$("#input").removeAttr("disabled");
	  }
	}
	
	/* Hashing Functions */
	    
	// Simple mod function
	function simpleMod(inputVal) {
	
		// Simple Mod Function
	  var pos = inputVal % theArray.length;	    	
	  
	  // Process function with selected collision resolution
	  determineResolution(inputVal, pos);
	  
	  // Return success
	  return 0;
	}
	
	// Binning Function
	function binning(inputVal) {
		
		var keyrange = $("#keyrange").val();
		
		// Check that a key range has been selected
		if (keyrange == 0) {
			av.umsg("Please select a key range");
			
			// Return error
			return 1;
		}
		
		else {
		
			// Determine key range
			switch(keyrange) {
				case '1':
					keyrange = 1000;
					break;
				case '2':
					keyrange = 2000;
					break;
			}
		
			// Binning function Position
			var binsize = keyrange / $("#arraysize").val()
			var pos =  Math.floor(inputVal / binsize);
		
			// Process function with selected collision resolution
			determineResolution(inputVal, pos);
			
			// Return success
			return 0;
		}
	}
	
	/* Collision Resolutions */
	
	// Function that determines which collision resolution to pick
	function determineResolution(inputVal, pos) {
	
		var collisionResolution = $("#collision").val();
    switch(collisionResolution) {<commit_msg>Changed array index width.<commit_after><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>Hashing Visualization</title>
  <link href="../opendsaAV.css" title="CSS" rel="stylesheet" type="text/css" />
  <link rel="stylesheet" href="../../JSAV/css/JSAV.css" type="text/css" />
<style>

#container {
  width: 790px;
  height: 465px;
  border: 1px solid black;
  background-color: #efe;
  padding: 10px;
  overflow: hidden;
}

#bottom {
  width: 810px;
  height: 90px;
  border: 1px solid black;
  background-color: #ddd;
  
  overflow: hidden;
}

title {
	text-align: center;
}

div h1 {
  background-color: #efe;
  margin: 5px;
}

.jsavcontainer {
  background-color: #efe;
  border: none;
}

.jsavarray {
   padding-left:0;
   text-align: center;
   position: absolute;
   left: 350px;
}

.jsavarray .jsavindex {
	height: 40px;
}

p.jsavoutput.jsavline {
  height: 30px;
  margin: 0;
}

#about {
  float: right;
}

a.jsavsettings {
  display: block;
  margin-top: 10px;
  margin-left: 10px;
}

form {
  clear: both;
}

</style>
</head>

<body>

	<!-- Main Container -->
	<div id="container">
		<p class="jsavoutput jsavscroll" readonly="readonly" style="width:225px; height:400px;  float:left"> </p>
	</div>

	<!-- Bottom Container -->
	<div id="bottom">
	
		<form id="ssperform">
			<p align="left">
			
				<!-- Function Dropdown -->
				<select id="function">
					<option selected value = 0> Choose Hashing Function </option>
					<option value = 1> Simple Mod Hash </option>
					<option value = 2> Binning Hash </option>
				</select>
			
				<!-- Array Size Dropdown -->
				<select id="arraysize">
					<option selected value = 0> Table Size </option>
					<option value = 1> 1 </option>
					<option value = 2> 2 </option>
					<option value = 3> 3 </option>
					<option value = 4> 4 </option>
					<option value = 5> 5 </option>
					<option value = 6> 6 </option>
					<option value = 7> 7 </option>
					<option value = 8> 8 </option>
					<option value = 9> 9 </option>
					<option value = 10> 10 </option>
					<option value = 11> 11 </option>
					<option value = 12> 12 </option>
					<option value = 13> 13 </option>
					<option value = 14> 14 </option>
					<option value = 15> 15 </option>
					<option value = 16> 16 </option>
				</select>
				
				<!-- Collision Resolution Dropdown -->
				<select id="collision">
					<option selected value = 0> Collision Resolution Policy </option>
					<option value = 1> Linear Probing </option>
				</select>
				
				<!-- Input Text Field -->
				<label for="input">&nbsp;Input:</label>
				<input size="10" name="input" id="input" type="text" />
				&nbsp;
				
				<!-- Buttons --> 				
				<input type="button" name="next" value="Next" />
				<input type="button" name="reset" value="Restart" />
				<input type="button" name="help" value="Help" />
			</p>
			
			<!-- Second row of controls -->
			<p align="left">
			
			<select id="keyrange">
					<option selected value = 0> Key Range </option>
					<option value = 1> 0 - 999 </option>
					<option value = 2> 1000 - 1999 </option>
				</select>
				</p>
			 
		</form>
		
	</div>


<script
   src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">
</script>
<script
  src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js">
</script>
<script src="../../JSAV/lib/jquery.transform.light.js"></script>
<script src="../../JSAV/build/JSAV-min.js"></script>
<script type="text/javascript" src="Queue.js"></script>

<script>
 
/* The fun starts here  */
(function($) {

  /* Variables */
  var arraySize;					// Table size
  var theArray = [];				// Actual array
  var av;							// JSAV
  var arr;						// JSAV Array
  var fullArray= false;           // Flag that determines whether array is full or not
  var nextStep = new Queue();		/* A queue that will contain the "next step". Stores 
																	position and value of next step as an object */
  // Initialize JSAV object
  av = new JSAV("container");
  av.umsg("Please select a hashing function");
		
  // Connect action callbacks to the HTML entities
  $('input[name="about"]').click(about);
  $('input[name="next"]').click(next);
  $('input[name="reset"]').click(reset);
  		
  // Call reset - the initial state of the vizualization
  reset();
  		
  /* Settings Function */
  // create a new settings panel and specify the link to show it
  var settings = new JSAV.utils.Settings($(".jsavsettings"));
  // add the layout setting preference
  var arrayLayout = settings.add("layout", {"type": "select", "options": {"bar": "Bar", "array": "Array"}, "label":"Array layout: ", "value": "bar"});

  // Process About button: Pop up a message with an Alert
  function about() {
	var mystring = "Hashing  Visualization\nWritten by ...\nCreated as part of the OpenDSA hypertextbook project.\nFor more information, see http://algoviz.org/OpenDSA\nWritten during Spring, 2012\nLast update: January, 2012\nJSAV library version " + JSAV.version();
    alert(mystring);
  }
  
  
  /* Reset Function */
  function reset() {
	  
  	// Clear messages
    if (av) {
      av.clearumsg();
      av.umsg("Please select a hashing function");
    }
      		
    // Hide array if one exists
    if (arr) {
      arr.hide();
    }
      			
   	// Reset & disable dropdowns
    $("#function").val(0);
    $("#arraysize").val(0);
    $("#collision").val(0);
    $('#keyrange').val(0);
    $('#arraysize').attr("disabled", "disabled");
    $('#input').attr("disabled", "disabled");
    $('#collision').attr("disabled", "disabled");
    $('#keyrange').attr("disabled", "disabled");
    		
    // Disable buttons
    $('input[name="next"]').attr("disabled", "disabled");
    		
    // Enable function change dropdown
    $("#function").removeAttr("disabled");
	}
	
	/* Key Presses */
	// Enable Next as soon as the text field has been changed
	$('#input').keypress(function() {
		 $('input[name="next"]').removeAttr("disabled");
	});
	
	// Disable key range as soon as it has been set
	$('#keyrange').change(function() {
		$("#keyrange").attr("disabled", "disabled");
	});
	
	
	// Event trigger change if hashing function option is changed
	$("#function").change(function() {
	    
	  if ($(this).val() == 0) {
	    reset();
	  }
	    		
	  else {
	  
	    // Enable table size
	    $("#arraysize").removeAttr("disabled");
	    		
	    // Disable function change
	    $("#function").attr("disabled", "disabled");
	     	    
	    // Enable Appropriate Controls for each function
	    switch ($(this).val()) {
	    	    	
	    	// Binning
	    	case '2':
	    		// Enable key range
          $("#keyrange").removeAttr("disabled");
          break;
      }
	    
	    /*
	     * THIS IS DETERMINED FROM THE QUERY.
	     * EITHER QUERY SETS IT, OR IT IS FREE TO CHOOSE
	     * FOR NOW, USE LINEAR PROBING
	     */
	    // Choose linear probing resolution policy for now:
	    $("#collision").val(1);
	    
	    /*switch ($(this).val()) {
	      // Linear probing for simple mod
	      case '1':
	    		$("#collision").val(1);
	    		break;
	    }*/
	  }
	});
	
	// Event trigger change if size of hash changes
	$("#arraysize").change(function() {
	    
		// Hide previous array if it exists
	  if (arr) {
			arr.hide();
	  }
		
	  // Draw new array
	  var arraySize = $('#arraysize').val();
	  theArray.length = arraySize;
	  // Initialize JSAV
	  arr = av.ds.array(theArray, {indexed: true, layout: "vertical"});
	  
	  // Enable input field
	  $("#input").removeAttr("disabled");
	});
	
	/* Next button pushed. 
	 * If no slide show exits, make one.
	 * Else, load next slide
	 */
	function next() {
	
		// If no slide exists, create one
		if (nextStep.isEmpty()) {
		
			// Input field value
  		var inputVal = $("#input").val();
    		
  		// Check if input is a valid number
  		if (isNaN(inputVal)) {
  	  	av.umsg("Please enter a valid number");
	  	}
    		
	  	else {
    		
  	  	// Disable input field to process it safely
      	$("#input").attr("disabled", "disabled");
    			
      	// Disable array size drop down to avoid havoc
      	$("#arraysize").attr("disabled", "disabled");    			
    		
      	// Process input with selected function
      	var hashFunction = $("#function").val();
      	switch(hashFunction) {
      		// No function chosen
      		case '0':
          	reset();
          	break;
		  		case '1':
      	  	var ret = simpleMod(inputVal);
          	break;
          case '2':
          	var ret = binning(inputVal);
          	break;
		  	}
		  	
		  	// Show first slide if success
		  	if (ret === 0)
		  		loadNextSlide();
	  	}
		}
		
		// Else, load next slide
		else {
			loadNextSlide();
		}
	}
	
	function loadNextSlide() {
	
		var next = nextStep.dequeue();
		
	  // If activity is insertion
	  if (next.insert) {
	    av.umsg("Inserting " + next.value + " at position " + next.position + ".");
			arr.unhighlight(next.position);
			arr.value(next.position, next.value);
	  }
	  
	  // If activity is only highlighting
	  else {
	    av.umsg("Attempting to insert " + next.value + " at position " + next.position + ".");
			arr.unhighlight(next.position-1);
			arr.highlight(next.position);
	  }
	  
	  // Disable Next Button & re-enable input field if queue is empty
	  if (nextStep.isEmpty()) {
	  	  		  
	  	// If array is full at the end of dequeue, display message
      if (fullArray) {
	    	av.umsg("Array is full. Insertion failed.");
				// Reset flag
				fullArray = false;
	  	}
	  	
	  	$('input[name="next"]').attr("disabled", "disabled");
	  	$("#input").removeAttr("disabled");
	  }
	}
	
	/* Hashing Functions */
	    
	// Simple mod function
	function simpleMod(inputVal) {
	
		// Simple Mod Function
	  var pos = inputVal % theArray.length;	    	
	  
	  // Process function with selected collision resolution
	  determineResolution(inputVal, pos);
	  
	  // Return success
	  return 0;
	}
	
	// Binning Function
	function binning(inputVal) {
		
		var keyrange = $("#keyrange").val();
		
		// Check that a key range has been selected
		if (keyrange == 0) {
			av.umsg("Please select a key range");
			
			// Return error
			return 1;
		}
		
		else {
		
			// Determine key range
			switch(keyrange) {
				case '1':
					keyrange = 1000;
					break;
				case '2':
					keyrange = 2000;
					break;
			}
		
			// Binning function Position
			var binsize = keyrange / $("#arraysize").val()
			var pos =  Math.floor(inputVal / binsize);
		
			// Process function with selected collision resolution
			determineResolution(inputVal, pos);
			
			// Return success
			return 0;
		}
	}
	
	// Mid-Square Method
	function midSquare(inputVal) {
	
		// Square Input Value
		var squaredInput = inputVal * inputVal;
		
		// Convert to binary
		var squaredBinary = squaredInput.toString(2);
		
		// Get middle r bits of the digit
		
		
			
	}
	
	/* Collision Resolutions */
	
	// Function that determines which collision resolution to pick
	function determineResolution(inputVal, pos) {
	
		var collisionResolution = $("#collision").val();
    switch(collisionResolution) {
{'fraction_non_alphanumeric': 0.15885834901115037, 'fraction_numerical': 0.013903547010507961, 'mean_word_length': 2.428346704420324, 'pattern_counts': {'":': 12, '<': 215, '<?xml version=': 0, '>': 215, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3351699', 'n_tokens_mistral': 8257, 'n_tokens_neox': 6922, 'n_words': 1953}