CC Checker (Credit Card Checker)

by cc_checker_io

HTML

<div class="mx-auto max-w-7xl px-4 py-4 sm:px-6 lg:px-8">
  <h1 class="text-gray-900 text-4xl font-extrabold md:text-5xl lg:text-6xl">
    CC Checker
  </h1>
  <input class="block w-96" type="text" id="credit-card-number" placeholder="Enter a credit card number">
  <button id="sumButton" class="p-2 my-2 border-2 border-gray-500">Check</button>
  <p id="result"></p>
  <p class="mt-8">
  For more detail, visit <a class="text-blue-600" href="https://ccchecker.io">CC Checker</a>.
  </p>
</div>

JavaScript

function handleClick() {
	const result = ccchecker();
  // Display the result
  document.getElementById('result').textContent = result;
}

function ccchecker() {
	let result = '';
  // Get the input value
  let inputNumber = document.getElementById('credit-card-number').value;

  // Convert to string to easily iterate through digits
  let trimmed = inputNumber.toString().trim();

  if (!/^[0-9]+$/.test(trimmed)) {
    return 'Please enter 0-9 only.';
  }

  const sum = trimmed
    .split('')
    .reverse()
    .map(Number)
    .reduce((sum, num, index) => {
      if (index % 2 !== 0) {
        num *= 2;
        num = num > 9 ? num - 9 : num;
      }

      return sum + num;
    }, 0);

  if (sum % 10 === 0) {
		return 'Passed';
  } else {
    return 'Invalid';
  }
}

document.getElementById('sumButton').addEventListener('click', handleClick);