From 04fa1f0b2d1a92b1c653cd55f51ee7e1434b2bd7 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 7 Jun 2021 18:39:51 +0300 Subject: some docs, added richcontent to usernames in status, updated stillImage to allow scale of "gif" label --- src/components/rich_content/rich_content.jsx | 33 ++++++++++++++++++++++------ 1 file changed, 26 insertions(+), 7 deletions(-) (limited to 'src/components/rich_content/rich_content.jsx') diff --git a/src/components/rich_content/rich_content.jsx b/src/components/rich_content/rich_content.jsx index 00cf6623..c15877c8 100644 --- a/src/components/rich_content/rich_content.jsx +++ b/src/components/rich_content/rich_content.jsx @@ -9,25 +9,41 @@ import './rich_content.scss' export default Vue.component('RichContent', { name: 'RichContent', props: { + // Original html content html: { required: true, type: String }, + // Emoji object, as in status.emojis, note the "s" at the end... emoji: { required: true, type: Array + }, + // Whether to handle links or not (posts: yes, everything else: no) + handleLinks: { + required: false, + type: Boolean, + default: false } }, render (h) { const renderImage = (tag) => { - const attrs = getAttrs(tag) - return + return } const renderMention = (attrs, children) => { - return + return } - const structure = convertHtml(this.html) + + // Processor to use with mini_html_converter const processItem = (item) => { + // Handle text noes - just add emoji if (typeof item === 'string') { if (item.includes(':')) { return processTextForEmoji( @@ -46,18 +62,21 @@ export default Vue.component('RichContent', { return unescape(item) } } + // Handle tag nodes if (Array.isArray(item)) { const [opener, children] = item const Tag = getTagName(opener) switch (Tag) { - case 'img': + case 'img': // replace images with StillImage return renderImage(opener) - case 'a': + case 'a': // replace mentions with MentionLink + if (!this.handleLinks) break const attrs = getAttrs(opener) if (attrs['class'] && attrs['class'].includes('mention')) { return renderMention(attrs, children) } } + // Render tag as is if (children !== undefined) { return { children.map(processItem) } @@ -68,7 +87,7 @@ export default Vue.component('RichContent', { } } return - { structure.map(processItem) } + { convertHtml(this.html).map(processItem) } } }) -- cgit v1.2.3-70-g09d2