JSFiddle - React, Tailwind, and code Playground

by debugLogEnabled

HTML

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous" />
<script src="https://code.jquery.com/jquery-3.7.1.min.js" integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
<body data-bs-theme="dark">
  <div class="container">
    <div class="row mt-5">
      <div class="col">
        <div class="input-group mb-1">
          <span class="input-group-text">From System</span>
          <input type="text" id="fromSystemInput" class="form-control" value="Jita">
        </div>
        <div class="input-group mb-1">
          <span class="input-group-text">Max Jumps</span>
          <input type="text" id="maxJumpsInput" class="form-control" value="5" placeholder="Max Jumps as integer">
        </div>
        <div>
          <button class="btn btn-primary w-100" type="button" onclick="calculate()">Calculate</button>
        </div>
      </div>
      
      <h2>
      Result:
      </h2>
       <div id="result">
         
       </div>


    </div>
  </div>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script>

</body>

JavaScript

let reachableSystems = []

var GET = function(dataURL, async=true) {
  return $.ajax({
    method: 'GET',
    url: dataURL,
    async: async
  });
}

var POST = function(query, dataURL) {
  return $.ajax({
    method: 'POST',
    data: query,
    dataType: 'json',
    url: dataURL
  });
}

function calculate() {
	fromSystem = $('#fromSystemInput').val()
  maxJumps = parseInt($('#maxJumpsInput').val())
  getSystemId = POST(JSON.stringify([fromSystem]), "https://esi.evetech.net/latest/universe/ids/?datasource=tranquility&language=en")
  $.when(getSystemId).then(function (data) {
  	calculateSystemsInRange(data.systems[0].id, maxJumps)
  })
}

function calculateSystemsInRange(fromSysId, maxJumps) {
	getSystemsInRange(fromSysId, 0, maxJumps)
  $('#result').html(`${JSON.stringify(reachableSystems)}`)
}

function getSystemsInRange(currentSystem, currentRange, maxRange) {
	if(currentRange > maxRange) {
  	return
  }
  if(!reachableSystems.includes(currentSystem)) {
  	reachableSystems.push(currentSystem)
  }
 	getConnectedSystems(currentSystem).forEach(function (nextSysId) {
  	if(!reachableSystems.includes(nextSysId)) {
    	getSystemsInRange(nextSysId, currentRange + 1, maxRange)
    }
  })
}

function getConnectedSystems(fromSysId) {
	sysData = JSON.parse(GET(`https://esi.evetech.net/latest/universe/systems/${fromSysId}/?datasource=tranquility&language=en`, async=false).responseText)
  connectedSystems = []
 	sysData.stargates.forEach(sgId => {
  	sgData = JSON.parse(GET(`https://esi.evetech.net/latest/universe/stargates/${sgId}/?datasource=tranquility`, async=false).responseText)
    connectedSystems.push(sgData.destination.system_id)
  })
  return connectedSystems
}