Review expensive HTTP operation in archive.html

[segun-codes]

The code snippet below is extracted from /examples/archive.html, I am of the opinion that axios.get(...) shouldn't be invoked without validating that the user-supplied url argument meets certain criteria before attempting to perform the expensive over-the-network get operation albeit there's a failure handling mechanism in place.

I could improve the code by validating the url first, then wrap axios.get(...) codes in an if statement. For instance, if the url must always originate from https://archive.org, then the proposed validation will ensure this. Where validation fails, a small notification message is displayed to the user with the welcomeModal still in view.

@jywaren, what do you think? Can I give this a shot? Many thanks.

form.addEventListener('submit', (event) => {
      event.preventDefault();
      const url = input.value.replace('details', 'metadata');
      axios.get(url)
        .then((response) => {
          if (response.data.files && response.data.files.length != 0) {
            let imageCount = 0;
            response.data.files.forEach(file => {
              if (file.format === 'PNG' || file.format === 'JPEG'){
                let imageRow = document.createElement('div');
                let image = new Image(150, 150);
                let placeButton = document.createElement('a');

                placeButton.classList.add('btn', 'btn-sm', 'btn-outline-secondary', 'place-button');
                placeButton.innerHTML = 'Place on map';

                image.src = `${url.replace('metadata', 'download')}/${file.name}`;