update images to match with api response

This commit is contained in:
Greg Gauthier 2024-06-27 01:45:44 +01:00
parent bd1041b9cd
commit 7f6464e89b
19 changed files with 23 additions and 9 deletions

View File

@ -17,17 +17,31 @@ document.getElementById('terrainForm').addEventListener('submit', function(event
//Handle null encounter //Handle null encounter
let encounterText = json.encounter ? json.encounter : "No Encounter"; let encounterText = json.encounter ? json.encounter : "No Encounter";
let resultSection = document.getElementById('resultSection'); let resultSection = document.getElementById('resultSection');
resultSection.style.textAlign = 'center'; // To center text resultSection.innerHTML = '';
resultSection.style.fontSize = '1.5em'; // Relative to current font-size (1.5 times the size of the current font)
resultSection.style.fontWeight = 'bold'; //To make it bold like H3 // Create an image element and set its src to the corresponding jpeg image
resultSection.innerText = encounterText; let imgElement = document.createElement("img");
imgElement.alt = encounterText;
imgElement.width = 500; // You can set width as per your choice
imgElement.height = 500; // You can set height as per your choice
imgElement.onerror = function() {
this.onerror=null;
this.src='./img/404.jpg';
}
imgElement.src = "./img/" + encounterText + ".jpg";
// Append the image element to the resultSection
resultSection.appendChild(imgElement);
}).catch(err => { }).catch(err => {
err.text().then(errorMessage => { err.text().then(errorMessage => {
let imgElement = document.createElement("img");
imgElement.src = "./img/404.jpg";
imgElement.width = 500;
imgElement.height = 500;
let resultSection = document.getElementById('resultSection'); let resultSection = document.getElementById('resultSection');
resultSection.style.textAlign = 'center'; resultSection.innerHTML = '';
resultSection.style.fontSize = '1.5em'; resultSection.appendChild(imgElement);
resultSection.style.fontWeight = 'bold';
resultSection.innerText = errorMessage;
}) })
}); });
}); });

BIN
web/img/404.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 110 KiB

BIN
web/img/No Encounter.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

BIN
web/img/android.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 132 KiB

View File

Before

Width:  |  Height:  |  Size: 78 KiB

After

Width:  |  Height:  |  Size: 78 KiB

BIN
web/img/calthen.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

View File

Before

Width:  |  Height:  |  Size: 72 KiB

After

Width:  |  Height:  |  Size: 72 KiB

BIN
web/img/crep plant.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 99 KiB

View File

Before

Width:  |  Height:  |  Size: 100 KiB

After

Width:  |  Height:  |  Size: 100 KiB

View File

Before

Width:  |  Height:  |  Size: 92 KiB

After

Width:  |  Height:  |  Size: 92 KiB

View File

Before

Width:  |  Height:  |  Size: 77 KiB

After

Width:  |  Height:  |  Size: 77 KiB

View File

Before

Width:  |  Height:  |  Size: 60 KiB

After

Width:  |  Height:  |  Size: 60 KiB

View File

Before

Width:  |  Height:  |  Size: 95 KiB

After

Width:  |  Height:  |  Size: 95 KiB

BIN
web/img/pineto.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 95 KiB

BIN
web/img/rakox.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 90 KiB

View File

Before

Width:  |  Height:  |  Size: 86 KiB

After

Width:  |  Height:  |  Size: 86 KiB

BIN
web/img/squeekr.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 61 KiB

View File

Before

Width:  |  Height:  |  Size: 96 KiB

After

Width:  |  Height:  |  Size: 96 KiB

View File

Before

Width:  |  Height:  |  Size: 106 KiB

After

Width:  |  Height:  |  Size: 106 KiB