fixes? ig?

site/camera-info/main.css

@@ -57,6 +57,7 @@ body > div > * {
 #precanvas {
 	height: 100%;
 	max-height: 4in;
+	max-width: 100vw;
 	flex-shrink: 0;
 }
 

site/camera-info/main.js

@@ -89,8 +89,10 @@ window.app = {
     enter() {
       let canvas = document.getElementById("final");
       let ctx = canvas.getContext("2d");
+      ctx.fillStyle = "white";
+      ctx.fillRect(0, 0, 1440, 960);
       ctx.font = "bold 96px sans-serif";
-      ctx.filLStyle = "black";
+      ctx.fillStyle = "black";
       ctx.fillText(document.getElementById("title").value, 0, 96);
       ctx.font = "bold 48px sans-serif";
       ctx.fillText(new Date().toLocaleString(), 0, 152);
@@ -135,10 +137,25 @@ function maps_static(lat, long, cbk) {
 }
 
 
+function getFilename() {
+  var title = "camera-info-";
+  for (char of document.getElementById("title").value) {
+    let cc = char.charCodeAt(0);
+    if ((cc > 47 && cc < 58) || (cc > 64 && cc < 91) || (cc > 96 && cc < 123)) {
+      title += char.toLowerCase();
+    }
+    else {
+      title += '-';
+    }
+  }
+  return title + ".png";
+}
+
+
 function download() {
   let canvas = document.getElementById("final");
   let anchor = document.createElement("a");
   anchor.href = canvas.toDataURL();
-  anchor.download = "file.png";
+  anchor.download = getFilename();
   anchor.click();
 }