From e245c934df824e79dd99004461476591893adca4 Mon Sep 17 00:00:00 2001
From: mwiegand <mwiegand@seibert-media.net>
Date: Sat, 19 Nov 2022 20:45:11 +0100
Subject: [PATCH] wip

---
 experiments/keyboard/keyboard.erb  |   2 +-
 experiments/keyboard/keyboard.html |  30 ++--
 experiments/keyboard/keyboard.rb   | 223 +++++++++++++++++++++--------
 3 files changed, 179 insertions(+), 76 deletions(-)

diff --git a/experiments/keyboard/keyboard.erb b/experiments/keyboard/keyboard.erb
index cab091c..ebae4e1 100644
--- a/experiments/keyboard/keyboard.erb
+++ b/experiments/keyboard/keyboard.erb
@@ -36,7 +36,7 @@
       <% keys.each do |key| %>
         <g transform="translate(<%= key[:x] %>, <%= key[:y] %>)">
           <use class="key" href="#<%= key[:keycap] %>"></use>
-          <text class="keycap_text"><%= key[:name] %></text>
+          <text class="keycap_text"><%= key[:symbol] %></text>
         </g>
       <% end %>
     </svg>
diff --git a/experiments/keyboard/keyboard.html b/experiments/keyboard/keyboard.html
index 9848173..17b2075 100644
--- a/experiments/keyboard/keyboard.html
+++ b/experiments/keyboard/keyboard.html
@@ -129,7 +129,7 @@
       
         <g transform="translate(17.75, 0.5)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">PAU</text>
+          <text class="keycap_text">⏸</text>
         </g>
       
         <g transform="translate(0.5, 1.75)">
@@ -199,7 +199,7 @@
       
         <g transform="translate(14.0, 1.75)">
           <use class="key" href="#h2"></use>
-          <text class="keycap_text">BACKSP</text>
+          <text class="keycap_text">⇦</text>
         </g>
       
         <g transform="translate(15.75, 1.75)">
@@ -209,7 +209,7 @@
       
         <g transform="translate(16.75, 1.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">HOM</text>
+          <text class="keycap_text">⌂</text>
         </g>
       
         <g transform="translate(17.75, 1.75)">
@@ -239,7 +239,7 @@
       
         <g transform="translate(0.75, 2.75)">
           <use class="key" href="#h1.5"></use>
-          <text class="keycap_text">TAB</text>
+          <text class="keycap_text">↹</text>
         </g>
       
         <g transform="translate(2.0, 2.75)">
@@ -304,17 +304,17 @@
       
         <g transform="translate(14.25, 2.75)">
           <use class="key" href="#enter_iso"></use>
-          <text class="keycap_text">ENT</text>
+          <text class="keycap_text">↵</text>
         </g>
       
         <g transform="translate(15.75, 2.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">DEL</text>
+          <text class="keycap_text">⇨</text>
         </g>
       
         <g transform="translate(16.75, 2.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">END</text>
+          <text class="keycap_text">⇥</text>
         </g>
       
         <g transform="translate(17.75, 2.75)">
@@ -344,7 +344,7 @@
       
         <g transform="translate(0.875, 3.75)">
           <use class="key" href="#h1.75"></use>
-          <text class="keycap_text">CAPS</text>
+          <text class="keycap_text">⇪</text>
         </g>
       
         <g transform="translate(2.25, 3.75)">
@@ -489,7 +489,7 @@
       
         <g transform="translate(16.75, 4.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">ARU</text>
+          <text class="keycap_text">↑</text>
         </g>
       
         <g transform="translate(19.0, 4.75)">
@@ -509,7 +509,7 @@
       
         <g transform="translate(22.0, 4.75)">
           <use class="key" href="#v2"></use>
-          <text class="keycap_text">ENT</text>
+          <text class="keycap_text">↵</text>
         </g>
       
         <g transform="translate(0.625, 5.75)">
@@ -544,7 +544,7 @@
       
         <g transform="translate(13.25, 5.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">MENU</text>
+          <text class="keycap_text">≡</text>
         </g>
       
         <g transform="translate(14.375, 5.75)">
@@ -554,17 +554,17 @@
       
         <g transform="translate(15.75, 5.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">ARL</text>
+          <text class="keycap_text">←</text>
         </g>
       
         <g transform="translate(16.75, 5.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">ARD</text>
+          <text class="keycap_text">↓</text>
         </g>
       
         <g transform="translate(17.75, 5.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">ARR</text>
+          <text class="keycap_text">→</text>
         </g>
       
         <g transform="translate(19.5, 5.75)">
@@ -574,7 +574,7 @@
       
         <g transform="translate(21.0, 5.75)">
           <use class="key" href="#h1"></use>
-          <text class="keycap_text">DEL</text>
+          <text class="keycap_text">⇨</text>
         </g>
       
     </svg>
diff --git a/experiments/keyboard/keyboard.rb b/experiments/keyboard/keyboard.rb
index 928816c..52ed90d 100755
--- a/experiments/keyboard/keyboard.rb
+++ b/experiments/keyboard/keyboard.rb
@@ -2,215 +2,317 @@
 
 # https://developer.valvesoftware.com/wiki/Bind
 
-keys = {
-  escape: {
+keys = [
+  {
+    ingame: 'escape',
+    short: 'ESC',
     title: 'Escape',
     keycap: 'ESC',
   },
-  tab: {
+  {
+    ingame: 'tab',
+    short: 'TAB',
     title: 'Tabulator',
     keycap: '↹',
   },
-  capslock: {
+  {
+    ingame: 'capslock',
+    short: 'CAPS',
     title: 'Capslock',
     keycap: '⇪',
   },
-  shift: {
+  {
+    ingame: 'shift',
+    short: 'SFT',
     title: 'Shift',
     keycap: '⇧',
   },
-  ctrl: {
+  {
+    ingame: 'ctrl',
+    short: 'CTL',
     title: 'Control',
     keycap: 'CTL',
   },
-  alt: {
+  {
+    ingame: 'alt',
+    short: 'ALT',
     title: 'ALT',
     keycap: 'ALT',
   },
-  space: {
+  {
+    ingame: 'space',
+    short: 'SPC',
     title: 'Space',
     keycap: 'SPACE',
   },
-  backspace: {
+  {
+    ingame: 'backspace',
+    short: 'BSP',
     title: 'Backspace',
     keycap: '⇦',
   },
-  enter: {
+  {
+    ingame: 'enter',
+    short: 'ENT',
     title: 'Enter',
     keycap: '↵',
   },
-  semicolon: {
+  {
+    ingame: 'semicolon',
+    short: ';',
     title: 'Semicolon',
     keycap: ';',
   },
-  lwin: {
+  {
+    ingame: 'lwin',
+    short: 'LWIN',
     title: 'Left Super',
     keycap: '⊞',
   },
-  rwin: {
+  {
+    ingame: 'rwin',
+    short: 'RWIN',
     title: 'Right Super',
     keycap: '⊞',
   },
-  apps: {
+  {
+    ingame: 'apps',
+    short: 'MENU',
     title: 'Menu',
     keycap: '≡',
   },
-  numlock: {
+  {
+    ingame: 'numlock',
+    short: 'NUM',
     title: 'Numlock',
     keycap: 'NUM',
   },
-  scrolllock: {
+  {
+    ingame: 'scrolllock',
+    short: 'SCR',
     title: 'Scrollock',
     keycap: 'SCR',
   },
-  uparrow: {
+  {
+    ingame: 'uparrow',
+    short: 'ARU',
     title: 'Arrow Up',
     keycap: '↑',
   },
-  downarrow: {
+  {
+    ingame: 'downarrow',
+    short: 'ARD',
     title: 'Arrow Down',
     keycap: '↓',
   },
-  leftarrow: {
+  {
+    ingame: 'leftarrow',
+    short: 'ARL',
     title: 'Arrow Left',
     keycap: '←',
   },
-  rightarrow: {
+  {
+    ingame: 'rightarrow',
+    short: 'ARR',
     title: 'Arrow Right',
     keycap: '→',
   },
-  ins: {
+  {
+    ingame: 'ins',
+    short: 'INS',
     title: 'Insert',
     keycap: 'INS',
   },
-  del: {
+  {
+    ingame: 'del',
+    short: 'DEL',
     title: 'Delete',
     keycap: '⇨',
   },
-  pgdn: {
+  {
+    ingame: 'pgdn',
+    short: 'PGD',
     title: 'Page Down',
     keycap: '⇣',
   },
-  pgup: {
+  {
+    ingame: 'pgup',
+    short: 'PGU',
     title: 'Page Up',
     keycap: '⇡',
   },
-  home: {
+  {
+    ingame: 'home',
+    short: 'HOM',
     title: 'Home',
     keycap: '⌂',
   },
-  end: {
+  {
+    ingame: 'end',
+    short: 'END',
     title: 'End',
     keycap: '⇥',
   },
-  pause: {
+  {
+    ingame: 'pause',
+    short: 'PAU',
     title: 'Pause',
     keycap: '⏸',
   },
-  kp_end: {
+  {
+    ingame: 'kp_end',
+    short: 'N1',
     title: 'Keypad 1 (End)',
     keycap: '1',
   },
-  kp_downarrow: {
+  {
+    ingame: 'kp_downarrow',
+    short: 'N2',
     title: 'Keypad 2 (Arrow Down)',
     keycap: '2',
   },
-  kp_pgdn: {
+  {
+    ingame: 'kp_pgdn',
+    short: 'N3',
     title: 'Keypad 3 (Page Down)',
     keycap: '3',
   },
-  kp_leftarrow: {
+  {
+    ingame: 'kp_leftarrow',
+    short: 'N4',
     title: 'Keypad 4 (Arrow Left)',
     keycap: '4',
   },
-  kp_5: {
+  {
+    ingame: 'kp_5',
+    short: 'N5',
     title: 'Keypad 5',
     keycap: '5',
   },
-  kp_rightarrow: {
+  {
+    ingame: 'kp_rightarrow',
+    short: 'N6',
     title: 'Keypad 6 (Arrow Right)',
     keycap: '6',
   },
-  kp_home: {
+  {
+    ingame: 'kp_home',
+    short: 'N7',
     title: 'Keypad 7 (Home)',
     keycap: '7',
   },
-  kp_uparrow: {
+  {
+    ingame: 'kp_uparrow',
+    short: 'N8',
     title: 'Keypad 8 (Arrow Up)',
     keycap: '8',
   },
-  kp_pgup: {
+  {
+    ingame: 'kp_pgup',
+    short: 'N9',
     title: 'Keypad 9 (Page Up)',
     keycap: '9',
   },
-  kp_enter: {
+  {
+    ingame: 'kp_enter',
+    short: 'NENT',
     title: 'Keypad Enter',
     keycap: '↵',
   },
-  kp_ins: {
+  {
+    ingame: 'kp_ins',
+    short: 'NINS',
     title: 'Keypad 0',
     keycap: '0',
   },
-  kp_del: {
+  {
+    ingame: 'kp_del',
+    short: 'NDEL',
     title: 'Keypad .',
     keycap: '.',
   },
-  kp_slash: {
+  {
+    ingame: 'kp_slash',
+    short: 'NSL',
     title: 'Keypad /',
     keycap: '/',
   },
-  kp_multiply: {
+  {
+    ingame: 'kp_multiply',
+    short: 'NMUL',
     title: 'Keypad *',
     keycap: '*',
   },
-  kp_minus: {
+  {
+    ingame: 'kp_minus',
+    short: 'NMIN',
     title: 'Keypad -',
     keycap: '-',
   },
-  kp_plus: {
+  {
+    ingame: 'kp_plus',
+    short: 'NPLS',
     title: 'Keypad +',
     keycap: '+',
   },
-  mwheeldown: {
+  {
+    ingame: 'mwheeldown',
+    short: 'WLD',
     title: 'Mousewheel Down',
     keycap: '⇟',
   },
-  mwheelup: {
+  {
+    ingame: 'mwheelup',
+    short: 'WLU',
     title: 'Mousewheel Up',
     keycap: '⇞',
   },
-  mouse1: {
+  {
+    ingame: 'mouse1',
+    short: 'M1',
     title: 'Mouse 1',
     keycap: '🖱️1',
   },
-  mouse2: {
+  {
+    ingame: 'mouse2',
+    short: 'M2',
     title: 'Mouse 2',
     keycap: '🖱️2',
   },
-  mouse3: {
+  {
+    ingame: 'mouse3',
+    short: 'M3',
     title: 'Mouse 3',
     keycap: '🖱️3',
   },
-  mouse4: {
+  {
+    ingame: 'mouse4',
+    short: 'M4',
     title: 'Mouse 4',
     keycap: '🖱️4',
   },
-  mouse5: {
+  {
+    ingame: 'mouse5',
+    short: 'M5',
     title: 'Mouse 5',
     keycap: '🖱️5',
   },
-}
+]
 %(0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZÄÖÜß,.+-*/#^´).each_char do |char|
-  keys[char.to_sym] = {
+  keys.append({
+    ingame: char,
+    short: char,
     title: char,
-    'keymap': char,
-  }
+    keycap: char,
+  })
 end
 (1..12).each do |num|
-  keys[:"F#{num}"] = {
+  keys.append({
+    ingame: "F#{num}",
+    short: "F#{num}",
     title: "Function #{num}",
-    'keymap': "F#{num}",
-  }
+    keycap: "F#{num}",
+  })
 end
 
 keycaps = {
@@ -258,7 +360,7 @@ keycaps = {
 
 keyboard = {
   0    => 'ESC :1 F1 F2 F3 F4 :.5 F5 F6 F7 F8 :.5 F9 F10 F11 F12                       :.25 PNT ROL PAU',
-  1.25 => '^ 1 2 3 4 5 6 7 8 9 0 ß ´ BACKSP:h2                                         :.25 INS HOM PUP :.25 NUM / * -',
+  1.25 => '^ 1 2 3 4 5 6 7 8 9 0 ß ´ BSP:h2                                            :.25 INS HOM PUP :.25 NUM / * -',
   2.25 => 'TAB:h1.5 Q W E R T Z U I O P Ü + ENT:enter_iso                              :.25 DEL END PDN :.25   7 8 9 +:v2',
   3.25 => 'CAPS:h1.75 A S D F G H J K L Ö Ä # :1.25                                    :.25 :1  :1  :1  :.25   4 5 6',
   4.25 => 'SHIFT:h1.25 < Y X C V B N M , . - SHIFT:h2.75                               :.25 :1  ARU :1  :.25   1 2 3 ENT:v2',
@@ -275,10 +377,11 @@ keyboard.each do |row_v, row_text|
     if element.start_with? ':'
       row_h += element[1..].to_f
     else
-      key, keycap = element.split(':')
+      short, keycap = element.split(':')
+      key = keys.find{|k| k[:short] == short}
       keycap ||= :h1
       keyboard_keys.append({
-        name: key,
+        symbol: key ? key[:keycap] : short,
         keycap: keycap,
         x: row_h + keycaps[keycap.to_sym][:width]/2.0,
         y: 0.5 + row_v,