diff --git a/web/encounter.js b/web/encounter.js
index 9853e52..4f23f14 100644
--- a/web/encounter.js
+++ b/web/encounter.js
@@ -1,47 +1,51 @@
-document.getElementById('terrainForm').addEventListener('submit', function(event) {
+document.getElementById('terrainForm').addEventListener('submit', function (event) {
event.preventDefault();
var terrain = document.getElementById('terrainType').value;
+ // Insert the loading.gif before making the fetch request
+ let resultSection = document.getElementById('resultSection');
+ resultSection.innerHTML = '';
+ let imgElement = document.createElement('img');
+ imgElement.src = 'img/checking.gif';
+ imgElement.style.width = '500px';
+ imgElement.style.height = '500px';
+ imgElement.style.display = 'block';
+ imgElement.style.marginLeft = 'auto';
+ imgElement.style.marginRight = 'auto';
+ resultSection.appendChild(imgElement);
+
fetch('https://gammaworld.gmgauthier.com/roll/encounter', {
method: 'POST',
headers: {
- 'Content-Type': 'application/json'
+ 'Content-Type': 'application/json',
},
body: JSON.stringify({
- "terrain": terrain
+ terrain: terrain,
+ }),
+ })
+ .then((response) => {
+ if (!response.ok) {
+ throw response;
+ }
+ return response.json(); // we only get here if there is no error
})
- }).then(response => {
- if (!response.ok) { throw response }
- return response.json() // we only get here if there is no error
- }).then(json => {
- //Handle null encounter
- let encounterText = json.encounter ? json.encounter : "No Encounter";
- let resultSection = document.getElementById('resultSection');
- resultSection.innerHTML = '';
+ .then((json) => {
+ // Handle null encounter
+ let encounterText = json.encounter ? json.encounter : 'No Encounter';
- // Create an image element and set its src to the corresponding jpeg image
- 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";
+ // Change the src attribute of the image after fetch resolves
+ setTimeout(() => {
+ imgElement.src = './img/' + encounterText + ".jpg";
+ }, 1000);
- // Append the image element to the resultSection
- resultSection.appendChild(imgElement);
- }).catch(err => {
- 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');
- resultSection.innerHTML = '';
- resultSection.appendChild(imgElement);
+ imgElement.onerror = function () {
+ this.onerror = null;
+ this.src = './img/404.jpg';
+ };
})
- });
+ .catch((err) => {
+ err.text().then((errorMessage) => {
+ imgElement.src = './img/404.jpg';
+ });
+ });
});
\ No newline at end of file
diff --git a/web/img/Heads.jpg b/web/img/Heads.jpg
new file mode 100644
index 0000000..3f37daa
Binary files /dev/null and b/web/img/Heads.jpg differ
diff --git a/web/img/Tails.jpg b/web/img/Tails.jpg
new file mode 100644
index 0000000..f1c22a8
Binary files /dev/null and b/web/img/Tails.jpg differ
diff --git a/web/img/checking.gif b/web/img/checking.gif
new file mode 100644
index 0000000..33edee0
Binary files /dev/null and b/web/img/checking.gif differ
diff --git a/web/img/loading.gif b/web/img/loading.gif
new file mode 100644
index 0000000..946238b
Binary files /dev/null and b/web/img/loading.gif differ
diff --git a/web/img/odds.gif b/web/img/odds.gif
new file mode 100644
index 0000000..3e300d0
Binary files /dev/null and b/web/img/odds.gif differ
diff --git a/web/index.html b/web/index.html
index 01f7e06..2490043 100644
--- a/web/index.html
+++ b/web/index.html
@@ -9,13 +9,19 @@
Gamma World Gaming Tools
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
@@ -33,10 +39,90 @@
loadContent("mentalattack.html?t=" + new Date().getTime());
});
+ document.getElementById("physicalattack").addEventListener("click", function () {
+ loadContent("physicalattack.html?t=" + new Date().getTime());
+ });
+
document.getElementById("chargen").addEventListener("click", function () {
loadContent("chargen.html?t=" + new Date().getTime());
});
+ document.getElementById("coinflip").addEventListener("click", function () {
+ let commonImgSize = '250px'
+ // Display a placeholder image or loading indicator
+ let imgElement = document.createElement('img');
+ imgElement.src = 'img/loading.gif';
+ imgElement.style.width = commonImgSize;
+ imgElement.style.height = commonImgSize;
+
+ // Center the image
+ imgElement.style.display = 'block';
+ imgElement.style.marginLeft = 'auto';
+ imgElement.style.marginRight = 'auto';
+
+ document.getElementById('toolPanel').innerHTML = '';
+ document.getElementById('toolPanel').appendChild(imgElement);
+
+ fetch('https://gammaworld.gmgauthier.com/coinflip')
+ .then(response => response.text())
+ .then(data => {
+ let imgSrc = 'img/' + data.replace(/\"/g, '') + '.jpg';
+ setTimeout(() => {
+ imgElement.src = imgSrc;
+ }, 1500);
+ })
+ .catch((error) => {
+ console.error('Error:', error);
+ });
+ });
+
+ document.getElementById('chance').addEventListener('click', function(event) {
+ event.preventDefault();
+
+ // Insert the odds.gif before making the fetch request
+ let resultSection = document.getElementById('toolPanel');
+ resultSection.innerHTML = '';
+ let imgElement = document.createElement('img');
+ imgElement.src = 'img/odds.gif';
+ imgElement.style.width = '250px';
+ imgElement.style.height = '250px';
+ imgElement.style.display = 'block';
+ imgElement.style.marginLeft = 'auto';
+ imgElement.style.marginRight = 'auto';
+ resultSection.appendChild(imgElement);
+
+ fetch('https://gammaworld.gmgauthier.com/roll/chance', {
+ method: 'GET',
+ headers: {
+ 'Content-Type': 'application/json',
+ },
+ })
+ .then((response) => {
+ if (!response.ok) {
+ throw response;
+ }
+ return response.json();
+ })
+ .then((json) => {
+ // Add a delay of 1 second (1000 milliseconds) before changing the image.
+ setTimeout(() => {
+ // Remove loading gif from HTML
+ imgElement.style.display = 'none';
+
+ // Show the result with %+ in large bold centered text
+ let resultText = document.createElement('p');
+ resultText.style.fontSize = '32px'; // Large text
+ resultText.style.fontWeight = 'bold'; // Bold text
+ resultText.style.textAlign = 'center'; // Centered text
+ resultText.textContent = json.result + '%'; // Append % to the result value
+
+ resultSection.appendChild(resultText);
+ }, 1000);
+ })
+ .catch((err) => {
+ console.log('Request failed', err);
+ });
+ });
});
function loadContent(pageUrl) {
@@ -45,7 +131,7 @@
iframe.style.width = '100%'; // make the iframe take full width of the container
iframe.style.border = 'none'; // hide the border
iframe.style.overflow = 'hidden'; // hide scrollbars, can be 'auto' if you prefer automatic scrollbars
- iframe.style.height = '750px'; // set a height so that the iframe is visible, adjust as per your needs
+ iframe.style.height = '800px'; // set a height so that the iframe is visible, adjust as per your needs
document.getElementById("toolPanel").innerHTML = '';
document.getElementById("toolPanel").appendChild(iframe);
}
diff --git a/web/physicalattack.html b/web/physicalattack.html
new file mode 100644
index 0000000..4a6d7ae
--- /dev/null
+++ b/web/physicalattack.html
@@ -0,0 +1,50 @@
+
+
+
+
+
Gamma World Physical Attack Roll
+
+
+
+
+
+
Attempt A Physical Attack
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/web/physicalattack.js b/web/physicalattack.js
new file mode 100644
index 0000000..34280bd
--- /dev/null
+++ b/web/physicalattack.js
@@ -0,0 +1,58 @@
+window.onload = function () {
+ document.getElementById('physicalAttackForm').addEventListener('submit', function (event) {
+ event.preventDefault(); // Prevent the form from submitting the normal way
+
+ const dac = parseInt(document.getElementById('dac').value, 10);
+ const awc = parseInt(document.getElementById('awc').value, 10);
+ const ahd = parseInt(document.getElementById('ahd').value, 10);
+ const modifier = parseInt(document.getElementById('modifier').value, 10);
+ const weapon_attack = document.getElementById('weapon_attack').checked;
+
+ fetch('https://gammaworld.gmgauthier.com/roll/attack/physical', {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json',
+ },
+ body: JSON.stringify({
+ weapon_attack: weapon_attack,
+ modifier: modifier,
+ dac: dac,
+ awc: awc,
+ ahd: ahd
+ }),
+ })
+ .then(response => response.json())
+ .then(data => {
+ const resultsDiv = document.getElementById('results');
+ let html = '';
+
+ if (data['needed']) {
+ html += `
Needed: ${data['needed']} `;
+ }
+
+ if (data['original-roll']) {
+ html += `Original Roll: ${data['original-roll']}
`;
+ }
+
+ if (data['modifier']) {
+ html += `
Modifier: ${data['modifier']} `;
+ }
+
+ if (data['adjusted-roll']) {
+ html += `Adjusted Roll: ${data['adjusted-roll']}
`;
+ }
+
+ html += `
`;
+
+ if (data['outcome']) {
+ let outcomeText = data['outcome'];
+ html += `
${outcomeText}
`;
+ // adding img tag
+ let outcomeImage = 'img/' + outcomeText.replace(' ', '%20') + '.png';
+ html += `
`
+
+ resultsDiv.innerHTML = html;
+ }
+ })
+ });
+}
\ No newline at end of file