mirror of
https://git.sr.ht/~tsileo/microblog.pub
synced 2024-11-15 03:04:28 +00:00
Tweak the emoji picker
This commit is contained in:
parent
c100796c86
commit
4122912c19
1 changed files with 21 additions and 10 deletions
|
@ -35,23 +35,34 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<script>
|
<script>
|
||||||
|
// The new post textarea
|
||||||
var ta = document.getElementsByTagName("textarea")[0];
|
var ta = document.getElementsByTagName("textarea")[0];
|
||||||
|
// Helper for inserting text (emojis) in the textarea
|
||||||
function insertAtCursor (textToInsert) {
|
function insertAtCursor (textToInsert) {
|
||||||
// get current text of the input
|
ta.focus();
|
||||||
const value = ta.value;
|
const isSuccess = document.execCommand("insertText", false, textToInsert);
|
||||||
// save selection start and end position
|
|
||||||
const start = ta.selectionStart;
|
// Firefox (non-standard method)
|
||||||
const end = ta.selectionEnd;
|
if (!isSuccess) {
|
||||||
// update the value with our text inserted
|
// Credits to https://www.everythingfrontend.com/posts/insert-text-into-textarea-at-cursor-position.html
|
||||||
ta.value = value.slice(0, start) + textToInsert + value.slice(end);
|
// get current text of the input
|
||||||
// update cursor to be at the end of insertion
|
const value = ta.value;
|
||||||
ta.selectionStart = ta.selectionEnd = start + textToInsert.length;
|
// save selection start and end position
|
||||||
|
const start = ta.selectionStart;
|
||||||
|
const end = ta.selectionEnd;
|
||||||
|
// update the value with our text inserted
|
||||||
|
ta.value = value.slice(0, start) + textToInsert + value.slice(end);
|
||||||
|
// update cursor to be at the end of insertion
|
||||||
|
ta.selectionStart = ta.selectionEnd = start + textToInsert.length;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
// Emoji click callback func
|
||||||
var ji = function (ev) {
|
var ji = function (ev) {
|
||||||
insertAtCursor(ev.target.attributes.alt.value);
|
insertAtCursor(ev.target.attributes.alt.value + " ");
|
||||||
ta.focus()
|
ta.focus()
|
||||||
//console.log(document.execCommand('insertText', false /*no UI*/, ev.target.attributes.alt.value));
|
//console.log(document.execCommand('insertText', false /*no UI*/, ev.target.attributes.alt.value));
|
||||||
}
|
}
|
||||||
|
// Enable the click for each emojis
|
||||||
var items = document.getElementsByClassName("ji")
|
var items = document.getElementsByClassName("ji")
|
||||||
for (var i = 0; i < items.length; i++) {
|
for (var i = 0; i < items.length; i++) {
|
||||||
items[i].addEventListener('click', ji);
|
items[i].addEventListener('click', ji);
|
||||||
|
|
Loading…
Reference in a new issue