From a511d81c97b9f314431c6023db372c012a91c548 Mon Sep 17 00:00:00 2001
From: Steven Hugg <hugg@fasterlight.com>
Date: Sat, 24 Nov 2018 13:44:07 -0500
Subject: [PATCH] less padding on CRT style, overscan option

---
 css/ui.css             | 8 ++++----
 src/emu.ts             | 7 ++++++-
 src/platform/coleco.ts | 2 +-
 src/platform/nes.ts    | 2 +-
 4 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/css/ui.css b/css/ui.css
index 12177d29..06e02fbc 100644
--- a/css/ui.css
+++ b/css/ui.css
@@ -244,12 +244,12 @@ div.emuspacer {
   border-radius:20px;
   border: 4px solid #222;
   outline-color: #666;
-  padding: 30px;
+  padding: 20px;
   background: #000;
   margin-top:40px;
-  margin-left:7.5%;
-  margin-right:7.5%;
-  width: 85%;
+  margin-left:5%;
+  margin-right:5%;
+  width:90%;
   pointer-events:auto;
 }
 canvas.pixelated {
diff --git a/src/emu.ts b/src/emu.ts
index 497cb622..c5d785b5 100644
--- a/src/emu.ts
+++ b/src/emu.ts
@@ -53,7 +53,9 @@ function _setKeyboardEvents(canvas:HTMLElement, callback:KeyboardCallback) {
   };
 };
 
-export var RasterVideo = function(mainElement:HTMLElement, width:number, height:number, options?) {
+type VideoCanvasOptions = {rotate?:number, overscan?:boolean};
+
+export var RasterVideo = function(mainElement:HTMLElement, width:number, height:number, options?:VideoCanvasOptions) {
   var canvas, ctx;
   var imageData, arraybuf, buf8, datau32;
   var vcanvas;
@@ -79,6 +81,9 @@ export var RasterVideo = function(mainElement:HTMLElement, width:number, height:
     if (options && options.rotate) {
       this.setRotate(options.rotate);
     }
+    if (options && options.overscan) {
+      vcanvas.css('padding','0px');
+    }
     ctx = canvas.getContext('2d');
     imageData = ctx.createImageData(width, height);
     datau32 = new Uint32Array(imageData.data.buffer);
diff --git a/src/platform/coleco.ts b/src/platform/coleco.ts
index 4b05c9ab..18877b06 100644
--- a/src/platform/coleco.ts
+++ b/src/platform/coleco.ts
@@ -123,7 +123,7 @@ const _ColecoVisionPlatform = function(mainElement) {
       	}
       };
       cpu = this.newCPU(membus, iobus);
-      video = new RasterVideo(mainElement,canvasWidth,numVisibleScanlines);
+      video = new RasterVideo(mainElement,canvasWidth,numVisibleScanlines,{overscan:true});
       video.create();
       audio = new MasterAudio();
       psg = new SN76489_Audio(audio);
diff --git a/src/platform/nes.ts b/src/platform/nes.ts
index b51a0be9..ee14cd77 100644
--- a/src/platform/nes.ts
+++ b/src/platform/nes.ts
@@ -78,7 +78,7 @@ const _JSNESPlatform = function(mainElement) {
 
   start() {
     var self = this;
-    video = new RasterVideo(mainElement,256,224);
+    video = new RasterVideo(mainElement,256,224,{overscan:true});
     audio = new SampleAudio(audioFrequency);
     video.create();
     var idata = video.getFrameData();