username -> displayname

This commit is contained in:
Craig 2020-04-05 01:33:19 +00:00
parent bcb4ea6641
commit bf51a3ff3a
12 changed files with 56 additions and 56 deletions

View File

@ -4,11 +4,11 @@
<template v-for="(message, index) in history"> <template v-for="(message, index) in history">
<li :key="index" class="message" v-if="message.type === 'text'"> <li :key="index" class="message" v-if="message.type === 'text'">
<div class="author" @contextmenu.stop.prevent="onContext($event, { member: member(message.id) })"> <div class="author" @contextmenu.stop.prevent="onContext($event, { member: member(message.id) })">
<img :src="`https://api.adorable.io/avatars/40/${member(message.id).username}.png`" /> <img :src="`https://api.adorable.io/avatars/40/${member(message.id).displayname}.png`" />
</div> </div>
<div class="content"> <div class="content">
<div class="content-head"> <div class="content-head">
<span>{{ member(message.id).username }}</span> <span>{{ member(message.id).displayname }}</span>
<span class="timestamp">{{ timestamp(message.created) }}</span> <span class="timestamp">{{ timestamp(message.created) }}</span>
</div> </div>
<neko-markdown class="content-body" :source="message.content" /> <neko-markdown class="content-body" :source="message.content" />
@ -25,7 +25,7 @@
}" }"
> >
<strong v-if="message.id === id">You</strong> <strong v-if="message.id === id">You</strong>
<strong v-else>{{ member(message.id).username }}</strong> <strong v-else>{{ member(message.id).displayname }}</strong>
{{ message.content }} {{ message.content }}
</div> </div>
</li> </li>

View File

@ -7,7 +7,7 @@
</div> </div>
<form class="message" v-if="!connecting" @submit.stop.prevent="connect"> <form class="message" v-if="!connecting" @submit.stop.prevent="connect">
<span>Please Login</span> <span>Please Login</span>
<input type="text" placeholder="Display Name" v-model="username" /> <input type="text" placeholder="Display Name" v-model="displayname" />
<input type="password" placeholder="Password" v-model="password" /> <input type="password" placeholder="Password" v-model="password" />
<button type="submit" @click.stop.prevent="login"> <button type="submit" @click.stop.prevent="login">
Connect Connect
@ -150,12 +150,12 @@
@Component({ name: 'neko-connect' }) @Component({ name: 'neko-connect' })
export default class extends Vue { export default class extends Vue {
private username = '' private displayname = ''
private password = '' private password = ''
mounted() { mounted() {
if (this.$accessor.username !== '' && this.$accessor.password !== '') { if (this.$accessor.displayname !== '' && this.$accessor.password !== '') {
this.$accessor.login({ username: this.$accessor.username, password: this.$accessor.password }) this.$accessor.login({ displayname: this.$accessor.displayname, password: this.$accessor.password })
} }
} }
@ -164,7 +164,7 @@
} }
login() { login() {
this.$accessor.login({ username: this.username, password: this.password }) this.$accessor.login({ displayname: this.displayname, password: this.password })
} }
} }
</script> </script>

View File

@ -3,8 +3,8 @@
<template slot-scope="child" v-if="child.data"> <template slot-scope="child" v-if="child.data">
<li class="header"> <li class="header">
<div class="user"> <div class="user">
<img :src="`https://api.adorable.io/avatars/25/${child.data.member.username}.png`" /> <img :src="`https://api.adorable.io/avatars/25/${child.data.member.displayname}.png`" />
<strong>{{ child.data.member.username }}</strong> <strong>{{ child.data.member.displayname }}</strong>
</div> </div>
</li> </li>
<li class="seperator" /> <li class="seperator" />
@ -163,8 +163,8 @@
kick(member: Member) { kick(member: Member) {
this.$swal({ this.$swal({
title: `Kick ${member.username}?`, title: `Kick ${member.displayname}?`,
text: `Are you sure you want to kick ${member.username}?`, text: `Are you sure you want to kick ${member.displayname}?`,
icon: 'warning', icon: 'warning',
showCancelButton: true, showCancelButton: true,
confirmButtonText: 'Yes', confirmButtonText: 'Yes',
@ -177,8 +177,8 @@
ban(member: Member) { ban(member: Member) {
this.$swal({ this.$swal({
title: `Ban ${member.username}?`, title: `Ban ${member.displayname}?`,
text: `Are you sure you want to ban ${member.username}? You will need to restart the server to undo this.`, text: `Are you sure you want to ban ${member.displayname}? You will need to restart the server to undo this.`,
icon: 'warning', icon: 'warning',
showCancelButton: true, showCancelButton: true,
confirmButtonText: 'Yes', confirmButtonText: 'Yes',
@ -191,8 +191,8 @@
mute(member: Member) { mute(member: Member) {
this.$swal({ this.$swal({
title: `Mute ${member.username}?`, title: `Mute ${member.displayname}?`,
text: `Are you sure you want to mute ${member.username}?`, text: `Are you sure you want to mute ${member.displayname}?`,
icon: 'warning', icon: 'warning',
showCancelButton: true, showCancelButton: true,
confirmButtonText: 'Yes', confirmButtonText: 'Yes',
@ -205,8 +205,8 @@
unmute(member: Member) { unmute(member: Member) {
this.$swal({ this.$swal({
title: `Unmute ${member.username}?`, title: `Unmute ${member.displayname}?`,
text: `Are you sure you want to unmute ${member.username}?`, text: `Are you sure you want to unmute ${member.displayname}?`,
icon: 'warning', icon: 'warning',
showCancelButton: true, showCancelButton: true,
confirmButtonText: 'Yes', confirmButtonText: 'Yes',

View File

@ -4,18 +4,18 @@
<ul class="members-list"> <ul class="members-list">
<li v-if="member"> <li v-if="member">
<div :class="[{ host: member.id === host }, 'self', 'member']"> <div :class="[{ host: member.id === host }, 'self', 'member']">
<img :src="`https://api.adorable.io/avatars/50/${member.username}.png`" /> <img :src="`https://api.adorable.io/avatars/50/${member.displayname}.png`" />
</div> </div>
</li> </li>
<template v-for="(member, index) in members"> <template v-for="(member, index) in members">
<li <li
v-if="member.id !== id && member.connected" v-if="member.id !== id && member.connected"
:key="index" :key="index"
v-tooltip="{ content: member.username, placement: 'bottom', offset: -15, boundariesElement: 'body' }" v-tooltip="{ content: member.displayname, placement: 'bottom', offset: -15, boundariesElement: 'body' }"
> >
<div :class="[{ host: member.id === host, admin: member.admin }, 'member']"> <div :class="[{ host: member.id === host, admin: member.admin }, 'member']">
<img <img
:src="`https://api.adorable.io/avatars/50/${member.username}.png`" :src="`https://api.adorable.io/avatars/50/${member.displayname}.png`"
@contextmenu.stop.prevent="onContext($event, { member })" @contextmenu.stop.prevent="onContext($event, { member })"
/> />
</div> </div>

View File

@ -16,7 +16,7 @@ export abstract class BaseClient extends EventEmitter<BaseEvents> {
protected _peer?: RTCPeerConnection protected _peer?: RTCPeerConnection
protected _channel?: RTCDataChannel protected _channel?: RTCDataChannel
protected _timeout?: NodeJS.Timeout protected _timeout?: NodeJS.Timeout
protected _username?: string protected _displayname?: string
protected _state: RTCIceConnectionState = 'disconnected' protected _state: RTCIceConnectionState = 'disconnected'
protected _id = '' protected _id = ''
@ -40,7 +40,7 @@ export abstract class BaseClient extends EventEmitter<BaseEvents> {
return this.peerConnected && this.socketOpen return this.peerConnected && this.socketOpen
} }
public connect(url: string, password: string, username: string) { public connect(url: string, password: string, displayname: string) {
if (this.socketOpen) { if (this.socketOpen) {
this.emit('warn', `attempting to create websocket while connection open`) this.emit('warn', `attempting to create websocket while connection open`)
return return
@ -51,11 +51,11 @@ export abstract class BaseClient extends EventEmitter<BaseEvents> {
return return
} }
if (username === '') { if (displayname === '') {
throw new Error('Must add a username') // TODO: Better handling throw new Error('Must add a displayname') // TODO: Better handling
} }
this._username = username this._displayname = displayname
this[EVENT.CONNECTING]() this[EVENT.CONNECTING]()
try { try {
@ -90,7 +90,7 @@ export abstract class BaseClient extends EventEmitter<BaseEvents> {
} }
this._state = 'disconnected' this._state = 'disconnected'
this._username = undefined this._displayname = undefined
this._id = '' this._id = ''
} }
@ -223,7 +223,7 @@ export abstract class BaseClient extends EventEmitter<BaseEvents> {
JSON.stringify({ JSON.stringify({
event: EVENT.SIGNAL.ANSWER, event: EVENT.SIGNAL.ANSWER,
sdp: d.sdp, sdp: d.sdp,
username: this._username, displayname: this._displayname,
}), }),
) )
}) })

View File

@ -41,13 +41,13 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.chat.reset() this.$accessor.chat.reset()
} }
login(password: string, username: string) { login(password: string, displayname: string) {
const url = const url =
process.env.NODE_ENV === 'development' process.env.NODE_ENV === 'development'
? `ws://${location.host.split(':')[0]}:${process.env.VUE_APP_SERVER_PORT}/` ? `ws://${location.host.split(':')[0]}:${process.env.VUE_APP_SERVER_PORT}/`
: `${/https/gi.test(location.protocol) ? 'wss' : 'ws'}://${location.host}/` : `${/https/gi.test(location.protocol) ? 'wss' : 'ws'}://${location.host}/`
this.connect(url, password, username) this.connect(url, password, displayname)
} }
logout() { logout() {
@ -222,7 +222,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$vue.$notify({ this.$vue.$notify({
group: 'neko', group: 'neko',
type: 'info', type: 'info',
title: `${member.username} has the controls`, title: `${member.displayname} has the controls`,
text: 'But I let them know you wanted it', text: 'But I let them know you wanted it',
duration: 5000, duration: 5000,
speed: 1000, speed: 1000,
@ -238,7 +238,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$vue.$notify({ this.$vue.$notify({
group: 'neko', group: 'neko',
type: 'info', type: 'info',
title: `${member.username} is requesting the controls`, title: `${member.displayname} is requesting the controls`,
duration: 5000, duration: 5000,
speed: 1000, speed: 1000,
}) })
@ -253,7 +253,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.remote.setHost(member) this.$accessor.remote.setHost(member)
this.$accessor.chat.newMessage({ this.$accessor.chat.newMessage({
id, id,
content: `gave the controls to ${member.id == this.id ? 'you' : member.username}`, content: `gave the controls to ${member.id == this.id ? 'you' : member.displayname}`,
type: 'event', type: 'event',
created: new Date(), created: new Date(),
}) })
@ -331,7 +331,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.chat.newMessage({ this.$accessor.chat.newMessage({
id, id,
content: `banned ${member.id == this.id ? 'you' : member.username}`, content: `banned ${member.id == this.id ? 'you' : member.displayname}`,
type: 'event', type: 'event',
created: new Date(), created: new Date(),
}) })
@ -349,7 +349,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.chat.newMessage({ this.$accessor.chat.newMessage({
id, id,
content: `kicked ${member.id == this.id ? 'you' : member.username}`, content: `kicked ${member.id == this.id ? 'you' : member.displayname}`,
type: 'event', type: 'event',
created: new Date(), created: new Date(),
}) })
@ -369,7 +369,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.chat.newMessage({ this.$accessor.chat.newMessage({
id, id,
content: `muted ${member.id == this.id ? 'you' : member.username}`, content: `muted ${member.id == this.id ? 'you' : member.displayname}`,
type: 'event', type: 'event',
created: new Date(), created: new Date(),
}) })
@ -389,7 +389,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.chat.newMessage({ this.$accessor.chat.newMessage({
id, id,
content: `unmuted ${member.username}`, content: `unmuted ${member.displayname}`,
type: 'event', type: 'event',
created: new Date(), created: new Date(),
}) })
@ -435,7 +435,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.chat.newMessage({ this.$accessor.chat.newMessage({
id, id,
content: `took the controls from ${member.id == this.id ? 'you' : member.username}`, content: `took the controls from ${member.id == this.id ? 'you' : member.displayname}`,
type: 'event', type: 'event',
created: new Date(), created: new Date(),
}) })
@ -460,7 +460,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.chat.newMessage({ this.$accessor.chat.newMessage({
id, id,
content: `released the controls from ${member.id == this.id ? 'you' : member.username}`, content: `released the controls from ${member.id == this.id ? 'you' : member.displayname}`,
type: 'event', type: 'event',
created: new Date(), created: new Date(),
}) })
@ -480,7 +480,7 @@ export class NekoClient extends BaseClient implements EventEmitter<NekoEvents> {
this.$accessor.chat.newMessage({ this.$accessor.chat.newMessage({
id, id,
content: `gave the controls to ${member.id == this.id ? 'you' : member.username}`, content: `gave the controls to ${member.id == this.id ? 'you' : member.displayname}`,
type: 'event', type: 'event',
created: new Date(), created: new Date(),
}) })

View File

@ -70,7 +70,7 @@ export interface SignalAnswerMessage extends WebSocketMessage, SignalAnswerPaylo
} }
export interface SignalAnswerPayload { export interface SignalAnswerPayload {
sdp: string sdp: string
username: string displayname: string
} }
/* /*

View File

@ -1,6 +1,6 @@
export interface Member { export interface Member {
id: string id: string
username: string displayname: string
admin: boolean admin: boolean
muted: boolean muted: boolean
connected?: boolean connected?: boolean

View File

@ -13,7 +13,7 @@ import * as client from './client'
import * as emoji from './emoji' import * as emoji from './emoji'
export const state = () => ({ export const state = () => ({
username: get<string>('username', ''), displayname: get<string>('displayname', ''),
password: get<string>('password', ''), password: get<string>('password', ''),
active: false, active: false,
connecting: false, connecting: false,
@ -26,8 +26,8 @@ export const mutations = mutationTree(state, {
state.active = true state.active = true
}, },
setLogin(state, { username, password }: { username: string; password: string }) { setLogin(state, { displayname, password }: { displayname: string; password: string }) {
state.username = username state.displayname = displayname
state.password = password state.password = password
}, },
@ -44,7 +44,7 @@ export const mutations = mutationTree(state, {
state.connected = connected state.connected = connected
state.connecting = false state.connecting = false
if (connected) { if (connected) {
set('username', state.username) set('displayname', state.displayname)
set('password', state.password) set('password', state.password)
} }
}, },
@ -73,14 +73,14 @@ export const actions = actionTree(
$client.sendMessage(EVENT.ADMIN.UNLOCK) $client.sendMessage(EVENT.ADMIN.UNLOCK)
}, },
login({ state }, { username, password }: { username: string; password: string }) { login({ state }, { displayname, password }: { displayname: string; password: string }) {
accessor.setLogin({ username, password }) accessor.setLogin({ displayname, password })
$client.login(password, username) $client.login(password, displayname)
}, },
logout({ state }) { logout({ state }) {
accessor.setLogin({ username: '', password: '' }) accessor.setLogin({ displayname: '', password: '' })
set('username', '') set('displayname', '')
set('password', '') set('password', '')
$client.logout() $client.logout()
}, },

View File

@ -21,7 +21,7 @@ type SignalProvide struct {
type SignalAnswer struct { type SignalAnswer struct {
Event string `json:"event"` Event string `json:"event"`
Username string `json:"username"` DisplayName string `json:"displayname"`
SDP string `json:"sdp"` SDP string `json:"sdp"`
} }

View File

@ -2,7 +2,7 @@ package types
type Member struct { type Member struct {
ID string `json:"id"` ID string `json:"id"`
Name string `json:"username"` Name string `json:"displayname"`
Admin bool `json:"admin"` Admin bool `json:"admin"`
Muted bool `json:"muted"` Muted bool `json:"muted"`
} }

View File

@ -24,7 +24,7 @@ func (h *MessageHandler) signalProvide(id string, session types.Session) error {
} }
func (h *MessageHandler) signalAnswer(id string, session types.Session, payload *message.SignalAnswer) error { func (h *MessageHandler) signalAnswer(id string, session types.Session, payload *message.SignalAnswer) error {
if err := session.SetName(payload.Username); err != nil { if err := session.SetName(payload.DisplayName); err != nil {
return err return err
} }