diff --git a/css/ui.css b/css/ui.css
index 69b4588c..cb0c2403 100644
--- a/css/ui.css
+++ b/css/ui.css
@@ -516,3 +516,19 @@ div.asset_toolbar {
padding:8px;
margin:8px;
}
+.control-insns {
+ margin-top:1em;
+}
+.control-key {
+ border: 2px solid rgba(0,0,0,0.2);
+ border-radius: 0.6em;
+ padding: 0.2em;
+ padding-left: 0.5em;
+ padding-right: 0.5em;
+ background-color: #eee;
+ margin-left: 1em;
+ color: #666;
+}
+.control-def {
+ color: #ccc;
+}
diff --git a/index.html b/index.html
index 92522fa9..51a925e4 100644
--- a/index.html
+++ b/index.html
@@ -225,6 +225,14 @@ if (window.location.host.endsWith('8bitworkshop.com')) {
+
+
diff --git a/src/ui.ts b/src/ui.ts
index 44709748..4bd074f7 100644
--- a/src/ui.ts
+++ b/src/ui.ts
@@ -12,7 +12,7 @@ import { PLATFORMS, EmuHalt, Toolbar } from "./emu";
import * as Views from "./views";
import { createNewPersistentStore } from "./store";
import { getFilenameForPath, getFilenamePrefix, highlightDifferences, invertMap, byteArrayToString, compressLZG,
- byteArrayToUTF8, isProbablyBinary, getWithBinary, getBasePlatform, hex } from "./util";
+ byteArrayToUTF8, isProbablyBinary, getWithBinary, getBasePlatform, getRootBasePlatform, hex } from "./util";
import { StateRecorderImpl } from "./recorder";
import { GHSession, GithubService, getRepos, parseGithubURL } from "./services";
@@ -1643,6 +1643,10 @@ function addPageFocusHandlers() {
});
}
+function showInstructions() {
+ $("#emucontrols-" + getRootBasePlatform(platform_id)).show();
+}
+
function startPlatform() {
if (!PLATFORMS[platform_id]) throw Error("Invalid platform '" + platform_id + "'.");
platform = new PLATFORMS[platform_id]($("#emulator")[0]);
@@ -1669,6 +1673,7 @@ function startPlatform() {
setupDebugControls();
updateSelector();
addPageFocusHandlers();
+ showInstructions();
return true;
}