Skip to content

Commit 62e2c6d

Browse files
committed
fix issues with selection & jumping on focus on mobile #572
1 parent 3f0a403 commit 62e2c6d

15 files changed

+125
-48
lines changed

CHANGELOG.md

+1
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
* fix broken html with wide characters without formatting
66
* fix jumping to address bar on CTRL+L [#587](https://github.com/jcubic/jquery.terminal/issues/587)
77
* fix issue in less when only one image get rendered [#583](https://github.com/jcubic/jquery.terminal/issues/583)
8+
* fix jumping on focus on mobile when terminal content scrolled down [#572](https://github.com/jcubic/jquery.terminal/issues/572)
89

910
## 2.17.2
1011
### Bugfix

README.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@ http://terminal.jcubic.pl
1010

1111
[![npm](https://img.shields.io/badge/npm-DEV-blue.svg)](https://www.npmjs.com/package/jquery.terminal)
1212
![bower](https://img.shields.io/badge/bower-DEV-yellow.svg)
13-
[![travis](https://travis-ci.org/jcubic/jquery.terminal.svg?branch=devel&2498146193f74c12340e089ed0b46c596083bacb)](https://travis-ci.org/jcubic/jquery.terminal)
14-
[![Coverage Status](https://coveralls.io/repos/github/jcubic/jquery.terminal/badge.svg?branch=devel&650b71b0202888b8d052d04ebf1a1b56)](https://coveralls.io/github/jcubic/jquery.terminal?branch=devel)
13+
[![travis](https://travis-ci.org/jcubic/jquery.terminal.svg?branch=devel&3f0a40310b412cd8895ab8d33a407b58f00f42a8)](https://travis-ci.org/jcubic/jquery.terminal)
14+
[![Coverage Status](https://coveralls.io/repos/github/jcubic/jquery.terminal/badge.svg?branch=devel&58a3902a41308c45d083501726944415)](https://coveralls.io/github/jcubic/jquery.terminal?branch=devel)
1515
![downloads](https://img.shields.io/npm/dm/jquery.terminal.svg?style=flat)
1616
[![](https://data.jsdelivr.com/v1/package/npm/jquery.terminal/badge?style=rounded)](https://www.jsdelivr.com/package/npm/jquery.terminal)
1717
[![LICENSE MIT](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/jcubic/jquery.terminal/blob/master/LICENSE)

__tests__/terminal.spec.js

+4
Original file line numberDiff line numberDiff line change
@@ -5626,8 +5626,12 @@ describe('Terminal plugin', function() {
56265626
});
56275627
it('should not execute methods', function() {
56285628
spy(term, 'clear');
5629+
var warn = console.warn;
5630+
console.warn = jest.fn();
56295631
term.echo('bar');
56305632
term.echo('[[ terminal::clear() ]]', { invokeMethods: false });
5633+
expect(count(console.warn)).toEqual(1);
5634+
console.warn = warn;
56315635
term.echo('[[ foo ]]', { invokeMethods: false });
56325636
expect(interpreter.foo).toHaveBeenCalled();
56335637
expect(a0(term.find('.terminal-output').text())).toEqual('bar');

css/jquery.terminal-2.17.2.css

+12-3
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
* Copyright (c) 2011-2020 Jakub Jankiewicz <https://jcubic.pl/me>
1313
* Released under the MIT license
1414
*
15-
* Date: Wed, 24 Jun 2020 20:41:28 +0000
15+
* Date: Sun, 28 Jun 2020 15:36:54 +0000
1616
*/
1717
.terminal .terminal-output .format, .cmd .format,
1818
.cmd-prompt, .cmd-prompt div {
@@ -674,9 +674,12 @@ terminal .terminal-output > div {
674674
pointer-events: none;
675675
box-sizing: border-box;
676676
}
677-
.terminal, .terminal .terminal-fill {
677+
.terminal, .terminal .terminal-fill, .cmd-editable {
678678
padding: 10px;
679679
}
680+
.cmd-editable {
681+
padding-top: 0;
682+
}
680683
/* padding added as margin to .cmd to fix FireFox bug see: https://stackoverflow.com/q/29986977/387194 */
681684
.terminal {
682685
padding-bottom: 0;
@@ -945,15 +948,21 @@ terminal .terminal-output > div {
945948
.terminal-mobile.terminal-less .terminal-output a, .cmd-editable {
946949
pointer-events: visible;
947950
}
951+
.cmd-editable::before {
952+
content: attr(data-cmd-prompt);
953+
display: inline-block;
954+
}
948955
.cmd-editable {
949956
position: absolute;
950957
top: 0;
951-
top: calc(var(--terminal-y, var(--cmd-y, 0)) * 1px);
958+
top: calc(var(--terminal-y, var(--cmd-y, 0)) + var(--terminal-scroll, 0) * 1px);
952959
right: 0;
953960
left: 0;
954961
bottom: 0;
962+
bottom: calc(var(--terminal-scroll, 0) * -1px);
955963
z-index: 500;
956964
color: transparent;
965+
background: transparent;
957966
opacity: 0.01;
958967
}
959968
.terminal::-webkit-scrollbar {

css/jquery.terminal-2.17.2.min.css

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

css/jquery.terminal-src.css

+11-2
Original file line numberDiff line numberDiff line change
@@ -674,9 +674,12 @@ terminal .terminal-output > div {
674674
pointer-events: none;
675675
box-sizing: border-box;
676676
}
677-
.terminal, .terminal .terminal-fill {
677+
.terminal, .terminal .terminal-fill, .cmd-editable {
678678
padding: 10px;
679679
}
680+
.cmd-editable {
681+
padding-top: 0;
682+
}
680683
/* padding added as margin to .cmd to fix FireFox bug see: https://stackoverflow.com/q/29986977/387194 */
681684
.terminal {
682685
padding-bottom: 0;
@@ -945,15 +948,21 @@ terminal .terminal-output > div {
945948
.terminal-mobile.terminal-less .terminal-output a, .cmd-editable {
946949
pointer-events: visible;
947950
}
951+
.cmd-editable::before {
952+
content: attr(data-cmd-prompt);
953+
display: inline-block;
954+
}
948955
.cmd-editable {
949956
position: absolute;
950957
top: 0;
951-
top: calc(var(--terminal-y, var(--cmd-y, 0)) * 1px);
958+
top: calc(var(--terminal-y, var(--cmd-y, 0)) + var(--terminal-scroll, 0) * 1px);
952959
right: 0;
953960
left: 0;
954961
bottom: 0;
962+
bottom: calc(var(--terminal-scroll, 0) * -1px);
955963
z-index: 500;
956964
color: transparent;
965+
background: transparent;
957966
opacity: 0.01;
958967
}
959968
.terminal::-webkit-scrollbar {

css/jquery.terminal.css

+12-3
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
* Copyright (c) 2011-2020 Jakub Jankiewicz <https://jcubic.pl/me>
1313
* Released under the MIT license
1414
*
15-
* Date: Wed, 24 Jun 2020 20:41:28 +0000
15+
* Date: Sun, 28 Jun 2020 15:36:54 +0000
1616
*/
1717
.terminal .terminal-output .format, .cmd .format,
1818
.cmd-prompt, .cmd-prompt div {
@@ -674,9 +674,12 @@ terminal .terminal-output > div {
674674
pointer-events: none;
675675
box-sizing: border-box;
676676
}
677-
.terminal, .terminal .terminal-fill {
677+
.terminal, .terminal .terminal-fill, .cmd-editable {
678678
padding: 10px;
679679
}
680+
.cmd-editable {
681+
padding-top: 0;
682+
}
680683
/* padding added as margin to .cmd to fix FireFox bug see: https://stackoverflow.com/q/29986977/387194 */
681684
.terminal {
682685
padding-bottom: 0;
@@ -945,15 +948,21 @@ terminal .terminal-output > div {
945948
.terminal-mobile.terminal-less .terminal-output a, .cmd-editable {
946949
pointer-events: visible;
947950
}
951+
.cmd-editable::before {
952+
content: attr(data-cmd-prompt);
953+
display: inline-block;
954+
}
948955
.cmd-editable {
949956
position: absolute;
950957
top: 0;
951-
top: calc(var(--terminal-y, var(--cmd-y, 0)) * 1px);
958+
top: calc(var(--terminal-y, var(--cmd-y, 0)) + var(--terminal-scroll, 0) * 1px);
952959
right: 0;
953960
left: 0;
954961
bottom: 0;
962+
bottom: calc(var(--terminal-scroll, 0) * -1px);
955963
z-index: 500;
956964
color: transparent;
965+
background: transparent;
957966
opacity: 0.01;
958967
}
959968
.terminal::-webkit-scrollbar {

css/jquery.terminal.min.css

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

css/jquery.terminal.min.css.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

js/jquery.terminal-2.17.2.js

+25-10
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141
*
4242
* broken image by Sophia Bai from the Noun Project (CC-BY)
4343
*
44-
* Date: Sun, 28 Jun 2020 12:29:49 +0000
44+
* Date: Sun, 28 Jun 2020 15:36:53 +0000
4545
*/
4646
/* global define, Map */
4747
/* eslint-disable */
@@ -1644,15 +1644,23 @@
16441644
reset: function() {
16451645
clearTimeout(timer);
16461646
timer = setTimeout(function() {
1647-
$node.css('top', '');
1647+
$node.css({
1648+
top: '',
1649+
bottom: ''
1650+
});
16481651
}, 400);
16491652
},
16501653
focus: function() {
1651-
$node.css('top', 0);
1654+
css($node[0], {
1655+
top: 'calc(var(--terminal-scroll, 0) * 1px)'
1656+
});
16521657
clip.reset();
16531658
},
16541659
blur: function() {
1655-
$node.css('top', '100%').blur();
1660+
$node.css({
1661+
top: '100%',
1662+
bottom: 0
1663+
}).blur();
16561664
// just in case of Webkit bug
16571665
window.getSelection().removeAllRanges();
16581666
clip.reset();
@@ -3046,6 +3054,7 @@
30463054
// fix for Chrome bug width selection
30473055
// https://bugs.chromium.org/p/chromium/issues/detail?id=1087787
30483056
var spans = prompt_node.find('> span span');
3057+
clip.$node.attr('data-cmd-prompt', prompt_node.text());
30493058
if (is_ch_unit_supported) {
30503059
prompt_node.hide();
30513060
spans.each(function() {
@@ -4422,7 +4431,7 @@
44224431
// -------------------------------------------------------------------------
44234432
$.terminal = {
44244433
version: 'DEV',
4425-
date: 'Sun, 28 Jun 2020 12:29:49 +0000',
4434+
date: 'Sun, 28 Jun 2020 15:36:53 +0000',
44264435
// colors from https://www.w3.org/wiki/CSS/Properties/color/keywords
44274436
color_names: [
44284437
'transparent', 'currentcolor', 'black', 'silver', 'gray', 'white',
@@ -8888,11 +8897,14 @@
88888897
fire_event('onFlush');
88898898
var offset = self.find('.cmd').offset();
88908899
var self_offset = self.offset();
8891-
css(self[0], {
8892-
'--terminal-x': offset.left - self_offset.left,
8893-
'--terminal-y': offset.top - self_offset.top
8894-
});
8895-
8900+
setTimeout(function() {
8901+
css(self[0], {
8902+
'--terminal-height': self.height(),
8903+
'--terminal-x': offset.left - self_offset.left,
8904+
'--terminal-y': offset.top - self_offset.top,
8905+
'--terminal-scroll': self.prop('scrollTop')
8906+
});
8907+
}, 0);
88968908
if ((settings.scrollOnEcho && options.scroll) || bottom) {
88978909
self.scroll_to_bottom();
88988910
}
@@ -10420,6 +10432,9 @@
1042010432
} else if (is_function(settings.touchscroll)) {
1042110433
ret = settings.touchscroll(event, delta, self);
1042210434
}
10435+
css(self[0], {
10436+
'--terminal-scroll': self.prop('scrollTop')
10437+
});
1042310438
if (ret === true) {
1042410439
return;
1042510440
}

js/jquery.terminal-2.17.2.min.js

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

js/jquery.terminal-src.js

+23-8
Original file line numberDiff line numberDiff line change
@@ -1644,15 +1644,23 @@
16441644
reset: function() {
16451645
clearTimeout(timer);
16461646
timer = setTimeout(function() {
1647-
$node.css('top', '');
1647+
$node.css({
1648+
top: '',
1649+
bottom: ''
1650+
});
16481651
}, 400);
16491652
},
16501653
focus: function() {
1651-
$node.css('top', 0);
1654+
css($node[0], {
1655+
top: 'calc(var(--terminal-scroll, 0) * 1px)'
1656+
});
16521657
clip.reset();
16531658
},
16541659
blur: function() {
1655-
$node.css('top', '100%').blur();
1660+
$node.css({
1661+
top: '100%',
1662+
bottom: 0
1663+
}).blur();
16561664
// just in case of Webkit bug
16571665
window.getSelection().removeAllRanges();
16581666
clip.reset();
@@ -3046,6 +3054,7 @@
30463054
// fix for Chrome bug width selection
30473055
// https://bugs.chromium.org/p/chromium/issues/detail?id=1087787
30483056
var spans = prompt_node.find('> span span');
3057+
clip.$node.attr('data-cmd-prompt', prompt_node.text());
30493058
if (is_ch_unit_supported) {
30503059
prompt_node.hide();
30513060
spans.each(function() {
@@ -8888,11 +8897,14 @@
88888897
fire_event('onFlush');
88898898
var offset = self.find('.cmd').offset();
88908899
var self_offset = self.offset();
8891-
css(self[0], {
8892-
'--terminal-x': offset.left - self_offset.left,
8893-
'--terminal-y': offset.top - self_offset.top
8894-
});
8895-
8900+
setTimeout(function() {
8901+
css(self[0], {
8902+
'--terminal-height': self.height(),
8903+
'--terminal-x': offset.left - self_offset.left,
8904+
'--terminal-y': offset.top - self_offset.top,
8905+
'--terminal-scroll': self.prop('scrollTop')
8906+
});
8907+
}, 0);
88968908
if ((settings.scrollOnEcho && options.scroll) || bottom) {
88978909
self.scroll_to_bottom();
88988910
}
@@ -10420,6 +10432,9 @@
1042010432
} else if (is_function(settings.touchscroll)) {
1042110433
ret = settings.touchscroll(event, delta, self);
1042210434
}
10435+
css(self[0], {
10436+
'--terminal-scroll': self.prop('scrollTop')
10437+
});
1042310438
if (ret === true) {
1042410439
return;
1042510440
}

js/jquery.terminal.js

+25-10
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,7 @@
4141
*
4242
* broken image by Sophia Bai from the Noun Project (CC-BY)
4343
*
44-
* Date: Sun, 28 Jun 2020 12:29:49 +0000
44+
* Date: Sun, 28 Jun 2020 15:36:53 +0000
4545
*/
4646
/* global define, Map */
4747
/* eslint-disable */
@@ -1644,15 +1644,23 @@
16441644
reset: function() {
16451645
clearTimeout(timer);
16461646
timer = setTimeout(function() {
1647-
$node.css('top', '');
1647+
$node.css({
1648+
top: '',
1649+
bottom: ''
1650+
});
16481651
}, 400);
16491652
},
16501653
focus: function() {
1651-
$node.css('top', 0);
1654+
css($node[0], {
1655+
top: 'calc(var(--terminal-scroll, 0) * 1px)'
1656+
});
16521657
clip.reset();
16531658
},
16541659
blur: function() {
1655-
$node.css('top', '100%').blur();
1660+
$node.css({
1661+
top: '100%',
1662+
bottom: 0
1663+
}).blur();
16561664
// just in case of Webkit bug
16571665
window.getSelection().removeAllRanges();
16581666
clip.reset();
@@ -3046,6 +3054,7 @@
30463054
// fix for Chrome bug width selection
30473055
// https://bugs.chromium.org/p/chromium/issues/detail?id=1087787
30483056
var spans = prompt_node.find('> span span');
3057+
clip.$node.attr('data-cmd-prompt', prompt_node.text());
30493058
if (is_ch_unit_supported) {
30503059
prompt_node.hide();
30513060
spans.each(function() {
@@ -4422,7 +4431,7 @@
44224431
// -------------------------------------------------------------------------
44234432
$.terminal = {
44244433
version: 'DEV',
4425-
date: 'Sun, 28 Jun 2020 12:29:49 +0000',
4434+
date: 'Sun, 28 Jun 2020 15:36:53 +0000',
44264435
// colors from https://www.w3.org/wiki/CSS/Properties/color/keywords
44274436
color_names: [
44284437
'transparent', 'currentcolor', 'black', 'silver', 'gray', 'white',
@@ -8888,11 +8897,14 @@
88888897
fire_event('onFlush');
88898898
var offset = self.find('.cmd').offset();
88908899
var self_offset = self.offset();
8891-
css(self[0], {
8892-
'--terminal-x': offset.left - self_offset.left,
8893-
'--terminal-y': offset.top - self_offset.top
8894-
});
8895-
8900+
setTimeout(function() {
8901+
css(self[0], {
8902+
'--terminal-height': self.height(),
8903+
'--terminal-x': offset.left - self_offset.left,
8904+
'--terminal-y': offset.top - self_offset.top,
8905+
'--terminal-scroll': self.prop('scrollTop')
8906+
});
8907+
}, 0);
88968908
if ((settings.scrollOnEcho && options.scroll) || bottom) {
88978909
self.scroll_to_bottom();
88988910
}
@@ -10420,6 +10432,9 @@
1042010432
} else if (is_function(settings.touchscroll)) {
1042110433
ret = settings.touchscroll(event, delta, self);
1042210434
}
10435+
css(self[0], {
10436+
'--terminal-scroll': self.prop('scrollTop')
10437+
});
1042310438
if (ret === true) {
1042410439
return;
1042510440
}

js/jquery.terminal.min.js

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

js/jquery.terminal.min.js.map

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)