Focus chat when switching room

This commit is contained in:
Cadence Ember 2020-10-19 20:23:28 +13:00
parent 1f9462b89d
commit 6b97b226e6
Signed by: cadence
GPG key ID: BC1C2C61CF521B17
6 changed files with 27 additions and 15 deletions

View file

@ -4,10 +4,10 @@
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="static/main.css?static=9aad8398d2">
<script type="module" src="static/groups.js?static=2cc7f0daf8"></script>
<script type="module" src="static/chat-input.js?static=e8b21037fa"></script>
<script type="module" src="static/chat-input.js?static=92188b34f9"></script>
<script type="module" src="static/room-picker.js?static=7bc94b38d3"></script>
<script type="module" src="static/sync/sync.js?static=56e374b23d"></script>
<script type="module" src="static/chat.js?static=8a04bee48d"></script>
<script type="module" src="static/chat.js?static=fc121d3d23"></script>
<title>Carbon</title>
</head>
<body>

View file

@ -1,29 +1,36 @@
import {q} from "./basic.js"
import {store} from "./store/store.js"
import * as lsm from "./lsm.js"
import {chat} from "./chat.js"
let sentIndex = 0
const chat = q("#c-chat-textarea")
const input = q("#c-chat-textarea")
chat.addEventListener("keydown", event => {
store.activeRoom.subscribe("changeSelf", () => {
if (store.activeRoom.exists()) {
input.focus()
}
})
input.addEventListener("keydown", event => {
if (event.key === "Enter" && !event.shiftKey && !event.ctrlKey) {
event.preventDefault()
const body = chat.value
send(chat.value)
chat.value = ""
const body = input.value
send(input.value)
input.value = ""
fixHeight()
}
})
chat.addEventListener("input", () => {
input.addEventListener("input", () => {
fixHeight()
})
function fixHeight() {
chat.style.height = "0px"
console.log(chat.clientHeight, chat.scrollHeight)
chat.style.height = (chat.scrollHeight + 1) + "px"
input.style.height = "0px"
// console.log(input.clientHeight, input.scrollHeight)
input.style.height = (input.scrollHeight + 1) + "px"
}
function getTxnId() {

View file

@ -34,7 +34,7 @@ class Chat extends ElemJS {
let oldDifference = chatMessages.scrollHeight - chatMessages.clientHeight
setTimeout(() => {
let newDifference = chatMessages.scrollHeight - chatMessages.clientHeight
console.log("height difference", oldDifference, newDifference)
// console.log("height difference", oldDifference, newDifference)
if (oldDifference < 24) { // this is jank
this.element.parentElement.scrollBy(0, 1000)
}

View file

@ -54,7 +54,6 @@ class SubscribeMapList extends Subscribable {
}
sort() {
console.log("sorting")
this.list.sort((a, b) => {
const orderA = this.map.get(a).value().order
const orderB = this.map.get(b).value().order

View file

@ -7,6 +7,12 @@ let sentIndex = 0
const input = q("#c-chat-textarea")
store.activeRoom.subscribe("changeSelf", () => {
if (store.activeRoom.exists()) {
input.focus()
}
})
input.addEventListener("keydown", event => {
if (event.key === "Enter" && !event.shiftKey && !event.ctrlKey) {
event.preventDefault()
@ -23,7 +29,7 @@ input.addEventListener("input", () => {
function fixHeight() {
input.style.height = "0px"
console.log(input.clientHeight, input.scrollHeight)
// console.log(input.clientHeight, input.scrollHeight)
input.style.height = (input.scrollHeight + 1) + "px"
}

View file

@ -34,7 +34,7 @@ class Chat extends ElemJS {
let oldDifference = chatMessages.scrollHeight - chatMessages.clientHeight
setTimeout(() => {
let newDifference = chatMessages.scrollHeight - chatMessages.clientHeight
console.log("height difference", oldDifference, newDifference)
// console.log("height difference", oldDifference, newDifference)
if (oldDifference < 24) { // this is jank
this.element.parentElement.scrollBy(0, 1000)
}