Maxluli/Octotor
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added last week work

Browse Source
This commit is contained in:
maxluli
2023-02-14 09:36:51 +01:00
parent 29050b4029
commit 21eeb9da84
4 changed files with 99 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
JS/helpers.js Normal file
View File

0
JS/methods.js Normal file
View File

0
JS/ui.js Normal file
View File

128
index.php
View File

@@ -8,7 +8,7 @@
<title>Document</title> <title>Document</title>
</head> </head>
<body> <body display: inline>
<button id="btnRefresh">RefreshInfos</button> <button id="btnRefresh">RefreshInfos</button>
<h2>Printer temperatures</h2> <h2>Printer temperatures</h2>
@@ -21,11 +21,41 @@
Target : <div id="lblBedTempTarget">NaN<div> Target : <div id="lblBedTempTarget">NaN<div>
</h3> </h3>
<h2>Job</h2>
<h3>Status : </h3>
<h3 id="lblJobStatus">NaN</h3>
<h3>Completion : </h3>
<h3 id="lblCompletion">NaN</h3>
<h3>Print time : </h3>
<h3 id="lblPrintTime">NaN</h3>
<h3>Time left : </h3>
<h3 id="lblPrintTimeLeft">NaN</h3>
<h2>Print</h2>
<h3>Estimated print time :</h3>
<h3 id="lblEstimatedPrintTime">NaN</h3>
<h3><b>Filament</b></h3>
<h3>length :</h3>
<h3 id="lblFilamentLength">NaN</h3>
<h3>volume :</h3>
<h3 id="lblFilamentVolume">NaN</h3>
<h3><b>File</b></h3>
<h3>Filename :</h3>
<h3 id="lblJobFileName">NaN</h3>
<h3>Last print time :</h3>
<h3 id="lblJobFileLastPrintedTime">NaN</h3>
<label for="inptBedTempTarget">Bed temp target :</label><input type="number" min="0" id="tbxBedTempTarget"> <label for="inptBedTempTarget">Bed temp target :</label><input type="number" min="0" id="tbxBedTempTarget">
</br> </br>
<label for="inptHotEndTempTarget">Hot end temp target :</label><input type="number" min="0" id="tbxHotEndTempTarget"> <label for="inptHotEndTempTarget">Hot end temp target :</label><input type="number" min="0" id="tbxHotEndTempTarget">
</br> </br>
<button id="btnSetNewTemps">confirm</button> <button id="btnSetNewTemps">confirm</button>
<h3>Monitor</h3>
<iframe src="http://192.168.50.239/webcam/?action=stream" title="webcam stream" frameborder="0" width="640" height="480">></iframe>
</body> </body>
</html> </html>
@@ -45,6 +75,7 @@
}); });
var timer = window.setInterval(function() { var timer = window.setInterval(function() {
RecoverPrinterInfos(); RecoverPrinterInfos();
RecoverJobInfos();
}, 1000) }, 1000)
btnRefresh.addEventListener('click', event => { btnRefresh.addEventListener('click', event => {
RecoverPrinterInfos(); RecoverPrinterInfos();
@@ -56,19 +87,16 @@
setNewHotEndTemps(hotEndTemp); setNewHotEndTemps(hotEndTemp);
}); });
//Helpers
async function fetchData(url, options = {}) { async function fetchData(url) {
const defaultOptions = { const defaultOptions = {
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json',
'X-Api-Key': 'AB36FE568344446D92F87BACD84F02CB'
} }
}; };
const combinedOptions = {
...defaultOptions,
...options
};
try { try {
const response = await fetch(url, combinedOptions); const response = await fetch(url, defaultOptions);
if (!response.ok) { if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`); throw new Error(`HTTP error! status: ${response.status}`);
} }
@@ -80,25 +108,6 @@
} }
} }
function load(){
RecoverPrinterInfos();
}
function RecoverPrinterInfos() {
const temperaturesRoute = 'http://192.168.50.239/api/printer';
const headers = {
'X-Api-Key': 'AB36FE568344446D92F87BACD84F02CB'
};
fetchData(temperaturesRoute, {
headers
}).then(data => {
DisplayTemperatures(data);
})
.catch(error => {
//alert(error);
console.error(error);
});
}
function sendPostRequest(url, json) { function sendPostRequest(url, json) {
var myHeaders = new Headers(); var myHeaders = new Headers();
myHeaders.append("X-Api-Key", "AB36FE568344446D92F87BACD84F02CB"); myHeaders.append("X-Api-Key", "AB36FE568344446D92F87BACD84F02CB");
@@ -115,10 +124,35 @@
fetch(url, requestOptions) fetch(url, requestOptions)
.then(response => response.text()) .then(response => response.text())
.then(result => console.log(result)) .then( /*result => console.log(result)*/ )
.catch(error => console.log('error', error)); .catch(error => console.log('error', error));
} }
//Methods
function load() {
RecoverPrinterInfos();
}
function RecoverPrinterInfos() {
const temperaturesRoute = 'http://192.168.50.239/api/printer';
fetchData(temperaturesRoute).then(data => {
DisplayTemperatures(data);
})
.catch(error => {
console.error(error);
});
}
function RecoverJobInfos() {
let url = "http://192.168.50.239/api/job";
fetchData(url).then(data => {
DisplayJob(data);
})
.catch(error => {
console.error(error);
});
}
function setNewBedTemps(temp) { function setNewBedTemps(temp) {
let url = "http://192.168.50.239/api/printer/bed"; let url = "http://192.168.50.239/api/printer/bed";
let json = { let json = {
@@ -139,6 +173,7 @@
sendPostRequest(url, json); sendPostRequest(url, json);
} }
//Vue
function DisplayTemperatures(data) { function DisplayTemperatures(data) {
var bedTemp = data["temperature"]["bed"]["actual"]; var bedTemp = data["temperature"]["bed"]["actual"];
var bedTempTarget = data["temperature"]["bed"]["target"]; var bedTempTarget = data["temperature"]["bed"]["target"];
@@ -161,4 +196,39 @@
lblHotEndTemp.innerHTML = hotEndTemp; lblHotEndTemp.innerHTML = hotEndTemp;
lblHotEndTempTarget.innerHTML = hotEndTempTarget; lblHotEndTempTarget.innerHTML = hotEndTempTarget;
} }
function DisplayJob(data) {
///console.log(data.state);
///console.log(data.progress);
///console.log(data.job);
let lblJobStatus = document.getElementById("lblJobStatus");
let lblCompletion = document.getElementById("lblCompletion");
let lblPrintTime = document.getElementById("lblPrintTime");
let lblPrintTimeLeft = document.getElementById("lblPrintTimeLeft");
let lblEstimatedPrintTime = document.getElementById("lblEstimatedPrintTime");
let lblFilamentLength = document.getElementById("lblFilamentLength");
let lblFilamentVolume = document.getElementById("lblFilamentVolume");
let lblJobFileName = document.getElementById("lblJobFileName");
let lblJobFileLastPrintedTime = document.getElementById("lblJobFileLastPrintedTime");
lblJobStatus.innerHTML = data.state;
lblCompletion.innerHTML = Math.floor(data.progress.completion * 100) / 100;
lblCompletion.innerHTML += "%";
lblPrintTime.innerHTML = Math.floor((data.progress.printTime / 3600) * 100) / 100;
lblPrintTime.innerHTML += "H";
lblPrintTimeLeft.innerHTML = Math.floor((data.progress.printTimeLeft / 3600) * 100) / 100;
lblPrintTimeLeft.innerHTML += "H";
lblEstimatedPrintTime.innerHTML = data.job.estimatedPrintTime;
if (data.job.filament != null) {
lblFilamentLength.innerHTML = data.job.filament.length;
lblFilamentVolume.innerHTML = data.job.filament.volume;
}
lblJobFileName.innerHTML = data.job.file.name;
lblJobFileLastPrintedTime = data.job.lastPrintTime;
}
</script> </script>