Store the keyboard layout in its own HTML file.

diff --git a/Makefile.am b/Makefile.am
index 2f28df253011a95bd53efddaa2e462f4e5f556a5..92df0bc5984db29707f1b157d5d85220649354d5 100644 (file)
--- a/Makefile.am
+++ b/Makefile.am
@@ -32,6 +32,7 @@ EXTRA_DIST           = INSTALL.Debian                                         \
                        demo/demo.jspp                                         \
                        demo/demo.xml                                          \
                        demo/enabled.gif                                       \
+                       demo/keyboard.html                                     \
                        demo/keyboard.png                                      \
                        demo/styles.css                                        \
                        demo/print-styles.css                                  \
@@ -153,6 +154,7 @@ ${top_srcdir}/demo/demo.js: ${top_srcdir}/demo/beep.wav                       \
                             ${top_srcdir}/demo/demo.jspp                      \
                             ${top_srcdir}/demo/enabled.gif                    \
                             ${top_srcdir}/demo/favicon.ico                    \
+                            ${top_srcdir}/demo/keyboard.html                  \
                             ${top_srcdir}/demo/keyboard.png                   \
                             ${top_srcdir}/demo/styles.css                     \
                             ${top_srcdir}/demo/print-styles.css               \
@@ -174,6 +176,10 @@ ${top_srcdir}/demo/favicon.ico: ${top_srcdir}/shellinabox/favicon.ico
        @rm -f "$@"
        ln "$?" "$@"
 
+${top_srcdir}/demo/keyboard.html: ${top_srcdir}/shellinabox/keyboard-layout.html
+       @rm -f "$@"
+       ln "$?" "$@"
+
 ${top_srcdir}/demo/keyboard.png: ${top_srcdir}/shellinabox/keyboard.png
        @rm -f "$@"
        ln "$?" "$@"
@@ -292,20 +298,15 @@ clean-local:
 shellinabox/shell_in_a_box.o: ${top_srcdir}/shellinabox/shell_in_a_box.js     \
                ${top_srcdir}/config.h
 
-${top_srcdir}/shellinabox/vt100.js: ${top_srcdir}/shellinabox/vt100.jspp      \
-               ${top_srcdir}/shellinabox/keyboard-layout.html
+${top_srcdir}/shellinabox/vt100.js: ${top_srcdir}/shellinabox/vt100.jspp
 
 .jspp.js:
        @echo preprocess "$<" "$@"
-       @kbd=`while read i; do                                                \
-               printf '%s' "\`echo "$$i" | sed 's/&/\\\\\\&/g'\`";           \
-             done <${top_srcdir}/shellinabox/keyboard-layout.html`;          \
        sed -e "`sed -e 's/^#define *\([^ ]*\) *\(.*\)/\/^[^#]\/s\/\1\/\2 \\\\\/* \1 *\\\\\/\/g/' \
                     -e t                                                     \
                     -e d "$<"`"                                              \
             -e "s/^#/\/\/ #/"                                                \
             -e "s/VERSION/\"@VERSION@ (revision @VCS_REVISION@)\"/g"         \
-            -e "s%KEYBOARD%'$${kbd}'%"                                       \
             "$<" >"$@"
 
 .js.o:

diff --git a/Makefile.in b/Makefile.in
index 018f2349f5f07734faf52d23fe8b66a2a40032fd..1fb1a2b8b1400da20b3b1ca0658b909ce131475e 100644 (file)
--- a/Makefile.in
+++ b/Makefile.in
@@ -290,6 +290,7 @@ EXTRA_DIST = INSTALL.Debian                                         \
                        demo/demo.jspp                                         \
                        demo/demo.xml                                          \
                        demo/enabled.gif                                       \
+                       demo/keyboard.html                                     \
                        demo/keyboard.png                                      \
                        demo/styles.css                                        \
                        demo/print-styles.css                                  \
@@ -1175,6 +1176,7 @@ ${top_srcdir}/demo/demo.js: ${top_srcdir}/demo/beep.wav                       \
                             ${top_srcdir}/demo/demo.jspp                      \
                             ${top_srcdir}/demo/enabled.gif                    \
                             ${top_srcdir}/demo/favicon.ico                    \
+                            ${top_srcdir}/demo/keyboard.html                  \
                             ${top_srcdir}/demo/keyboard.png                   \
                             ${top_srcdir}/demo/styles.css                     \
                             ${top_srcdir}/demo/print-styles.css               \
@@ -1196,6 +1198,10 @@ ${top_srcdir}/demo/favicon.ico: ${top_srcdir}/shellinabox/favicon.ico
        @rm -f "$@"
        ln "$?" "$@"
 
+${top_srcdir}/demo/keyboard.html: ${top_srcdir}/shellinabox/keyboard-layout.html
+       @rm -f "$@"
+       ln "$?" "$@"
+
 ${top_srcdir}/demo/keyboard.png: ${top_srcdir}/shellinabox/keyboard.png
        @rm -f "$@"
        ln "$?" "$@"
@@ -1312,20 +1318,15 @@ clean-local:
 shellinabox/shell_in_a_box.o: ${top_srcdir}/shellinabox/shell_in_a_box.js     \
                ${top_srcdir}/config.h
 
-${top_srcdir}/shellinabox/vt100.js: ${top_srcdir}/shellinabox/vt100.jspp      \
-               ${top_srcdir}/shellinabox/keyboard-layout.html
+${top_srcdir}/shellinabox/vt100.js: ${top_srcdir}/shellinabox/vt100.jspp
 
 .jspp.js:
        @echo preprocess "$<" "$@"
-       @kbd=`while read i; do                                                \
-               printf '%s' "\`echo "$$i" | sed 's/&/\\\\\\&/g'\`";           \
-             done <${top_srcdir}/shellinabox/keyboard-layout.html`;          \
        sed -e "`sed -e 's/^#define *\([^ ]*\) *\(.*\)/\/^[^#]\/s\/\1\/\2 \\\\\/* \1 *\\\\\/\/g/' \
                     -e t                                                     \
                     -e d "$<"`"                                              \
             -e "s/^#/\/\/ #/"                                                \
             -e "s/VERSION/\"@VERSION@ (revision @VCS_REVISION@)\"/g"         \
-            -e "s%KEYBOARD%'$${kbd}'%"                                       \
             "$<" >"$@"
 
 .js.o:

diff --git a/config.h b/config.h
index 14cbbcc81a01eaf5a2574320488ab40620587c05..347a300e2f675f0d972bb07519f3a73cf00f0c8b 100644 (file)
--- a/config.h
+++ b/config.h
@@ -153,7 +153,7 @@
 #define STDC_HEADERS 1
 
 /* Most recent revision number in the version control system */
-#define VCS_REVISION "223"
+#define VCS_REVISION "225"
 
 /* Version number of package */
 #define VERSION "2.10"

diff --git a/configure b/configure
index 118c49a9e68d74ec193ef54a2a99831dc62befb8..ca1d7a891290f995d010a8fdc469f4ee0f613915 100755 (executable)
--- a/configure
+++ b/configure
@@ -2328,7 +2328,7 @@ ac_link='$CC -o conftest$ac_exeext $CFLAGS $CPPFLAGS $LDFLAGS conftest.$ac_ext $
 ac_compiler_gnu=$ac_cv_c_compiler_gnu
 
 
-VCS_REVISION=223
+VCS_REVISION=225
 
 
 cat >>confdefs.h <<_ACEOF

diff --git a/configure.ac b/configure.ac
index ecd2bf944450aca433f5cf10443423ccb9d71c3c..65d2ff8cec617f25ec2eb186e20812776e8c3dbf 100644 (file)
--- a/configure.ac
+++ b/configure.ac
@@ -2,7 +2,7 @@ AC_PREREQ(2.57)
 
 dnl This is the one location where the authoritative version number is stored
 AC_INIT(shellinabox, 2.10, markus@shellinabox.com)
-VCS_REVISION=223
+VCS_REVISION=225
 AC_SUBST(VCS_REVISION)
 AC_DEFINE_UNQUOTED(VCS_REVISION, "${VCS_REVISION}",
                    [Most recent revision number in the version control system])

diff --git a/demo/keyboard.html b/demo/keyboard.html
new file mode 100644 (file)
index 0000000..6a95f3b
--- /dev/null
+++ b/demo/keyboard.html
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xml:lang="en" lang="en">
+<head>
+</head>
+<body><pre class="box"><div
+  ><i id="27">Esc</i><i id="112">F1</i><i id="113">F2</i><i id="114">F3</i
+  ><i id="115">F4</i><i id="116">F5</i><i id="117">F6</i><i id="118">F7</i
+  ><i id="119">F8</i><i id="120">F9</i><i id="121">F10</i><i id="122">F11</i
+  ><i id="123">F12</i><br
+  /><b><span class="unshifted">`</span><span class="shifted">~</span></b
+    ><b><span class="unshifted">1</span><span class="shifted">!</span></b
+    ><b><span class="unshifted">2</span><span class="shifted">@</span></b
+    ><b><span class="unshifted">3</span><span class="shifted">#</span></b
+    ><b><span class="unshifted">4</span><span class="shifted">&#36;</span></b
+    ><b><span class="unshifted">5</span><span class="shifted">&#37;</span></b
+    ><b><span class="unshifted">6</span><span class="shifted">^</span></b
+    ><b><span class="unshifted">7</span><span class="shifted">&amp;</span></b
+    ><b><span class="unshifted">8</span><span class="shifted">*</span></b
+    ><b><span class="unshifted">9</span><span class="shifted">(</span></b
+    ><b><span class="unshifted">0</span><span class="shifted">)</span></b
+    ><b><span class="unshifted">-</span><span class="shifted">_</span></b
+    ><b><span class="unshifted">=</span><span class="shifted">+</span></b
+    ><i id="8">&nbsp;&larr;&nbsp;</i
+    ><br
+  /><i id="9">Tab</i
+    ><b>Q</b><b>W</b><b>E</b><b>R</b><b>T</b><b>Y</b><b>U</b><b>I</b><b>O</b
+    ><b>P</b
+    ><b><span class="unshifted">[</span><span class="shifted">{</span></b
+    ><b><span class="unshifted">]</span><span class="shifted">}</span></b
+    ><b><span class="unshifted">&#92;</span><span class="shifted">|</span></b
+    ><br
+  /><u>Tab&nbsp;&nbsp;</u
+    ><b>A</b><b>S</b><b>D</b><b>F</b><b>G</b><b>H</b><b>J</b><b>K</b><b>L</b
+    ><b><span class="unshifted">;</span><span class="shifted">:</span></b
+    ><b><span class="unshifted">&#39;</span><span class="shifted">"</span></b
+    ><i id="13">Enter</i
+    ><br
+  /><u>&nbsp;&nbsp;</u
+    ><i id="16">Shift</i
+    ><b>Z</b><b>X</b><b>C</b><b>V</b><b>B</b><b>N</b><b>M</b
+    ><b><span class="unshifted">,</span><span class="shifted">&lt;</span></b
+    ><b><span class="unshifted">.</span><span class="shifted">&gt;</span></b
+    ><b><span class="unshifted">/</span><span class="shifted">?</span></b
+    ><i id="16">Shift</i
+    ><br
+  /><u>XXX</u
+    ><i id="17">Ctrl</i
+    ><i id="18">Alt</i
+    ><i style="width: 25ex">&nbsp</i
+  ></div
+  >&nbsp;&nbsp;&nbsp;<div
+    ><i id="45">Ins</i><i id="46">Del</i><i id="36">Home</i><i id="35">End</i
+    ><br
+    /><u>&nbsp;</u><br
+    /><u>&nbsp;</u><br
+    /><u>Ins</u><s>&nbsp;</s><b id="38">&uarr;</b><s>&nbsp;</s><u>&nbsp;</u
+      ><b id="33">&uArr;</b><br
+    /><u>Ins</u><b id="37">&larr;</b><b id="40">&darr;</b
+      ><b id="39">&rarr;</b><u>&nbsp;</u><b id="34">&dArr;</b
+  ></div
+></pre></body></html>

diff --git a/demo/vt100.js b/demo/vt100.js
index a36b76890db797a11249cce69ee209419176aa71..6b25ce5babecd186f9ba34c60411f50085a29788 100644 (file)
--- a/demo/vt100.js
+++ b/demo/vt100.js
@@ -716,15 +716,20 @@ VT100.prototype.initializeKeyBindings = function(elem) {
         }
       } else {
         var child = elem.firstChild;
-        if (child.nodeName == "#text") {
-          // If the key only has a text node as a child, then it is a letter.
-          // Automatically compute the lower and upper case version of the key.
-          this.addKeyBinding(elem, this.getTextContent(child).toLowerCase());
-        } else {
-          // If the key has two children, they are the lower and upper case
-          // character code, respectively.
-          this.addKeyBinding(elem, this.getTextContent(child), undefined,
-                             this.getTextContent(child.nextSibling));
+        if (child) {
+          if (child.nodeName == "#text") {
+            // If the key only has a text node as a child, then it is a letter.
+            // Automatically compute the lower and upper case version of the
+            // key.
+            var text = this.getTextContent(child) ||
+                       this.getTextContent(elem);
+            this.addKeyBinding(elem, text.toLowerCase());
+          } else if (child.nextSibling) {
+            // If the key has two children, they are the lower and upper case
+            // character code, respectively.
+            this.addKeyBinding(elem, this.getTextContent(child), undefined,
+                               this.getTextContent(child.nextSibling));
+          }
         }
       }
     }
@@ -735,14 +740,13 @@ VT100.prototype.initializeKeyBindings = function(elem) {
   }
 };
 
-VT100.prototype.initializeKeyboard = function() {
+VT100.prototype.initializeKeyboardButton = function() {
   // Configure mouse event handlers for button that displays/hides keyboard
-  var box                               = this.keyboard.firstChild;
-  this.hideSoftKeyboard();
   this.addListener(this.keyboardImage, 'click',
     function(vt100) { return function(e) {
       if (vt100.keyboard.style.display != '') {
         if (vt100.reconnectBtn.style.visibility != '') {
+          vt100.initializeKeyboard();
           vt100.showSoftKeyboard();
         }
       } else {
@@ -755,6 +759,18 @@ VT100.prototype.initializeKeyboard = function() {
   if (this.softKeyboard) {
     this.keyboardImage.style.visibility = 'visible';
   }
+};
+
+VT100.prototype.initializeKeyboard = function() {
+  // Only need to initialize the keyboard the very first time. When doing so,
+  // copy the keyboard layout from the iframe.
+  if (this.keyboard.firstChild) {
+    return;
+  }
+  this.keyboard.innerHTML               =
+                                    this.layout.contentDocument.body.innerHTML;
+  var box                               = this.keyboard.firstChild;
+  this.hideSoftKeyboard();
 
   // Configure mouse event handlers for on-screen keyboard
   this.addListener(this.keyboard, 'click',
@@ -808,6 +824,7 @@ VT100.prototype.initializeElements = function(container) {
       !this.getChildById(this.container, 'keyboard')    ||
       !this.getChildById(this.container, 'kbd_button')  ||
       !this.getChildById(this.container, 'kbd_img')     ||
+      !this.getChildById(this.container, 'layout')      ||
       !this.getChildById(this.container, 'scrollable')  ||
       !this.getChildById(this.container, 'console')     ||
       !this.getChildById(this.container, 'alt_console') ||
@@ -851,7 +868,6 @@ VT100.prototype.initializeElements = function(container) {
                        '</div>' +
                        '<div id="menu"></div>' +
                        '<div id="keyboard" unselectable="on">' +
-                         '<pre class="box"><div><i id="27">Esc</i><i id="112">F1</i><i id="113">F2</i><i id="114">F3</i><i id="115">F4</i><i id="116">F5</i><i id="117">F6</i><i id="118">F7</i><i id="119">F8</i><i id="120">F9</i><i id="121">F10</i><i id="122">F11</i><i id="123">F12</i><br /><b><span class="unshifted">`</span><span class="shifted">~</span></b><b><span class="unshifted">1</span><span class="shifted">!</span></b><b><span class="unshifted">2</span><span class="shifted">@</span></b><b><span class="unshifted">3</span><span class="shifted">#</span></b><b><span class="unshifted">4</span><span class="shifted">&#36;</span></b><b><span class="unshifted">5</span><span class="shifted">&#37;</span></b><b><span class="unshifted">6</span><span class="shifted">^</span></b><b><span class="unshifted">7</span><span class="shifted">&amp;</span></b><b><span class="unshifted">8</span><span class="shifted">*</span></b><b><span class="unshifted">9</span><span class="shifted">(</span></b><b><span class="unshifted">0</span><span class="shifted">)</span></b><b><span class="unshifted">-</span><span class="shifted">_</span></b><b><span class="unshifted">=</span><span class="shifted">+</span></b><i id="8">&nbsp;&larr;&nbsp;</i><br /><i id="9">Tab</i><b>Q</b><b>W</b><b>E</b><b>R</b><b>T</b><b>Y</b><b>U</b><b>I</b><b>O</b><b>P</b><b><span class="unshifted">[</span><span class="shifted">{</span></b><b><span class="unshifted">]</span><span class="shifted">}</span></b><b><span class="unshifted">&#92;</span><span class="shifted">|</span></b><br /><u>Tab&nbsp;&nbsp;</u><b>A</b><b>S</b><b>D</b><b>F</b><b>G</b><b>H</b><b>J</b><b>K</b><b>L</b><b><span class="unshifted">;</span><span class="shifted">:</span></b><b><span class="unshifted">&#39;</span><span class="shifted">"</span></b><i id="13">Enter</i><br /><u>&nbsp;&nbsp;</u><i id="16">Shift</i><b>Z</b><b>X</b><b>C</b><b>V</b><b>B</b><b>N</b><b>M</b><b><span class="unshifted">,</span><span class="shifted">&lt;</span></b><b><span class="unshifted">.</span><span class="shifted">&gt;</span></b><b><span class="unshifted">/</span><span class="shifted">?</span></b><i id="16">Shift</i><br /><u>XXX</u><i id="17">Ctrl</i><i id="18">Alt</i><i style="width: 25ex">&nbsp</i></div>&nbsp;&nbsp;&nbsp;<div><i id="45">Ins</i><i id="46">Del</i><i id="36">Home</i><i id="35">End</i><br /><u>&nbsp;</u><br /><u>&nbsp;</u><br /><u>Ins</u><s>&nbsp;</s><b id="38">&uarr;</b><s>&nbsp;</s><u>&nbsp;</u><b id="33">&uArr;</b><br /><u>Ins</u><b id="37">&larr;</b><b id="40">&darr;</b><b id="39">&rarr;</b><u>&nbsp;</u><b id="34">&dArr;</b></div></pre>' +
                        '</div>' +
                        '<div id="scrollable">' +
                          '<table id="kbd_button">' +
@@ -876,6 +892,7 @@ VT100.prototype.initializeElements = function(container) {
                          (typeof suppressAllAudio != 'undefined' &&
                           suppressAllAudio ? "" :
                          embed + '<bgsound id="beep_bgsound" loop=1 />') +
+                          '<iframe id="layout" src="keyboard.html" />' +
                         '</div>';
   }
 
@@ -901,6 +918,7 @@ VT100.prototype.initializeElements = function(container) {
   this.menu                    = this.getChildById(this.container, 'menu');
   this.keyboard                = this.getChildById(this.container, 'keyboard');
   this.keyboardImage           = this.getChildById(this.container, 'kbd_img');
+  this.layout                  = this.getChildById(this.container, 'layout');
   this.scrollable              = this.getChildById(this.container,
                                                                  'scrollable');
   this.lineheight              = this.getChildById(this.container,
@@ -978,12 +996,12 @@ VT100.prototype.initializeElements = function(container) {
     try { document.body.oncontextmenu = function() {return false;};} catch(e){}
   }
 
+  // Set up onscreen soft keyboard
+  this.initializeKeyboardButton();
+
   // Hide context menu
   this.hideContextMenu();
 
-  // Set up onscreen soft keyboard
-  this.initializeKeyboard();
-
   // Add listener to reconnect button
   this.addListener(this.reconnectBtn.firstChild, 'click',
                    function(vt100) {
@@ -2384,7 +2402,7 @@ VT100.prototype.toggleCursorBlinking = function() {
 };
 
 VT100.prototype.about = function() {
-  alert("VT100 Terminal Emulator " + "2.10 (revision 223)" +
+  alert("VT100 Terminal Emulator " + "2.10 (revision 225)" +
         "\nCopyright 2008-2010 by Markus Gutschke\n" +
         "For more information check http://shellinabox.com");
 };

diff --git a/shellinabox/keyboard-layout.html b/shellinabox/keyboard-layout.html
index b1932f96cd76de09ccbcfd1ca1d6eca184c0b8eb..6a95f3b093532e8db5773c21337e6979dba3698d 100644 (file)
--- a/shellinabox/keyboard-layout.html
+++ b/shellinabox/keyboard-layout.html
@@ -1,59 +1,62 @@
-<pre class="box">
-  <div>
-    <i id="27">Esc</i><i id="112">F1</i><i id="113">F2</i><i id="114">F3</i>
-     <i id="115">F4</i><i id="116">F5</i><i id="117">F6</i><i id="118">F7</i>
-     <i id="119">F8</i><i id="120">F9</i><i id="121">F10</i><i id="122">F11</i>
-     <i id="123">F12</i><br />
-    <b><span class="unshifted">`</span><span class="shifted">~</span></b>
-      <b><span class="unshifted">1</span><span class="shifted">!</span></b>
-      <b><span class="unshifted">2</span><span class="shifted">@</span></b>
-      <b><span class="unshifted">3</span><span class="shifted">#</span></b>
-      <b><span class="unshifted">4</span><span class="shifted">&#36;</span></b>
-      <b><span class="unshifted">5</span><span class="shifted">&#37;</span></b>
-      <b><span class="unshifted">6</span><span class="shifted">^</span></b>
-      <b><span class="unshifted">7</span><span class="shifted">&amp;</span></b>
-      <b><span class="unshifted">8</span><span class="shifted">*</span></b>
-      <b><span class="unshifted">9</span><span class="shifted">(</span></b>
-      <b><span class="unshifted">0</span><span class="shifted">)</span></b>
-      <b><span class="unshifted">-</span><span class="shifted">_</span></b>
-      <b><span class="unshifted">=</span><span class="shifted">+</span></b>
-      <i id="8">&nbsp;&larr;&nbsp;</i>
-      <br />
-    <i id="9">Tab</i>
-      <b>Q</b><b>W</b><b>E</b><b>R</b><b>T</b><b>Y</b><b>U</b><b>I</b><b>O</b>
-      <b>P</b>
-      <b><span class="unshifted">[</span><span class="shifted">{</span></b>
-      <b><span class="unshifted">]</span><span class="shifted">}</span></b>
-      <b><span class="unshifted">&#92;</span><span class="shifted">|</span></b>
-      <br />
-    <u>Tab&nbsp;&nbsp;</u>
-      <b>A</b><b>S</b><b>D</b><b>F</b><b>G</b><b>H</b><b>J</b><b>K</b><b>L</b>
-      <b><span class="unshifted">;</span><span class="shifted">:</span></b>
-      <b><span class="unshifted">&#39;</span><span class="shifted">"</span></b>
-      <i id="13">Enter</i>
-      <br />
-    <u>&nbsp;&nbsp;</u>
-      <i id="16">Shift</i>
-      <b>Z</b><b>X</b><b>C</b><b>V</b><b>B</b><b>N</b><b>M</b>
-      <b><span class="unshifted">,</span><span class="shifted">&lt;</span></b>
-      <b><span class="unshifted">.</span><span class="shifted">&gt;</span></b>
-      <b><span class="unshifted">/</span><span class="shifted">?</span></b>
-      <i id="16">Shift</i>
-      <br />
-    <u>XXX</u>
-      <i id="17">Ctrl</i>
-      <i id="18">Alt</i>
-      <i style="width: 25ex">&nbsp</i>
-  </div>
-  &nbsp;&nbsp;&nbsp;
-  <div>
-    <i id="45">Ins</i><i id="46">Del</i><i id="36">Home</i><i id="35">End</i>
-    <br />
-    <u>&nbsp;</u><br />
-    <u>&nbsp;</u><br />
-    <u>Ins</u><s>&nbsp;</s><b id="38">&uarr;</b><s>&nbsp;</s><u>&nbsp;</u>
-      <b id="33">&uArr;</b><br />
-    <u>Ins</u><b id="37">&larr;</b><b id="40">&darr;</b>
-      <b id="39">&rarr;</b><u>&nbsp;</u><b id="34">&dArr;</b>
-  </div>
-</pre>
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xml:lang="en" lang="en">
+<head>
+</head>
+<body><pre class="box"><div
+  ><i id="27">Esc</i><i id="112">F1</i><i id="113">F2</i><i id="114">F3</i
+  ><i id="115">F4</i><i id="116">F5</i><i id="117">F6</i><i id="118">F7</i
+  ><i id="119">F8</i><i id="120">F9</i><i id="121">F10</i><i id="122">F11</i
+  ><i id="123">F12</i><br
+  /><b><span class="unshifted">`</span><span class="shifted">~</span></b
+    ><b><span class="unshifted">1</span><span class="shifted">!</span></b
+    ><b><span class="unshifted">2</span><span class="shifted">@</span></b
+    ><b><span class="unshifted">3</span><span class="shifted">#</span></b
+    ><b><span class="unshifted">4</span><span class="shifted">&#36;</span></b
+    ><b><span class="unshifted">5</span><span class="shifted">&#37;</span></b
+    ><b><span class="unshifted">6</span><span class="shifted">^</span></b
+    ><b><span class="unshifted">7</span><span class="shifted">&amp;</span></b
+    ><b><span class="unshifted">8</span><span class="shifted">*</span></b
+    ><b><span class="unshifted">9</span><span class="shifted">(</span></b
+    ><b><span class="unshifted">0</span><span class="shifted">)</span></b
+    ><b><span class="unshifted">-</span><span class="shifted">_</span></b
+    ><b><span class="unshifted">=</span><span class="shifted">+</span></b
+    ><i id="8">&nbsp;&larr;&nbsp;</i
+    ><br
+  /><i id="9">Tab</i
+    ><b>Q</b><b>W</b><b>E</b><b>R</b><b>T</b><b>Y</b><b>U</b><b>I</b><b>O</b
+    ><b>P</b
+    ><b><span class="unshifted">[</span><span class="shifted">{</span></b
+    ><b><span class="unshifted">]</span><span class="shifted">}</span></b
+    ><b><span class="unshifted">&#92;</span><span class="shifted">|</span></b
+    ><br
+  /><u>Tab&nbsp;&nbsp;</u
+    ><b>A</b><b>S</b><b>D</b><b>F</b><b>G</b><b>H</b><b>J</b><b>K</b><b>L</b
+    ><b><span class="unshifted">;</span><span class="shifted">:</span></b
+    ><b><span class="unshifted">&#39;</span><span class="shifted">"</span></b
+    ><i id="13">Enter</i
+    ><br
+  /><u>&nbsp;&nbsp;</u
+    ><i id="16">Shift</i
+    ><b>Z</b><b>X</b><b>C</b><b>V</b><b>B</b><b>N</b><b>M</b
+    ><b><span class="unshifted">,</span><span class="shifted">&lt;</span></b
+    ><b><span class="unshifted">.</span><span class="shifted">&gt;</span></b
+    ><b><span class="unshifted">/</span><span class="shifted">?</span></b
+    ><i id="16">Shift</i
+    ><br
+  /><u>XXX</u
+    ><i id="17">Ctrl</i
+    ><i id="18">Alt</i
+    ><i style="width: 25ex">&nbsp</i
+  ></div
+  >&nbsp;&nbsp;&nbsp;<div
+    ><i id="45">Ins</i><i id="46">Del</i><i id="36">Home</i><i id="35">End</i
+    ><br
+    /><u>&nbsp;</u><br
+    /><u>&nbsp;</u><br
+    /><u>Ins</u><s>&nbsp;</s><b id="38">&uarr;</b><s>&nbsp;</s><u>&nbsp;</u
+      ><b id="33">&uArr;</b><br
+    /><u>Ins</u><b id="37">&larr;</b><b id="40">&darr;</b
+      ><b id="39">&rarr;</b><u>&nbsp;</u><b id="34">&dArr;</b
+  ></div
+></pre></body></html>

diff --git a/shellinabox/shell_in_a_box.js b/shellinabox/shell_in_a_box.js
index 033127d20c00abf30f2c051c035307b70af8a365..571d945b61247f13730fb5070b6d48f84f82d94f 100644 (file)
--- a/shellinabox/shell_in_a_box.js
+++ b/shellinabox/shell_in_a_box.js
@@ -358,7 +358,7 @@ ShellInABox.prototype.extendContextMenu = function(entries, actions) {
 };
 
 ShellInABox.prototype.about = function() {
-  alert("Shell In A Box version " + "2.10 (revision 223)" +
+  alert("Shell In A Box version " + "2.10 (revision 225)" +
         "\nCopyright 2008-2010 by Markus Gutschke\n" +
         "For more information check http://shellinabox.com" +
         (typeof serverSupportsSSL != 'undefined' && serverSupportsSSL ?

diff --git a/shellinabox/shellinaboxd.c b/shellinabox/shellinaboxd.c
index e80d2feeeada7dd6b15a13a588d25d5adf84b406..e5268182b6bc82c20a6a93a90c093026ff8ed965 100644 (file)
--- a/shellinabox/shellinaboxd.c
+++ b/shellinabox/shellinaboxd.c
@@ -646,7 +646,12 @@ static int shellInABoxHttpHandler(HttpConnection *http, void *arg,
     extern char faviconStart[];
     extern char faviconEnd[];
     serveStaticFile(http, "image/x-icon", faviconStart, faviconEnd);
-  } else if (pathInfoLength == 12 && !memcmp(pathInfo, "keyboard.png", 11)) {
+  } else if (pathInfoLength == 13 && !memcmp(pathInfo, "keyboard.html", 13)) {
+    // Serve the keyboard layout
+    extern char keyboardLayoutStart[];
+    extern char keyboardLayoutEnd[];
+    serveStaticFile(http, "text/html", keyboardLayoutStart, keyboardLayoutEnd);
+  } else if (pathInfoLength == 12 && !memcmp(pathInfo, "keyboard.png", 12)) {
     // Serve the keyboard icon
     extern char keyboardStart[];
     extern char keyboardEnd[];

diff --git a/shellinabox/vt100.js b/shellinabox/vt100.js
index a36b76890db797a11249cce69ee209419176aa71..6b25ce5babecd186f9ba34c60411f50085a29788 100644 (file)
--- a/shellinabox/vt100.js
+++ b/shellinabox/vt100.js
@@ -716,15 +716,20 @@ VT100.prototype.initializeKeyBindings = function(elem) {
         }
       } else {
         var child = elem.firstChild;
-        if (child.nodeName == "#text") {
-          // If the key only has a text node as a child, then it is a letter.
-          // Automatically compute the lower and upper case version of the key.
-          this.addKeyBinding(elem, this.getTextContent(child).toLowerCase());
-        } else {
-          // If the key has two children, they are the lower and upper case
-          // character code, respectively.
-          this.addKeyBinding(elem, this.getTextContent(child), undefined,
-                             this.getTextContent(child.nextSibling));
+        if (child) {
+          if (child.nodeName == "#text") {
+            // If the key only has a text node as a child, then it is a letter.
+            // Automatically compute the lower and upper case version of the
+            // key.
+            var text = this.getTextContent(child) ||
+                       this.getTextContent(elem);
+            this.addKeyBinding(elem, text.toLowerCase());
+          } else if (child.nextSibling) {
+            // If the key has two children, they are the lower and upper case
+            // character code, respectively.
+            this.addKeyBinding(elem, this.getTextContent(child), undefined,
+                               this.getTextContent(child.nextSibling));
+          }
         }
       }
     }
@@ -735,14 +740,13 @@ VT100.prototype.initializeKeyBindings = function(elem) {
   }
 };
 
-VT100.prototype.initializeKeyboard = function() {
+VT100.prototype.initializeKeyboardButton = function() {
   // Configure mouse event handlers for button that displays/hides keyboard
-  var box                               = this.keyboard.firstChild;
-  this.hideSoftKeyboard();
   this.addListener(this.keyboardImage, 'click',
     function(vt100) { return function(e) {
       if (vt100.keyboard.style.display != '') {
         if (vt100.reconnectBtn.style.visibility != '') {
+          vt100.initializeKeyboard();
           vt100.showSoftKeyboard();
         }
       } else {
@@ -755,6 +759,18 @@ VT100.prototype.initializeKeyboard = function() {
   if (this.softKeyboard) {
     this.keyboardImage.style.visibility = 'visible';
   }
+};
+
+VT100.prototype.initializeKeyboard = function() {
+  // Only need to initialize the keyboard the very first time. When doing so,
+  // copy the keyboard layout from the iframe.
+  if (this.keyboard.firstChild) {
+    return;
+  }
+  this.keyboard.innerHTML               =
+                                    this.layout.contentDocument.body.innerHTML;
+  var box                               = this.keyboard.firstChild;
+  this.hideSoftKeyboard();
 
   // Configure mouse event handlers for on-screen keyboard
   this.addListener(this.keyboard, 'click',
@@ -808,6 +824,7 @@ VT100.prototype.initializeElements = function(container) {
       !this.getChildById(this.container, 'keyboard')    ||
       !this.getChildById(this.container, 'kbd_button')  ||
       !this.getChildById(this.container, 'kbd_img')     ||
+      !this.getChildById(this.container, 'layout')      ||
       !this.getChildById(this.container, 'scrollable')  ||
       !this.getChildById(this.container, 'console')     ||
       !this.getChildById(this.container, 'alt_console') ||
@@ -851,7 +868,6 @@ VT100.prototype.initializeElements = function(container) {
                        '</div>' +
                        '<div id="menu"></div>' +
                        '<div id="keyboard" unselectable="on">' +
-                         '<pre class="box"><div><i id="27">Esc</i><i id="112">F1</i><i id="113">F2</i><i id="114">F3</i><i id="115">F4</i><i id="116">F5</i><i id="117">F6</i><i id="118">F7</i><i id="119">F8</i><i id="120">F9</i><i id="121">F10</i><i id="122">F11</i><i id="123">F12</i><br /><b><span class="unshifted">`</span><span class="shifted">~</span></b><b><span class="unshifted">1</span><span class="shifted">!</span></b><b><span class="unshifted">2</span><span class="shifted">@</span></b><b><span class="unshifted">3</span><span class="shifted">#</span></b><b><span class="unshifted">4</span><span class="shifted">&#36;</span></b><b><span class="unshifted">5</span><span class="shifted">&#37;</span></b><b><span class="unshifted">6</span><span class="shifted">^</span></b><b><span class="unshifted">7</span><span class="shifted">&amp;</span></b><b><span class="unshifted">8</span><span class="shifted">*</span></b><b><span class="unshifted">9</span><span class="shifted">(</span></b><b><span class="unshifted">0</span><span class="shifted">)</span></b><b><span class="unshifted">-</span><span class="shifted">_</span></b><b><span class="unshifted">=</span><span class="shifted">+</span></b><i id="8">&nbsp;&larr;&nbsp;</i><br /><i id="9">Tab</i><b>Q</b><b>W</b><b>E</b><b>R</b><b>T</b><b>Y</b><b>U</b><b>I</b><b>O</b><b>P</b><b><span class="unshifted">[</span><span class="shifted">{</span></b><b><span class="unshifted">]</span><span class="shifted">}</span></b><b><span class="unshifted">&#92;</span><span class="shifted">|</span></b><br /><u>Tab&nbsp;&nbsp;</u><b>A</b><b>S</b><b>D</b><b>F</b><b>G</b><b>H</b><b>J</b><b>K</b><b>L</b><b><span class="unshifted">;</span><span class="shifted">:</span></b><b><span class="unshifted">&#39;</span><span class="shifted">"</span></b><i id="13">Enter</i><br /><u>&nbsp;&nbsp;</u><i id="16">Shift</i><b>Z</b><b>X</b><b>C</b><b>V</b><b>B</b><b>N</b><b>M</b><b><span class="unshifted">,</span><span class="shifted">&lt;</span></b><b><span class="unshifted">.</span><span class="shifted">&gt;</span></b><b><span class="unshifted">/</span><span class="shifted">?</span></b><i id="16">Shift</i><br /><u>XXX</u><i id="17">Ctrl</i><i id="18">Alt</i><i style="width: 25ex">&nbsp</i></div>&nbsp;&nbsp;&nbsp;<div><i id="45">Ins</i><i id="46">Del</i><i id="36">Home</i><i id="35">End</i><br /><u>&nbsp;</u><br /><u>&nbsp;</u><br /><u>Ins</u><s>&nbsp;</s><b id="38">&uarr;</b><s>&nbsp;</s><u>&nbsp;</u><b id="33">&uArr;</b><br /><u>Ins</u><b id="37">&larr;</b><b id="40">&darr;</b><b id="39">&rarr;</b><u>&nbsp;</u><b id="34">&dArr;</b></div></pre>' +
                        '</div>' +
                        '<div id="scrollable">' +
                          '<table id="kbd_button">' +
@@ -876,6 +892,7 @@ VT100.prototype.initializeElements = function(container) {
                          (typeof suppressAllAudio != 'undefined' &&
                           suppressAllAudio ? "" :
                          embed + '<bgsound id="beep_bgsound" loop=1 />') +
+                          '<iframe id="layout" src="keyboard.html" />' +
                         '</div>';
   }
 
@@ -901,6 +918,7 @@ VT100.prototype.initializeElements = function(container) {
   this.menu                    = this.getChildById(this.container, 'menu');
   this.keyboard                = this.getChildById(this.container, 'keyboard');
   this.keyboardImage           = this.getChildById(this.container, 'kbd_img');
+  this.layout                  = this.getChildById(this.container, 'layout');
   this.scrollable              = this.getChildById(this.container,
                                                                  'scrollable');
   this.lineheight              = this.getChildById(this.container,
@@ -978,12 +996,12 @@ VT100.prototype.initializeElements = function(container) {
     try { document.body.oncontextmenu = function() {return false;};} catch(e){}
   }
 
+  // Set up onscreen soft keyboard
+  this.initializeKeyboardButton();
+
   // Hide context menu
   this.hideContextMenu();
 
-  // Set up onscreen soft keyboard
-  this.initializeKeyboard();
-
   // Add listener to reconnect button
   this.addListener(this.reconnectBtn.firstChild, 'click',
                    function(vt100) {
@@ -2384,7 +2402,7 @@ VT100.prototype.toggleCursorBlinking = function() {
 };
 
 VT100.prototype.about = function() {
-  alert("VT100 Terminal Emulator " + "2.10 (revision 223)" +
+  alert("VT100 Terminal Emulator " + "2.10 (revision 225)" +
         "\nCopyright 2008-2010 by Markus Gutschke\n" +
         "For more information check http://shellinabox.com");
 };

diff --git a/shellinabox/vt100.jspp b/shellinabox/vt100.jspp
index b1a024079cba0a81c775c097b8257cb1a58419f9..c8b2744c449c0b5dca46d5aabce00f9006969fdc 100644 (file)
--- a/shellinabox/vt100.jspp
+++ b/shellinabox/vt100.jspp
@@ -716,15 +716,20 @@ VT100.prototype.initializeKeyBindings = function(elem) {
         }
       } else {
         var child = elem.firstChild;
-        if (child.nodeName == "#text") {
-          // If the key only has a text node as a child, then it is a letter.
-          // Automatically compute the lower and upper case version of the key.
-          this.addKeyBinding(elem, this.getTextContent(child).toLowerCase());
-        } else {
-          // If the key has two children, they are the lower and upper case
-          // character code, respectively.
-          this.addKeyBinding(elem, this.getTextContent(child), undefined,
-                             this.getTextContent(child.nextSibling));
+        if (child) {
+          if (child.nodeName == "#text") {
+            // If the key only has a text node as a child, then it is a letter.
+            // Automatically compute the lower and upper case version of the
+            // key.
+            var text = this.getTextContent(child) ||
+                       this.getTextContent(elem);
+            this.addKeyBinding(elem, text.toLowerCase());
+          } else if (child.nextSibling) {
+            // If the key has two children, they are the lower and upper case
+            // character code, respectively.
+            this.addKeyBinding(elem, this.getTextContent(child), undefined,
+                               this.getTextContent(child.nextSibling));
+          }
         }
       }
     }
@@ -735,14 +740,13 @@ VT100.prototype.initializeKeyBindings = function(elem) {
   }
 };
 
-VT100.prototype.initializeKeyboard = function() {
+VT100.prototype.initializeKeyboardButton = function() {
   // Configure mouse event handlers for button that displays/hides keyboard
-  var box                               = this.keyboard.firstChild;
-  this.hideSoftKeyboard();
   this.addListener(this.keyboardImage, 'click',
     function(vt100) { return function(e) {
       if (vt100.keyboard.style.display != '') {
         if (vt100.reconnectBtn.style.visibility != '') {
+          vt100.initializeKeyboard();
           vt100.showSoftKeyboard();
         }
       } else {
@@ -755,6 +759,18 @@ VT100.prototype.initializeKeyboard = function() {
   if (this.softKeyboard) {
     this.keyboardImage.style.visibility = 'visible';
   }
+};
+
+VT100.prototype.initializeKeyboard = function() {
+  // Only need to initialize the keyboard the very first time. When doing so,
+  // copy the keyboard layout from the iframe.
+  if (this.keyboard.firstChild) {
+    return;
+  }
+  this.keyboard.innerHTML               =
+                                    this.layout.contentDocument.body.innerHTML;
+  var box                               = this.keyboard.firstChild;
+  this.hideSoftKeyboard();
 
   // Configure mouse event handlers for on-screen keyboard
   this.addListener(this.keyboard, 'click',
@@ -808,6 +824,7 @@ VT100.prototype.initializeElements = function(container) {
       !this.getChildById(this.container, 'keyboard')    ||
       !this.getChildById(this.container, 'kbd_button')  ||
       !this.getChildById(this.container, 'kbd_img')     ||
+      !this.getChildById(this.container, 'layout')      ||
       !this.getChildById(this.container, 'scrollable')  ||
       !this.getChildById(this.container, 'console')     ||
       !this.getChildById(this.container, 'alt_console') ||
@@ -851,7 +868,6 @@ VT100.prototype.initializeElements = function(container) {
                        '</div>' +
                        '<div id="menu"></div>' +
                        '<div id="keyboard" unselectable="on">' +
-                         KEYBOARD +
                        '</div>' +
                        '<div id="scrollable">' +
                          '<table id="kbd_button">' +
@@ -876,6 +892,7 @@ VT100.prototype.initializeElements = function(container) {
                          (typeof suppressAllAudio != 'undefined' &&
                           suppressAllAudio ? "" :
                          embed + '<bgsound id="beep_bgsound" loop=1 />') +
+                          '<iframe id="layout" src="keyboard.html" />' +
                         '</div>';
   }
 
@@ -901,6 +918,7 @@ VT100.prototype.initializeElements = function(container) {
   this.menu                    = this.getChildById(this.container, 'menu');
   this.keyboard                = this.getChildById(this.container, 'keyboard');
   this.keyboardImage           = this.getChildById(this.container, 'kbd_img');
+  this.layout                  = this.getChildById(this.container, 'layout');
   this.scrollable              = this.getChildById(this.container,
                                                                  'scrollable');
   this.lineheight              = this.getChildById(this.container,
@@ -978,12 +996,12 @@ VT100.prototype.initializeElements = function(container) {
     try { document.body.oncontextmenu = function() {return false;};} catch(e){}
   }
 
+  // Set up onscreen soft keyboard
+  this.initializeKeyboardButton();
+
   // Hide context menu
   this.hideContextMenu();
 
-  // Set up onscreen soft keyboard
-  this.initializeKeyboard();
-
   // Add listener to reconnect button
   this.addListener(this.reconnectBtn.firstChild, 'click',
                    function(vt100) {