PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

support links in RTE

Browse source
This commit is contained in:
Matthew Hodgson 2018-05-20 00:49:29 +01:00
parent f2116943c8
commit c3a6a41e5d
2 changed files with 30 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/autocomplete/PlainWithPillsSerializer.js
View file

@ -69,7 +69,7 @@ class PlainWithPillsSerializer {
case 'plain': case 'plain':
return node.data.get('completion'); return node.data.get('completion');
case 'md': case 'md':
return `[${ node.text }](${ node.data.get('url') })`; return `[${ node.text }](${ node.data.get('href') })`;
case 'id': case 'id':
return node.data.get('completionId') || node.data.get('completion'); return node.data.get('completionId') || node.data.get('completion');
} }

31
src/components/views/rooms/MessageComposerInput.js
View file

@ -200,6 +200,31 @@ export default class MessageComposerInput extends React.Component {
nodes: next(el.childNodes), nodes: next(el.childNodes),
} }
} }
// special case links
if (tag === 'a') {
const href = el.getAttribute('href');
let m = href.match(MATRIXTO_URL_PATTERN);
if (m) {
return {
object: 'inline',
type: 'pill',
data: {
href,
completion: el.innerText,
completionId: m[1],
},
isVoid: true,
}
}
else {
return {
object: 'inline',
type: 'link',
data: { href },
nodes: next(el.childNodes),
}
}
}
}, },
serialize: (obj, children) => { serialize: (obj, children) => {
if (obj.object === 'block' || obj.object === 'inline') { if (obj.object === 'block' || obj.object === 'inline') {
@ -1161,7 +1186,7 @@ export default class MessageComposerInput extends React.Component {
if (href) { if (href) {
inline = Inline.create({ inline = Inline.create({
type: 'pill', type: 'pill',
data: { completion, completionId, url: href }, data: { completion, completionId, href },
// we can't put text in here otherwise the editor tries to select it // we can't put text in here otherwise the editor tries to select it
isVoid: true, isVoid: true,
}); });
@ -1233,9 +1258,11 @@ export default class MessageComposerInput extends React.Component {
return <ol {...attributes}>{children}</ol>; return <ol {...attributes}>{children}</ol>;
case 'code-block': case 'code-block':
return <pre {...attributes}><code {...attributes}>{children}</code></pre>; return <pre {...attributes}><code {...attributes}>{children}</code></pre>;
case 'link':
return <a {...attributes} href={ node.data.get('href') }>{children}</a>;
case 'pill': { case 'pill': {
const { data } = node; const { data } = node;
const url = data.get('url'); const url = data.get('href');
const completion = data.get('completion'); const completion = data.get('completion');
const shouldShowPillAvatar = !SettingsStore.getValue("Pill.shouldHidePillAvatar"); const shouldShowPillAvatar = !SettingsStore.getValue("Pill.shouldHidePillAvatar");