Dynamically load display size from the driver to the canvas on app init

README.md

@@ -2,9 +2,11 @@ NEEDS BETTER README!
 
 Make sure you are on a recent nodejs version. Raspbian has old version. Use nodesource ;).
 
+copy config.example.json to config.json and pick a driver + display size.
+
 npm install
 
-node pixdisp.js
+nodejs pixdisp.js
 
 http://localhost:8080/
 

controllers/apicontroller.js

@@ -7,13 +7,14 @@ class ApiController {
 		this.server = server;
 		this.driver = driver;
 
-		this.server.post( { path: '/api/writecanvas' }, this.writecanvas.bind( this ) );
+		this.server.post( { path: '/api/writecanvas' }, this.writeCanvas.bind( this ) );
 		this.server.get( { path: '/api/write' }, this.write.bind( this ) );
+		this.server.get( { path: '/api/getdisplaysize' }, this.getDisplaySize.bind( this ) );
 		this.server.get( { path: '/api/setpixel/:x/:y/:r/:g/:b' }, this.setPixel.bind( this ) );
 
 	}
 
-	writecanvas( request, resource, next ) {
+	writeCanvas( request, resource, next ) {
 
 		this.driver.clearMatrix();
 
@@ -45,6 +46,15 @@ class ApiController {
 
 	}
 
+	getDisplaySize( request, resource, next ) {
+
+		resource.setHeader( 'Access-Control-Allow-Origin', '*' );
+
+		resource.json( 200, this.driver.getSize() );
+		return next();
+
+	}
+
 	setPixel( request, resource, next ) {
 
 		resource.setHeader( 'Access-Control-Allow-Origin', '*' );

www/js/app.js

@@ -3,8 +3,19 @@
 class App
 {
 	constructor() {
-		this.createCanvas(16,16);
-		this.createPalette();
+		let request = new XMLHttpRequest();
+		request.open( 'GET', '/api/getdisplaysize', true );
+		request.onload = this.onGetDisplaySizeFinished;
+		request.send();
+	}
+
+	onGetDisplaySizeFinished() {
+		if ( this.status >= 200 && this.status < 400 ) {
+			let resp = JSON.parse( this.responseText );
+
+			app.createCanvas( resp.width, resp.height );
+			app.createPalette();
+		}
 	}
 
 	createCanvas( width, height ) {