started node removal function

Author: adammehaney

src/pages/index.astro

@@ -24,12 +24,12 @@ import { Icon } from 'astro-icon/components'
 			</InfoPanel>
 			<InfoPanel>
 				<h2><Icon name="material-symbols:arrow-cool-down-rounded" />Removing from a Binary Tree</h2>
-				<form id="insert-form" onsubmit="return false;" method="post" name="myForm">
+				<form id="remove-form" onsubmit="return false;" method="post" name="myForm2">
 					<div>
 						<label for="fname">Value you want to remove</label>
-						<input id="insert-form-input" type="text" name="fname" placeholder="Input any integer that is in the existing tree" required />
+						<input id="remove-form-input" type="text" name="fname" placeholder="Input any integer that is in the existing tree" required />
 					</div>
-					<input class="submit-button" type="submit" value="Insert">
+					<input class="submit-button" type="submit" value="Remove">
 				</form>
 			</InfoPanel>
 			<InfoPanel>

src/typescript/BST.ts

@@ -160,6 +160,25 @@ const canvas = document.getElementById("main-canvas") as HTMLCanvasElement;
 			}
 		}
 	}
+	function deepRight(tree: BinaryTree) {
+		if (tree.getRight()) {
+			return deepRight(tree.getRight())
+		} else {
+			return tree.getRoot()
+		}
+	}
+	function remove(tree: BinaryTree, value: number) {
+		if (tree.getRoot() === value) {
+			tree.setRoot(deepRight(tree));
+		} else {
+			if (tree.getLeft()) {
+				remove(tree.getLeft(), value)
+			}
+			if (tree.getRight()) {
+				remove(tree.getRight(), value)
+			}
+		}
+	}
     function drawTree(ctx: CanvasRenderingContext2D, tree: BinaryTree, canvasWidth: number, scale: number, i=0, rootPosition: any=null) {          
         if (tree) {
             if (rootPosition === null) {
@@ -233,15 +252,25 @@ const canvas = document.getElementById("main-canvas") as HTMLCanvasElement;
 
 			drawTree(ctx, tree, canvas.width, scale);
 
-			var number = document.getElementById('insert-form-input') as HTMLInputElement;
-			var numberForm = document.getElementById('insert-form') as HTMLElement;
+			var insertNumber = document.getElementById('insert-form-input') as HTMLInputElement;
+			var insertNumberForm = document.getElementById('insert-form') as HTMLElement;
+
+			var removeNumber = document.getElementById('remove-form-input') as HTMLInputElement;
+			var removeNumberForm = document.getElementById('remove-form') as HTMLElement;
 
 			// if (numberForm.addEventListener){
 
 			// }
-			numberForm.addEventListener("submit", function (){
-				console.log(number.value);
-				insert(tree, parseInt(number.value))
+			insertNumberForm.addEventListener("submit", function (){
+				console.log(insertNumber.value);
+				insert(tree, parseInt(insertNumber.value))
+				drawTree(ctx, tree, canvas.width, scale);
+				updateTraversals(tree);
+			}, false);
+
+			removeNumberForm.addEventListener("submit", function (){
+				console.log(removeNumber.value);
+				remove(tree, parseInt(removeNumber.value))
 				drawTree(ctx, tree, canvas.width, scale);
 				updateTraversals(tree);
 			}, false);