add IPv4 Decimal to Binary conversion

Author: ibrahimmoalim

problemSolvingPractices/problems/p3-BinaryConversion/index.html

@@ -17,5 +17,15 @@ <h3> Convert an IPv4 address from Binary to Decimal </h3><br>
   <br><br>
   <h4 id="result"></h4>
 
+  <br><br><br><br>
+
+  <h3> Convert an IPv4 address from Decimal to Binary </h3><br>
+  <!-- <h3> Example: 10101100.00010000.00100010.00000011(Binary) to 172.16.34.3 </h3><br> -->
+
+  <input type="text" placeholder="Example: 172.16.34.3" id="input2">
+  <button id="but2">Convert</button>
+  <br><br>
+  <h4 id="result2"></h4>
+
 </body>
 </html>

problemSolvingPractices/problems/p3-BinaryConversion/p3-BinaryConversion.js

@@ -22,9 +22,35 @@ Binary.addEventListener('keydown', (event) => {
 })
 
 
+const Decimal = document.getElementById('input2')
+const ConvertButtonTwo = document.getElementById('but2')
+
+ConvertButtonTwo.addEventListener('click', () => {
+  // .trim() gets rid of spaces at start or end of string
+  const result = DeicmalToBinary(Decimal.value.trim())
+
+  document.getElementById('result2').innerText = result
+})
+
+Decimal.addEventListener('keydown', (event) => {
+  if (event.key === 'Enter') {
+
+    const result = DeicmalToBinary(Decimal.value.trim())
+
+    document.getElementById('result2').innerText = result
+    // Decimal.value = ''
+
+  }
+})
+
+
 
 const errorMsg1 = 'Please insert an IPv4 address in Binary (4 bytes)'
 const errorMsg2 = 'Please make sure the input format is correct and each Octet is exactly 8 numbers'
+const errorMsg3 = 'Please insert an IPv4 address in Decimal (4 bytes)'
+const errorMsg4 = 'Please make sure the input format is correct'
+const errorMsg5 = 'Please make sure the input format is correct and each Octet is correct length'
+const errorMsg6 = 'Please make sure the input format is correct and each Octet is in 0-255 range'
 
 function BinaryToDecimal(Binary){
 
@@ -84,4 +110,93 @@ function BinaryToDecimal(Binary){
 
   return `Result: ${firstOctetDecimal}.${secondOctetDecimal}.${thirdOctetDecimal}.${fourthOctetDecimal}`
 
+}
+
+function DeicmalToBinary(Decimal){
+
+  if (!Decimal) return errorMsg3
+  if (Decimal.length > 15 || Decimal.length < 7) return errorMsg4;
+
+  const chart = [128,64,32,16,8,4,2,1]
+
+  const octets = Decimal.split('.')
+
+  if (octets[0].length > 3 || octets[0].length < 1) return errorMsg5
+  if (octets[1].length > 3 || octets[1].length < 1) return errorMsg5
+  if (octets[2].length > 3 || octets[2].length < 1) return errorMsg5
+  if (octets[3].length > 3 || octets[3].length < 1) return errorMsg5
+
+
+
+  let temp = 0
+
+
+  let firstOctet = ''
+  let secondOctet = ''
+  let thirdOctet = ''
+  let fourthOctet= ''
+
+  // if octetOne from input includes anyhting thats not a number (like 'h')
+  // we make octetOne be more that 3 digits (4444) which would return errorMsg6
+  let octetOne = Number(octets[0]) ? Number(octets[0]) : 4444
+  if (octetOne < 0 || octetOne > 255) return errorMsg6
+
+  for (let i=0; i < chart.length; i++) {
+
+    if (octetOne >= chart[i]) {
+      temp = octetOne - chart[i]
+      firstOctet += 1
+      octetOne = temp
+    } else {
+      firstOctet +=0
+    }
+  }  
+
+  let octetTwo = Number(octets[1]) ? Number(octets[1]) : 4444
+  if (octetTwo < 0 || octetTwo > 255) return errorMsg6
+
+  for (let i=0; i < chart.length; i++) {
+
+    if (octetTwo >= chart[i]) {
+      temp = octetTwo - chart[i]
+      secondOctet += 1
+      octetTwo = temp
+    } else {
+      secondOctet +=0
+    }
+
+  }
+
+  let octetThree = Number(octets[2]) ? Number(octets[2]) : 4444
+  if (octetThree < 0 || octetThree > 255) return errorMsg6
+
+  for (let i=0; i < chart.length; i++) {
+
+    if (octetThree >= chart[i]) {
+      temp = octetThree - chart[i]
+      thirdOctet += 1
+      octetThree = temp
+    } else {
+      thirdOctet +=0
+    }
+
+  }
+
+  let octetFour = Number(octets[3]) ? Number(octets[3]) : 4444
+  if (octetFour < 0 || octetFour > 255) return errorMsg6
+
+  for (let i=0; i < chart.length; i++) {
+
+    if (octetFour >= chart[i]) {
+      temp = octetFour - chart[i]
+      fourthOctet += 1
+      octetFour = temp
+    } else {
+      fourthOctet +=0
+    }
+
+  }
+
+  return `Result: ${firstOctet}.${secondOctet}.${thirdOctet}.${fourthOctet}`
+
 }