mirror of
https://github.com/DoomKitty87/seafoam.git
synced 2025-02-06 02:05:24 +01:00
finished generation frontend trying to get tauri to read files
This commit is contained in:
DoomKitty87
parent
d6e89e43ae
commit
bb04ff1e46
8 changed files with 87 additions and 31 deletions
16
web-app/seafoam/package-lock.json
generated
16
web-app/seafoam/package-lock.json
generated
|
|
@ -8,9 +8,25 @@
|
|||
"name": "seafoam",
|
||||
"version": "0.0.0",
|
||||
"devDependencies": {
|
||||
"@tauri-apps/api": "^1.4.0",
|
||||
"@tauri-apps/cli": "^1.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/api": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/api/-/api-1.4.0.tgz",
|
||||
"integrity": "sha512-Jd6HPoTM1PZSFIzq7FB8VmMu3qSSyo/3lSwLpoapW+lQ41CL5Dow2KryLg+gyazA/58DRWI9vu/XpEeHK4uMdw==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": ">= 14.6.0",
|
||||
"npm": ">= 6.6.0",
|
||||
"yarn": ">= 1.19.1"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/tauri"
|
||||
}
|
||||
},
|
||||
"node_modules/@tauri-apps/cli": {
|
||||
"version": "1.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@tauri-apps/cli/-/cli-1.4.0.tgz",
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
"tauri": "tauri"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@tauri-apps/api": "^1.4.0",
|
||||
"@tauri-apps/cli": "^1.4.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ edition = "2021"
|
|||
tauri-build = { version = "1.4", features = [] }
|
||||
|
||||
[dependencies]
|
||||
tauri = { version = "1.4", features = ["shell-open"] }
|
||||
tauri = { version = "1.4", features = [ "fs-all", "shell-open"] }
|
||||
serde = { version = "1.0", features = ["derive"] }
|
||||
serde_json = "1.0"
|
||||
|
||||
|
|
|
|||
|
|
@ -16,6 +16,9 @@
|
|||
"shell": {
|
||||
"all": false,
|
||||
"open": true
|
||||
},
|
||||
"fs": {
|
||||
"all":true
|
||||
}
|
||||
},
|
||||
"bundle": {
|
||||
|
|
|
|||
|
|
@ -5,13 +5,13 @@
|
|||
<link rel="stylesheet" href="styles.css" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Seafoam</title>
|
||||
<script type="module" src="/main.js" defer></script>
|
||||
<script type="module" src="routegen.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="navbar">
|
||||
<img class="icon" src="assets/seafoamarmadillo.webp">
|
||||
<h1 class="title">seafoam</h1>
|
||||
<div class="menubutton"><h2 class="buttontext">GENERATE</h2></div>
|
||||
<div class="menubutton" onclick="resetMenu()"><h2 class="buttontext">GENERATE</h2></div>
|
||||
<div class="menubutton"><h2 class="buttontext">ROUTES</h2></div>
|
||||
</div>
|
||||
<div class="main">
|
||||
|
|
@ -119,7 +119,16 @@
|
|||
</form>
|
||||
</div>
|
||||
<div class="nextbutton" style="margin-top: 2rem">
|
||||
<h2 class="nextbuttontext" onclick="moveStep()">NEXT →</h2>
|
||||
<h2 class="nextbuttontext" onclick="moveStep()">GENERATE</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="menuscreen" id="menua4">
|
||||
<div class="infobox">
|
||||
<h1 class="infotitle">GENERATE</h1>
|
||||
<h3 class="infodesc">Your route is being generated. Please wait.</h3>
|
||||
</div>
|
||||
<div class="routeresults">
|
||||
<p class="routeoutput">Route loading...</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -130,7 +139,7 @@
|
|||
|
||||
var waypointNumber = 150;
|
||||
|
||||
var priority = "TP";
|
||||
var priority = "tp";
|
||||
var allowedOOB = 0;
|
||||
|
||||
var angleEnable = false;
|
||||
|
|
@ -147,6 +156,24 @@
|
|||
activeSquare = parseInt(indx);
|
||||
document.getElementById(indx).style.backgroundColor = "#ffffff";
|
||||
}
|
||||
async function getRoute() {
|
||||
var output = generateRoute(activeSquare, allowedOOB, priority, waypointNumber);
|
||||
//document.getElementsByClassName("routeoutput")[0].innerHTML = output[0];
|
||||
}
|
||||
async function resetMenu() {
|
||||
document.getElementById("menua" + (currentStep)).style.opacity = 0;
|
||||
document.getElementsByClassName("progressitem")[currentStep - 1].setAttribute("data-active", "false");
|
||||
document.getElementsByClassName("dot")[currentStep - 1].setAttribute("data-active", "false");
|
||||
await new Promise(r => setTimeout(r, 500));
|
||||
document.getElementById("menua" + (currentStep)).style.display = "none";
|
||||
currentStep = 1;
|
||||
document.getElementById(activeSquare).style.backgroundColor = "#0e141b";
|
||||
activeSquare = -1;
|
||||
document.getElementById("menua" + (currentStep)).style.display = "block";
|
||||
document.getElementById("menua" + (currentStep)).style.opacity = 1;
|
||||
document.getElementsByClassName("progressitem")[currentStep - 1].setAttribute("data-active", "true");
|
||||
document.getElementsByClassName("dot")[currentStep - 1].setAttribute("data-active", "true");
|
||||
}
|
||||
async function updateMenu(step) {
|
||||
document.getElementById("menua" + (step - 1)).style.opacity = 0;
|
||||
document.getElementsByClassName("progressitem")[step - 2].setAttribute("data-active", "false");
|
||||
|
|
@ -157,12 +184,13 @@
|
|||
document.getElementById("menua" + (step)).style.opacity = 1;
|
||||
document.getElementsByClassName("progressitem")[step - 1].setAttribute("data-active", "true");
|
||||
document.getElementsByClassName("dot")[step - 1].setAttribute("data-active", "true");
|
||||
if (step == 4) getRoute();
|
||||
}
|
||||
function moveStep() {
|
||||
if (currentStep == 1 && activeSquare == -1) return;
|
||||
if (currentStep == 2) waypointNumber = document.getElementById("wpform").value;
|
||||
if (currentStep == 3) {
|
||||
if (document.getElementById("tp").checked) priority = "TP"; else priority = "DENS";
|
||||
if (document.getElementById("tp").checked) priority = "tp"; else priority = "dens";
|
||||
allowedOOB = document.getElementsByClassName("oobform")[0].value;
|
||||
if (document.getElementById("anglecheck").checked) {
|
||||
angleEnable = true;
|
||||
|
|
@ -170,6 +198,7 @@
|
|||
angle33 = document.getElementsById("angle33").value;
|
||||
} else angleEnable = false;
|
||||
}
|
||||
if (currentStep == 4) return;
|
||||
currentStep++;
|
||||
updateMenu(currentStep);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,18 +0,0 @@
|
|||
const { invoke } = window.__TAURI__.tauri;
|
||||
|
||||
let greetInputEl;
|
||||
let greetMsgEl;
|
||||
|
||||
async function greet() {
|
||||
// Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
|
||||
greetMsgEl.textContent = await invoke("greet", { name: greetInputEl.value });
|
||||
}
|
||||
|
||||
window.addEventListener("DOMContentLoaded", () => {
|
||||
greetInputEl = document.querySelector("#greet-input");
|
||||
greetMsgEl = document.querySelector("#greet-msg");
|
||||
document.querySelector("#greet-form").addEventListener("submit", (e) => {
|
||||
e.preventDefault();
|
||||
greet();
|
||||
});
|
||||
});
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
const fs = require('fs');
|
||||
import { readTextFile } from '@tauri-apps/api/fs';
|
||||
document.getElementsByClassName("title")[0].innerHTML = "Generating route...";
|
||||
|
||||
const overallPads = [];
|
||||
// Loading etherwarp pad coordinates
|
||||
|
|
@ -30,8 +31,6 @@ for (const line of densityLines) {
|
|||
|
||||
console.log(`Loaded ${overallPads.length / 3} pads.`);
|
||||
|
||||
const desiredPathLength = 150;
|
||||
|
||||
const jadecoordsx = 823;
|
||||
const jadecoordsz = 202;
|
||||
|
||||
|
|
@ -49,7 +48,9 @@ for (let i = 0; i < 5; i++) {
|
|||
}
|
||||
}
|
||||
|
||||
async function generateRoute(sector, allowedOOB) {
|
||||
function generateRoute(sector, allowedOOB, priority, waypointCount) {
|
||||
document.getElementsByClassName("routeoutput")[0].innerHTML = "Generating route...";
|
||||
const desiredPathLength = waypointCount;
|
||||
const padCoords = [];
|
||||
const secDensities = [];
|
||||
for (var i = 0; i < overallPads.length / 3; i++) {
|
||||
|
|
@ -68,6 +69,7 @@ async function generateRoute(sector, allowedOOB) {
|
|||
var highestDensityDist = Infinity;
|
||||
|
||||
for (var i = 0; i < padCoords.length / 3; i++) {
|
||||
document.getElementsByClassName("routeoutput")[0].innerHTML = "Generating route... " + floor(i / padCoords.length * 100) + "%";
|
||||
const path = [];
|
||||
path.push_back(padCoords[i * 3]);
|
||||
path.push_back(padCoords[i * 3 + 1]);
|
||||
|
|
@ -198,9 +200,18 @@ async function generateRoute(sector, allowedOOB) {
|
|||
}
|
||||
}
|
||||
//Choose between density and dist in settings as well though
|
||||
const outPath = lowestAvgDistPath;
|
||||
const outPathDensity = lowestAvgDistDensity;
|
||||
const outPathDist = lowestAvgDist;
|
||||
var outPath = [];
|
||||
var outPathDensity = 0;
|
||||
var outPathDist = 0;
|
||||
if (priority == "tp") {
|
||||
outPath = lowestAvgDistPath;
|
||||
outPathDensity = lowestAvgDistDensity;
|
||||
outPathDist = lowestAvgDist;
|
||||
} else {
|
||||
outPath = highestDensityPath;
|
||||
outPathDensity = highestDensity;
|
||||
outPathDist = highestDensityDist;
|
||||
}
|
||||
|
||||
var pathOutput = "[";
|
||||
for (var i = 0; i < outPath.length / 3; i++) {
|
||||
|
|
|
|||
|
|
@ -280,4 +280,18 @@ label.anglesettings {
|
|||
margin-left: 0.5rem;
|
||||
position: relative;
|
||||
bottom: 0.2rem;
|
||||
}
|
||||
|
||||
.routeresults {
|
||||
position: relative;
|
||||
left: 20rem;
|
||||
margin-top: 2rem;
|
||||
width: 40rem;
|
||||
}
|
||||
|
||||
.routeoutput {
|
||||
color: #ffffff;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 300;
|
||||
user-select: text;
|
||||
}
|
||||
Loading…
Reference in a new issue