From f991833d68fde979c8bca998226aca06ac80290f Mon Sep 17 00:00:00 2001
From: Ian Flanigan <flan@google.com>
Date: Sun, 11 Oct 2020 17:48:16 +0200
Subject: [PATCH] Add a "Clear" button to clear the printer paper (#35)

Before, the printer "paper" would just keep accumulating changes. Now
the `printer-modal` dialog has a "clear" button that will the paper.
---
 apple2js.html    |  1 +
 apple2jse.html   |  1 +
 js/main2.js      |  2 +-
 js/main2e.js     |  2 +-
 js/ui/apple2.js  |  8 +++++++-
 js/ui/printer.js | 16 +++++++++++++++-
 6 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/apple2js.html b/apple2js.html
index b806eee..40b5794 100644
--- a/apple2js.html
+++ b/apple2js.html
@@ -348,6 +348,7 @@
           <div class="paper"></div>
         </main>
         <footer class="modal__footer">
+          <button class="modal__btn" onclick="Apple2.clearPrinterPaper()" aria-label="Clear the paper">Clear</button>
           <button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Close</button>
         </footer>
       </div>
diff --git a/apple2jse.html b/apple2jse.html
index 5d8a921..1f44f56 100644
--- a/apple2jse.html
+++ b/apple2jse.html
@@ -353,6 +353,7 @@
           <div class="paper"></div>
         </main>
         <footer class="modal__footer">
+          <button class="modal__btn" onclick="Apple2.clearPrinterPaper()" aria-label="Clear the paper">Clear</button>
           <button class="modal__btn" data-micromodal-close aria-label="Close this dialog window">Close</button>
         </footer>
       </div>
diff --git a/js/main2.js b/js/main2.js
index 768aca4..5ea6a0b 100644
--- a/js/main2.js
+++ b/js/main2.js
@@ -105,7 +105,7 @@ var disk2 = new DiskII(io, driveLights, sectors);
 var clock = new Thunderclock(io);
 var smartport = new SmartPort(io, cpu, { block: true });
 
-initUI(apple2, disk2, smartport, false);
+initUI(apple2, disk2, smartport, printer, false);
 
 io.setSlot(0, lc);
 io.setSlot(1, parallel);
diff --git a/js/main2e.js b/js/main2e.js
index 453ace5..b50ab09 100644
--- a/js/main2e.js
+++ b/js/main2e.js
@@ -86,7 +86,7 @@ var disk2 = new DiskII(io, driveLights);
 var clock = new Thunderclock(io);
 var smartport = new SmartPort(io, cpu);
 
-initUI(apple2, disk2, smartport, options.e);
+initUI(apple2, disk2, smartport, printer, options.e);
 
 io.setSlot(1, parallel);
 io.setSlot(2, slinky);
diff --git a/js/ui/apple2.js b/js/ui/apple2.js
index d2830c2..a46d852 100644
--- a/js/ui/apple2.js
+++ b/js/ui/apple2.js
@@ -35,6 +35,7 @@ var vm;
 var tape;
 var _disk2;
 var _smartPort;
+var _printer;
 var audio;
 var keyboard;
 var io;
@@ -769,7 +770,11 @@ export function openPrinterModal() {
     MicroModal.show('printer-modal');
 }
 
-export function initUI(apple2, disk2, smartPort, e) {
+export function clearPrinterPaper() {
+    _printer.clear();
+}
+
+export function initUI(apple2, disk2, smartPort, printer, e) {
     _apple2 = apple2;
     cpu = _apple2.getCPU();
     io = _apple2.getIO();
@@ -778,6 +783,7 @@ export function initUI(apple2, disk2, smartPort, e) {
     tape = new Tape(io);
     _disk2 = disk2;
     _smartPort = smartPort;
+    _printer = printer;
 
     keyboard = new KeyBoard(cpu, io, e);
     keyboard.create('#keyboard');
diff --git a/js/ui/printer.js b/js/ui/printer.js
index 2dc2023..e372c85 100644
--- a/js/ui/printer.js
+++ b/js/ui/printer.js
@@ -9,6 +9,20 @@
  * implied warranty.
  */
 
+ /**
+  * Printer UI. The "paper" is bound to the element selected by the input.
+  *
+  * Every line that is output to the printer is added as a <div> to the paper.
+  * The high bit of all characters is stripped and only visible characters are
+  * added to the output. The following characters receive special treatment:
+  *
+  * *   `EOT` (ASCII 4): deletes last character
+  * *   `HT` (ASCII 9): replaced with 8 spaces
+  * *   `LF` (ASCII 10): silently removed
+  * *   `CR` (ASCII 13): a newline and carriage return
+  *
+  * @param {string} el The selector of the element on which to bind the "paper".
+  */
 export default function Printer(el) {
     var paper = document.querySelector(el);
     var _lineBuffer = '';
@@ -46,7 +60,7 @@ export default function Printer(el) {
 
         clear: function() {
             _lineBuffer = '';
-            paper.empty();
+            paper.innerHTML = "";
             newLine();
         },