Просмотр исходного кода

Remove he.js, manage whitespace with `'pre-wrap'`

Since we just want to ensure that html elements cannot be created from
the commandline, it is good enough to escape angle brackets and the
ampersand. Shells can do their own escaping of other html entities
though it probably won't be necessary.

`'pre-wrap'` has existed forever, and allows to not need to escape all
spaces to `' '` ourselves.
Weiyi Lou 10 лет назад
Родитель
Сommit
4da23c37ba
1 измененных файлов с 18 добавлено и 19 удалено
  1. 18 19
      tags/terminal.tag

+ 18 - 19
tags/terminal.tag

@@ -18,7 +18,6 @@
  *     <terminal shell='myshellclass' welcome='text' prompt='text'></terminal>
  *
  *     <script src='riot+compiler.min.js'></script>
- *     <script src='he.js'></script>
  *     <script src='myshell.js'></script>
  *     <script src='terminal.tag' type='riot/tag'></script>
  *     <script>riot.mount('terminal')</script>
@@ -26,7 +25,6 @@
  * ## Dependencies
  *
  * - riot.js (http://riotjs.com/)
- * - he.js (https://github.com/mathiasbynens/he) for HTML Entity conversion.
  *
  * ## Making A Shell Class
  *
@@ -114,7 +112,7 @@
 
   add(text) {
     if (text) {
-      text = this.preserveWhiteSpace(text)
+      text = text.replace(/\r\n|\r|\n/g, '<br />')
       this.output.push({ 'content': text })
       this.update()
     }
@@ -124,16 +122,6 @@
     this.output.length = 0
     this.update()
   }
-
-  preserveWhiteSpace(text) {
-    text = text.replace(/\r\n|\r|\n/g, '<br />')
-    // Search for tags or whitespace. Escape whitespace, leave tags.
-    text = text.replace(/<[^<]+>|( )/g, function(match, group1) {
-      if (group1 == " ") { return '&nbsp;' }
-      return match
-    })
-    return text
-  }
 </display>
 
 <commandline>
@@ -142,11 +130,11 @@
   </form>
 
   <style>
-    input[name='command'] {
+    commandline input[name='command'] {
       background: transparent;
       border: none; outline: none;
       padding: 0; margin: 0;
-      width: 90%;
+      width: 70%;
     }
   </style>
 
@@ -161,7 +149,6 @@
 
   ev.on('prompt_set', function(value) {
     self.prompt = value
-    // `write()` is called to actually update the `raw` tag's html.
     self.tags.lhs.write(value)
   })
 
@@ -175,19 +162,31 @@
 
   process() {
     var prompt = this.visible ? this.prompt : ''
-    var command = he.encode(this.command.value)
+    var command = this.encode(this.command.value)
     this.command.value = ''
     ev.trigger('disp_add', prompt + command + '\n')
     ev.trigger('cmd_entered', command)
   }
+
+  encode(text) {
+    return text.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;')
+  }
 </commandline>
 
 <raw>
   <span></span>
 
-  // Initialise HTML from tag options and expose `write()` for updating.
+  <style>
+    raw { white-space: pre-wrap }
+  </style>
+
+  // Set the initial html using the `content` option.
+  this.on('mount', function() {
+    this.write(opts.content)
+  })
+
+  // Call `write()` manually to update the html.
   write(text) {
     this.root.innerHTML = text
   }
-  this.write(opts.content)
 </raw>