diff --git a/index.htm b/index.htm
index e88f096..2e28f88 100644
--- a/index.htm
+++ b/index.htm
@@ -31,12 +31,12 @@ By Joshua Bell
-
+
diff --git a/index.js b/index.js
index 2ea09c0..9ca9aae 100644
--- a/index.js
+++ b/index.js
@@ -11,7 +11,8 @@ window.onload = function () {
} ());
- var tty = new TTY($('#screen'), $('#screen'), bell);
+ var frame = $('#frame');
+ var tty = new TTY($('#screen'), frame, bell);
var dos = new DOS(tty);
var lores = new LoRes($('#lores'), 40, 48);
@@ -84,27 +85,6 @@ window.onload = function () {
editor.setValue(source);
}
- // Do not let certain events take focus away from "keyboard"
- function keyboardFocus(e) {
- tty.focus();
- e.stopPropagation(); // W3C
- e.preventDefault(); // e.g. to block arrows from scrolling the page
- }
-
- addEvent($('#lores'), 'click', keyboardFocus);
- addEvent($('#hires'), 'click', keyboardFocus);
- addEvent($('#hires2'), 'click', keyboardFocus);
- addEvent($('#screen'), 'click', keyboardFocus);
- addEvent($('#frame'), 'click', keyboardFocus);
- addEvent($('#frame'), 'blur', keyboardFocus); // Needed on IE, not sure why it tries to get focus
-
- addEvent($('#screen'), 'focus', function () {
- getClassList($('#frame')).add('focused');
- });
- addEvent($('#screen'), 'blur', function () {
- getClassList($('#frame')).remove('focused');
- });
-
var program;
addEvent($('#btn_run'), 'click', function () {
dos.reset();
diff --git a/styles.css b/styles.css
index 4ff208f..aa7412a 100644
--- a/styles.css
+++ b/styles.css
@@ -38,7 +38,7 @@ body.printout #hide_paper { display: inline-block; }
/* Apple II Screen */
.frame {width: 560px; height: 384px; border-style: ridge; border-width: 10px; border-color: gray; padding: 10px; background-color: #202020; }
-.frame.focused { background-color: #204020; }
+.frame:focus { background-color: #204020; }
.wrapper { width: 560px; height: 384px; overflow: hidden; padding: 0; margin: 0; position: relative; }
.lores {position: absolute; z-index: 2; left: 0; top: 0; width: 560px; height: 384px; overflow: hidden; visibility: hidden; }
.hires {position: absolute; z-index: 2; left: 0; top: 0; width: 560px; height: 384px; overflow: hidden; visibility: hidden; background-color: #000000; }