Skip to content
Snippets Groups Projects
Commit 0ed2be09 authored by Robin Steiner's avatar Robin Steiner
Browse files

ASDF

parent e7fe2e74
No related branches found
No related tags found
No related merge requests found
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="DataSourceManagerImpl" format="xml" multifile-model="true">
<data-source source="LOCAL" name="dev" uuid="dd5ce02c-a064-4b65-9135-1124ad6950da">
<driver-ref>sqlite.xerial</driver-ref>
<synchronize>true</synchronize>
<jdbc-driver>org.sqlite.JDBC</jdbc-driver>
<jdbc-url>jdbc:sqlite:C:\Users\Robin\Desktop\Lexicon\tierlexikon-api-main\prisma\dev.db</jdbc-url>
<working-dir>$ProjectFileDir$</working-dir>
</data-source>
</component>
</project>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="" vcs="Git" />
</component>
</project>
\ No newline at end of file
...@@ -11,6 +11,6 @@ COPY . . ...@@ -11,6 +11,6 @@ COPY . .
RUN npx prisma generate RUN npx prisma generate
CMD node index.js CMD node index_front.js
EXPOSE 28785 EXPOSE 28785
...@@ -10,9 +10,8 @@ ...@@ -10,9 +10,8 @@
<body style="background-color: #0a2d0f"> <body style="background-color: #0a2d0f">
<div class="headline"> <div class="headline">
<h1>Das grosse Tierlexikon</h1> <h1>Das grosse Tierlexikon</h1>
<p>Semsterprojekt VS 2022</p> <p>Semesterprojekt VS 2022</p>
</div> </div>
<form id="create" class="create">
<div class="createleft"> <div class="createleft">
<div class="name">NAME</div> <div class="name">NAME</div>
<div class="id"> <div class="id">
...@@ -25,6 +24,10 @@ ...@@ -25,6 +24,10 @@
<div class="size"> <div class="size">
<textarea required type="text" rows="1" cols="50" id="size" input="text"></textarea> <textarea required type="text" rows="1" cols="50" id="size" input="text"></textarea>
</div> </div>
<div class="feed">FUTTER</div>
<div class="weight">
<textarea required type="text" rows="1" cols="50" id="feed" input="text"></textarea>
</div>
<div class="weight_min">GEWICHT MIN</div> <div class="weight_min">GEWICHT MIN</div>
<div class="weight"> <div class="weight">
<textarea required type="text" rows="1" cols="50" id="weight_min" input="text"></textarea> <textarea required type="text" rows="1" cols="50" id="weight_min" input="text"></textarea>
...@@ -37,75 +40,23 @@ ...@@ -37,75 +40,23 @@
<div class="class"> <div class="class">
<textarea required type="text" rows="1" cols="50" id="class" input="text"></textarea> <textarea required type="text" rows="1" cols="50" id="class" input="text"></textarea>
</div> </div>
<div class="age">ALTER</div>
<div class="age">
<textarea required type="text" rows="1" cols="50" id="age" input="text"></textarea>
</div>
<div class="origin">HERKUNFT</div> <div class="origin">HERKUNFT</div>
<div class="origin"> <div class="origin">
<textarea required type="text" rows="1" cols="50" id="origin" input="text"></textarea> <textarea required type="text" rows="1" cols="50" id="origin" input="text"></textarea>
</div> </div>
</div>
<div class="createright">
<div class="description">BESCHREIBUNG</div>
<div class="description">
<textarea required type="text" rows="10" cols="50" id="desc2" input="text"></textarea>
</div>
<div class="erstellenknopf"> <div class="erstellenknopf">
<button value="create" type="submit" id="erstellen">Tier Hinzufügen</button> <button value="create" id="erstellen">Tier Hinzufügen</button>
</div>
<div class="editknopf">
<button value="edit" type="submit" id="edit">Tier Editieren</button>
</div> </div>
</div>
</form> </div>
<div class="read"> <div class="read">
<div class="products">Lexikon Einträge</div>
<div id="container"> <table id="table"> <div id="container"> <table id="table">
<caption>Tierarten</caption>
<tr>
<th scope="col">Tiere</th>
<th scope="col">Name</th>
<th scope="col">Größe</th>
<th scope="col">Gewicht</th>
<th scope="col">Klasse</th>
<th scope="col">Alter</th>
<th scope="col">Herkunft</th>
</tr>
<tr>
<th scope="row">Pinguin</th>
<td>Adéliepinguin</td>
<td>70 cm</td>
<td>4-5 kg</td>
<td>Vögel</td>
<td>5 Jahre</td>
<td>Antarktis</td>
</tr>
<tr>
<th scope="row">Wal</th>
<td>Belugawal</td>
<td>3-6 m</td>
<td>1500 kg</td>
<td>Säugetiere</td>
<td>50 Jahre</td>
<td>Alaska, Kanada</td>
</tr>
<tr>
<th scope="row">Hund</th>
<td>Dalmatiner</td>
<td>60 cm</td>
<td>30 kg</td>
<td>Säugetiere</td>
<td>10-13 Jahre</td>
<td>Kroatien</td>
</tr>
</table> </table>
</div> </div>
...@@ -118,6 +69,6 @@ ...@@ -118,6 +69,6 @@
<script src="src/index.js"></script> <script src="src/index_front.js"></script>
</body> </body>
</html> </html>
...@@ -27,6 +27,7 @@ app.post('/api/v1/animals', async (req, res) => { ...@@ -27,6 +27,7 @@ app.post('/api/v1/animals', async (req, res) => {
weight_max: data.weight_max, weight_max: data.weight_max,
feed: data.feed, feed: data.feed,
size: data.size size: data.size
} }
}); });
......
const API_BASE = 'http://localhost:28785/api/v1/animals'; const API_BASE = 'http://localhost:28785/api/v1/animals';
function fill(animals){ function fill(element){
document.getElementById("ID").value=element.name; document.getElementById("ID").value=element.name;
document.getElementById("name").value=element.class; document.getElementById("name").value=element.class;
document.getElementById("origin").value=element.origin; document.getElementById("origin").value=element.origin;
...@@ -15,19 +15,47 @@ function getID(){ ...@@ -15,19 +15,47 @@ function getID(){
return document.getElementById("id").value; return document.getElementById("id").value;
} }
function getData(){ function getData(){
let data = JSON.stringify({ let data = JSON.stringify({
name: document.getElementById("name").value, name: document.getElementById("name").value,
class: document.getElementById("class").value,
origin: document.getElementById("origin").value, origin: document.getElementById("origin").value,
weight_min: document.getElementById("weight_min").value, weight_min: parseInt(document.getElementById("weight_min").value),
weight_max: document.getElementById("weight_max").value, weight_max: parseInt(document.getElementById("weight_max").value),
feed: document.getElementById("feed").value, feed: document.getElementById("feed").value,
size: document.getElementById("size").value size: parseFloat(document.getElementById("size").value)
}) })
return data; return data;
} }
async function addItem(item) {
const headers = new Headers();
headers.append("Content-Type", "application/json");
const body = item;
const init = {
method: "put",
headers,
body,
};
console.log(body);
fetch(API_BASE, init)
.then(function (response){
console.log(response)
getAllItems();
return response.json();
//return Promise.reject(response);
}).then(() =>{
}
).catch((e) => {
console.warn("Something went wrong", e);
});
}
async function getAllItems() { async function getAllItems() {
fetch(API_BASE) fetch(API_BASE)
.then((response) => { .then((response) => {
...@@ -35,17 +63,54 @@ async function getAllItems() { ...@@ -35,17 +63,54 @@ async function getAllItems() {
}) })
.then((text) => { .then((text) => {
console.log(text); console.log(text);
}) text=text.animals
function addHeaders(table, keys) {
const row = table.insertRow();
for (let i = 0; i < keys.length; i++) {
const cell = row.insertCell();
cell.appendChild(document.createTextNode(keys[i]));
}
}
const table = document.createElement("table");
for (let i = 0; i < text.length; i++) {
const child = text[i];
if (i == 0) {
addHeaders(table, Object.keys(child));
}
const row = table.insertRow();
Object.keys(child).forEach(function (k) {
const cell = row.insertCell();
cell.appendChild(document.createTextNode(child[k]));
})
}
document.getElementById("container").appendChild(table);
})
.catch((e) => {
console.log(e);
});
}
window.onload = () => { window.onload = () => {
getAllItems(); getAllItems();
}} }
document.getElementById("erstellen").addEventListener("click", async function (e) {
const data = getData()
await fetch(API_BASE, {
headers: {
"Accept": "application/json",
"Content-Type": "application/json"
},
method: "POST",
body: data
});
})
\ No newline at end of file
...@@ -50,7 +50,22 @@ p{ ...@@ -50,7 +50,22 @@ p{
.products{ .products{
color:white; color:white;
} }
#table{ .weight_min {
color:white;
}
.weight_max {
color:white;
}
.feed {
color:white;
}
.container {
color:white;
}
.table{
color:white; color:white;
} }
...@@ -140,6 +155,7 @@ button:hover { ...@@ -140,6 +155,7 @@ button:hover {
text-align: center; text-align: center;
margin-top: 1%; margin-top: 1%;
} }
#erstellen { #erstellen {
width: 200px; width: 200px;
height: 50px; height: 50px;
...@@ -157,14 +173,7 @@ button:hover { ...@@ -157,14 +173,7 @@ button:hover {
background: linear-gradient(to top right, #fde374, #fde374); background: linear-gradient(to top right, #fde374, #fde374);
} }
.editknopf {
font-family: "Century Gothic", CenturyGothic, Geneva, AppleGothic, sans-serif;
height: max-content;
width: 100%;
float: left;
text-align: center;
margin-top: 1%;
}
#edit { #edit {
width: 200px; width: 200px;
height: 50px; height: 50px;
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment