Add more whitespace preservation actions

This allows command line text to be preserved more accurately, and
allows the shell to do more interesting formatting.

tags/terminal.tag

@@ -70,7 +70,7 @@
    */
   process(prompt, input) {
     input = he.encode(input)
-    var output = prompt + ' ' + input + '\n'
+    var output = prompt + input + '\n'
     var response = this.shell.process(input)
     switch(response) {
       case 'clear':
@@ -79,7 +79,7 @@
       default:
         this.tags.history.add(output + response)
     }
-    this.tags.commandline.setprompt(this.shell.prompt)
+    this.tags.commandline.setPrompt(this.shell.prompt)
     this.tags.commandline.command.value = ''
   }
 
@@ -111,11 +111,11 @@
    * Set the prompt to any truthy value.
    *
    * Note about `lhs.write()` check:
-   * `setprompt()` fires at `<terminal>` setup, before `lhs.write()` exists.
+   * `setPrompt()` fires at `<terminal>` setup, before `lhs.write()` exists.
    * At that point, `lhs` is just initialised with its `content` option.
    * After that, `lhs.write()` is called for all subsequent prompt changes.
    */
-  setprompt(value) {
+  setPrompt(value) {
     if (value) {
       if (typeof this.tags.lhs.write != 'undefined') {
         this.tags.lhs.write(value)
@@ -129,7 +129,7 @@
   }
 
   this.prompt = '$ '
-  this.setprompt(opts.prompt)
+  this.setPrompt(opts.prompt)
 </commandline>
 
 <history>
@@ -137,19 +137,32 @@
     <raw content={ content } />
   </div>
 
-  /**
-   * Append any truthy value to command history
-   *
-   * Replaces all newline characters with HTML breaks.
-   */
   add(output) {
     if (output) {
-      output = output.replace(/(?:\r\n|\r|\n)/g, '<br />');
+      output = this.preserveWhiteSpace(output)
       this.hist.push({ 'content': output })
       this.update()
     }
   }
 
+  /**
+   * Make sure whitespace displays correctly.
+   *
+   * Keep the following:
+   *
+   * - Newlines.
+   * - Whitespace for display. This means all spaces that are not within tags.
+   */
+  preserveWhiteSpace(text) {
+    text = text.replace(/(?:\r\n|\r|\n)/g, '<br />')
+    // Search for tags or whitespace. Replace whitespace, leave the tags.
+    text = text.replace(/<[^<]+>|( )/g, function(match, group1) {
+      if (group1 == " ") { return '&nbsp;' }
+      return match
+    })
+    return text
+  }
+
   this.hist = []
   this.add(opts.welcome)
 </history>