diff --git a/scripts/scripts.js b/scripts/scripts.js
index 19baa3a..4e34e8f 100644
--- a/scripts/scripts.js
+++ b/scripts/scripts.js
@@ -30,9 +30,20 @@ function addSpeedInformation(info, containerElement, name, splitWords = false) {
containerElement.appendChild(infoElement);
}
-function addSpecifications(specs) {
- const specContainer = document.createElement('div');
+function addShipSpecifications(specs) {
+ const infoContainer = document.createElement('div');
+ const titleElement = document.querySelector('h2');
+
+ if (specs.Range) {
+ addSpeedInformation(specs.Range, infoContainer);
+ // Temp content as it is not received from document
+ addSpeedInformation(specs['Number of Passengers'].replace('to', '–').replaceAll(' ', ''), infoContainer, 'passengers', true);
+ addSpeedInformation(specs.Length, infoContainer);
+ }
+ infoContainer.classList.add('info-container');
+ titleElement.parentNode.insertBefore(infoContainer, titleElement);
+ const specContainer = document.createElement('div');
specContainer.classList.add('spec-container');
const content = `
SPECIFICATIONS
Learn more about the ${document.querySelector('h1').textContent} and its technical specifications.
@@ -44,9 +55,28 @@ function addSpecifications(specs) {
parentElement.appendChild(specContainer);
}
+function addEngineSpecifications(specs) {
+ const specContainer = document.createElement('div');
+ specContainer.classList.add('spec-container');
+
+ const content = `
+ Length | ${specs.Length} |
+ Width | ${specs.Width} |
+ Maximum Speed | ${specs['Maximum Speed']} |
+ Range | ${specs.Range} |
+ `;
+ specContainer.innerHTML = content;
+
+ const parentElement = document.querySelector('body.engine-focus .default-content-wrapper');
+ parentElement.appendChild(specContainer);
+}
+
async function prepareSpecification() {
+ const isTemplate = (template) => document.body.classList.contains(template);
+ const isShipFocus = isTemplate('ship-focus');
+ const isEngineFocus = !isShipFocus && isTemplate('engine-focus');
try {
- if (!document.body.classList.contains('ship-focus')) {
+ if (!isShipFocus && !isEngineFocus) {
return;
}
const specificationPath = getMetadata('specifications');
@@ -65,22 +95,13 @@ async function prepareSpecification() {
}
const specificationsObj = JSON.parse(specification.specifications);
- const infoContainer = document.createElement('div');
- const titleElement = document.querySelector('h2');
-
- if (specificationsObj.Range) {
- addSpeedInformation(specificationsObj.Range, infoContainer);
- // Temp content as it is not received from document
- addSpeedInformation(specificationsObj['Number of Passengers'].replace('to', '–').replaceAll(' ', ''), infoContainer, 'passengers', true);
- addSpeedInformation(specificationsObj.Length, infoContainer);
- }
-
- addSpecifications(specificationsObj);
- infoContainer.classList.add('info-container');
- titleElement.parentNode.insertBefore(infoContainer, titleElement);
+ if (isShipFocus) {
+ addShipSpecifications(specificationsObj);
+ } else /* if (isEngineFocus) */ {
+ addEngineSpecifications(specificationsObj);
+ }
- // these dataset are reference and will be removed later
document.body.dataset.features = specification.features;
document.body.dataset.specification = specification.specifications;
} catch (e) {