Add back button to keys scene and allow fullscreen

Closes #29

icon_font/U+2BC7 Black Medium Left-Pointing Triangle Centred.svg

@@ -0,0 +1,159 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   inkscape:version="1.1.1 (3bf5ae0d25, 2021-09-20)"
+   sodipodi:docname="U+2B60 Leftwards Triangle-Headed Arrow (Kopie).svg"
+   width="1000"
+   height="1000"
+   viewBox="0 0 264.58333 264.58334"
+   version="1.1"
+   id="svg964"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:dc="http://purl.org/dc/elements/1.1/">
+  <sodipodi:namedview
+     inkscape:document-rotation="0"
+     inkscape:snap-global="true"
+     inkscape:current-layer="layer1"
+     inkscape:window-maximized="1"
+     inkscape:window-y="32"
+     inkscape:window-x="0"
+     inkscape:cy="437.77147"
+     inkscape:cx="266.98483"
+     inkscape:zoom="0.71726922"
+     inkscape:guide-bbox="true"
+     showguides="true"
+     showgrid="false"
+     id="namedview8"
+     inkscape:window-height="1011"
+     inkscape:window-width="1920"
+     inkscape:pageshadow="2"
+     inkscape:pageopacity="0"
+     guidetolerance="10"
+     gridtolerance="10"
+     objecttolerance="10"
+     borderopacity="1"
+     bordercolor="#666666"
+     pagecolor="#ffffff"
+     inkscape:pagecheckerboard="0"
+     inkscape:snap-bbox="false">
+    <sodipodi:guide
+       inkscape:color="rgb(0,0,255)"
+       inkscape:label=""
+       inkscape:locked="false"
+       id="guide815"
+       orientation="0,1"
+       position="0,52.916667" />
+    <sodipodi:guide
+       inkscape:color="rgb(0,0,255)"
+       inkscape:label=""
+       inkscape:locked="false"
+       id="guide817"
+       orientation="1,0"
+       position="5.2916667,0" />
+    <sodipodi:guide
+       inkscape:color="rgb(0,0,255)"
+       inkscape:label=""
+       inkscape:locked="false"
+       id="guide819"
+       orientation="0,1"
+       position="0,259.29167" />
+    <sodipodi:guide
+       inkscape:color="rgb(0,0,255)"
+       inkscape:label=""
+       inkscape:locked="false"
+       id="guide821"
+       orientation="1,0"
+       position="259.29167,0" />
+    <sodipodi:guide
+       inkscape:color="rgb(0,0,255)"
+       inkscape:label=""
+       inkscape:locked="false"
+       id="guide823"
+       orientation="1,0"
+       position="29.104167,0" />
+    <sodipodi:guide
+       inkscape:color="rgb(0,0,255)"
+       inkscape:label=""
+       inkscape:locked="false"
+       id="guide825"
+       orientation="1,0"
+       position="235.47917,0" />
+    <sodipodi:guide
+       inkscape:color="rgb(0,0,255)"
+       inkscape:label=""
+       inkscape:locked="false"
+       id="guide827"
+       orientation="0,1"
+       position="132.29167,161.39583" />
+    <sodipodi:guide
+       inkscape:color="rgb(0,0,255)"
+       inkscape:label=""
+       inkscape:locked="false"
+       id="guide829"
+       orientation="1,0"
+       position="132.29167,161.39583" />
+  </sodipodi:namedview>
+  <defs
+     id="defs958">
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect6088"
+       is_visible="true"
+       lpeversion="1"
+       satellites_param="F,0,0,1,0,38,0,4 @ F,0,0,1,0,38,0,4 @ F,0,0,1,0,38,0,4"
+       unit="px"
+       method="auto"
+       mode="F"
+       radius="38"
+       chamfer_steps="4"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+    <inkscape:path-effect
+       effect="fillet_chamfer"
+       id="path-effect5304"
+       is_visible="true"
+       lpeversion="1"
+       satellites_param="F,0,0,1,0,7,0,1 @ F,0,0,1,0,7,0,1 @ F,0,0,1,0,7,0,1"
+       unit="px"
+       method="auto"
+       mode="F"
+       radius="7"
+       chamfer_steps="1"
+       flexible="false"
+       use_knot_distance="true"
+       apply_no_radius="true"
+       apply_with_radius="true"
+       only_selected="false"
+       hide_knots="false" />
+  </defs>
+  <metadata
+     id="metadata961">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title />
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <g
+     inkscape:groupmode="layer"
+     id="layer1"
+     transform="translate(0,-32.41665)">
+    <path
+       id="path2476"
+       inkscape:transform-center-x="26.879406"
+       d="M 204.85638,252.74656 55.648672,168.16048 a 3.9683103,3.9683103 90.000003 0 1 0,-6.90434 L 204.85639,76.670075 a 4.0782719,4.0782719 30.225521 0 1 6.08954,3.54783 l -1e-5,168.980825 a 4.078272,4.078272 149.77449 0 1 -6.08954,3.54783 z"
+       style="fill:#000000;stroke-width:0.273459" />
+  </g>
+</svg>

icon_font/icon.sfd

@@ -21,7 +21,7 @@ OS2Version: 0
 OS2_WeightWidthSlopeOnly: 0
 OS2_UseTypoMetrics: 1
 CreationTime: 1535548659
-ModificationTime: 1643014100
+ModificationTime: 1643323396
 PfmFamily: 17
 TTFWeight: 400
 TTFWidth: 5
@@ -55,7 +55,7 @@ WinInfo: 0 35 12
 BeginPrivate: 0
 EndPrivate
 TeXData: 1 0 0 346030 173015 115343 0 1048576 115343 783286 444596 497025 792723 393216 433062 380633 303038 157286 324010 404750 52429 2506097 1059062 262144
-BeginChars: 1114112 24
+BeginChars: 1114112 25
 
 StartChar: uni2328
 Encoding: 9000 9000 0
@@ -1068,5 +1068,24 @@ SplineSet
  840 791 847 799 855 799 c 2
 EndSplineSet
 EndChar
+
+StartChar: uni2BC7
+Encoding: 11207 11207 24
+Width: 1024
+LayerCount: 2
+Fore
+SplineSet
+793 -34 m 2
+ 215 294 l 2
+ 210 297 208 301 208 307 c 0
+ 208 313 210 317 215 320 c 2
+ 793 648 l 2
+ 798 651 804 651 809 648 c 0
+ 814 645 816 639 816 634 c 2
+ 816 -20 l 2
+ 816 -25 814 -31 809 -34 c 0
+ 804 -37 798 -37 793 -34 c 2
+EndSplineSet
+EndChar
 EndChars
 EndSplineFont

webdata/fn.js

@@ -488,6 +488,11 @@ window.addEventListener("load", function() {
     document.getElementById("reloadbutton").addEventListener("click", function() {
         location.reload();
     });
+    document.querySelectorAll(".backbutton").forEach(function(button) {
+        button.addEventListener("click", function() {
+            history.back();
+        });
+    });
     document.addEventListener("touchstart", handleStart);
     document.addEventListener("touchend", handleEnd);
     document.addEventListener("touchcancel", handleEnd);

webdata/index.html

@@ -30,7 +30,7 @@
         <button id="sendbutton">➣</button>
     </div>
 </div>
-<div id="keys" class="touchpad key hidden">
+<div id="keys" class="touchpad key fullscreen hidden">
     <div class="page">
         <div class="buttons">
             <button id="browserbackbutton">⭠</button>
@@ -66,4 +66,5 @@
         </div>
     </div>
     <button id="switchbutton">⮂</button>
+    <button class="backbutton">⯇</button>
 </div>

webdata/main.css

@@ -180,6 +180,13 @@ textarea {
     border-right: none;
 }
 
+#keys .backbutton {
+    left: 0;
+    top: 0;
+    border-top: none;
+    border-left: none;
+}
+
 #keys .buttons {
     display: flex;
     justify-content: center;