martijn/pixdisp
1
0
Fork 0
mirror of https://github.com/sexybiggetje/pixdisp.git synced 2024-11-22 14:41:02 +01:00
Code Issues Releases Activity

Add basic animation queue, documentation to follow. Update README with new shots.

Browse source
This commit is contained in:
Martijn de Boer 2018-01-10 19:58:48 +01:00
parent 543cad5228
commit b90370351d
2 changed files with 25 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
README.md
View file

@ -35,7 +35,7 @@ Some code linting practices and security tests can be executed by running the li
### Drawing ### Drawing
![Device drawing](https://raw.githubusercontent.com/sexybiggetje/pixdisp/screenshots/device.jpg "Drawing on the device") ![Device drawing](https://raw.githubusercontent.com/sexybiggetje/pixdisp/screenshots/device.jpg "Drawing on the device")
Simple clicking on the canvas in the responsive webinterface makes things light up. Simple clicking on the canvas in the responsive webinterface makes things light up, when you press submit it will get sent to the device.
### Camera ### Camera
![Using your camera](https://raw.githubusercontent.com/sexybiggetje/pixdisp/screenshots/camera.jpg "Using your camera") ![Using your camera](https://raw.githubusercontent.com/sexybiggetje/pixdisp/screenshots/camera.jpg "Using your camera")
@ -46,3 +46,10 @@ The webinterface allows you to capture your camera and submit images from there.
![Web interface](https://raw.githubusercontent.com/sexybiggetje/pixdisp/screenshots/webui.png "Webinterface") ![Web interface](https://raw.githubusercontent.com/sexybiggetje/pixdisp/screenshots/webui.png "Webinterface")
A simple web interface is included for drawing on the device. Defaults to port 8080. A simple web interface is included for drawing on the device. Defaults to port 8080.
### Coding
![Coding](https://raw.githubusercontent.com/sexybiggetje/pixdisp/screenshots/animation.jpg "Coding")
[![Demo](http://img.youtube.com/vi/4mPzOF_h1kQ/0.jpg)](http://www.youtube.com/watch?v=4mPzOF_h1kQ)
With an advanced editor you can write simple animations in the browser using a secure sandboxed javascript. Documentation will follow here once the API is final.

23
controllers/vmcontroller.js
View file

@ -11,6 +11,7 @@ class VMController
this.delta = 0; this.delta = 0;
this.sandbox = {}; this.sandbox = {};
this.vm = null; this.vm = null;
this.runNextFrame = false;
} }
@ -34,9 +35,11 @@ class VMController
} }
resetSandbox() { resetSandbox() {
this.previousTime = this.getTimeData();
let matrixSize = this.driver.getSize(); let matrixSize = this.driver.getSize();
this.sandbox = { this.sandbox = {
'sandbox': {},
'WIDTH': matrixSize.width, 'WIDTH': matrixSize.width,
'HEIGHT': matrixSize.height, 'HEIGHT': matrixSize.height,
@ -51,7 +54,8 @@ class VMController
'drawCircle': this.driver.drawCircle.bind( this.driver ), 'drawCircle': this.driver.drawCircle.bind( this.driver ),
'write': this.driver.write.bind( this.driver ), 'write': this.driver.write.bind( this.driver ),
'delta': this.getDelta.bind( this ) 'delta': this.getDelta.bind( this ),
'run': this.run.bind( this )
}; };
} }
@ -60,17 +64,18 @@ class VMController
let delta = 0; let delta = 0;
let tmd = this.getTimeData(); let tmd = this.getTimeData();
if ( this.previousTime === 0 ) {
this.previousTime = tmd;
} else {
delta = tmd - this.previousTime; delta = tmd - this.previousTime;
this.previousTime = tmd;
}
this.delta = delta; this.previousTime = tmd;
this.delta = delta / 1000000;
this.vm.run( this.runningVmScript, 'pixdisp-sandbox.js' ); this.vm.run( this.runningVmScript, 'pixdisp-sandbox.js' );
if ( this.runNextFrame === true ) {
this.runNextFrame = false;
setTimeout( this.runScript.bind( this ), 1 );
}
} }
getTimeData() { getTimeData() {
@ -85,6 +90,10 @@ class VMController
getDelta() { getDelta() {
return this.delta; return this.delta;
} }
run() {
this.runNextFrame = true;
}
} }
exports.VMController = VMController; exports.VMController = VMController;