vmario/Doodle3D-API
0
0
Fork 0
mirror of https://github.com/Doodle3D/Doodle3D-API synced 2024-12-22 13:53:48 +01:00
Code Issues Releases Wiki Activity

update examples

Browse Source
This commit is contained in:
casperlamboo 2016-04-21 15:26:08 +02:00
parent 50167a686a
commit 84aa7ee8bf
2 changed files with 29 additions and 122 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

112
example/app.js
View File

@ -1,90 +1,28 @@
import {Doodle3DManager} from 'src/index.js';
import { Doodle3DManager } from 'src/index.js';
const doodle3DManager = new Doodle3DManager();
const TABLE = document.getElementById('table');
doodle3DManager.addEventListener('boxappeared', ({box}) => {
let row = document.createElement('tr');
row.id = box.boxData.wifiboxid;
row.style.color = 'black';
let id = document.createElement('td');
let state = document.createElement('td');
let localIP = document.createElement('td');
let bed = document.createElement('td');
let bedTarget = document.createElement('td');
let bufferedLines = document.createElement('td');
let currentLine = document.createElement('td');
let hasControl = document.createElement('td');
let hotend = document.createElement('td');
let hotendTarget = document.createElement('td');
let totalLines = document.createElement('td');
row.appendChild(id);
row.appendChild(localIP);
row.appendChild(state);
row.appendChild(currentLine);
row.appendChild(bufferedLines);
row.appendChild(totalLines);
row.appendChild(hotend);
row.appendChild(hotendTarget);
row.appendChild(bed);
row.appendChild(bedTarget);
row.appendChild(hasControl);
id.innerHTML = box.boxData.wifiboxid;
localIP.innerHTML = box.boxData.localip;
TABLE.appendChild(row);
function update ({state: data}) {
state.innerHTML = data.state;
if (data.state !== 'disconnected' && data.state !== 'connecting' && data.state !== 'unknown') {
bed.innerHTML = data.bed;
bedTarget.innerHTML = data.bed_target;
bufferedLines.innerHTML = data.buffered_lines;
currentLine.innerHTML = data.current_line;
hasControl.innerHTML = data.has_control;
hotend.innerHTML = data.hotend;
hotendTarget.innerHTML = data.hotend_target;
state.innerHTML = data.state;
totalLines.innerHTML = data.total_lines;
}
else {
bed.innerHTML = '';
bedTarget.innerHTML = '';
bufferedLines.innerHTML = '';
currentLine.innerHTML = '';
hasControl.innerHTML = '';
hotend.innerHTML = '';
hotendTarget.innerHTML = '';
totalLines.innerHTML = '';
}
}
if (box.alive) {
box.addEventListener('update', update);
}
box.addEventListener('connect', (event) => {
row.style.color = 'black';
box.addEventListener('update', update);
});
box.addEventListener('disconnect', (event) => {
row.style.color = 'gray';
box.removeEventListener('update', update);
});
box.setAutoUpdate(true, 1000);
});
doodle3DManager.addEventListener('boxdisappeared', ({box}) => {
let row = document.getElementById(box.boxData.wifiboxid);
TABLE.removeChild(row);
});
doodle3DManager.setAutoUpdate(true, 1000);
doodle3DManager.addEventListener('boxappeared', ({ box }) => {
box.setAutoUpdate(true);
box.addEventListener('connect', () => {
console.log('connect to box', box);
});
box.addEventListener('disconnect', () => {
console.log('disonnect to box', box);
})
box.addEventListener('update', ({ state }) => {
console.log(state);
});
});
doodle3DManager.addEventListener('boxdisappeared', ({ box }) => {
box.setAutoUpdate(false);
});
doodle3DManager.addEventListener('boxeschanged', ({ boxes }) => {
});

39
example/index.html
View File

@ -1,45 +1,14 @@
<!DOCTYPE>
<html>
<head>
<title>Doodle3D Box</title>
<style>
table, th, td {
border: 1px solid #dddddd;
font-size: 15px;
font-family: Verdana, Geneva, Tahoma, Arial, Helvetica, sans-serif;
line-height: 20px;
}
</style>
<title>Doodle3D Box</title>
<script type="text/javascript" src="../jspm_packages/system.js"></script>
<script type="text/javascript" src="../config.js"></script>
</head>
<body>
<script type="text/javascript">
System.import('./app.js');
</script>
</head>
<table style="width:100%">
<tbody id="table">
<tr>
<th>ID</th>
<th>Local IP</th>
<th>State</th>
<th>Current Line</th>
<th>Buffered Lines</th>
<th>Total Lines</th>
<th>Hotend</th>
<th>Hotend Target</th>
<th>Bed</th>
<th>Bed Target</th>
<th>Has Control</th>
</tr>
</tbody>
</table>
<body>
</body>
</html>
</html>