Add code to allow terminal in BangleApps

android.html

@@ -187,14 +187,18 @@
           </details>
         </div>
         <div id="more-deviceinfo" style="display:none">
-        <h3>Device info</h3>
-        <div id="more-deviceinfo-content"></div>
+          <h3>Device info</h3>
+          <div id="more-deviceinfo-content"></div>
+          <div class="editor--terminal">
+            <div class="editor__canvas" style="position:relative;height:20rem;display:none;"></div>
+            <button class="btn" id="terminalEnable">Enable Terminal</button>
+          </div>
         </div>
       </div>
     </div>
 
     <footer class="floating hidden">
-      <!-- Install button, hidden by default -->
+      <!-- PWA Install button, hidden by default -->
       <div id="installContainer" class="hidden">
         <button id="butInstall" type="button">
           Install
@@ -203,7 +207,7 @@
     </footer>
 
     <script src="webtools/puck.js"></script>
-    <script src="webtools/heatshrink.js"></script>    
+    <script src="webtools/heatshrink.js"></script>
     <script src="core/lib/marked.min.js"></script>
     <script src="core/lib/espruinotools.js"></script>
     <script src="core/js/utils.js"></script>
@@ -416,7 +420,7 @@ if (el) el.addEventListener("click", event=>{
   if (webrtc) showWebRTCID(webrtc.peerId);
   else {
     webrtc = webrtcInit({
-      bridge:true, 
+      bridge:true,
       onStatus : function(s) {
         showToast(s);
       },
@@ -432,7 +436,7 @@ if (el) el.addEventListener("click", event=>{
       onPortDisconnect : function(serialPort) {
       },
       onPortWrite : function(data, cb) {
-        Puck.write(data, cb);        
+        Puck.write(data, cb);
       }
     });
     connection.on("data", function(d) {

core

@@ -1 +1 @@
-Subproject commit 8f4b43bab57ddc482533b1a00bb03601dc7ead79
+Subproject commit 7e5ac0271f794bcacda3a5a692cfa479457eb4dd

css/main.css

@@ -81,8 +81,8 @@ a.btn.btn-link.dropdown-toggle {
   min-height: 8em;
 }
 
-.tile-content { 
-  position: relative; 
+.tile-content {
+  position: relative;
   overflow-wrap: anywhere; /* stop long text like links pushing the width out too far*/
 }
 .link-github {
@@ -141,3 +141,64 @@ Not sure how to get 'normal' wrap behaviour (eg fill up until max-width, then wr
   white-space: normal;
   min-width: 160px;
 }*/
+
+/* Terminal */
+/* ----------------------------------------------------- */
+.terminal
+{
+  font-size: 12px;
+  background-color: #222;
+  color: white;
+  display: block;
+  border: 0;
+  padding: 10px;
+  overflow: auto; /* adds scrollbar if needed */
+
+  position: absolute;
+  left: 0px;
+  top: 0px;
+  bottom: 0px;
+  right: 0px;
+
+  -o-user-select: text;
+  -moz-user-select: text;
+  -webkit-user-select: text;
+  user-select: text;
+}
+
+.termLine {
+  font-family: Fixed, monospace;
+  tab-size: 4;
+  min-height: 1em;
+}
+
+.terminal.focus
+{
+  background-color: #333;
+}
+
+.terminal__focus
+{
+  position: absolute;
+  top: -100px;  /* hide it */
+}
+
+.terminal a
+{
+  color:#88F;
+}
+.terminal a:visited
+{
+  color:#88F;
+}
+
+.terminal--connected.focus .terminal__cursor
+{
+  animation: blink 1s step-end 0s infinite;
+}
+
+.terminal--webcam.focus .terminal__cursor
+{
+  text-shadow: none;
+  animation: blink_webcam 1s step-end 0s infinite;
+}

index.html

@@ -190,14 +190,18 @@
           </details>
         </div>
         <div id="more-deviceinfo" style="display:none">
-        <h3>Device info</h3>
-        <div id="more-deviceinfo-content"></div>
+          <h3>Device info</h3>
+          <div id="more-deviceinfo-content"></div>
+          <div class="editor--terminal">
+            <div class="editor__canvas" style="position:relative;height:20rem;display:none;"></div>
+            <button class="btn" id="terminalEnable">Enable Terminal</button>
+          </div>
         </div>
       </div>
     </div>
 
     <footer class="floating hidden">
-      <!-- Install button, hidden by default -->
+      <!-- PWA Install button, hidden by default -->
       <div id="installContainer" class="hidden">
         <button id="butInstall" type="button">
           Install