Enabled multiline input to easily paste several lines from an external editor. Sth like backslash in bash doesn't work; don't see the need for that
This commit is contained in:
parent
31944186e1
commit
9dabe938f9
3 changed files with 53 additions and 21 deletions
17
src/app.css
17
src/app.css
|
|
@ -61,12 +61,25 @@ svg {
|
|||
bottom: 0;
|
||||
}
|
||||
|
||||
#command_input{
|
||||
.multiline{
|
||||
border-top: 1px slategray solid;
|
||||
border-left: 1px slategray solid;
|
||||
border-right: 1px slategray solid;
|
||||
border-bottom: none transparent;
|
||||
border-top-left-radius: 3px;
|
||||
border-top-right-radius: 3px;
|
||||
}
|
||||
|
||||
.single_line{
|
||||
border: none transparent;
|
||||
background: black;
|
||||
}
|
||||
|
||||
#command_input{
|
||||
background: #111;
|
||||
color: greenyellow;
|
||||
outline: none;
|
||||
width: 39vw;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
#command_history{
|
||||
|
|
|
|||
|
|
@ -6,10 +6,21 @@
|
|||
const command_input_element = document.getElementById('command_input');
|
||||
const command_history_element = document.getElementById('command_history');
|
||||
command_input_element.value = '';
|
||||
let command_history = [];
|
||||
let command_history = [''];
|
||||
let command_history_index = 0;
|
||||
|
||||
let adjust_input_element_height = function(){
|
||||
let num_lines=command_input_element.value.split(/\n/).length;
|
||||
command_input_element.setAttribute('style', 'height: ' + num_lines + 'em');
|
||||
if (num_lines>1){
|
||||
command_input_element.setAttribute('class','multiline');
|
||||
} else {
|
||||
command_input_element.setAttribute('class','single_line');
|
||||
}
|
||||
}
|
||||
|
||||
command_input_element.onkeyup = function handle_key_input(event) {
|
||||
adjust_input_element_height();
|
||||
if (event.key === 'ArrowUp') {
|
||||
if (command_history_index > -1) {
|
||||
command_input_element.value = command_history[command_history_index];
|
||||
|
|
@ -27,7 +38,13 @@
|
|||
}
|
||||
}
|
||||
if (event.key === 'Enter') {
|
||||
let command = command_input_element.value;
|
||||
let commands = command_input_element.value;
|
||||
command_input_element.value='';
|
||||
adjust_input_element_height();
|
||||
let command_array = commands.split(/\n/);
|
||||
for (let i = 0; i < command_array.length; i++) {
|
||||
let command = command_array[i];
|
||||
if (command.length > 0) {
|
||||
command_history_element.innerText += command + "\n";
|
||||
command_input_element.value = '';
|
||||
command_history_index = command_history.length;
|
||||
|
|
@ -46,6 +63,8 @@
|
|||
command_history.push(command);
|
||||
command_history_element.scrollTo(0, command_history_element.scrollHeight);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
let visit_expression = function (expr) {
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
<div id="console">
|
||||
<div id="command_history"><div id="bottom"></div></div>
|
||||
<label id="prompt">>
|
||||
<input id="command_input" type="text" autofocus/>
|
||||
<textarea id="command_input" class="single_line" autofocus></textarea>
|
||||
</label>
|
||||
</div>
|
||||
<script type="application/ecmascript" src="index.js"></script>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue