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:
Sander Hautvast 2021-02-14 16:54:01 +01:00
parent 31944186e1
commit 9dabe938f9
3 changed files with 53 additions and 21 deletions

View file

@ -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{

View file

@ -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) {
@ -134,7 +153,7 @@
return object_wrapper.object[method_or_property.name].apply(object_wrapper, method_or_property.arguments);
} else { // property
if (!object_wrapper.object.hasOwnProperty(method_or_property.name)){
if (!object_wrapper.object.hasOwnProperty(method_or_property.name)) {
throw {message: `property ${method_or_property.name} not found on ${object_wrapper.type}`};
}
return object_wrapper.object[method_or_property.name];

View file

@ -9,7 +9,7 @@
<div id="console">
<div id="command_history"><div id="bottom"></div></div>
<label id="prompt">&gt;
<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>