1.1.3
Upload der ersten lauffähigen Version
This commit is contained in:
Adam Jaquet (Diez)
GitHub
parent
cf34f467eb
commit
274a8049f7
41
css/main.css
Normal file
41
css/main.css
Normal file
@ -0,0 +1,41 @@
|
|||||||
|
.version {
|
||||||
|
font-size:smaller;
|
||||||
|
padding-left:20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Feldbeschreibung {
|
||||||
|
font-size:medium;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Titel {
|
||||||
|
font-size:xx-large;
|
||||||
|
padding-top: 40px;
|
||||||
|
font-style: italic;
|
||||||
|
padding-bottom:30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Ergebniss {
|
||||||
|
font-size:x-large;
|
||||||
|
padding:10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabelle-ergebniss {
|
||||||
|
border-width: medium;
|
||||||
|
border-collapse: collapse;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-content {
|
||||||
|
padding: 0px 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.distaceTableColumn {
|
||||||
|
padding: 5px;
|
||||||
|
color:#444444;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.distanztabelle {
|
||||||
|
border-collapse: collapse;
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
BIN
favicon.ico
Normal file
BIN
favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 264 KiB |
136
index.html
Normal file
136
index.html
Normal file
@ -0,0 +1,136 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head lang="en">
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>Avorion distance calculator</title>
|
||||||
|
<link rel="stylesheet" href="css/main.css" type="text/css">
|
||||||
|
|
||||||
|
<!-- Material Design Lite begin -->
|
||||||
|
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
|
||||||
|
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.orange-deep_orange.min.css" />
|
||||||
|
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>
|
||||||
|
<!-- Material Design Lite end -->
|
||||||
|
|
||||||
|
<!-- jQuery Einbindung:
|
||||||
|
|
||||||
|
<script src="js/jquery-3.6.0.min.js"></script>
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
/* Hier der jQuery-Code */
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
-->
|
||||||
|
|
||||||
|
<!--Hier wird die externe JavaScript-Datei zum berechnen eingebunden -->
|
||||||
|
<script src="js/main.js"></script>
|
||||||
|
</head>
|
||||||
|
<body onload="start();">
|
||||||
|
|
||||||
|
<div class="mdl-layout mdl-js-layout mdl-layout--fixed-drawer">
|
||||||
|
<div class="mdl-layout__drawer">
|
||||||
|
<span class="mdl-layout-title"> </span>
|
||||||
|
<nav class="mdl-navigation">
|
||||||
|
|
||||||
|
<!-- left Menue
|
||||||
|
<a class="mdl-navigation__link" href="">Link</a>
|
||||||
|
-->
|
||||||
|
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
<main class="mdl-layout__content">
|
||||||
|
<div class="page-content">
|
||||||
|
|
||||||
|
<!-- Your content goes here begin -->
|
||||||
|
|
||||||
|
<!-- Numeric Textfield with Floating Label -->
|
||||||
|
<div class="Titel">
|
||||||
|
Avorion distance calculator
|
||||||
|
</div>
|
||||||
|
<div class="Feldbeschreibung">
|
||||||
|
Starting coordinates:
|
||||||
|
</div>
|
||||||
|
<form action="#" onsubmit="calculate(); return false;">
|
||||||
|
|
||||||
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
||||||
|
<input class="mdl-textfield__input" type="text" pattern="-?[0-9]*(\.[0-9]+)?" id="koordinateX">
|
||||||
|
<label class="mdl-textfield__label" for="koordinateX">Koordinate X ...</label>
|
||||||
|
<span class="mdl-textfield__error">Input is not a number!</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
|
||||||
|
<input class="mdl-textfield__input" type="text" pattern="-?[0-9]*(\.[0-9]+)?" id="koordinateY">
|
||||||
|
<label class="mdl-textfield__label" for="koordinateY">Koordinate Y ...</label>
|
||||||
|
<span class="mdl-textfield__error">Input is not a number!</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Raised button with ripple -->
|
||||||
|
<button type="submit" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect">Calculate</button>
|
||||||
|
</form>
|
||||||
|
<div style="padding-top: 25px;">
|
||||||
|
<table class="tabelle-ergebniss">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<div class="Ergebniss">Result:</div>
|
||||||
|
</td>
|
||||||
|
<td style="width: 100%;">
|
||||||
|
<div class="Ergebniss" id="result">
|
||||||
|
-
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<!-- Distanztabelle -->
|
||||||
|
<table class="distanztabelle">
|
||||||
|
<tbody>
|
||||||
|
<tr style="background-color:#FFB380;">
|
||||||
|
<td class="distaceTableColumn">Iron:</td>
|
||||||
|
<td class="distaceTableColumn">overall</td>
|
||||||
|
</tr>
|
||||||
|
<tr style="background-color:#FFFFFF;">
|
||||||
|
<td class="distaceTableColumn">Titanium:</td>
|
||||||
|
<td class="distaceTableColumn">from 420 sectors to the center</td>
|
||||||
|
</tr>
|
||||||
|
<tr style="background-color:#4DFF4D;">
|
||||||
|
<td class="distaceTableColumn">Naonit:</td>
|
||||||
|
<td class="distaceTableColumn">from 360 sectors to the center</td>
|
||||||
|
</tr>
|
||||||
|
<tr style="background-color:dodgerblue">
|
||||||
|
<td class="distaceTableColumn">Trinium:</td>
|
||||||
|
<td class="distaceTableColumn">from 290 sectors to the center</td>
|
||||||
|
</tr>
|
||||||
|
<tr style="background-color:gold;">
|
||||||
|
<td class="distaceTableColumn">Xanion:</td>
|
||||||
|
<td class="distaceTableColumn">from 210 sectors to the center</td>
|
||||||
|
</tr>
|
||||||
|
<tr style="background-color:coral;">
|
||||||
|
<td class="distaceTableColumn">Orgonit:</td>
|
||||||
|
<td class="distaceTableColumn">from 145 sectors to the center</td>
|
||||||
|
</tr>
|
||||||
|
<tr style="background-color:#FF2626;">
|
||||||
|
<td class="distaceTableColumn">Avorion:</td>
|
||||||
|
<td class="distaceTableColumn">from 75 sectors to the center</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<hr>
|
||||||
|
<div>
|
||||||
|
<p class="version" id="version">
|
||||||
|
</p>
|
||||||
|
<!-- Your content goes here end -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
2
js/jquery-3.6.0.min.js
vendored
Normal file
2
js/jquery-3.6.0.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
77
js/main.js
Normal file
77
js/main.js
Normal file
@ -0,0 +1,77 @@
|
|||||||
|
|
||||||
|
/*
|
||||||
|
* Programm zum berechnen der Distanz im "Avorion distance Calculator"
|
||||||
|
*
|
||||||
|
* (c) Adam Jaquet 2022 - ionivation.com
|
||||||
|
*
|
||||||
|
*
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
// bei Änderungen Version eintragen!
|
||||||
|
const MAJOR = 1; // +1 wenn inkompatibel zur vorherigen Version
|
||||||
|
const MINOR = 1; // +1 wenn neue Funktionen implementiert
|
||||||
|
const PATCH = 3; // +1 wenn Änderungen ohne neue Funktionen
|
||||||
|
|
||||||
|
// letzte Veröffentlichung
|
||||||
|
const LASTDEV = '2022-01-13 19:40:10 Thursday';
|
||||||
|
|
||||||
|
// debug-modus ON/ OFF
|
||||||
|
const DEBUG = false;
|
||||||
|
|
||||||
|
// Ab hier nichts mehr konfigurieren!
|
||||||
|
|
||||||
|
function start() {
|
||||||
|
/* sollte onload vom Body des HTML Dokuments geladen werden
|
||||||
|
* start() und goVersion() sind für den eigentlichen Zweck des Programms überflüssig
|
||||||
|
*/
|
||||||
|
goVersion();
|
||||||
|
}
|
||||||
|
|
||||||
|
function goVersion() {
|
||||||
|
// Es wird die Version des Programs generiert und die ID=version im HTML geaendert.
|
||||||
|
const VERSION = MAJOR + "." + MINOR + "." + PATCH;
|
||||||
|
version.innerHTML += `
|
||||||
|
Script-Version: ${VERSION}
|
||||||
|
( <a href="https://www.ionivation.com">Ionivation.com</a> )
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function calculate() {
|
||||||
|
// Holt die Koordinaten aus der Website die in dem Formular eingetragen wurden und rundet diese
|
||||||
|
let x = Math.round(koordinateX.value);
|
||||||
|
let y = Math.round(koordinateY.value);
|
||||||
|
|
||||||
|
// Schickt die Daten zur Berechnung an die Funktion und schreibt in die ID (id="result") des HTML Dokuments
|
||||||
|
if ( (x) && (y) ){ // wenn x unc y Werte enthalten
|
||||||
|
result.innerHTML = `
|
||||||
|
from [${x}:${y}] = ${goDistToCenter(x, y)} sectors to Center
|
||||||
|
`;
|
||||||
|
koordinateX.value = "";
|
||||||
|
koordinateY.value = "";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function goDistToCenter(x, y){
|
||||||
|
// Berechnet Entfernung zum Zentrum und schickt Ergebnis zurück
|
||||||
|
let result;
|
||||||
|
|
||||||
|
result = Math.round (Math.sqrt( Math.round(x * x) + Math.round(y * y) ));
|
||||||
|
|
||||||
|
// Nur zum debuggen der Ergebnisse wenn DEBUG=true: (1.1.0)
|
||||||
|
if (DEBUG){
|
||||||
|
console.log("");
|
||||||
|
console.log("Berechnungen ohne Rundungen aus goDistToCenter()")
|
||||||
|
console.log("X * X: " + Math.round(x * x) );
|
||||||
|
console.log("Y * Y: " + Math.round(y * y) );
|
||||||
|
console.log("----------------------------")
|
||||||
|
console.log(`SQRT x^2 + Y^2: ${Math.sqrt((x * x) + (y * y))}` );
|
||||||
|
console.log("");
|
||||||
|
}
|
||||||
|
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
|
||||||
|
function goDistToTarget(x1, y1, x2, y2){
|
||||||
|
// geplante Funktion die jede beliebige Entfernung Berechnet
|
||||||
|
}
|
||||||
6
liesmich.md
Normal file
6
liesmich.md
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
# Anleitung zur Installation
|
||||||
|
|
||||||
|
- Paket entpacken in einen beliebigen leeren Ordner
|
||||||
|
- die index.html mit einem beliebigen Browser öffnen
|
||||||
|
|
||||||
|
Das gesamte Paket enthällt alles was man zum Betrieb benötigt.
|
||||||
13
patchlog.md
Normal file
13
patchlog.md
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
# Avorion Distanzrechner
|
||||||
|
|
||||||
|
## Patchlogs
|
||||||
|
|
||||||
|
### 1.1.3 13.01.2022
|
||||||
|
- Farbtabelle für Erze und Entfernungen in die index.html implementiert
|
||||||
|
- einige Optimierungen am Code
|
||||||
|
|
||||||
|
### 1.1.0 13.01.2022
|
||||||
|
- Debugfunktion in main.js implementiert
|
||||||
|
|
||||||
|
### 1.0.1 13.01.2022
|
||||||
|
- erste Version
|
||||||
Loading…
x
Reference in New Issue
Block a user