fix spacing of wider characters in echo (by wrapping each char in sty…

…le with width)

CHANGELOG.md

@@ -6,6 +6,7 @@
 * fix throw/reject in async function/promise [#546](https://github.com/jcubic/jquery.terminal/issues/546)
 * allow to return string from greetings function
 * fix low level iterate_formatting function to handle html entities properly
+* fix spacing of wider characters (Chinese/Japanese) in echo (to match cmd)
 
 ## 2.9.0
 ### Features

README.md

@@ -10,8 +10,8 @@ http://terminal.jcubic.pl
 
 [![npm](https://img.shields.io/badge/npm-DEV-blue.svg)](https://www.npmjs.com/package/jquery.terminal)
 ![bower](https://img.shields.io/badge/bower-DEV-yellow.svg)
-[![travis](https://travis-ci.org/jcubic/jquery.terminal.svg?branch=devel&f9c286e45fac35388177758ae1fb381cf2a8e52a)](https://travis-ci.org/jcubic/jquery.terminal)
-[![Coverage Status](https://coveralls.io/repos/github/jcubic/jquery.terminal/badge.svg?branch=devel&61cb229c68751f037ef12fc3e6e88f0f)](https://coveralls.io/github/jcubic/jquery.terminal?branch=devel)
+[![travis](https://travis-ci.org/jcubic/jquery.terminal.svg?branch=devel&2927582373f2249bc9be6e71a1ff3c600513d68d)](https://travis-ci.org/jcubic/jquery.terminal)
+[![Coverage Status](https://coveralls.io/repos/github/jcubic/jquery.terminal/badge.svg?branch=devel&61cd458e5a8c6d4c02575731ac378fd2)](https://coveralls.io/github/jcubic/jquery.terminal?branch=devel)
 ![downloads](https://img.shields.io/npm/dm/jquery.terminal.svg?style=flat)
 [![package quality](http://npm.packagequality.com/shield/jquery.terminal.svg)](http://packagequality.com/#?package=jquery.terminal)
 [![](https://data.jsdelivr.com/v1/package/npm/jquery.terminal/badge?style=rounded)](https://www.jsdelivr.com/package/npm/jquery.terminal)

__tests__/terminal.spec.js

@@ -847,10 +847,19 @@ describe('Terminal utils', function() {
         it('should handle wider characters without formatting', function() {
             var input = 'ターミナルウィンドウは黒[[;;]です]';
             var string = $.terminal.format(input, {char_width: 7});
+            function wrap(str) {
+                return str.split('').map(char => {
+                    return '<span style="width: 2ch">' + char + '</span>';
+                }).join('');
+            }
+            var chars_a = wrap('ターミナルウィンドウは黒').split('').map(x => {
+                return '<span style="width: 2ch">' + x + '</span>';
+            }).join('');
             expect(string).toEqual('<span style="width: 24ch"><span style="widt'+
-                                   'h: 24ch">ターミナルウィンドウは黒</span></span'+
-                                   '><span style="width: 4ch" data-text="です">'+
-                                   '<span style="width: 4ch">です</span></span>');
+                                   'h: 24ch">' + wrap('ターミナルウィンドウは黒') +
+                                   '</span></span><span style="width: 4ch" data'+
+                                   '-text="です"><span style="width: 4ch">' +
+                                   wrap('です') + '</span></span>');
         });
         it('should handle links', function() {
             var input = '[[!;;]https://terminal.jcubic.pl]';

css/jquery.terminal-2.9.0.css

@@ -12,7 +12,7 @@
  * Copyright (c) 2011-2019 Jakub Jankiewicz <https://jcubic.pl/me>
  * Released under the MIT license
  *
- * Date: Wed, 18 Dec 2019 08:26:09 +0000
+ * Date: Wed, 18 Dec 2019 11:56:24 +0000
  */
 .terminal .terminal-output .format, .cmd .format,
 .cmd-prompt, .cmd-prompt div {
@@ -142,6 +142,7 @@ body.full-screen-terminal .terminal {
      * it's hard to overwrite long :not selector (:not(a span) don't work)
      */
     color: #0F60FF !important;
+    --color: var(--link-color, #0F60FF);
     color: var(--link-color, #0F60FF) !important;
     text-decoration: underline;
 }
@@ -607,6 +608,7 @@ terminal .terminal-output > div {
 }
 .terminal .terminal-output > :not(.raw) a[href], .cmd a[href] {
     color: #0F60FF;
+    --color: var(--link-color, #0F60FF);
     color: var(--link-color, #0F60FF);
     cursor: pointer;
 }
@@ -849,3 +851,17 @@ terminal .terminal-output > div {
 .terminal-output svg.terminal-broken-image use {
     fill: var(--color, #ccc);
 }
+.terminal-error {
+    --color: var(--error-color);
+}
+.terminal-glow {
+    --animation: terminal-glow;
+}
+.terminal-glow span[data-text],
+.terminal-glow a[data-text],
+.terminal-glow [data-text] span,
+.terminal-glow .terminal-output > div span,
+.terminal-glow .terminal-output > div a[href] {
+    text-shadow: 1px 1px 5px #ccc;
+    text-shadow: 1px 1px 5px var(--color, #ccc);
+}

css/jquery.terminal.css

@@ -12,7 +12,7 @@
  * Copyright (c) 2011-2019 Jakub Jankiewicz <https://jcubic.pl/me>
  * Released under the MIT license
  *
- * Date: Wed, 18 Dec 2019 08:26:09 +0000
+ * Date: Wed, 18 Dec 2019 11:56:24 +0000
  */
 .terminal .terminal-output .format, .cmd .format,
 .cmd-prompt, .cmd-prompt div {
@@ -142,6 +142,7 @@ body.full-screen-terminal .terminal {
      * it's hard to overwrite long :not selector (:not(a span) don't work)
      */
     color: #0F60FF !important;
+    --color: var(--link-color, #0F60FF);
     color: var(--link-color, #0F60FF) !important;
     text-decoration: underline;
 }
@@ -607,6 +608,7 @@ terminal .terminal-output > div {
 }
 .terminal .terminal-output > :not(.raw) a[href], .cmd a[href] {
     color: #0F60FF;
+    --color: var(--link-color, #0F60FF);
     color: var(--link-color, #0F60FF);
     cursor: pointer;
 }
@@ -849,3 +851,17 @@ terminal .terminal-output > div {
 .terminal-output svg.terminal-broken-image use {
     fill: var(--color, #ccc);
 }
+.terminal-error {
+    --color: var(--error-color);
+}
+.terminal-glow {
+    --animation: terminal-glow;
+}
+.terminal-glow span[data-text],
+.terminal-glow a[data-text],
+.terminal-glow [data-text] span,
+.terminal-glow .terminal-output > div span,
+.terminal-glow .terminal-output > div a[href] {
+    text-shadow: 1px 1px 5px #ccc;
+    text-shadow: 1px 1px 5px var(--color, #ccc);
+}