Skip to content

Commit

Permalink
fix sequence of animations in echo without newline #930
Browse files Browse the repository at this point in the history
  • Loading branch information
@jcubic
jcubic committed Apr 20, 2024
1 parent e74ce2e commit 8806882
Show file tree
Hide file tree
Showing 8 changed files with 89 additions and 50 deletions.
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Expand Up @@ -4,6 +4,7 @@
* fix occasional selecting Accessibility label (about clipboard textarea) in CMD
* fix sync commands and dynamic prompt [#923](https://github.com/jcubic/jquery.terminal/issues/923) [#922](https://github.com/jcubic/jquery.terminal/issues/922)
* fix calling `onCommandChange` when command don't change
* fix sequence of animations in echo without newline [#930](https://github.com/jcubic/jquery.terminal/issues/930)

## 2.39.3
### Bugfix
Expand Down
2 changes: 1 addition & 1 deletion README.md
View file
Expand Up @@ -8,7 +8,7 @@
[![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)
[![Build and test](https://github.com/jcubic/jquery.terminal/actions/workflows/build.yaml/badge.svg?branch=devel&event=push)](https://github.com/jcubic/jquery.terminal/actions/workflows/build.yaml)
[![Coverage Status](https://coveralls.io/repos/github/jcubic/jquery.terminal/badge.svg?branch=devel&ee2a03a16ea250797b28569c122c3138)](https://coveralls.io/github/jcubic/jquery.terminal?branch=devel)
[![Coverage Status](https://coveralls.io/repos/github/jcubic/jquery.terminal/badge.svg?branch=devel&b68a7df0dd0c8bfd4f7e9bbbc513838b)](https://coveralls.io/github/jcubic/jquery.terminal?branch=devel)
![NPM Downloads](https://img.shields.io/npm/dm/jquery.terminal.svg?style=flat)
[![jsDelivr Downloads](https://data.jsdelivr.com/v1/package/npm/jquery.terminal/badge?style=rounded&n=1)](https://www.jsdelivr.com/package/npm/jquery.terminal)
[![Paid Support](https://img.shields.io/badge/paid-support-354465.svg)](https://support.jcubic.pl/)
Expand Down
2 changes: 2 additions & 0 deletions __tests__/__snapshots__/terminal.spec.js.snap
View file
Expand Up @@ -779,6 +779,8 @@ Array [
]
`;
exports[`extensions echo_newline should create sequance of animations (#930) 1`] = `"<div data-index=\\"0\\" class=\\"\\"><div style=\\"width: 100%;\\"><span data-text=\\"Hello,&nbsp;\\">Hello,&nbsp;</span><span data-text=\\"jQuery&nbsp;\\">jQuery&nbsp;</span><span data-text=\\"Terminal\\">Terminal</span></div></div>"`;
exports[`extensions echo_newline should print mixed newline with !flush 1`] = `
"foo, bar
baz, quux"
Expand Down
18 changes: 12 additions & 6 deletions __tests__/terminal.spec.js
View file
Expand Up @@ -2326,8 +2326,8 @@ describe('Terminal utils', function() {
}
}));
return term.exec('output | grep /foo/').then(function() {
expect(get_lines(term)).toEqual(['foo']);
}).catch(e => console.log(e));
return expect(get_lines(term)).toEqual(['foo']);
});
});
it('should escape pipe', async function() {
var term = $('<div/>').terminal($.terminal.pipe({
Expand Down Expand Up @@ -2767,13 +2767,13 @@ describe('extensions', function() {
expect(output(term)).toEqual(['hello, world']);
}
});
it('finalize with newline : false', function() {
it('finalize with newline: false', function() {
term.echo('foo', {
finalize: (a) => a.children().children().css("color", "red"),
finalize: (node) => node.css("color", "red"),
newline : false
});
var color = term[0].querySelector(`[data-index='${term.last_index()}`).firstChild.firstChild.style.color;
expect(color).toEqual("red");
const node = term.find(`[data-index='${term.last_index()}']`).get(0);
expect(node.style.color).toEqual("red");
});
it('should print multiple !flush && !newline', function() {
term.echo('foo, ', {newline: false, flush: false});
Expand All @@ -2794,6 +2794,12 @@ describe('extensions', function() {
expect(term.get_output()).toMatchSnapshot();
expect(output(term)).toMatchSnapshot();
});
it('should create sequance of animations (#930)', async function() {
await term.echo("Hello, ", { typing: true, delay: 0, newline: false });
await term.echo("jQuery ", { typing: true, delay: 0, newline: false });
await term.echo("Terminal", { typing: true, delay: 0 });
expect(term.find('.terminal-output').html()).toMatchSnapshot();
});
});
describe('autocomplete_menu', function() {
function completion(term) {
Expand Down
53 changes: 34 additions & 19 deletions js/jquery.terminal-src.js
View file
Expand Up @@ -9203,7 +9203,7 @@
var bottom = self.is_bottom();
var line = 0;
if (optimized) {
var lines = formatted_lines.map(function(formatted) {
var anim_lines = formatted_lines.map(function(formatted) {
return {
formatted: formatted,
chars: $.terminal.partition(formatted, {wrap: false}),
Expand All @@ -9218,9 +9218,9 @@
var formatted_line, input_chars, input_len;
if (!skip) {
if (optimized) {
formatted_line = lines[line].formatted;
input_chars = lines[line].chars;
input_len = lines[line].len;
formatted_line = anim_lines[line].formatted;
input_chars = anim_lines[line].chars;
input_len = anim_lines[line].len;
} else {
formatted_line = formatted;
input_chars = chars;
Expand All @@ -9245,12 +9245,13 @@
// swap prompt with line
var index = self.last_index();
self.set_prompt(prompt);
var is_partial = !!lines.get_partial().length;
self.echo(formatted_line, $.extend({}, options, {
formatters: false,
finalize: null,
typing: false
}));
lines[line].index = index + 1;
anim_lines[line].index = index + 1;
new_prompt = '';
++line;
char_i = 0;
Expand All @@ -9263,21 +9264,28 @@
stop = true;
}
if (optimized) {
stop = line === lines.length;
stop = line === anim_lines.length;
} else {
stop = char_i === len;
}
if (stop) {
clearInterval(interval);
setTimeout(function() {
if (optimized) {
// clear old lines and make one full line
// so it can wrap when you resize
lines.forEach(function(line) {
self.remove_line(line.index);
});
if (is_partial || options.newline === false) {
// HACK: fix sequance of animations #930
index = self.last_index();
var node = output.find('[data-index="' + index + '"]');

Check failure on line 9277 in js/jquery.terminal-src.js

View workflow job for this annotation

GitHub Actions / build 

This line has a length of 91. Maximum allowed is 90
options.finalize(node);
} else {
if (optimized) {
// clear old lines and make one full line
// so it can wrap when you resize
anim_lines.forEach(function(line) {
self.remove_line(line.index);
});
}
finish_typing_fn(message, prompt, options);
}
finish_typing_fn(message, prompt, options);
animating = false;
}, options.delay);
}
Expand Down Expand Up @@ -10538,6 +10546,7 @@
var appending_to_partial = false;
var partial = $();
var snapshot;
var finalizations = [];
if (!options.update) {
partial = self.find('.partial');
snapshot = lines.get_partial();
Expand Down Expand Up @@ -10580,13 +10589,16 @@
wrapper.attr('data-index', data.index);
appending_to_partial = !data.newline;
wrapper.toggleClass('partial', appending_to_partial);
finalizations.push({
node: wrapper,
finalize: data.finalize
});
if (appending_to_partial) {
partial = wrapper;
} else if (data.newline && partial.length) {
wrapper = $('<div/>');
partial = $();
}
data.finalize(wrapper);
} else {
var line = data.line;
var div;
Expand Down Expand Up @@ -10614,6 +10626,9 @@
}
});
partial = self.find('.partial');
finalizations.forEach(function(data) {
data.finalize(data.node);
});
var last_row;
if (partial.length === 0) {
css(command_line[0], {
Expand Down Expand Up @@ -10810,18 +10825,18 @@
if (is_node(arg)) {
return;
}
locals.finalize = function(div) {
locals.finalize = function(node) {
if (locals.raw) {
div.addClass('raw');
node.addClass('raw');
}
if (locals.ansi) {
div.addClass('ansi');
node.addClass('ansi');
}
try {
if (is_function(finalize)) {
finalize.call(self, div);
finalize.call(self, node);
}
div.on_load({
node.on_load({
error: function(element) {
element.replaceWith(use_broken_image);
},
Expand Down
57 changes: 36 additions & 21 deletions js/jquery.terminal.js
View file
Expand Up @@ -41,7 +41,7 @@
*
* broken image by Sophia Bai from the Noun Project (CC-BY)
*
* Date: Thu, 18 Apr 2024 19:49:50 +0000
* Date: Sat, 20 Apr 2024 17:22:28 +0000
*/
/* global define, Map, BigInt */
/* eslint-disable */
Expand Down Expand Up @@ -5308,7 +5308,7 @@
// -------------------------------------------------------------------------
$.terminal = {
version: 'DEV',
date: 'Thu, 18 Apr 2024 19:49:50 +0000',
date: 'Sat, 20 Apr 2024 17:22:28 +0000',
// colors from https://www.w3.org/wiki/CSS/Properties/color/keywords
color_names: [
'transparent', 'currentcolor', 'black', 'silver', 'gray', 'white',
Expand Down Expand Up @@ -9203,7 +9203,7 @@
var bottom = self.is_bottom();
var line = 0;
if (optimized) {
var lines = formatted_lines.map(function(formatted) {
var anim_lines = formatted_lines.map(function(formatted) {
return {
formatted: formatted,
chars: $.terminal.partition(formatted, {wrap: false}),
Expand All @@ -9218,9 +9218,9 @@
var formatted_line, input_chars, input_len;
if (!skip) {
if (optimized) {
formatted_line = lines[line].formatted;
input_chars = lines[line].chars;
input_len = lines[line].len;
formatted_line = anim_lines[line].formatted;
input_chars = anim_lines[line].chars;
input_len = anim_lines[line].len;
} else {
formatted_line = formatted;
input_chars = chars;
Expand All @@ -9245,12 +9245,13 @@
// swap prompt with line
var index = self.last_index();
self.set_prompt(prompt);
var is_partial = !!lines.get_partial().length;
self.echo(formatted_line, $.extend({}, options, {
formatters: false,
finalize: null,
typing: false
}));
lines[line].index = index + 1;
anim_lines[line].index = index + 1;
new_prompt = '';
++line;
char_i = 0;
Expand All @@ -9263,21 +9264,28 @@
stop = true;
}
if (optimized) {
stop = line === lines.length;
stop = line === anim_lines.length;
} else {
stop = char_i === len;
}
if (stop) {
clearInterval(interval);
setTimeout(function() {
if (optimized) {
// clear old lines and make one full line
// so it can wrap when you resize
lines.forEach(function(line) {
self.remove_line(line.index);
});
if (is_partial || options.newline === false) {
// HACK: fix sequance of animations #930
index = self.last_index();
var node = output.find('[data-index="' + index + '"]');
options.finalize(node);
} else {
if (optimized) {
// clear old lines and make one full line
// so it can wrap when you resize
anim_lines.forEach(function(line) {
self.remove_line(line.index);
});
}
finish_typing_fn(message, prompt, options);
}
finish_typing_fn(message, prompt, options);
animating = false;
}, options.delay);
}
Expand Down Expand Up @@ -10538,6 +10546,7 @@
var appending_to_partial = false;
var partial = $();
var snapshot;
var finalizations = [];
if (!options.update) {
partial = self.find('.partial');
snapshot = lines.get_partial();
Expand Down Expand Up @@ -10580,13 +10589,16 @@
wrapper.attr('data-index', data.index);
appending_to_partial = !data.newline;
wrapper.toggleClass('partial', appending_to_partial);
finalizations.push({
node: wrapper,
finalize: data.finalize
});
if (appending_to_partial) {
partial = wrapper;
} else if (data.newline && partial.length) {
wrapper = $('<div/>');
partial = $();
}
data.finalize(wrapper);
} else {
var line = data.line;
var div;
Expand Down Expand Up @@ -10614,6 +10626,9 @@
}
});
partial = self.find('.partial');
finalizations.forEach(function(data) {
data.finalize(data.node);
});
var last_row;
if (partial.length === 0) {
css(command_line[0], {
Expand Down Expand Up @@ -10810,18 +10825,18 @@
if (is_node(arg)) {
return;
}
locals.finalize = function(div) {
locals.finalize = function(node) {
if (locals.raw) {
div.addClass('raw');
node.addClass('raw');
}
if (locals.ansi) {
div.addClass('ansi');
node.addClass('ansi');
}
try {
if (is_function(finalize)) {
finalize.call(self, div);
finalize.call(self, node);
}
div.on_load({
node.on_load({
error: function(element) {
element.replaceWith(use_broken_image);
},
Expand Down
4 changes: 2 additions & 2 deletions js/jquery.terminal.min.js
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion js/jquery.terminal.min.js.map
View file

Large diffs are not rendered by default.

0 comments on commit 8806882

Please sign in to comment.