Honestly way too much went into this single commit. I am so sorry future me
This commit is contained in:
14
project-warstone/.eslintrc.cjs
Normal file
14
project-warstone/.eslintrc.cjs
Normal file
@@ -0,0 +1,14 @@
|
||||
module.exports = {
|
||||
env: { browser: true, es2020: true },
|
||||
extends: [
|
||||
'eslint:recommended',
|
||||
'plugin:@typescript-eslint/recommended',
|
||||
'plugin:react-hooks/recommended',
|
||||
],
|
||||
parser: '@typescript-eslint/parser',
|
||||
parserOptions: { ecmaVersion: 'latest', sourceType: 'module' },
|
||||
plugins: ['react-refresh'],
|
||||
rules: {
|
||||
'react-refresh/only-export-components': 'warn',
|
||||
},
|
||||
}
|
24
project-warstone/.gitignore
vendored
Normal file
24
project-warstone/.gitignore
vendored
Normal file
@@ -0,0 +1,24 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
13
project-warstone/index.html
Normal file
13
project-warstone/index.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/battlelog icon.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>BattleLog</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/src/main.tsx"></script>
|
||||
</body>
|
||||
</html>
|
34
project-warstone/package.json
Normal file
34
project-warstone/package.json
Normal file
@@ -0,0 +1,34 @@
|
||||
{
|
||||
"name": "project-warstone",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "tsc && vite build",
|
||||
"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@types/react-router-dom": "^5.3.3",
|
||||
"autoprefixer": "^10.4.14",
|
||||
"postcss": "^8.4.24",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"react-router-dom": "^6.12.0",
|
||||
"recoil": "^0.7.7",
|
||||
"tailwindcss": "^3.3.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.0.37",
|
||||
"@types/react-dom": "^18.0.11",
|
||||
"@typescript-eslint/eslint-plugin": "^5.59.0",
|
||||
"@typescript-eslint/parser": "^5.59.0",
|
||||
"@vitejs/plugin-react-swc": "^3.0.0",
|
||||
"eslint": "^8.38.0",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.3.4",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^4.3.9"
|
||||
}
|
||||
}
|
6
project-warstone/postcss.config.js
Normal file
6
project-warstone/postcss.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
export default {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
}
|
394
project-warstone/public/battlelog icon.svg
Normal file
394
project-warstone/public/battlelog icon.svg
Normal file
@@ -0,0 +1,394 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="36.50486mm"
|
||||
height="36.50486mm"
|
||||
viewBox="0 0 36.50486 36.50486"
|
||||
version="1.1"
|
||||
id="svg8"
|
||||
sodipodi:docname="battlelog icon.svg"
|
||||
inkscape:export-filename="C:\Users\ironi\Pictures\battlelog.png"
|
||||
inkscape:export-xdpi="138.39"
|
||||
inkscape:export-ydpi="138.39"
|
||||
inkscape:version="1.0 (4035a4fb49, 2020-05-01)">
|
||||
<defs
|
||||
id="defs2">
|
||||
<marker
|
||||
inkscape:isstock="true"
|
||||
style="overflow:visible"
|
||||
id="Arrow1Sstart"
|
||||
refX="0"
|
||||
refY="0"
|
||||
orient="auto"
|
||||
inkscape:stockid="Arrow1Sstart">
|
||||
<path
|
||||
transform="matrix(0.2,0,0,0.2,1.2,0)"
|
||||
style="fill:#35185a;fill-opacity:1;fill-rule:evenodd;stroke:#35185a;stroke-width:1pt;stroke-opacity:1"
|
||||
d="M 0,0 5,-5 -12.5,0 5,5 Z"
|
||||
id="path993" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:isstock="true"
|
||||
style="overflow:visible"
|
||||
id="marker1259"
|
||||
refX="0"
|
||||
refY="0"
|
||||
orient="auto"
|
||||
inkscape:stockid="Arrow1Lstart">
|
||||
<path
|
||||
transform="matrix(0.8,0,0,0.8,10,0)"
|
||||
style="fill:#35185a;fill-opacity:1;fill-rule:evenodd;stroke:#35185a;stroke-width:1pt;stroke-opacity:1"
|
||||
d="M 0,0 5,-5 -12.5,0 5,5 Z"
|
||||
id="path1257" />
|
||||
</marker>
|
||||
<marker
|
||||
inkscape:isstock="true"
|
||||
style="overflow:visible"
|
||||
id="Arrow1Lstart"
|
||||
refX="0"
|
||||
refY="0"
|
||||
orient="auto"
|
||||
inkscape:stockid="Arrow1Lstart">
|
||||
<path
|
||||
transform="matrix(0.8,0,0,0.8,10,0)"
|
||||
style="fill:#35185a;fill-opacity:1;fill-rule:evenodd;stroke:#35185a;stroke-width:1pt;stroke-opacity:1"
|
||||
d="M 0,0 5,-5 -12.5,0 5,5 Z"
|
||||
id="path981" />
|
||||
</marker>
|
||||
<inkscape:path-effect
|
||||
effect="mirror_symmetry"
|
||||
start_point="24.197977,13.799948"
|
||||
end_point="24.197977,15.24464"
|
||||
center_point="24.197977,14.522294"
|
||||
id="path-effect933"
|
||||
is_visible="true"
|
||||
lpeversion="1"
|
||||
mode="free"
|
||||
discard_orig_path="false"
|
||||
fuse_paths="false"
|
||||
oposite_fuse="false"
|
||||
split_items="false" />
|
||||
<inkscape:path-effect
|
||||
split_items="false"
|
||||
oposite_fuse="false"
|
||||
fuse_paths="false"
|
||||
discard_orig_path="false"
|
||||
mode="free"
|
||||
lpeversion="1"
|
||||
is_visible="true"
|
||||
id="path-effect898"
|
||||
center_point="24.087931,14.05635"
|
||||
end_point="24.087931,17.323464"
|
||||
start_point="24.087931,10.789236"
|
||||
effect="mirror_symmetry" />
|
||||
<inkscape:path-effect
|
||||
hide_knots="false"
|
||||
only_selected="false"
|
||||
apply_with_radius="true"
|
||||
apply_no_radius="true"
|
||||
use_knot_distance="true"
|
||||
flexible="false"
|
||||
chamfer_steps="1"
|
||||
radius="0"
|
||||
mode="F"
|
||||
method="auto"
|
||||
unit="px"
|
||||
satellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,1.9337788,0,1 @ F,0,0,1,0,0.70814436,0,1 @ F,0,0,1,0,0,0,1"
|
||||
lpeversion="1"
|
||||
is_visible="true"
|
||||
id="path-effect896"
|
||||
effect="fillet_chamfer" />
|
||||
<inkscape:path-effect
|
||||
effect="fillet_chamfer"
|
||||
id="path-effect875"
|
||||
is_visible="true"
|
||||
lpeversion="1"
|
||||
satellites_param="F,0,0,1,0,0,0,1 @ F,0,0,1,0,1.9337788,0,1 @ F,0,0,1,0,0.70814436,0,1 @ F,0,0,1,0,0,0,1"
|
||||
unit="px"
|
||||
method="auto"
|
||||
mode="F"
|
||||
radius="0"
|
||||
chamfer_steps="1"
|
||||
flexible="false"
|
||||
use_knot_distance="true"
|
||||
apply_no_radius="true"
|
||||
apply_with_radius="true"
|
||||
only_selected="false"
|
||||
hide_knots="false" />
|
||||
<inkscape:path-effect
|
||||
effect="mirror_symmetry"
|
||||
start_point="24.087931,10.789236"
|
||||
end_point="24.087931,17.323464"
|
||||
center_point="24.087931,14.05635"
|
||||
id="path-effect873"
|
||||
is_visible="true"
|
||||
lpeversion="1"
|
||||
mode="free"
|
||||
discard_orig_path="false"
|
||||
fuse_paths="false"
|
||||
oposite_fuse="false"
|
||||
split_items="false" />
|
||||
<inkscape:path-effect
|
||||
effect="mirror_symmetry"
|
||||
start_point="15.2,12.19"
|
||||
end_point="0,18.82"
|
||||
center_point="7.6,15.505"
|
||||
id="path-effect869"
|
||||
is_visible="true"
|
||||
lpeversion="1"
|
||||
mode="free"
|
||||
discard_orig_path="false"
|
||||
fuse_paths="false"
|
||||
oposite_fuse="false"
|
||||
split_items="false" />
|
||||
<inkscape:perspective
|
||||
sodipodi:type="inkscape:persp3d"
|
||||
inkscape:vp_x="0 : -108.11874 : 1"
|
||||
inkscape:vp_y="0 : 999.99993 : 0"
|
||||
inkscape:vp_z="210 : -108.11874 : 1"
|
||||
inkscape:persp3d-origin="105 : -157.61873 : 1"
|
||||
id="perspective841" />
|
||||
</defs>
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="8"
|
||||
inkscape:cx="74.035737"
|
||||
inkscape:cy="76.334249"
|
||||
inkscape:document-units="mm"
|
||||
inkscape:current-layer="layer1"
|
||||
inkscape:document-rotation="0"
|
||||
showgrid="false"
|
||||
inkscape:window-width="3440"
|
||||
inkscape:window-height="1369"
|
||||
inkscape:window-x="-8"
|
||||
inkscape:window-y="1432"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:object-paths="true"
|
||||
inkscape:snap-intersection-paths="true"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0" />
|
||||
<metadata
|
||||
id="metadata5">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title></dc:title>
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:label="Layer 1"
|
||||
inkscape:groupmode="layer"
|
||||
id="layer1"
|
||||
transform="translate(-10.381405,6.5569707)">
|
||||
<path
|
||||
sodipodi:open="true"
|
||||
d="M 45.469057,11.723468 A 16.835245,16.835245 0 0 1 28.637202,28.530704 16.835245,16.835245 0 0 1 11.798626,11.730202 16.835245,16.835245 0 0 1 28.567716,-5.1396559 16.835245,16.835245 0 0 1 45.468798,11.597965"
|
||||
sodipodi:arc-type="arc"
|
||||
sodipodi:end="6.2773942"
|
||||
sodipodi:start="0.0016637066"
|
||||
sodipodi:ry="16.835245"
|
||||
sodipodi:rx="16.835245"
|
||||
sodipodi:cy="11.695459"
|
||||
sodipodi:cx="28.633835"
|
||||
sodipodi:type="arc"
|
||||
id="path979"
|
||||
style="font-variation-settings:'wght' 700;mix-blend-mode:normal;fill:#688e26;fill-opacity:1;stroke:#35185a;stroke-width:2.834;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;paint-order:stroke fill markers" />
|
||||
<path
|
||||
style="fill:#35185a;fill-opacity:0;stroke:#35185a;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
d="m 24.087931,10.789236 h -10.41137 c -0.859457,0 -1.396618,0.93039 -0.966889,1.674701 l 2.451577,4.246256 c 0.2191,0.379493 0.624015,0.613271 1.062216,0.613271 h 7.864466 m 0,-6.534228 h 10.41137 c 0.859457,0 1.396618,0.93039 0.966889,1.674701 l -2.451577,4.246256 c -0.2191,0.379493 -0.624015,0.613271 -1.062216,0.613271 h -7.864466"
|
||||
id="path863"
|
||||
sodipodi:nodetypes="cccc"
|
||||
inkscape:original-d="M 24.087931,10.789236 H 11.742782 l 3.772539,6.534228 h 8.57261"
|
||||
inkscape:path-effect="#path-effect875;#path-effect873"
|
||||
transform="matrix(1,0,0,0.68612415,0,3.7150793)"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<path
|
||||
inkscape:path-effect="#path-effect896;#path-effect898"
|
||||
inkscape:original-d="M 24.087931,10.789236 H 11.742782 l 3.772539,6.534228 h 8.57261"
|
||||
sodipodi:nodetypes="cccc"
|
||||
id="path863-8"
|
||||
d="m 24.087931,10.789236 h -10.41137 c -0.859457,0 -1.396618,0.93039 -0.966889,1.674701 l 2.451577,4.246256 c 0.2191,0.379493 0.624015,0.613271 1.062216,0.613271 h 7.864466 m 0,-6.534228 h 10.41137 c 0.859457,0 1.396618,0.93039 0.966889,1.674701 l -2.451577,4.246256 c -0.2191,0.379493 -0.624015,0.613271 -1.062216,0.613271 h -7.864466"
|
||||
style="fill:none;fill-opacity:1;stroke:#35185a;stroke-width:0.264583px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
|
||||
transform="matrix(-0.67499607,0,0,-0.40562746,40.347189,15.060924)"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<g
|
||||
id="g931"
|
||||
inkscape:path-effect="#path-effect933"
|
||||
transform="matrix(0.98544691,0,0,0.98544691,0.21734233,0.22302668)"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646">
|
||||
<path
|
||||
d="m 17.89465,13.809577 c 0,0.516139 -0.275356,0.99307 -0.722345,1.25114 -0.44699,0.258069 -0.997703,0.258069 -1.444692,0 -0.446989,-0.25807 -0.722346,-0.735001 -0.722346,-1.25114 h 1.444692 z m 12.606654,0 c 0,0.516139 0.275356,0.99307 0.722345,1.25114 0.44699,0.258069 0.997703,0.258069 1.444692,0 0.446989,-0.25807 0.722346,-0.735001 0.722346,-1.25114 h -1.444692 z"
|
||||
sodipodi:arc-type="slice"
|
||||
sodipodi:end="3.1415927"
|
||||
sodipodi:start="0"
|
||||
sodipodi:ry="1.4446917"
|
||||
sodipodi:rx="1.4446917"
|
||||
sodipodi:cy="13.809577"
|
||||
sodipodi:cx="16.449959"
|
||||
sodipodi:type="arc"
|
||||
id="path906"
|
||||
style="fill:none;fill-opacity:1;stroke:#35185a;stroke-width:0.141635;stroke-linecap:round;stroke-opacity:1" />
|
||||
<path
|
||||
style="fill:none;fill-opacity:1;stroke:#35185a;stroke-width:0.141635;stroke-linecap:round;stroke-opacity:1"
|
||||
id="path908"
|
||||
sodipodi:type="arc"
|
||||
sodipodi:cx="19.547373"
|
||||
sodipodi:cy="13.809577"
|
||||
sodipodi:rx="1.4446917"
|
||||
sodipodi:ry="1.4446917"
|
||||
sodipodi:start="0"
|
||||
sodipodi:end="3.1415927"
|
||||
sodipodi:arc-type="slice"
|
||||
d="m 20.992064,13.809577 c 0,0.516139 -0.275356,0.99307 -0.722345,1.25114 -0.44699,0.258069 -0.997703,0.258069 -1.444692,0 -0.446989,-0.25807 -0.722346,-0.735001 -0.722346,-1.25114 h 1.444692 z m 6.411826,0 c 0,0.516139 0.275356,0.99307 0.722345,1.25114 0.44699,0.258069 0.997703,0.258069 1.444692,0 0.446989,-0.25807 0.722346,-0.735001 0.722346,-1.25114 h -1.444692 z" />
|
||||
<path
|
||||
style="fill:none;fill-opacity:1;stroke:#35185a;stroke-width:0.141635;stroke-linecap:round;stroke-opacity:1"
|
||||
id="path906-6"
|
||||
sodipodi:type="arc"
|
||||
sodipodi:cx="22.64736"
|
||||
sodipodi:cy="13.809577"
|
||||
sodipodi:rx="1.4446917"
|
||||
sodipodi:ry="1.4446917"
|
||||
sodipodi:start="0"
|
||||
sodipodi:end="3.1415927"
|
||||
sodipodi:arc-type="slice"
|
||||
d="m 24.092052,13.809577 c 0,0.516139 -0.275357,0.99307 -0.722346,1.25114 -0.44699,0.258069 -0.997703,0.258069 -1.444692,0 -0.446989,-0.25807 -0.722346,-0.735001 -0.722346,-1.25114 h 1.444692 z m 0.21185,0 c 0,0.516139 0.275357,0.99307 0.722346,1.25114 0.44699,0.258069 0.997703,0.258069 1.444692,0 0.446989,-0.25807 0.722346,-0.735001 0.722346,-1.25114 h -1.444692 z" />
|
||||
</g>
|
||||
<path
|
||||
style="fill:#35185a;fill-opacity:0;stroke:none;stroke-width:0.0194533;stroke-linecap:round;stroke-opacity:1"
|
||||
d="m 60.839149,58.589236 c -1.142597,-0.09331 -2.207846,-0.524549 -2.865794,-1.160143 -0.164868,-0.159266 -9.292094,-10.983964 -9.574525,-11.355184 -0.303686,-0.399159 -0.429649,-0.784273 -0.407842,-1.24693 0.02282,-0.484087 0.202576,-0.868101 0.604522,-1.291417 0.519984,-0.547631 1.227896,-0.90187 2.168345,-1.085038 l 0.295953,-0.05764 39.786475,-0.0083 c 28.413597,-0.0059 39.871077,-3.06e-4 40.082427,0.0196 1.59021,0.149734 2.88448,1.030138 3.1288,2.128311 0.064,0.287534 0.041,0.70402 -0.053,0.959883 -0.0807,0.21978 -0.20788,0.448223 -0.34436,0.618695 -0.37269,0.465523 -9.39015,11.162257 -9.51235,11.283792 -0.59012,0.586881 -1.43643,0.971191 -2.5609,1.162906 -0.25853,0.04408 -1.57262,0.04621 -30.380295,0.04927 -16.560541,0.0018 -30.225883,-0.0063 -30.367426,-0.01782 z m 1.892205,-0.693177 c 1.008145,-0.122025 1.965943,-0.505487 2.769287,-1.108705 1.398597,-1.050184 2.247639,-2.766897 2.248296,-4.545924 l 8.8e-5,-0.23805 h -5.66568 -5.665681 l 0.01764,0.391024 c 0.05254,1.164265 0.348408,2.10567 0.943301,3.001412 0.450649,0.678551 0.957482,1.181334 1.641025,1.627914 0.656227,0.428733 1.524566,0.751701 2.307597,0.858282 0.312297,0.04251 1.103588,0.05042 1.404122,0.01405 z m 11.631318,-0.01425 c 2.380346,-0.308828 4.328704,-2.122817 4.797814,-4.466928 0.08253,-0.412383 0.117867,-0.746555 0.117867,-1.114535 V 52.00338 h -5.652464 -5.652464 l 0.01436,0.482533 c 0.0252,0.846558 0.204316,1.562125 0.577733,2.308009 0.733555,1.465242 2.038375,2.529854 3.609942,2.945379 0.269923,0.07137 0.646012,0.142633 0.874994,0.165803 0.26769,0.02709 1.027925,0.01359 1.312215,-0.02329 z m 11.453072,0.01425 c 0.815059,-0.09865 1.673408,-0.397143 2.328353,-0.809679 0.936578,-0.58993 1.627766,-1.35301 2.09824,-2.316476 0.372578,-0.762994 0.545448,-1.465359 0.582666,-2.36737 l 0.01647,-0.399154 H 85.171691 79.50191 l 0.01647,0.399154 c 0.03559,0.862436 0.206056,1.581879 0.542645,2.290165 0.453782,0.954897 1.113697,1.712994 2.008267,2.307058 0.697991,0.46352 1.575372,0.787429 2.420418,0.893562 0.256726,0.03224 1.068429,0.03392 1.326032,0.0027 z m 11.555063,-5.61e-4 c 2.146627,-0.265348 3.915343,-1.660422 4.664213,-3.678899 0.19636,-0.529259 0.31295,-1.1475 0.34336,-1.820758 l 0.0177,-0.392461 h -5.66946 -5.669465 l 0.01568,0.431063 c 0.05273,1.449779 0.594152,2.738041 1.584253,3.769587 0.876777,0.913477 2.040853,1.501682 3.323321,1.679267 0.300867,0.04166 1.095621,0.04864 1.39037,0.0122 z m 11.623843,-0.0124 c 1.01975,-0.132136 1.99984,-0.549097 2.81288,-1.196683 0.27722,-0.220806 0.76521,-0.721231 0.96908,-0.993779 0.71924,-0.961501 1.09835,-2.041839 1.13433,-3.232462 l 0.0138,-0.456798 h -5.65597 -5.65597 l 0.0144,0.469666 c 0.008,0.258316 0.0329,0.573893 0.0556,0.701281 0.22055,1.240496 0.75206,2.267533 1.61433,3.119355 0.47106,0.465362 0.90861,0.775375 1.50126,1.063687 0.56005,0.27245 1.12606,0.445669 1.71139,0.523747 0.37176,0.04959 1.10988,0.05058 1.48488,0.002 z m 11.78156,-0.03469 c 0.61118,-0.116373 1.06271,-0.268848 1.5953,-0.538703 1.30497,-0.661211 2.30356,-1.808851 2.77725,-3.191771 0.19454,-0.567968 0.28436,-1.08441 0.30844,-1.773565 l 0.0119,-0.34099 h -5.66362 -5.66362 l 0.0153,0.431063 c 0.0315,0.887454 0.20855,1.597065 0.58916,2.361018 0.84016,1.686402 2.41501,2.813001 4.3185,3.089342 0.37416,0.05432 1.34319,0.03371 1.71138,-0.03639 z"
|
||||
id="path969"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646"
|
||||
transform="scale(0.26458333)" />
|
||||
<path
|
||||
style="fill:#35185a;fill-opacity:1;stroke:#35185a;stroke-width:0.0334066;stroke-linecap:round;stroke-opacity:1"
|
||||
d="m 100.5298,41.981141 c -15.624906,0.01072 -31.249865,-0.0041 -46.87473,0.03578 -1.039624,0.02394 -2.085658,-0.02858 -3.121051,0.07082 -1.128071,0.253419 -2.271734,0.891143 -2.765762,1.983041 -0.350827,0.789345 -0.149624,1.741198 0.426068,2.370074 3.094249,3.685534 6.1823,7.376726 9.294838,11.046656 1.013733,1.089552 2.555503,1.567043 4.016404,1.485543 18.562036,0.0075 37.124099,0.01 55.686123,-0.01317 1.57941,-0.0197 3.16164,0.02202 4.73914,-0.06135 0.77035,-0.173856 1.56199,-0.439035 2.16646,-0.965367 1.1499,-1.142589 2.14504,-2.429187 3.20549,-3.653012 2.27089,-2.708381 4.56936,-5.394841 6.80216,-8.134489 0.47225,-0.673634 0.53862,-1.616338 0.0802,-2.315101 -0.45116,-0.73531 -1.17253,-1.285495 -1.99473,-1.544267 -1.06727,-0.405663 -2.22377,-0.248963 -3.33774,-0.288028 -9.44091,-0.02587 -18.88192,-0.01553 -28.32286,-0.01713 z M 62.094507,52.408549 c 1.752373,0 3.504747,0 5.257121,0 -0.05169,1.287348 -0.547297,2.55812 -1.456941,3.486161 -0.945084,1.003235 -2.336883,1.658468 -3.74105,1.616894 -2.346997,0.118464 -4.598872,-1.63866 -5.146726,-3.908776 -0.09935,-0.390635 -0.15444,-0.791875 -0.173669,-1.194279 1.753755,0 3.50751,0 5.261265,0 z m 11.533298,0 c 1.753053,0.0063 3.531929,-0.01256 5.268861,0.0094 -0.07169,1.339475 -0.605662,2.683303 -1.604948,3.600743 -0.768085,0.80005 -1.827263,1.310518 -2.921807,1.458995 -0.919685,0.0846 -1.87546,0.05785 -2.729118,-0.334846 -1.530359,-0.617907 -2.751312,-2.008172 -3.113531,-3.609593 -0.08871,-0.367145 -0.13874,-0.754103 -0.154076,-1.124708 1.75154,0 3.503079,0 5.254619,0 z m 11.550648,0 c 1.751942,0 3.503884,0 5.255826,0 -0.05498,1.880385 -1.165573,3.705954 -2.861963,4.545159 -0.768407,0.399974 -1.634067,0.597168 -2.500464,0.559873 -1.256844,0.02309 -2.49985,-0.501542 -3.429106,-1.334716 -0.788675,-0.748594 -1.401404,-1.708488 -1.605405,-2.797094 -0.06751,-0.319956 -0.113137,-0.645786 -0.115406,-0.973222 1.752173,0 3.504345,0 5.256518,0 z m 11.534162,0 c 1.750876,0 3.501755,0 5.252635,0 -6.7e-4,1.940214 -1.21507,3.791409 -2.967571,4.607675 -0.941185,0.48259 -2.026519,0.564517 -3.063642,0.463952 -1.847899,-0.284921 -3.516587,-1.59356 -4.136978,-3.371687 -0.199979,-0.544441 -0.306335,-1.121052 -0.331295,-1.69994 1.748949,0 3.497902,0 5.246851,0 z m 11.552715,0 c 1.75353,0 3.50706,0 5.26058,0 -0.0483,1.339478 -0.57179,2.630046 -1.5304,3.568162 -0.9346,0.944584 -2.2401,1.549748 -3.57986,1.53086 -0.84134,0.08077 -1.67576,-0.162821 -2.44134,-0.492728 -1.03601,-0.51283 -1.89442,-1.383754 -2.42386,-2.409705 -0.34363,-0.687548 -0.49716,-1.446492 -0.54224,-2.196589 1.75238,0 3.50475,0 5.25712,0 z m 11.54081,0 c 1.75278,0 3.50556,0 5.25833,0 -0.0488,1.261424 -0.51726,2.518415 -1.40834,3.427293 -0.92781,1.019206 -2.27089,1.683834 -3.66164,1.66997 -0.82227,0.08494 -1.63768,-0.139202 -2.39253,-0.448502 -1.02375,-0.469995 -1.84373,-1.289497 -2.40833,-2.252781 -0.41537,-0.738415 -0.60178,-1.559916 -0.64703,-2.39598 1.75318,0 3.50636,0 5.25954,0 z"
|
||||
id="path975"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646"
|
||||
transform="scale(0.26458333)" />
|
||||
<rect
|
||||
style="fill:none;fill-opacity:1;stroke:#35185a;stroke-width:0.05;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
id="rect977"
|
||||
width="2.5958393"
|
||||
height="0.17676066"
|
||||
x="21.741636"
|
||||
y="8.6375818"
|
||||
rx="0.1586249"
|
||||
ry="0.074778207"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<rect
|
||||
ry="0.074778207"
|
||||
rx="0.1586249"
|
||||
y="8.9901352"
|
||||
x="22.051559"
|
||||
height="0.17676066"
|
||||
width="2.5958395"
|
||||
id="rect977-5"
|
||||
style="fill:none;fill-opacity:1;stroke:#35185a;stroke-width:0.0499999;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<rect
|
||||
ry="0.074778207"
|
||||
rx="0.1586249"
|
||||
y="9.3622065"
|
||||
x="22.423628"
|
||||
height="0.17676066"
|
||||
width="2.5958395"
|
||||
id="rect977-2"
|
||||
style="fill:none;fill-opacity:1;stroke:#35185a;stroke-width:0.0499999;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<path
|
||||
style="fill:#35185a;fill-opacity:1;stroke:#35185a;stroke-width:0.00590551;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
d="m 84.501308,30.491633 c -4.578124,0.0075 -9.156441,-0.01371 -13.734429,0.02525 -0.693567,-0.01774 -1.390723,0.195106 -1.967292,0.578202 -1.340862,1.306989 -2.618146,2.678056 -3.921631,4.022187 -0.928179,0.979151 -1.884243,1.932938 -2.787903,2.934783 -0.296924,0.387827 -0.253972,0.964169 0.073,1.321595 0.453039,0.536154 1.165881,0.790805 1.846924,0.862427 9.088796,0.02919 18.177699,0.01801 27.266541,0.02098 8.971612,-0.0035 17.943722,9.79e-4 26.915032,-0.0075 0.67701,-0.159585 1.4309,-0.390888 1.83118,-1.006164 0.27401,-0.42712 0.20268,-1.042849 -0.1938,-1.371596 -2.08805,-2.215504 -4.20148,-4.40741 -6.33794,-6.57628 -0.41935,-0.445875 -1.03719,-0.630893 -1.61981,-0.752075 -1.12915,-0.06287 -2.26223,-0.02992 -3.39294,-0.0446 -7.9923,-0.01217 -15.984625,-0.0056 -23.97693,-0.0072 z m 0.931336,2.152832 c 1.991263,0.01019 3.993432,-0.0229 5.978121,0.02435 0.20274,0.01796 0.49119,-0.01541 0.573759,0.224553 0.06009,0.217689 -0.148816,0.405783 -0.358582,0.38678 -1.989608,0.04777 -3.991315,0.02099 -5.985535,0.03298 -1.043119,-0.01138 -2.088546,0.0277 -3.130249,-0.03035 -0.205687,-0.01898 -0.475698,-0.243439 -0.294983,-0.450256 0.130309,-0.212203 0.428219,-0.133687 0.627544,-0.167934 0.862957,-0.02591 1.726689,-0.01689 2.589925,-0.02012 z m 4.653564,1.317505 c 0.887729,0.01056 1.777847,-0.01728 2.664124,0.03168 0.208257,0.02208 0.514584,0.173208 0.392761,0.426697 -0.08105,0.133587 -0.264999,0.197053 -0.405884,0.227421 -3.009715,-0.0043 -6.019854,0.02491 -9.029297,-0.01581 -0.190892,-0.02956 -0.429268,-0.16786 -0.359863,-0.396119 0.06704,-0.205168 0.332926,-0.248012 0.524142,-0.24539 2.070841,-0.03742 4.142853,-0.02119 6.214017,-0.02847 z m 1.40625,1.40625 c 0.887729,0.01056 1.777848,-0.01728 2.664123,0.03168 0.208257,0.02208 0.514585,0.173208 0.392763,0.426697 -0.08105,0.133587 -0.265,0.197053 -0.405885,0.227421 -3.009715,-0.0043 -6.019854,0.02491 -9.029297,-0.01581 -0.190892,-0.02956 -0.429268,-0.16786 -0.359863,-0.396119 0.06704,-0.205168 0.332926,-0.248012 0.524142,-0.24539 2.070841,-0.03742 4.142853,-0.02119 6.214017,-0.02847 z"
|
||||
id="path1004"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646"
|
||||
transform="scale(0.26458333)" />
|
||||
<rect
|
||||
style="fill:#35185a;fill-opacity:1;stroke:#35185a;stroke-width:0.044635;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
id="rect1014"
|
||||
width="14.53014"
|
||||
height="0.8528896"
|
||||
x="30.362129"
|
||||
y="8.6211557"
|
||||
rx="0.14023046"
|
||||
ry="0.14540984"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<rect
|
||||
style="fill:#35185a;fill-opacity:1;stroke:#35185a;stroke-width:0.0506043;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
id="rect1016"
|
||||
width="2.0594873"
|
||||
height="1.0700072"
|
||||
x="42.406349"
|
||||
y="8.506938"
|
||||
rx="0.15056987"
|
||||
ry="0.12785782"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<rect
|
||||
style="fill:#35185a;fill-opacity:1;stroke:#35185a;stroke-width:0.0396433;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
id="rect1018"
|
||||
width="2.9120724"
|
||||
height="1.4533808"
|
||||
x="29.59572"
|
||||
y="8.3237476"
|
||||
rx="0.13227929"
|
||||
ry="0.12945224"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<path
|
||||
style="font-variation-settings:'wght' 700;fill:#35185a;fill-opacity:1;stroke:#35185a;stroke-width:0.057007;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
id="path1028"
|
||||
sodipodi:type="arc"
|
||||
sodipodi:cx="-21.117058"
|
||||
sodipodi:cy="-8.0305481"
|
||||
sodipodi:rx="2.0635529"
|
||||
sodipodi:ry="0.47371906"
|
||||
sodipodi:start="0"
|
||||
sodipodi:end="3.1415927"
|
||||
sodipodi:arc-type="slice"
|
||||
d="m -19.053505,-8.0305481 a 2.0635529,0.47371906 0 0 1 -1.031776,0.4102527 2.0635529,0.47371906 0 0 1 -2.063553,0 2.0635529,0.47371906 0 0 1 -1.031777,-0.4102527 h 2.063553 z"
|
||||
transform="scale(-1)"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
<path
|
||||
transform="scale(-1)"
|
||||
d="m -23.800879,-8.067503 a 2.0635529,0.47371906 0 0 1 -1.031776,0.4102528 2.0635529,0.47371906 0 0 1 -2.063553,0 2.0635529,0.47371906 0 0 1 -1.031776,-0.4102528 h 2.063553 z"
|
||||
sodipodi:arc-type="slice"
|
||||
sodipodi:end="3.1415927"
|
||||
sodipodi:start="0"
|
||||
sodipodi:ry="0.47371906"
|
||||
sodipodi:rx="2.0635529"
|
||||
sodipodi:cy="-8.067503"
|
||||
sodipodi:cx="-25.864431"
|
||||
sodipodi:type="arc"
|
||||
id="path1030"
|
||||
style="font-variation-settings:'wght' 700;fill:#35185a;fill-opacity:1;stroke:#35185a;stroke-width:0.057007;stroke-linecap:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;paint-order:stroke fill markers"
|
||||
inkscape:export-xdpi="73.4646"
|
||||
inkscape:export-ydpi="73.4646" />
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 24 KiB |
14
project-warstone/src/App.tsx
Normal file
14
project-warstone/src/App.tsx
Normal file
@@ -0,0 +1,14 @@
|
||||
import { RecoilRoot } from 'recoil'
|
||||
import { TextMapper } from './components/Importer/text-mapper'
|
||||
import { SchemaBuilder } from './components/SchemaBuilder'
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<RecoilRoot>
|
||||
{/* <TextMapper /> */}
|
||||
<SchemaBuilder />
|
||||
</RecoilRoot>
|
||||
)
|
||||
}
|
||||
|
||||
export default App
|
1
project-warstone/src/assets/react.svg
Normal file
1
project-warstone/src/assets/react.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>
|
After Width: | Height: | Size: 4.0 KiB |
@@ -0,0 +1,32 @@
|
||||
import React, { useState, useEffect, ReactNode, useRef, useLayoutEffect, useCallback } from 'react';
|
||||
import { FCC } from '../../types';
|
||||
|
||||
interface IProps {
|
||||
currentPage: number;
|
||||
}
|
||||
|
||||
const AnimatedPageContainer: FCC<IProps> = ({ children, currentPage }) => {
|
||||
const [uuid] = useState(crypto.randomUUID());
|
||||
|
||||
const renderChild = (child: ReactNode, index: number) => {
|
||||
const isActive = index === currentPage;
|
||||
|
||||
return (
|
||||
<div
|
||||
key={`page container ${uuid}: ${index}`}
|
||||
data-active={isActive}
|
||||
className="data-[active=true]:opacity-100 data-[active=true]:static opacity-0 top-0 left-0 absolute transition-opacity duration-300 data-[active=false]:-z-10"
|
||||
>
|
||||
{child}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="relative">
|
||||
{React.Children.map(children, renderChild)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default AnimatedPageContainer;
|
1066
project-warstone/src/components/Importer/text-mapper.tsx
Normal file
1066
project-warstone/src/components/Importer/text-mapper.tsx
Normal file
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,53 @@
|
||||
import { FC, useCallback, useEffect } from 'react'
|
||||
import { FieldType, FieldTypes, fieldTypeOptions, fieldTypesWithValues } from '../../types/schema'
|
||||
import { useObjectStateWrapper } from '../../hooks/useObjectState';
|
||||
import { FieldTypeInput } from './field-type-input';
|
||||
import { InputBinder } from '../../types/inputBinder';
|
||||
import { ValueField } from './value-field';
|
||||
|
||||
interface IProps {
|
||||
update: (arg: FieldType) => void;
|
||||
field: FieldType;
|
||||
fieldName: string;
|
||||
}
|
||||
|
||||
export const FieldEditor: FC<IProps> = ({ update, field, fieldName }) => {
|
||||
const { update: updateField, bindProperty, bindPropertyCheck } = useObjectStateWrapper(field, (e) => update(typeof e === 'function' ? e(field) : e))
|
||||
|
||||
const shouldShowValueField = useCallback(() => fieldTypesWithValues.includes(field.type) || field.isConstant, [field.isConstant, field.type]);
|
||||
|
||||
useEffect(() => {
|
||||
console.log(field.value);
|
||||
}, [field])
|
||||
|
||||
return (
|
||||
<li className="odd:bg-black/50 flex gap-4 items-center p-2">
|
||||
<p>{fieldName}</p>
|
||||
<select className="capitalize" {...bindProperty('type')}>
|
||||
{fieldTypeOptions.map(o => (
|
||||
<option className="capitalize" value={FieldTypes[o]}>{o}</option>
|
||||
))}
|
||||
</select>
|
||||
{shouldShowValueField() && (
|
||||
// <>
|
||||
// {field.type === FieldTypes.dice && (
|
||||
// <label>
|
||||
// Sides:
|
||||
// <select {...bindProperty('value')}>
|
||||
// {diceSides.map(d => (
|
||||
// <option value={'d' + d}>{d}</option>
|
||||
// ))}
|
||||
// </select>
|
||||
// </label>
|
||||
// )}
|
||||
// {field.type === FieldTypes.type && (
|
||||
// <FieldTypeInput bind={bindProperty('value')} />
|
||||
|
||||
// )}
|
||||
// </>
|
||||
<ValueField type={field.type} bind={bindProperty('value')} />
|
||||
)}
|
||||
<label><input type="checkbox" {...bindPropertyCheck('isConstant')} /> Is constant</label>
|
||||
</li>
|
||||
)
|
||||
}
|
@@ -0,0 +1,23 @@
|
||||
import { useRecoilValue } from 'recoil';
|
||||
import { SchemaEditAtom } from '../../recoil/atoms/schema';
|
||||
import { FCC } from '../../types'
|
||||
import { InputBinder } from '../../types/inputBinder'
|
||||
|
||||
interface IProps {
|
||||
bind: InputBinder
|
||||
}
|
||||
|
||||
export const FieldTypeInput: FCC<IProps> = ({ bind }) => {
|
||||
const Schema = useRecoilValue(SchemaEditAtom);
|
||||
|
||||
return (
|
||||
<>
|
||||
<input type="text" {...bind} list="type-editor-type-list" />
|
||||
<optgroup id="type-editor-type-list">
|
||||
{Object.keys(Schema.types).map(k => (
|
||||
<option className="capitalize" value={k}>{k}</option>
|
||||
))}
|
||||
</optgroup>
|
||||
</>
|
||||
)
|
||||
}
|
45
project-warstone/src/components/SchemaBuilder/index.tsx
Normal file
45
project-warstone/src/components/SchemaBuilder/index.tsx
Normal file
@@ -0,0 +1,45 @@
|
||||
import { FC, useCallback, useState } from 'react'
|
||||
import AnimatedPageContainer from '../AnimatedPageContainer';
|
||||
import { TypeEditor } from './type-editor';
|
||||
import { useObjectState, useObjectStateWrapper } from '../../hooks/useObjectState';
|
||||
import { Schema, TypeType } from '../../types/schema';
|
||||
import { useInput } from '../../hooks/useInput';
|
||||
import { useRecoilState } from 'recoil';
|
||||
import { SchemaEditAtom } from '../../recoil/atoms/schema';
|
||||
|
||||
|
||||
export const SchemaBuilder: FC = () => {
|
||||
const [schema, setSchema] = useRecoilState(SchemaEditAtom);
|
||||
const {update: updateSchema} = useObjectStateWrapper<Schema>(schema, setSchema);
|
||||
|
||||
const {value: typeName, bind: bindTypeName, reset: resetTypeName} = useInput('');
|
||||
|
||||
const [pageNumber, setPageNumber] = useState(1);
|
||||
|
||||
const saveType = useCallback((name: string, type: TypeType) => {
|
||||
updateSchema(e => ({
|
||||
types: {
|
||||
...e.types,
|
||||
}
|
||||
}));
|
||||
resetTypeName();
|
||||
}, [resetTypeName, updateSchema]);
|
||||
|
||||
return (
|
||||
<div className="container flex gap-4 p-8">
|
||||
<div className="panel w-2/3 h-full">
|
||||
<AnimatedPageContainer currentPage={pageNumber}>
|
||||
<div>
|
||||
<p className="subheader">Add A Type</p>
|
||||
<input type="text" {...bindTypeName} />
|
||||
<button className="interactive" disabled={!typeName} onClick={() => setPageNumber(1)}>Configure</button>
|
||||
</div>
|
||||
<TypeEditor name={typeName} saveType={saveType} />
|
||||
</AnimatedPageContainer>
|
||||
</div>
|
||||
<div className="panel w-1/3 whitespace-pre-wrap">
|
||||
{JSON.stringify(schema, null, 2)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
@@ -0,0 +1,52 @@
|
||||
import { FC, useCallback } from 'react'
|
||||
import { FCC } from '../../types'
|
||||
import { FieldType, FieldTypes, TypeType } from '../../types/schema'
|
||||
import { useObjectState } from '../../hooks/useObjectState';
|
||||
import { useInput } from '../../hooks/useInput';
|
||||
import { FieldEditor } from './field-editor';
|
||||
|
||||
interface IProps {
|
||||
name: string;
|
||||
saveType: (arg0: string, arg1: TypeType) => void;
|
||||
}
|
||||
|
||||
const constantProperties = ['metadata'];
|
||||
|
||||
export const TypeEditor: FCC<IProps> = ({ saveType, name }) => {
|
||||
const { update: updateType, reset: resetType, state: type } = useObjectState<TypeType>({});
|
||||
|
||||
const { value: propertyName, setValue: setPropertyName, bind: bindPropertyName, reset: resetPropertyName } = useInput('');
|
||||
|
||||
const save = () => {
|
||||
saveType(name, type);
|
||||
resetType();
|
||||
}
|
||||
|
||||
const addField = useCallback(() => {
|
||||
updateType({
|
||||
[propertyName]: {
|
||||
type: FieldTypes.number,
|
||||
value: '',
|
||||
isConstant: false,
|
||||
limit: 1,
|
||||
}
|
||||
})
|
||||
}, [propertyName, updateType])
|
||||
|
||||
const updateField = useCallback((k: keyof typeof type) => (field: FieldType) => {
|
||||
updateType({ [k]: field })
|
||||
}, [updateType])
|
||||
|
||||
return (
|
||||
<div>
|
||||
<p className="subheader">Creating type "{name}"</p>
|
||||
<input type="text" {...bindPropertyName} />
|
||||
<button disabled={!propertyName} onClick={addField}>Add Field</button>
|
||||
<ul>
|
||||
{Object.entries(type).filter(([k]) => !constantProperties.includes(k)).map(([key, value]) => (
|
||||
<FieldEditor field={value} update={updateField(key)} fieldName={key} />
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
)
|
||||
}
|
@@ -0,0 +1,37 @@
|
||||
import { FC } from 'react';
|
||||
import { FieldTypes } from '../../types/schema';
|
||||
import { InputBinder } from '../../types/inputBinder';
|
||||
import { FieldTypeInput } from './field-type-input';
|
||||
|
||||
interface IValueProps {
|
||||
type: FieldTypes;
|
||||
bind: InputBinder;
|
||||
}
|
||||
|
||||
const diceSides = [3, 4, 6, 8, 10, 12, 20, 100];
|
||||
|
||||
export const ValueField: FC<IValueProps> = ({type, bind}) => {
|
||||
switch (type) {
|
||||
case FieldTypes.dice:
|
||||
return (
|
||||
<label>
|
||||
Sides:
|
||||
<select {...bind}>
|
||||
{diceSides.map(d => (
|
||||
<option value={'d' + d}>{d}</option>
|
||||
))}
|
||||
</select>
|
||||
</label>
|
||||
);
|
||||
case FieldTypes.type:
|
||||
return (
|
||||
<FieldTypeInput bind={bind} />
|
||||
)
|
||||
case FieldTypes.number:
|
||||
return (
|
||||
<input type="number" {...bind} />
|
||||
)
|
||||
default:
|
||||
return <></>;
|
||||
}
|
||||
}
|
35
project-warstone/src/hooks/useInput.ts
Normal file
35
project-warstone/src/hooks/useInput.ts
Normal file
@@ -0,0 +1,35 @@
|
||||
import { useState, ChangeEvent } from 'react';
|
||||
|
||||
export const useInput = <T extends string | number>(initialValue: T) => {
|
||||
const [value, setValue] = useState<T>(initialValue);
|
||||
|
||||
return {
|
||||
value,
|
||||
setValue,
|
||||
reset: () => setValue(initialValue),
|
||||
bind: {
|
||||
value: value,
|
||||
onChange: (event: ChangeEvent<HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement>) => {
|
||||
const changed: string | number = typeof initialValue === 'number' ? parseInt(event.target.value) : event.target.value;
|
||||
setValue(changed as T);
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
export const useCheckbox = (initial: boolean) => {
|
||||
const [value, setValue] = useState(initial);
|
||||
|
||||
return {
|
||||
value,
|
||||
setValue,
|
||||
reset: () => setValue(initial),
|
||||
bind: {
|
||||
checked: value,
|
||||
onClick: () => {
|
||||
setValue(v => !v);
|
||||
},
|
||||
readOnly: true
|
||||
}
|
||||
};
|
||||
};
|
84
project-warstone/src/hooks/useObjectState.ts
Normal file
84
project-warstone/src/hooks/useObjectState.ts
Normal file
@@ -0,0 +1,84 @@
|
||||
import React, { ChangeEvent, useCallback, useState } from 'react';
|
||||
import { InputBinder } from '../types/inputBinder';
|
||||
|
||||
export const useObjectState = <T extends object>(initial: T) => {
|
||||
const [state, setState] = useState<T>(initial || {} as T);
|
||||
|
||||
const bindProperty = useCallback(<K extends keyof T>(property: K) => ({
|
||||
value: state[property] ?? '',
|
||||
name: property,
|
||||
onChange: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) =>
|
||||
setState(value => (
|
||||
{
|
||||
...value,
|
||||
[event.target.name]: (
|
||||
(typeof value[property] === 'number') ?
|
||||
Number(event.target.value) || 0 :
|
||||
event.target.value)
|
||||
}
|
||||
))
|
||||
}), [state])
|
||||
|
||||
const bindPropertyCheck = useCallback(<K extends keyof T>(property: K) => ({
|
||||
checked: !!state[property],
|
||||
name: property,
|
||||
onChange: (event: ChangeEvent<HTMLInputElement>) => setState(value => ({
|
||||
...value, [event.target.name]: (event.target.checked)
|
||||
})),
|
||||
readOnly: true
|
||||
}), [state])
|
||||
|
||||
const update = useCallback((updates: Partial<T>) => setState(s => ({ ...s, ...updates })), [])
|
||||
|
||||
const reset = useCallback(() => {
|
||||
setState(initial);
|
||||
}, [initial])
|
||||
|
||||
return {
|
||||
bindProperty,
|
||||
bindPropertyCheck,
|
||||
update,
|
||||
state,
|
||||
setState,
|
||||
reset
|
||||
}
|
||||
}
|
||||
|
||||
export const useObjectStateWrapper = <T extends object>(state: T, setState: React.Dispatch<React.SetStateAction<T>>) => {
|
||||
|
||||
const bindProperty = useCallback(<K extends keyof T>(property: K): InputBinder => ({
|
||||
value: state[property] ?? '',
|
||||
name: property.toString(),
|
||||
onChange: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) =>
|
||||
setState(value => (
|
||||
{
|
||||
...value,
|
||||
[event.target.name]: (
|
||||
(typeof value[property] === 'number') ?
|
||||
Number(event.target.value) || 0 :
|
||||
event.target.value)
|
||||
}
|
||||
))
|
||||
}), [setState, state])
|
||||
|
||||
const bindPropertyCheck = useCallback(<K extends keyof T>(property: K) => ({
|
||||
checked: !!state[property],
|
||||
name: property,
|
||||
onChange: (event: ChangeEvent<HTMLInputElement>) => setState(value => ({
|
||||
...value, [event.target.name]: (event.target.checked)
|
||||
})),
|
||||
readOnly: true
|
||||
}), [setState, state])
|
||||
|
||||
const update = useCallback((updates: Partial<T> | ((arg: T) => Partial<T>)) =>
|
||||
setState(s => ({ ...s, ...(typeof updates === 'function' ? updates(s) : updates) }
|
||||
)), [setState])
|
||||
|
||||
return {
|
||||
bindProperty,
|
||||
bindPropertyCheck,
|
||||
update,
|
||||
state,
|
||||
setState
|
||||
}
|
||||
}
|
10
project-warstone/src/hooks/useQueryParams.ts
Normal file
10
project-warstone/src/hooks/useQueryParams.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import { useEffect, useRef } from 'react'
|
||||
import { QueryParams } from '../utils/queryParams'
|
||||
|
||||
export const useQueryParams = (options?: {clean: boolean}) => {
|
||||
const queryParams = useRef(new QueryParams(options))
|
||||
|
||||
useEffect(() => {
|
||||
console.log(queryParams.current.get('test'))
|
||||
}, [queryParams.current])
|
||||
}
|
19
project-warstone/src/hooks/useRefCallback.ts
Normal file
19
project-warstone/src/hooks/useRefCallback.ts
Normal file
@@ -0,0 +1,19 @@
|
||||
import { ReactNode, useCallback, useRef } from 'react'
|
||||
|
||||
export const useRefCallback = <T = ReactNode>() : [T | null, (arg: T) => void] => {
|
||||
const ref = useRef<T | null>(null);
|
||||
const setRef = useCallback((val: T) => {
|
||||
console.log(val);
|
||||
if (ref.current) {
|
||||
// does something?
|
||||
}
|
||||
|
||||
if (val) {
|
||||
// also does something?
|
||||
}
|
||||
|
||||
ref.current = val
|
||||
}, [])
|
||||
|
||||
return [ref.current, setRef]
|
||||
}
|
39
project-warstone/src/index.css
Normal file
39
project-warstone/src/index.css
Normal file
@@ -0,0 +1,39 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
@layer base {
|
||||
body {
|
||||
@apply bg-bastille text-white
|
||||
}
|
||||
input, select {
|
||||
@apply p-1 rounded-lg text-cinder-500
|
||||
}
|
||||
}
|
||||
|
||||
@layer components {
|
||||
.panel {
|
||||
@apply bg-cinder shadow-xl p-8 rounded-xl
|
||||
}
|
||||
.header {
|
||||
@apply text-2xl font-bold
|
||||
}
|
||||
.subheader {
|
||||
@apply text-xl font-bold
|
||||
}
|
||||
button {
|
||||
@apply interactive bg-olive-drab p-1
|
||||
}
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
.interactive {
|
||||
@apply border-2 rounded-lg border-falcon cursor-pointer
|
||||
}
|
||||
.interactive svg {
|
||||
@apply fill-falcon
|
||||
}
|
||||
.interactive:disabled {
|
||||
@apply border-falcon-300 brightness-50 cursor-default
|
||||
}
|
||||
}
|
10
project-warstone/src/main.tsx
Normal file
10
project-warstone/src/main.tsx
Normal file
@@ -0,0 +1,10 @@
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import App from './App.tsx'
|
||||
import './index.css'
|
||||
|
||||
ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>,
|
||||
)
|
7
project-warstone/src/recoil/atoms/schema.ts
Normal file
7
project-warstone/src/recoil/atoms/schema.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import { atom } from 'recoil';
|
||||
import { Schema, TypeType } from '../../types/schema';
|
||||
|
||||
export const SchemaEditAtom = atom<Schema>({
|
||||
key: 'schema-edit',
|
||||
default: {name: '', types: {}}
|
||||
});
|
24
project-warstone/src/services/game-systems.ts
Normal file
24
project-warstone/src/services/game-systems.ts
Normal file
@@ -0,0 +1,24 @@
|
||||
import { Schema } from '../types/schema';
|
||||
|
||||
export const GameSystemsService = {
|
||||
// todo - connect to service to save schema for game
|
||||
saveSchema: async (schema: Schema) => {
|
||||
localStorage.setItem('schema', JSON.stringify(schema));
|
||||
|
||||
return { status: 200 }
|
||||
},
|
||||
// todo - connect to service to fetch schema for game
|
||||
getSchema: async (id: string) => {
|
||||
const schema = localStorage.getItem('schema');
|
||||
|
||||
if (schema)
|
||||
return {
|
||||
status: 200,
|
||||
json: async () => JSON.parse(schema)
|
||||
}
|
||||
|
||||
return {
|
||||
status: 404
|
||||
}
|
||||
}
|
||||
}
|
3
project-warstone/src/types.ts
Normal file
3
project-warstone/src/types.ts
Normal file
@@ -0,0 +1,3 @@
|
||||
import { FC, PropsWithChildren } from "react";
|
||||
|
||||
export type FCC<P=Record<string, never>> = FC<PropsWithChildren<P>>
|
7
project-warstone/src/types/inputBinder.ts
Normal file
7
project-warstone/src/types/inputBinder.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import { ChangeEvent } from 'react'
|
||||
|
||||
export type InputBinder = {
|
||||
name: string,
|
||||
value: string | number,
|
||||
onChange: (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement>) => void
|
||||
}
|
28
project-warstone/src/types/schema.ts
Normal file
28
project-warstone/src/types/schema.ts
Normal file
@@ -0,0 +1,28 @@
|
||||
export type MetadataType = {
|
||||
[key: string]: string
|
||||
}
|
||||
|
||||
export type FieldType = {
|
||||
type: FieldTypes;
|
||||
value: string;
|
||||
isConstant: boolean;
|
||||
limit: number;
|
||||
};
|
||||
|
||||
export type TypeType = Record<string, FieldType>;
|
||||
|
||||
export type Schema = {
|
||||
name: string;
|
||||
types: Record<string, TypeType>
|
||||
}
|
||||
|
||||
export enum FieldTypes {
|
||||
number = 'number',
|
||||
text = 'text',
|
||||
checkbox = 'checkbox',
|
||||
type = '@type',
|
||||
dice = 'dice'
|
||||
}
|
||||
|
||||
export const fieldTypeOptions: (keyof typeof FieldTypes)[] = ['number', 'text', 'checkbox', 'type', 'dice']
|
||||
export const fieldTypesWithValues = [FieldTypes.dice, FieldTypes.type];
|
20
project-warstone/src/utils/queryParams.ts
Normal file
20
project-warstone/src/utils/queryParams.ts
Normal file
@@ -0,0 +1,20 @@
|
||||
export class QueryParams {
|
||||
private params = new Map<string, string>()
|
||||
constructor(options?: {clean: boolean}) {
|
||||
if (!options?.clean) {
|
||||
const {search} = location;
|
||||
for (const [key, value] of search.replace('?', '').split('&').map(e => e.split('='))) {
|
||||
this.params.set(key, value);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
get = this.params.get
|
||||
set = this.params.set
|
||||
delete = this.params.delete
|
||||
clear = this.params.clear
|
||||
|
||||
apply() {
|
||||
location.search = '?' + encodeURIComponent(Array.from(this.params.entries()).map(e => e.join('=')).join('&'))
|
||||
}
|
||||
}
|
1
project-warstone/src/vite-env.d.ts
vendored
Normal file
1
project-warstone/src/vite-env.d.ts
vendored
Normal file
@@ -0,0 +1 @@
|
||||
/// <reference types="vite/client" />
|
54
project-warstone/tailwind.config.js
Normal file
54
project-warstone/tailwind.config.js
Normal file
@@ -0,0 +1,54 @@
|
||||
/** @type {import('tailwindcss').Config} */
|
||||
export default {
|
||||
content: [
|
||||
"./index.html",
|
||||
"./src/**/*.{js,ts,jsx,tsx}",
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
'cinder': {
|
||||
DEFAULT: '#120F16',
|
||||
50: '#6B5983',
|
||||
100: '#615177',
|
||||
200: '#4E415F',
|
||||
300: '#3A3047',
|
||||
400: '#26202E',
|
||||
500: '#120F16',
|
||||
},
|
||||
'falcon': {
|
||||
DEFAULT: '#785474',
|
||||
50: '#9A6F95',
|
||||
100: '#90658B',
|
||||
200: '#785474',
|
||||
300: '#573D54',
|
||||
400: '#362634',
|
||||
500: '#150F14',
|
||||
},
|
||||
'bastille': {
|
||||
DEFAULT: '#1A1420',
|
||||
50: '#765B91',
|
||||
100: '#6C5384',
|
||||
200: '#57436B',
|
||||
300: '#433352',
|
||||
400: '#2E2439',
|
||||
500: '#1A1420',
|
||||
},
|
||||
'olive-drab': {
|
||||
DEFAULT: '#688E26',
|
||||
50: '#8BBE33',
|
||||
100: '#80AE2F',
|
||||
200: '#688E26',
|
||||
300: '#48621A',
|
||||
400: '#27350E',
|
||||
500: '#070902',
|
||||
},
|
||||
},
|
||||
container: {
|
||||
center: true
|
||||
}
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
}
|
||||
|
25
project-warstone/tsconfig.json
Normal file
25
project-warstone/tsconfig.json
Normal file
@@ -0,0 +1,25 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"useDefineForClassFields": true,
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"module": "ESNext",
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
|
||||
/* Linting */
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"include": ["src"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
10
project-warstone/tsconfig.node.json
Normal file
10
project-warstone/tsconfig.node.json
Normal file
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
11
project-warstone/vite.config.ts
Normal file
11
project-warstone/vite.config.ts
Normal file
@@ -0,0 +1,11 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react-swc'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
appType: 'spa',
|
||||
preview: {
|
||||
port: 6969
|
||||
}
|
||||
})
|
1684
project-warstone/yarn.lock
Normal file
1684
project-warstone/yarn.lock
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user