String Challenge

Udemy complete JavaScript Jonas S

by trentHarlem

HTML

<h1>
  String Methods Practice
</h1>

<blockquote class='wrap'>
'_Delayed_Departure;fao93766109;txl2133758440;11:25+_Arrival;bru0943384722;fao93766109;11:45+_Delayed_Arrival;hel7439299980;fao93766109;12:05+_Departure;fao93766109;lis2323639855;12:30'
</blockquote>
<p>
  Format this input data string into something easier to read...</p>
<blockquote>
  🔴 Delayed Departure from FAO to TXL (11h25)<br>
  Arrival from BRU to FAO (11h45)<br>
  🔴 Delayed Arrival from HEL to FAO (12h05)<br>
  Departure from FAO to LIS (12h30)<br>
</blockquote>

<p>
innerHTML output here...
</p>
<blockquote id='result'>

</blockquote>

CSS

@import url('https://fonts.googleapis.com/css2?family=Share+Tech+Mono&display=swap');


body {
  background-color: #222222;
  font: bold 1.1em system-ui;
  color: whitesmoke;
}

.wrap {
  word-wrap: break-word;
}

#result {
  font-family: 'Share Tech Mono', monospace;
}

.delayed {
  color: yellow;
}

JavaScript

// data input
const flights =
  '_Delayed_Departure;fao93766109;txl2133758440;11:25+_Arrival;bru0943384722;fao93766109;11:45+_Delayed_Arrival;hel7439299980;fao93766109;12:05+_Departure;fao93766109;lis2323639855;12:30';
const result = document.getElementById('result')
let sep
const line = flights.split('+');
for (const l of line) {
  let output = ''
  sep = l.split(';');
  //console.log(sep);
  for (const [i, elem] of sep.entries()) {
    let dir = sep[0].replaceAll('_', ' ').trim()
    if (dir.includes('Delayed')) {
      dir = `🛑  ` + dir
    }
    const ap1 = sep[1].slice(0, 3).toUpperCase()
    const ap2 = sep[2].slice(0, 3).toUpperCase()
    const time = sep[3].replace(':', 'h')
    output = `${dir} from ${ap1} to ${ap2} (${time})  <br>`;
  }
  result.innerHTML += (output);

}