start spell.js

This commit is contained in:
Lucas 2023-03-05 02:03:48 +01:00
parent 2562801dcf
commit a1be0791a0
6 changed files with 91 additions and 18 deletions

15
.vscode/launch.json vendored Normal file
View file

@ -0,0 +1,15 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://127.0.0.1:5500",
"webRoot": "${workspaceFolder}"
}
]
}

View file

@ -24,11 +24,11 @@
<div><i class="fa-solid fa-wand-sparkles"></i></div>
<div data-localize="btn-spells">spells</div>
</button>
<button onclick="window.location.href='monsters.html';">
<button onclick="window.location.href='monsters.html';" disabled>
<div><i class="fa-solid fa-dragon"></i></div>
<div data-localize="btn-monsters">monsters</div>
</button>
<button onclick="window.location.href='items.html';">
<button onclick="window.location.href='items.html';" disabled>
<div><i class="fa-solid fa-hand-sparkles"></i></div>
<div data-localize="btn-items">items</div>
</button>

View file

@ -1,4 +1,4 @@
// In a browser where the language is set to French
$("[data-localize]").localize("main", { pathPrefix: "lang" });
// You can also override the language detection, and pass in a language code

View file

@ -0,0 +1,29 @@
var normaliseLang;
normaliseLang = function (lang) {
lang = lang.replace(/_/, "-").toLowerCase();
if (lang.length > 3) {
lang = lang.substring(0, 3) + lang.substring(3).toUpperCase();
}
return lang;
};
$.defaultLanguage = normaliseLang(
navigator.languages && navigator.languages.length > 0
? navigator.languages[0]
: navigator.language || navigator.userLanguage
);
var lang = normaliseLang( $.defaultLanguage);
fetch('data/spells/spells-grimoire-fr.json')
.then((response) => response.json())
.then((json) => JSON.parse(json));
var string jsonsource = ''.concat("../data/spells/spells-grimoire-",navigator.languages[0].slice(0,2),".json");
import data from jsonsource assert { type: 'json' };
console.log(data);
var yourHtml = JSON;
document.getElementById("spell-list").innerHTML = yourHtml;

View file

@ -1,4 +1,5 @@
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
@ -14,15 +15,43 @@
<button onclick="changeLangFR()">French</button>
<h1>FateforgeTools</h1>
<h2 data-localize="btn-spells">Spells</h2>
<h2 data-localize="btn-spells">Spells</h2>
<div class="container" style="display: flex;">
<div class="view-col" id="list">
<div id="sublistcontainer" class="sublist sublist--resizable">
<div id="sublistsort" class="btn-group">
<button class="btn-xs" data-sort="name" data-localize="spell-name">Name</button>
<button class="btn-xs" data-sort="level" data-localize="spell-level">Level</button>
<button class="btn-xs" data-sort="time" data-localize="spell-time">Time</button>
<button class="btn-xs" data-sort="school" data-localize="spell-school">School</button>
<button class="btn-xs" data-sort="concentration" title="Concentration" data-localize="spell-concentration">C.</button>
<button class="btn-xs" data-sort="range">Range</button>
</div>
<div id="spell-list" class="list subspells">
<!-- populate with JS -->
</div>
</div>
<div class="view-col" id="content">
<table id="pagecontent" class="w-100 stats">
<tr><th class="border" colspan="6"></th></tr>
<tr><td colspan="6" class="initial-message">Select a spell from the list to view it here</td></tr>
<tr><th class="border" colspan="6"></th></tr>
</table>
</div>
</div>
<script type="text/javascript" src="lib/jquery.min.js"></script>
<script type="text/javascript" src="lib/jquery.localize.js"></script>
<script type="text/javascript" src="js/language.js"></script>
<script type="text/javascript" src="lib/jquery.min.js"></script>
<script type="text/javascript" src="lib/jquery.localize-dev.js"></script>
<script type="text/javascript" src="js/language.js"></script>
<script type="module" src="js/spells.js"></script>
<script src="https://kit.fontawesome.com/126cdd0e29.js" crossorigin="anonymous"></script>
<script src="https://kit.fontawesome.com/126cdd0e29.js" crossorigin="anonymous"></script>
</body>
</html>