Merge pull request #7 from runjinz/type_a_request
Add auto-resizing functionality and Ctrl+Enter support to message input
This commit is contained in:
commit
0988effe3e
@ -1,4 +1,20 @@
|
|||||||
|
|
||||||
|
const messageInput = document.getElementById('message-input');
|
||||||
|
const inputContainer = document.getElementById('input-container');
|
||||||
|
|
||||||
|
const defaultHeight = 16;
|
||||||
|
|
||||||
|
function autoResizeTextarea() {
|
||||||
|
const lineCount = (messageInput.value.match(/\n/g) || []).length + 1;
|
||||||
|
messageInput.style.height = 'auto';
|
||||||
|
messageInput.style.height = (lineCount <= 1 ? defaultHeight : messageInput.scrollHeight) + 'px';
|
||||||
|
inputContainer.style.height = 'auto';
|
||||||
|
inputContainer.style.height = messageInput.style.height + 25;
|
||||||
|
}
|
||||||
|
|
||||||
|
messageInput.addEventListener('input', autoResizeTextarea);
|
||||||
|
|
||||||
|
autoResizeTextarea();
|
||||||
|
|
||||||
function initInputContainer() {
|
function initInputContainer() {
|
||||||
const messageInput = document.getElementById('message-input');
|
const messageInput = document.getElementById('message-input');
|
||||||
@ -12,11 +28,17 @@ function initInputContainer() {
|
|||||||
let commandList = [];
|
let commandList = [];
|
||||||
|
|
||||||
messageInput.addEventListener('keypress', function (e) {
|
messageInput.addEventListener('keypress', function (e) {
|
||||||
if (e.key === 'Enter' && !e.shiftKey) {
|
if (e.key === 'Enter') {
|
||||||
e.preventDefault();
|
if (e.ctrlKey) {
|
||||||
const message = messageInput.value.trim();
|
e.preventDefault();
|
||||||
if (message !== '') {
|
const message = messageInput.value.trim();
|
||||||
sendButton.click();
|
if (message !== '') {
|
||||||
|
sendButton.click();
|
||||||
|
}
|
||||||
|
} else if (!e.shiftKey) {
|
||||||
|
e.preventDefault();
|
||||||
|
messageInput.setRangeText('\n', messageInput.selectionStart, messageInput.selectionEnd, 'end');
|
||||||
|
autoResizeTextarea();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@ -26,15 +48,16 @@ function initInputContainer() {
|
|||||||
if (message) {
|
if (message) {
|
||||||
// Add the user's message to the chat UI
|
// Add the user's message to the chat UI
|
||||||
addMessageToUI('user', message);
|
addMessageToUI('user', message);
|
||||||
|
|
||||||
// Clear the input field
|
// Clear the input field
|
||||||
messageInput.value = '';
|
messageInput.value = '';
|
||||||
|
|
||||||
// Process and send the message to the extension
|
// Process and send the message to the extension
|
||||||
messageUtil.sendMessage({
|
messageUtil.sendMessage({
|
||||||
command: 'sendMessage',
|
command: 'sendMessage',
|
||||||
text: message
|
text: message
|
||||||
});
|
});
|
||||||
|
autoResizeTextarea();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user