LaniakeaSupercluster/webrtc
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

avatar 降低点错概率

Browse Source
This commit is contained in:
觉 2023-10-07 02:01:22 +08:00
parent 7e50b901c9
commit da79d6d4d7
1 changed files with 53 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
public/client.js
View File

@ -225,73 +225,63 @@ export default class ClientList {
add(item) { add(item) {
this.element.appendChild(ListItem({ this.element.appendChild(ListItem({
id: item.id, id: item.id,
onclick: event => { onclick: event => document.body.appendChild(Dialog({
}, children: [
Avatar({
src: item.avatar ?? '/favicon.ico',
style: {
width: '240px',
height: '240px',
borderRadius: '8px',
margin: '0 auto',
display: 'block',
cursor: 'pointer'
},
onclick: event => {
console.log('点击上传图片')
const input = document.createElement('input')
input.type = 'file'
input.accept = 'image/*'
input.onchange = async event => {
const file = event.target.files[0]
const reader = new FileReader()
reader.readAsDataURL(file)
reader.onload = async event => {
const base64 = event.target.result
localStorage.setItem('avatar', base64)
window.location.reload() // 简单刷新页面
}
}
input.click()
}
}),
Input({
style: {
width: '100px',
border: '2px dotted #bbb',
borderRadius: '50%',
outline: 'none',
padding: '5px 0',
textAlign: 'center',
position: 'absolute',
bottom: '-2px',
},
value: item.name ?? item.id,
type: 'text',
placeholder: '请设置你的昵称',
onchange: event => {
localStorage.setItem('username', event.target.value)
window.location.reload() // 简单刷新页面
}
})
]
})),
children: [ children: [
Avatar({ Avatar({
src: item.avatar ?? '/favicon.ico', src: item.avatar ?? '/favicon.ico'
onclick: event => {
event.stopPropagation()
// 点击插入一个弹出层
document.body.appendChild(Dialog({
children: [
Avatar({
src: item.avatar ?? '/favicon.ico',
style: {
width: '240px',
height: '240px',
borderRadius: '8px',
margin: '0 auto',
display: 'block',
cursor: 'pointer'
},
onclick: event => {
// 点击上传图片
console.log('点击上传图片')
const input = document.createElement('input')
input.type = 'file'
input.accept = 'image/*'
input.onchange = async event => {
const file = event.target.files[0]
const reader = new FileReader()
reader.readAsDataURL(file)
reader.onload = async event => {
const base64 = event.target.result
localStorage.setItem('avatar', base64)
window.location.reload() // 简单刷新页面
}
}
input.click()
}
}),
Input({
style: {
width: '100px',
border: '2px dotted #bbb',
borderRadius: '50%',
outline: 'none',
padding: '5px 0',
textAlign: 'center',
position: 'absolute',
bottom: '-2px',
},
value: item.name ?? item.id,
type: 'text',
placeholder: '请设置你的昵称',
onchange: event => {
localStorage.setItem('username', event.target.value)
window.location.reload() // 简单刷新页面
}
})
]
}))
}
}), }),
Span({ Span({
textContent: item.name ?? item.id, textContent: item.name ?? item.id
onclick: event => {
event.stopPropagation()
}
}) })
] ]
})) }))