Enhance character profile integration with dynamic data fetching and role identification
All checks were successful
Deploy Jekyll site to Pages / build (push) Successful in 5m31s

This commit is contained in:
2025-03-20 13:18:39 +01:00
parent 344caf5b52
commit c518cbf550
6 changed files with 31 additions and 10 deletions

View File

@@ -1,7 +1,18 @@
<div class="cyber-tile cyber-tile-big {{ include.bg_color }} {{ include.fg_color }} {{ include.class }}" style="min-height: auto;">
<img src="{{ include.image | relative_url }}" alt="{{ include.name }} Picture">
<p><span class="cyberpunk-font">Name:</span> {{ include.name }}</p>
<p><span class="cyberpunk-font">Handle:</span> {{ include.handle }}</p>
<p><span class="cyberpunk-font">Role:</span> {{ include.role }}</p>
<p><span class="cyberpunk-font">Age:</span> {{ include.age }}</p>
{% if include.image %}<img src="{{ include.image | relative_url }}" alt="Character Picture">{% endif %}
<p><span class="cyberpunk-font">Name:</span>&nbsp;&nbsp;<span id="name"></span></p>
<p><span class="cyberpunk-font">Handle:</span>&nbsp;&nbsp;<span id="streetname"></span></p>
<p><span class="cyberpunk-font">Role:</span>&nbsp;&nbsp;<span id="role"></span></p>
<p><span class="cyberpunk-font">Age:</span>&nbsp;&nbsp;<span id="age"></span></p>
</div>
<script>
fetch("{{ include.datasource | relative_url }}")
.then(response => response.json())
.then(character => {
document.getElementById('name').innerText = character.name;
document.getElementById('streetname').innerText = character.handle;
document.getElementById('age').innerText = character.age;
const mainRole = character.roles.find(role => role.main);
document.getElementById('role').innerText = mainRole.name + " Rang: " + mainRole.rank;
});
</script>