Compare commits
11 Commits
a5309a81b1
...
6224cde132
| Author | SHA1 | Date |
|---|---|---|
 Bad
|
6224cde132 | 3 years ago |
 Cadence Ember
|
ff196a64bb
|
3 years ago |
|
Cadence Ember
|
a4c7f29ec9
|
3 years ago |
|
Cadence Ember
|
5bfe98bdf4
|
3 years ago |
|
Cadence Ember
|
f4b368ea3e
|
3 years ago |
|
cadence
|
6da9f41519 | 3 years ago |
|
Cadence Ember
|
df47c8a88a
|
3 years ago |
|
cadence
|
5ab182e615 | 3 years ago |
|
Cadence Ember
|
08a0990bc8
|
3 years ago |
|
BadAtNames
|
c9dffc9d4a | 3 years ago |
|
BadAtNames
|
6227f6fa84 | 3 years ago |
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,120 @@
|
||||
const {ElemJS, ejs} = require("./basic.js")
|
||||
const {store} = require("./store/store.js")
|
||||
const {resolveMxc} = require("./functions.js")
|
||||
|
||||
function nameToColor(str) {
|
||||
// code from element's react sdk
|
||||
const colors = ["#55a7f0", "#da55ff", "#1bc47c", "#ea657e", "#fd8637", "#22cec6", "#8c8de3", "#71bf22"]
|
||||
let hash = 0
|
||||
let i
|
||||
let chr
|
||||
if (str.length === 0) {
|
||||
return hash
|
||||
}
|
||||
for (i = 0; i < str.length; i++) {
|
||||
chr = str.charCodeAt(i)
|
||||
hash = ((hash << 5) - hash) + chr
|
||||
hash |= 0
|
||||
}
|
||||
hash = Math.abs(hash) % 8
|
||||
return colors[hash]
|
||||
}
|
||||
|
||||
class Avatar extends ElemJS {
|
||||
constructor() {
|
||||
super("div")
|
||||
this.class("c-message-group__avatar")
|
||||
|
||||
this.mxc = undefined
|
||||
this.image = null
|
||||
|
||||
this.update(null)
|
||||
}
|
||||
|
||||
update(mxc) {
|
||||
if (mxc === this.mxc) return
|
||||
this.mxc = mxc
|
||||
this.hasImage = !!mxc
|
||||
if (this.hasImage) {
|
||||
const size = 96
|
||||
const url = resolveMxc(mxc, size, "crop")
|
||||
this.image = ejs("img").class("c-message-group__icon").attribute("src", url).attribute("width", size).attribute("height", size)
|
||||
this.image.on("error", this.onError.bind(this))
|
||||
}
|
||||
this.render()
|
||||
}
|
||||
|
||||
onError() {
|
||||
this.hasImage = false
|
||||
this.render()
|
||||
}
|
||||
|
||||
render() {
|
||||
this.clearChildren()
|
||||
if (this.hasImage) {
|
||||
this.child(this.image)
|
||||
} else {
|
||||
this.child(
|
||||
ejs("div").class("c-message-group__icon", "c-message-group__icon--no-icon")
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** Must update at least once to render. */
|
||||
class Name extends ElemJS {
|
||||
constructor() {
|
||||
super("div")
|
||||
this.class("c-message-group__name")
|
||||
|
||||
/**
|
||||
* Keeps track of whether we have the proper display name or not.
|
||||
* If we do, then we shoudn't override it with the mxid if the name becomes unavailable.
|
||||
*/
|
||||
this.hasName = false
|
||||
this.name = ""
|
||||
this.mxid = ""
|
||||
}
|
||||
|
||||
update(event) {
|
||||
this.mxid = event.state_key
|
||||
if (event.content.displayname) {
|
||||
this.hasName = true
|
||||
this.name = event.content.displayname
|
||||
} else if (!this.hasName) {
|
||||
this.name = this.mxid
|
||||
}
|
||||
this.render()
|
||||
}
|
||||
|
||||
render() {
|
||||
// set text
|
||||
this.text(this.name)
|
||||
// set color
|
||||
this.style("color", nameToColor(this.mxid))
|
||||
}
|
||||
}
|
||||
|
||||
class Sender {
|
||||
constructor(roomID, mxid) {
|
||||
this.sender = store.rooms.get(roomID).value().members.get(mxid)
|
||||
this.name = new Name()
|
||||
this.avatar = new Avatar()
|
||||
this.sender.subscribe("changeSelf", this.update.bind(this))
|
||||
this.update()
|
||||
}
|
||||
|
||||
update() {
|
||||
if (this.sender.exists()) {
|
||||
// name
|
||||
this.name.update(this.sender.value())
|
||||
|
||||
// avatar
|
||||
this.avatar.update(this.sender.value().content.avatar_url)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
Sender
|
||||
}
|
||||
@ -0,0 +1,13 @@
|
||||
@keyframes spin
|
||||
0%
|
||||
transform: rotate(0deg)
|
||||
100%
|
||||
transform: rotate(180deg)
|
||||
|
||||
.loading-icon
|
||||
display: inline-block
|
||||
background-color: #ccc
|
||||
width: 12px
|
||||
height: 12px
|
||||
margin-right: 6px
|
||||
animation: spin 0.7s infinite
|
||||
Loading…
Reference in New Issue