jank/test
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

small refactor

Browse Source
This commit is contained in:
Jan Klattenhoff 2024-01-31 10:09:57 +01:00
parent 1f7e68953d
commit 345e207328
2 changed files with 48 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.idea/dataSources.xml
View File

@ -1,13 +1,13 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<project version="4"> <project version="4">
<component name="DataSourceManagerImpl" format="xml" multifile-model="true"> <component name="DataSourceManagerImpl" format="xml" multifile-model="true">
<data-source source="LOCAL" name="DDEV" uuid="4e41cde9-514c-4972-ba5c-ef4322763eb5"> <data-source source="LOCAL" name="DDEV" uuid="791af1b4-fe47-4b86-b04d-3a852feea052">
<driver-ref>mariadb</driver-ref> <driver-ref>mariadb</driver-ref>
<synchronize>true</synchronize> <synchronize>true</synchronize>
<configured-by-url>true</configured-by-url> <configured-by-url>true</configured-by-url>
<remarks>DDEV generated data source</remarks> <remarks>DDEV generated data source</remarks>
<jdbc-driver>org.mariadb.jdbc.Driver</jdbc-driver> <jdbc-driver>org.mariadb.jdbc.Driver</jdbc-driver>
<jdbc-url>jdbc:mariadb://127.0.0.1:12526/db?user=db&amp;password=db</jdbc-url> <jdbc-url>jdbc:mariadb://127.0.0.1:32771/db?user=db&amp;password=db</jdbc-url>
<working-dir>$ProjectFileDir$</working-dir> <working-dir>$ProjectFileDir$</working-dir>
</data-source> </data-source>
</component> </component>

80
public/js/frontend.js
View File

@ -40,26 +40,46 @@ function setButtonAttributes(buttonType) {
return button; return button;
} }
function addViewButton(tableData, printer) { function setViewButtonOnClick(viewButton, printer) {
const viewButton = setButtonAttributes('btn-primary'); viewButton.onclick = function () {
viewButton.textContent = 'View';
viewButton.id = `printer${printer.id}:viewButton`;
viewButton.onclick = function() {
document.getElementById('viewModalName').textContent = `Name: ${printer.name}`; document.getElementById('viewModalName').textContent = `Name: ${printer.name}`;
document.getElementById('viewModalPrice').textContent = `Price: ${printer.price.toFixed(2)}$`; document.getElementById('viewModalPrice').textContent = `Price: ${printer.price.toFixed(2)}$`;
document.getElementById('viewModalBuildVolume').textContent = `Build Volume: ${printer.build_volume}`; document.getElementById('viewModalBuildVolume').textContent = `Build Volume: ${printer.build_volume}`;
document.getElementById('viewModalMaxSpeed').textContent = `Max Speed: ${printer.max_speed}mm/s`; document.getElementById('viewModalMaxSpeed').textContent = `Max Speed: ${printer.max_speed}mm/s`;
} }
}
function addViewButton(tableData, printer) {
const viewButton = setButtonAttributes('btn-primary');
viewButton.textContent = 'View';
viewButton.id = `printer${printer.id}:viewButton`;
setViewButtonOnClick(viewButton, printer);
tableData.appendChild(viewButton); tableData.appendChild(viewButton);
} }
function editPrinter(printerId) { function setEditButtonOnClick(editButton, printer) {
editButton.onclick = function () {
document.getElementById('editInputName').value = printer.name;
document.getElementById('editInputPrice').value = printer.price;
document.getElementById('editInputBuildVolume').value = printer.build_volume;
document.getElementById('editInputMaxSpeed').value = printer.max_speed;
document.getElementById('editModalConfirm').setAttribute('onclick', `editPrinter(${printer.id})`);
}
}
function getEditModalValues() {
const nameInput = document.getElementById('editInputName').value; const nameInput = document.getElementById('editInputName').value;
const priceInput = document.getElementById('editInputPrice').value; const priceInput = document.getElementById('editInputPrice').value;
const buildVolumeInput = document.getElementById('editInputBuildVolume').value; const buildVolumeInput = document.getElementById('editInputBuildVolume').value;
const maxSpeedInput = document.getElementById('editInputMaxSpeed').value; const maxSpeedInput = document.getElementById('editInputMaxSpeed').value;
return {nameInput, priceInput, buildVolumeInput, maxSpeedInput};
}
function editPrinter(printerId) {
const {nameInput, priceInput, buildVolumeInput, maxSpeedInput} = getEditModalValues();
fetch(`/printer/${printerId}`, {method: 'PUT', body: JSON.stringify({ fetch(`/printer/${printerId}`, {method: 'PUT', body: JSON.stringify({
name: nameInput, name: nameInput,
@ -72,23 +92,14 @@ function editPrinter(printerId) {
document.getElementById(`printer${printer.id}:name`).textContent = printer.name; document.getElementById(`printer${printer.id}:name`).textContent = printer.name;
document.getElementById(`printer${printer.id}:price`).textContent = printer.price; document.getElementById(`printer${printer.id}:price`).textContent = printer.price;
document.getElementById(`printer${printer.id}:build_volume`).textContent = printer.build_volume; document.getElementById(`printer${printer.id}:build_volume`).textContent = printer.build_volume;
document.getElementById(`printer${printer.id}:max_speed`).textContent = printer.max_speed; document.getElementById(`printer${printer.id}:max_speed`).textContent = printer.max_speed;
const editButton = document.getElementById(`printer${printer.id}:editButton`); const editButton = document.getElementById(`printer${printer.id}:editButton`);
editButton.onclick = function() { setEditButtonOnClick(editButton, printer);
document.getElementById('editInputName').value = printer.name;
document.getElementById('editInputPrice').value = printer.price;
document.getElementById('editInputBuildVolume').value = printer.build_volume;
document.getElementById('editInputMaxSpeed').value = printer.max_speed;
}
const viewButton = document.getElementById(`printer${printer.id}:viewButton`); const viewButton = document.getElementById(`printer${printer.id}:viewButton`);
viewButton.onclick = function() { setViewButtonOnClick(viewButton, printer);
document.getElementById('viewModalName').textContent = `Name: ${printer.name}`;
document.getElementById('viewModalPrice').textContent = `Price: ${printer.price.toFixed(2)}$`;
document.getElementById('viewModalBuildVolume').textContent = 'Build Volume: ' + printer.build_volume;
document.getElementById('viewModalMaxSpeed').textContent = `Max Speed: ${printer.max_speed}mm/s`;
}
}); });
} }
}); });
@ -102,20 +113,12 @@ function addEditButton(tableData, printer) {
editButton.id = `printer${printer.id}:editButton` editButton.id = `printer${printer.id}:editButton`
editButton.textContent = 'Edit'; editButton.textContent = 'Edit';
editButton.onclick = function() { setEditButtonOnClick(editButton, printer);
document.getElementById('editInputName').value = printer.name;
document.getElementById('editInputPrice').value = printer.price;
document.getElementById('editInputBuildVolume').value = printer.build_volume;
document.getElementById('editInputMaxSpeed').value = printer.max_speed;
document.getElementById('editModalConfirm').setAttribute('onclick', `editPrinter(${printer.id})`);
}
tableData.appendChild(editButton); tableData.appendChild(editButton);
} }
function addTableActions(tableRow, printer) { function addTableActions(tableRow, printer) {
const tableData = document.createElement('td'); const tableData = document.createElement('td');
addViewButton(tableData, printer); addViewButton(tableData, printer);
@ -150,16 +153,25 @@ function loadTable() {
}); });
} }
function createPrinter() { function clearCreateModalValues() {
const nameInput = document.getElementById('inputName').value;
const priceInput = document.getElementById('inputPrice').value;
const buildVolumeInput = document.getElementById('inputBuildVolume').value;
const maxSpeedInput = document.getElementById('inputMaxSpeed').value;
document.getElementById('inputName').value = ''; document.getElementById('inputName').value = '';
document.getElementById('inputPrice').value = ''; document.getElementById('inputPrice').value = '';
document.getElementById('inputBuildVolume').value = ''; document.getElementById('inputBuildVolume').value = '';
document.getElementById('inputMaxSpeed').value = ''; document.getElementById('inputMaxSpeed').value = '';
}
function getCreateModalValues() {
const nameInput = document.getElementById('inputName').value;
const priceInput = document.getElementById('inputPrice').value;
const buildVolumeInput = document.getElementById('inputBuildVolume').value;
const maxSpeedInput = document.getElementById('inputMaxSpeed').value;
return {nameInput, priceInput, buildVolumeInput, maxSpeedInput};
}
function createPrinter() {
const {nameInput, priceInput, buildVolumeInput, maxSpeedInput} = getCreateModalValues();
clearCreateModalValues();
fetch('/printer', {method: 'POST', body: JSON.stringify({ fetch('/printer', {method: 'POST', body: JSON.stringify({
name: nameInput, name: nameInput,