Add emoji autocomplete

- Fixes #255
This commit is contained in:
Dessalines 2019-08-30 17:40:59 -07:00
parent 13ef254c61
commit 168a0f61f1
3 changed files with 33 additions and 4 deletions

View File

@ -1,7 +1,7 @@
import { Component, linkEvent } from 'inferno';
import { CommentNode as CommentNodeI, CommentForm as CommentFormI, SearchForm, SearchType, SortType, UserOperation, SearchResponse } from '../interfaces';
import { Subscription } from "rxjs";
import { capitalizeFirstLetter, fetchLimit, msgOp } from '../utils';
import { capitalizeFirstLetter, fetchLimit, msgOp, md, emojiMentionList } from '../utils';
import { WebSocketService, UserService } from '../services';
import * as autosize from 'autosize';
import { i18n } from '../i18next';
@ -42,7 +42,21 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
this.tribute = new Tribute({
collection: [
// Emojis
{
trigger: ':',
menuItemTemplate: (item: any) => {
let emoji = `:${item.original.key}:`;
return `${md.renderInline(emoji)} ${emoji}`;
},
selectTemplate: (item: any) => {
return `:${item.original.key}:`;
},
values: emojiMentionList(),
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: 10,
},
// Users
{
trigger: '@',
@ -52,7 +66,9 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
values: (text: string, cb: any) => {
this.userSearch(text, (users: any) => cb(users));
},
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: 10,
},
// Communities
@ -64,7 +80,9 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
values: (text: string, cb: any) => {
this.communitySearch(text, (communities: any) => cb(communities));
},
allowSpaces: false,
autocompleteMode: true,
menuItemLimit: 10,
}
]
});

1
ui/src/emoji_list.ts vendored Normal file

File diff suppressed because one or more lines are too long

14
ui/src/utils.ts vendored
View File

@ -11,15 +11,16 @@ import { UserOperation, Comment, User, SortType, ListingType } from './interface
import * as markdown_it from 'markdown-it';
declare var markdownitEmoji: any;
import * as markdown_it_container from 'markdown-it-container';
import { emoji_list } from './emoji_list';
export let repoUrl = 'https://github.com/dessalines/lemmy';
export const repoUrl = 'https://github.com/dessalines/lemmy';
export function msgOp(msg: any): UserOperation {
let opStr: string = msg.op;
return UserOperation[opStr];
}
var md = new markdown_it({
export const md = new markdown_it({
html: false,
linkify: true,
typographer: true
@ -184,6 +185,15 @@ export function getLanguage(): string {
return (navigator.language || navigator.userLanguage);
}
export function emojiMentionList(): Array<{}> {
let keyedEmojis = [];
for (let e of emoji_list) {
let obj = {key: e};
keyedEmojis.push(obj);
}
return keyedEmojis;
}
export function getMomentLanguage(): string {
let lang = getLanguage();
if (lang.startsWith('zh')) {