Update to jquery.terminal 1.4.3

sharkdp · Jul 1, 2017 · ae9970d · ae9970d
1 parent d56ce96
commit ae9970d
Show file tree

Hide file tree

Showing 5 changed files with 76 additions and 39 deletions.
diff --git a/bower.json b/bower.json
@@ -16,7 +16,7 @@
     "purescript-quantities": "^6.1.0",
     "purescript-parsing": "^4.2.0",
     "purescript-maps": "^3.0.0",
-    "jquery.terminal": "=1.1.2",
+    "jquery.terminal": "=1.4.3",
     "keyboardevent-key-polyfill": "=1.1.0"
   },
   "devDependencies": {

diff --git a/index.html b/index.html
@@ -30,7 +30,7 @@
     <script src="insect.js" type="text/javascript"></script>
     <script src="bower_components/keyboardevent-key-polyfill/index.js" type="text/javascript"></script>
     <script src="bower_components/jquery/dist/jquery.min.js" type="text/javascript"></script>
-    <script src="bower_components/jquery.terminal/js/jquery.terminal-1.1.2.min.js" type="text/javascript"></script>
+    <script src="bower_components/jquery.terminal/js/jquery.terminal-1.4.3.min.js" type="text/javascript"></script>
     <script src="bower_components/jquery.terminal/js/jquery.mousewheel-min.js" type="text/javascript"></script>
     <script type="text/javascript">
       // Load KeyboardEvent polyfill for old browsers

diff --git a/src/Insect/Format.purs b/src/Insect/Format.purs
@@ -20,11 +20,11 @@ module Insect.Format
   , fmtConsole
   ) where
 
+import Prelude
+
 import Data.Array ((:))
 import Data.Foldable (foldMap)
 
-import Prelude ((<>), id)
-
 data FormatType
   = FTText
   | FTEmphasized
@@ -97,6 +97,7 @@ fmtPlain Normal   _ s = s
 fmtPlain Optional _ _ = "" -- ignore optional output
 
 jtClass ∷ String → String → String
+jtClass _ "" = ""  -- do not emit formatting code for empty strings
 jtClass name str = "[[;;;hl-" <> name <> "]" <> str <> "]"
 
 -- | Formatter for rich text output on jquery.terminal.

diff --git a/src/Insect/Interpreter.purs b/src/Insect/Interpreter.purs
@@ -209,7 +209,7 @@ runInsect env (Command Help) = { msg: Message Info
   , F.emph "  > ", F.function "sin", F.text "(", F.val "30", F.text " ", F.unit "deg", F.text ")", F.nl
   , F.text "", F.nl
   , F.emph "  > ", F.val "2", F.text " ", F.unit "min", F.text " + ", F.val "30", F.text " ", F.unit "s", F.text "          "
-  , F.emph "  > ", F.val "6", F.text " ", F.unit "Mbit/s", F.text " * ", F.val "1.5", F.text " ", F.unit "h", F.text " -> ", F.unit "GB", F.val "", F.nl
+  , F.emph "  > ", F.val "6", F.text " ", F.unit "Mbit/s", F.text " * ", F.val "1.5", F.text " ", F.unit "h", F.text " -> ", F.unit "GB", F.nl
   , F.text "", F.nl
   , F.emph "  > ", F.text "list", F.text "                  "
   , F.emph "  > ", F.ident "r", F.text " = ", F.val "80", F.text " ", F.unit "cm", F.nl

diff --git a/terminal.css b/terminal.css
@@ -12,7 +12,7 @@
  * Copyright (c) 2011-2017 Jakub Jankiewicz <http://jcubic.pl>
  * Released under the MIT license
  *
- * Date: Sat, 04 Mar 2017 10:48:35 +0000
+ * Date: Sun, 18 Jun 2017 06:22:28 +0000
  */
 .terminal .terminal-output .format, .cmd .format,
 .cmd .prompt, .cmd .prompt div, .terminal .terminal-output div div{
@@ -24,12 +24,29 @@
 .terminal h1, .terminal h2, .terminal h3, .terminal h4, .terminal h5, .terminal h6 {
     line-height: 1.2em;
 }
+/*
+.cmd .mask {
+    width: 10px;
+    height: 11px;
+    background: black;
+    z-index: 100;
+}
+*/
 .cmd .clipboard {
     position: absolute;
     left: -16px;
     top: 0;
     width: 20px;
     height: 16px;
+    /* this seems to work after all on Android */
+    /*left: -99999px;
+    clip: rect(1px,1px,1px,1px);
+    /* on desktop textarea appear when paste */
+    /*
+    opacity: 0.01;
+    filter: alpha(opacity = 0.01);
+    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0.01);
+    */
     background: transparent;
     border: none;
     color: transparent;
@@ -44,31 +61,45 @@
 }
 .terminal {
     position: relative;
+    /*overflow: hidden;*/
     overflow-y: auto;
     overflow-x: hidden;
 }
 .terminal > div {
     height: 100%;
 }
-.terminal-output > div {
+.cmd {
     padding: 0;
+    height: 1.3em;
+    position: relative;
+    /*margin-top: 3px; */
+}
+.terminal .inverted, .cmd .inverted {
+    background-color: #aaa;
+    color: #000;
+}
+.cmd .cursor {
+    border-bottom: 3px solid transparent;
+    margin-bottom: -3px;
+    background-clip: content-box;
+}
+.terminal-output > div {
     padding-bottom: 1em;
 }
 .terminal-output > div.command {
     padding-bottom: 0.1em;
 }
-.cmd {
-    position: relative;
-}
 .cmd .cursor.blink {
     -webkit-animation: terminal-blink 1s infinite steps(1, start);
        -moz-animation: terminal-blink 1s infinite steps(1, start);
         -ms-animation: terminal-blink 1s infinite steps(1, start);
             animation: terminal-blink 1s infinite steps(1, start);
     border-left: 1px solid transparent;
-    border-bottom: 3px solid transparent;
     margin-left: -1px;
-    background-clip: content-box;
+    /*margin-top: 1px;*/
+}
+.bar.terminal .inverted, .bar.cmd .inverted {
+    border-left-color: #aaa;
 }
 @-webkit-keyframes terminal-blink {
   0%, 100% {
@@ -146,79 +177,75 @@
 }
 @-webkit-keyframes terminal-underline {
   0%, 100% {
-      border-bottom-color: #F8F8F2;
+      border-bottom-color: #aaa;
       position: relative;
-      top: 2px;
+      line-height: 12px;
       border-left: none;
-      margin: 0;
   }
   50% {
-      border-bottom-color: #272822;
+      border-bottom-color: #000;
       position: relative;
-      top: 2px;
+      line-height: 12px;
       border-left: none;
-      margin: 0;
   }
 }
 @-ms-keyframes terminal-underline {
   0%, 100% {
-      border-bottom-color: #F8F8F2;
+      border-bottom-color: #aaa;
       position: relative;
-      top: 2px;
+      line-height: 12px;
       border-left: none;
-      margin: 0;
   }
   50% {
-      border-bottom-color: #272822;
+      border-bottom-color: #000;
       position: relative;
-      top: 2px;
+      line-height: 12px;
       border-left: none;
-      margin: 0;
   }
 }
 @-moz-keyframes terminal-underline {
   0%, 100% {
-      border-bottom-color: #F8F8F2;
+      border-bottom-color: #aaa;
       position: relative;
-      top: 2px;
+      line-height: 12px;
       border-left: none;
-      margin: 0;
   }
   50% {
-      border-bottom-color: #272822;
+      border-bottom-color: #000;
       position: relative;
-      top: 2px;
+      line-height: 11px;
       border-left: none;
-      margin: 0;
   }
 }
 @keyframes terminal-underline {
   0%, 100% {
-      border-bottom-color: #F8F8F2;
+      border-bottom-color: #aaa;
       position: relative;
-      top: 2px;
+      line-height: 11px;
       border-left: none;
-      margin: 0;
   }
   50% {
-      border-bottom-color: #272822;
+      border-bottom-color: #000;
       position: relative;
-      top: 2px;
+      line-height: 11px;
       border-left: none;
-      margin: 0;
   }
 }
 .terminal .terminal-output div div, .cmd .prompt {
     display: block;
+    /*line-height: 14px;*/
     height: auto;
 }
 .cmd .prompt {
     float: left;
 }
 .terminal, .cmd {
     font-family: 'Fira Mono', monospace;
+    /*font-family: FreeMono, monospace; this don't work on Android */
     color: #F8F8F2;
     background-color: #272822;
+    /*font-size: 12px;*/
+    /*line-height: 14px;*/
     box-sizing: border-box;
 }
 .cmd div {
@@ -232,6 +259,7 @@
     clear: right;
 }
 .terminal-output > div {
+    /*padding-top: 3px;*/
     min-height: 14px;
 }
 .terminal-output > div > div * {
@@ -300,6 +328,14 @@
     background-color: #F8F8F2;
     color: #272822;
 }
+/* this don't work in Chrome
+.terminal tr td::-moz-selection {
+    border-color: #000;
+}
+.terminal tr td::selection {
+    border-color: #000;
+}
+*/
 .terminal h1::selection,
 .terminal h2::selection,
 .terminal h3::selection,
@@ -343,7 +379,7 @@
 .terminal a:hover {
     color: #F8F8F2;
 }
-.terminal iframe {
+.terminal .terminal-fill {
     position: absolute;
     left: 0;
     top: -100%;
@@ -355,6 +391,6 @@
     pointer-events: none;
     box-sizing: border-box;
 }
-.terminal, .terminal iframe {
-    padding: 1.2em; /* we get width of the terminal from iframe so it need to have the same padding */
+.terminal, .terminal .terminal-fill {
+    padding: 1.2em;
 }