user avatars, proper event body display

master
f0x 5 years ago
parent 45cc004de1
commit a3b935effb

@ -116,10 +116,21 @@ let EventGroup = create({
getInitialState: function() { getInitialState: function() {
let user = this.props.client.getUser(this.props.events[0].sender) let user = this.props.client.getUser(this.props.events[0].sender)
let avatar = <svg id="avatar" ref={this.avatarRef} />
if (user.avatarUrl != null) {
let hs = this.props.client.baseUrl
let media_mxc = user.avatarUrl.slice(6)
let url = `${hs}/_matrix/media/v1/thumbnail/${media_mxc}?width=128&height=128&method=scale`
avatar = <img id="avatar" src={url}/>
}
console.log(user)
let color = ["red", "green", "yellow", "blue", "purple", "cyan"][Math.floor(Math.random()*6)] let color = ["red", "green", "yellow", "blue", "purple", "cyan"][Math.floor(Math.random()*6)]
return { return {
color: color, color: color,
user: user user: user,
avatar: avatar
} }
}, },
@ -132,7 +143,7 @@ let EventGroup = create({
return <Event event={event} key={key} client={this.props.client} /> return <Event event={event} key={key} client={this.props.client} />
}) })
return <div className="eventGroup"> return <div className="eventGroup">
<svg id="avatar" ref={this.avatarRef} /> {this.state.avatar}
<div className="col"> <div className="col">
<div id="name" className={`fg-palet-${this.state.color}`}>{this.state.user.displayName}</div> <div id="name" className={`fg-palet-${this.state.color}`}>{this.state.user.displayName}</div>
{events} {events}

@ -10,8 +10,23 @@ let Event = create({
displayName: "m.text", displayName: "m.text",
render: function() { render: function() {
let event = this.props.event; let event = this.props.event
let eventBody = riot.sanitize(event.content.body)
let eventBody
if (event.content.format == "org.matrix.custom.html") {
let html = riot.sanitize(event.content.formatted_body)
eventBody = <div
className={this.props.nested ? "nested" : "body"}
dangerouslySetInnerHTML={{__html: html}}
/>
} else {
eventBody =
<div className={this.props.nested ? "nested" : "body"}>
{event.content.body}
</div>
}
let eventClass = "event" let eventClass = "event"
if (event.local) { if (event.local) {
@ -19,10 +34,7 @@ let Event = create({
} }
return <div className={eventClass}> return <div className={eventClass}>
<div {eventBody}
className={this.props.nested ? "nested" : "body"}
dangerouslySetInnerHTML={{__html: eventBody}}
/>
</div> </div>
} }
}) })

Loading…
Cancel
Save